Содержание

AMP-specific metadata
- Required <amp-story> attributes
- Recommended <amp-story> attributes
  - poster-landscape-src
  - poster-square-src
Metadata

Make your Web Stories discoverable

Important: this documentation is not applicable to your currently selected format websites!

Ensure your Web Stories are reaching your intended audience by including necessary metadata and markup.

AMP-specific metadata

Web Stories with missing or incorrect AMP-specific metadata may not surface in search engines or third party platforms.

Required <amp-story> attributes

Web Stories must include the following <amp-story> attributes.

<body>
    <amp-story standalone
    title="Web Story Title"
    publisher="Web Story Publisher"
    publisher-logo-src="https://example.com/logo/1x1.png"
    poster-portrait-src="https://example.com/my-story/poster/3x4.jpg">
    ...
    </amp-story-standalone>
</body>

`title`

The title of the Web Story.

`publisher`

The name of the Web Story publisher.

`publisher-logo-src`

A URL to the Web Story publisher's logo image. The logo image should be larger than or equal to 96x96px and maintain a 1:1 aspect ratio. This logo appears in the right corner on the top of the poster image on platforms currently (October 2020) supporting Web Stories.

`poster-portrait-src`

A URL to an image used as the Web Story poster. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 640x853px and maintain a 3:4 aspect ratio.

Recommended <amp-story> attributes

`poster-landscape-src`

A URL to an image used as the Web Story poster in landscape format. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 853x640px and maintain a 4:3 aspect ratio.

`poster-square-src`

A URL to an image used as the Web Story poster. Used as the cover for the Web Story and should be representative of the story. Do not embed or burn-in the Web Story title on it. Should be at least 640x640px and maintain a 1:1 aspect ratio.

Metadata

Platforms that surface Web Stories rely on metadata to correctly index and display them. Include the following recommended information to give users a delightful Web Story experience.

Include the following recommended HTML markup in your Web Stories for the best user experience.

Canonical link

All Web Stories must include a canonical URL that points to the Web Story itself.

<link rel="canonical" href="https://www.example.com/url/to/Web/Story.html">

favicon

Include a favicon to display as the icon in the browser tab.

Document title

Give your Web Story document a title by including a </a></code> tag.</p> <h2 id="image-alt-text">Image alt-text</h2> <p>Maximize accessibility and indexability by including <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Accessibility_concerns">meaningful alt-text for images</a>.</p> <h2 id="video-subtitles-and-captions">Video subtitles and captions</h2> <p>Maximize accessibility and indexability by including <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video">video subtitles and/or captions</a>.</p> <h2 id="page-attachments">Page attachments</h2> <p>Use <a href="https://amp.dev/documentation/components/amp-story-page-attachment/">page attachments</a> to present additional information in “classic article form” alongside your Web Story. This can be useful to provide extra detail, deep dives, or onward journeys for the content presented in your Story.</p> <h2 id="schema.org-metadata">Schema.org metadata</h2> <p>Including <a href="https://schema.org/">schema.org</a> structured data vocabulary defines important information about your Web Story that allows third-party platforms, such as search engines, to display and index them.</p> <p> <div class="ap-m-tip"> <div class="ap-a-ico ap-m-tip-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#speech-bubble"></use></svg> </div> <div class="ap-m-tip-content"> Validate your schema.org data using Google's <a href="https://search.google.com/test/amp">AMP Test</a>. </div> </div></p> <h2 id="ogp-facebook-metadata">OGP Facebook metadata</h2> <p>Including <a href="https://ogp.me/">Open Graph protocol</a> enables Web Stories sharing on Facebook.</p> <h2 id="twitter-card-data">Twitter card data</h2> <p>Including <a href="https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards">Twitter card data</a> allows you to attach photos, videos and media experiences to a Tweet sharing your Web Story.</p> <p> <div class="ap-m-tip"> <div class="ap-a-ico ap-m-tip-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#bookmark"></use></svg> </div> <div class="ap-m-tip-content"> Read more about <a href="https://blog.amp.dev/2020/02/12/seo-for-amp-stories/">SEO for Web Stories in the AMP Blog</a>. </div> </div></p> </section> <section class="ap--content"> <hr> <ul class="ap-o-mini-card-list"> <li class="ap-o-mini-card-list-item"> <div class="ap-m-mini-card"> <amp-img alt="Author avatar" src="https://github.com/CrystalOnScript.png?size=38" width="38" height="38" class="large" style="max-width: 38px" layout="responsive"> </amp-img> <span> <strong>Written by <a href="https://github.com/CrystalOnScript" rel="nofollow" target="_blank"> @CrystalOnScript </a> </strong> </span> </a> </li> </ul> </section> </div> </main> <amp-sidebar id="sidebar-left" class="ap--ampsidebar" layout="nodisplay" side="left"> <nav class="ap--ampsidebar-toolbar" toolbar="(min-width: 768px)" toolbar-target="ap--sidebar-content"> <ul> <div class="ap-m-format-toggle"> <button class="ap-m-format-toggle-selected ap-m-format-toggle-link-websites"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-websites"></use></svg> </span> <span>websites</span> <span class="ap-a-ico ap-m-format-toggle-angle"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </span> </button> <div class="ap-m-format-toggle-formats"> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-stories" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=stories"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-stories"></use></svg> </span> <span>stories</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-ads" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=ads"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-ads"></use></svg> </span> <span>ads</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-email" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/discovery_web_stories/?format=email"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-email"></use></svg> </span> <span>email</span> </a> </div> </div> <div class="ap-o-sidebar-default"> <div class="ap-o-sidebar"> <div class="nav"> <ul class="nav-list level-1"> <li class="nav-item level-1"> <span class="nav-link"> <span>Начало</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/"> <span>Создание первой страницы</span> <span class="nav-link-lastword">AMP<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/basic_markup/"> Создание страницы AMP HTML </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/include_image/"> Добавление изображений </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/presentation_layout/"> Изменение представления и макета </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/prepare_for_discovery/"> Подготовка страницы к обнаружению и распространению </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/actions_events/"> Actions and events </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/preview_and_validate/"> Предварительный просмотр и валидация </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/create/publish/"> Последние шаги перед публикацией </a> </li> </ul> </li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/"> <span>Convert HTML to</span> <span class="nav-link-lastword">AMP<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/setting-up/"> Подготовка </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/building-page/"> Создание обычной HTML-страницы </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/resolving-errors/"> Устранение ошибок валидации </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/discoverable/"> Обеспечение обнаружения страницы </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/converting/congratulations/"> Поздравляем! </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/"> <span>Add advanced AMP</span> <span class="nav-link-lastword">features<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/setting_up/"> Подготовка </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/review_code/"> Обзор стартового кода </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/adding_components/"> Добавление расширенных компонентов AMP </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/adding_carousels/"> Добавление кольцевых галерей </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/tracking_data/"> Отслеживание вовлечения с помощью функций аналитики </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/navigating/"> Навигация по вашему сайту </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/fonts/"> Добавление шрифтов </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/start/add_advanced/congratulations/"> Поздравляем! </a> </li> </ul> </li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Обучение</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-actions-and-events/"> Actions and events </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/common_attributes/"> Общие атрибуты элементов </a> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>Спецификация AMP HTML</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/spec/amp-html-responsive-attributes/"> AMP HTML Responsive Attributes </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/spec/amp-video-interface/"> Video in AMP </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/spec/amphtml/"> Спецификация AMP HTML </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/spec/amp-boilerplate/"> Шаблонный код AMP </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/spec/release-schedule/"> График выхода релизов AMP </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/experimental/"> Использование экспериментальных возможностей </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-html-layout/"> <span>AMP's Layout System</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-html-layout/"> Система макетов AMPHTML </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-html-layout/layouts_demonstrated/"> Demonstrating AMP layouts </a> </li> </ul> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>Процесс проверки</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/validation-workflow/validate_amp/"> О проверке AMP-страниц </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/validation-workflow/validation_errors/"> Ошибки на AMP-страницах </a> </li> </ul> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>AMP-кеш и CORS</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-caches-and-cors/how_amp_pages_are_cached/"> Как кешируются AMP-страницы </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cache-debugging/"> Устранение проблем при работе с AMP-кешем </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cache-urls/"> AMP-кеш: формат URL-адресов и обработка запросов </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests/"> CORS в AMP </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/learn/combine-amp-pwa/"> Как AMP и PWA связаны друг с другом </a> </li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Разработка</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/"> <span>Как создать адаптивные AMP-страницы</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/style_pages/"> Поддерживаемые элементы CSS </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/control_layout/"> Поддерживаемые макеты </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/placeholders/"> Заполнители и резервные элементы </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/art_direction/"> Адаптивные изображения с набором параметров, размерами и высотой </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/responsive_design/"> Create responsive AMP pages </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/style_and_layout/custom_fonts/"> Добавление собственных шрифтов </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/media_iframes_3p/"> <span>Include media, iframes & third-party content</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/media_iframes_3p/"> Include images & video </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/media_iframes_3p/third_party_components/"> Как добавлять сторонний контент </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/media_iframes_3p/iframes/"> Размещение элементов iframe </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity_guide/"> <span>Interactivity</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity_guide/foundations/"> Interactivity foundations </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity_guide/ready_made/"> Ready-made interactivity with AMP components </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity_guide/personalized_experiences/"> Building personalized interactive experiences </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity_guide/client_rendering/"> Client-side rendering in AMP </a> </li> </ul> </li> <li class="nav-item level-2"> <span class="nav-link"> <span>Анимация и переходы</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/animations/triggering_css_animations/"> Запуск анимации и переходов CSS </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/animations/introduction_to_animations/"> Введение в сложные анимации </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/custom-javascript/"> Use custom JavaScript in AMP pages </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/monetization/"> <span>Monetize your AMP pages</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/monetization/"> Монетизация AMP-страницы с помощью рекламы </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/monetization/ads_vendors/"> Поставщики рекламы </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/monetization/content_encryption/"> Защитите содержимое подписки с помощью шифрования на стороне клиента </a> </li> </ul> </li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/"> <span>Create interactive AMP</span> <span class="nav-link-lastword">pages<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/prereqs-setup/"> Первоначальная настройка </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/get-familiar/"> Знакомство со стартовым кодом </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/advanced-interactivity/"> Улучшение интерактивности </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/remote-data/"> Работа с удаленными данными </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/interactivity/wrapping-up/"> Подведение итогов </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/login_requiring/"> <span>Create a login-requiring AMP</span> <span class="nav-link-lastword">page<svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg></span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/login_requiring/login/"> Вход </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/login_requiring/add_comment/"> Добавление комментария </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/login_requiring/logout/"> Выход </a> </li> <li class="nav-item level-3"> <div class="ap-m-tutorial-progress "></div> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/login_requiring/summary/"> Резюме </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/custom-javascript-tutorial/"> Create a UI widget with custom JavaScript <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/live_blog/"> Создание живого блога <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/develop/seatmap/"> Создание схемы посадочных мест <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> </ul> </li> <li class="nav-item level-1"> <span class="nav-link"> <span>Интеграция</span> </span> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/web-story-player-guide/"> Creating Web Story experiences using the Web Story Player on non-AMP sites </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/amp-in-pwa/"> Использование AMP в качестве источника данных для вашего PWA </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/amp-to-pwa/"> Предварительная загрузка PWA с AMP-страниц </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/integrate-with-apps/"> Интеграция AMP с вашим приложением </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/embed-stories/"> Встраивание историй в веб-страницы </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/integrate/embed-stories-nonamp/"> Integrate Web Stories in non-AMP pages </a> </li> </ul> </li> <li class="nav-item active level-1"> <span class="nav-link"> <span>Оптимизация и метрики</span> </span> <input class="nav-trigger" type="checkbox" checked/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/publishing_checklist/"> Контрольный список для публикации AMP-страниц </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/"> <span>Using an AMP Optimizer</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/explainer/"> Как работает AMP-оптимизатор </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/node-amp-optimizer/"> Руководство по AMP-оптимизатору для Node.js </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/"> <span>Настройка Analytics</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics_basics/"> Аналитика: основы </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/deep_dive_analytics/"> Погружение в AMP Analytics </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/use_cases/"> Примеры использования </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics-vendors/"> Поставщики аналитики </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp-managing-user-state/"> Управление неаутентифицированным состоянием пользователя при помощи AMP </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/signed-exchange/"> Выдача контента AMP с использованием подписанных обменов </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/discovery/"> Как сообщать о наличии AMP-версии страницы </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/engagement/"> Повышение вовлечения пользователей </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/optimize_amp/"> Optimize your hosted AMP pages </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/secure-pages/"> Защита от сторонних атак </a> </li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp_to_pwa/"> Превращение вашего AMP-сайта в PWA <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/amp-as-pwa/"> Реализация офлайн-доступа и повышение производительности </a> </li> <li class="nav-item-tutorial-divider"></li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/optimize-and-measure/tracking-engagement/"> Как настроить базовую аналитику для AMP-страниц <svg class="ap-a-ico nav-type-icon"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#tutorial"></use></svg> </a> </li> </ul> </li> <li class="nav-item level-1"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/"> <span>Contribute</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"></use></svg> </div> <ul class="nav-list level-2"> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/"> Как вы можете помочь? </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/contribute-documentation/"> <span>Contribute documentation</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/contribute-documentation/documentation-types/"> Типы документации </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/contribute-documentation/terminology/"> Терминология AMP </a> </li> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/contribute-documentation/formatting/"> Formatting guides & tutorials </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/integrate-your-analytics-tools/"> Интеграция вашего инструмента аналитики с AMP </a> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/vendor-contributions/"> <span>Third party contributions</span> </a> <input class="nav-trigger" type="checkbox"/> <div class="nav-icon"> <svg class="ap-a-ico light"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-light"></use></svg> </div> <ul class="nav-list level-3"> <li class="nav-item level-3"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/vendor-contributions/release-schedule/"> Release Schedule </a> </li> </ul> </li> <li class="nav-item level-2"> <a class="nav-link" href="/ru/documentation/guides-and-tutorials/contribute/translations/"> Contribute translations </a> </li> </ul> </li> </ul> </div> </div> </div> </ul> </nav> </amp-sidebar> <footer class="ap--footer"> <div class="ap-o-footer"> <div class="ap-o-footer-line-top"> <div class="ap-o-footer-hint">Конечно же, этот сайт сделан с помощью AMP!</div> <div class="ap-o-footer-follow"> <h5 class="ap-o-footer-follow-title">Подписывайтесь на нас</h5> <ul class="ap-o-footer-follow-menu"> <li class="ap-o-footer-follow-item"> <a class="ap-a-ico ap-o-footer-follow-icon" href="https://twitter.com/AMPhtml" rel="noopener" title="Twitter"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#twitter"></use></svg> </a> </li> <li class="ap-o-footer-follow-item"> <a class="ap-a-ico ap-o-footer-follow-icon" href="https://www.youtube.com/channel/UCXPBsjgKKG2HqsKBhWA4uQw" rel="noopener" title="YouTube"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#youtube"></use></svg> </a> </li> <li class="ap-o-footer-follow-item"> <a class="ap-a-ico ap-o-footer-follow-icon" href="https://blog.amp.dev/" rel="noopener"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#wordpress" title="WordPress"></use></svg> </a> </li> <li class="ap-o-footer-follow-item"> <a class="ap-a-ico ap-o-footer-follow-icon" href="https://github.com/ampproject" title="GitHub"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#github"></use></svg> </a></li> <li class="ap-o-footer-follow-item"> <a class="ap-a-ico ap-o-footer-follow-icon" href="https://stackoverflow.com/questions/tagged/amp-html" rel="noopener" title="Stackoverflow"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#stackoverflow"></use></svg></a> </li> </ul> </div> </div> <div class="ap-o-footer-nav"> <div class="ap-o-footer-nav-column"> <h5 class="ap-o-footer-nav-title">Обзор</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a href="/ru/about/websites/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Фреймворк AMP</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/about/use-cases/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Пользовательские сценарии</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/success-stories/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Истории успеха</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/about/how-amp-works/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Функциональность</a></li> </ul> </div> <div class="ap-o-footer-nav-column"> <h5 class="ap-o-footer-nav-title">Документы</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/guides-and-tutorials/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Начало работы</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/guides-and-tutorials/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Руководства и учебники</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/components/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Компоненты</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/examples/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Примеры</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/templates/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Шаблоны дизайна</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/tools/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Инструменты</a></li> </ul> </div> <div class="ap-o-footer-nav-column"> <h5 class="ap-o-footer-nav-title">Сообщество</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a href="/ru/support/faq/platform-and-vendor-partners/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Партнерские платформы и поставщики</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/documentation/guides-and-tutorials/contribute/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Участие в проекте</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/community/roadmap/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>План развития</a></li> </ul> <h5 class="ap-o-footer-nav-title">OpenJS Foundation</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a class="ap-o-footer-nav-link" href="https://openjsf.org" rel="noopener"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>The OpenJS Foundation</a></li> <li class="ap-o-footer-nav-item"><a class="ap-o-footer-nav-link" href="https://bylaws.openjsf.org" rel="noopener"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>OpenJS Foundation Bylaws</a></li> <li class="ap-o-footer-nav-item"><a class="ap-o-footer-nav-link" href="https://trademark-policy.openjsf.org" rel="noopener"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Trademark Policy</a></li> <li class="ap-o-footer-nav-item"><a class="ap-o-footer-nav-link" href="https://trademark-list.openjsf.org" rel="noopener"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>Trademark List</a></li> </ul> </div> <div class="ap-o-footer-nav-column"> <h5 class="ap-o-footer-nav-title">События</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a href="https://blog.amp.dev/2020/02/20/amp-conf-2020-return-to-nyc/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>AMP Conf 2020</a></li> <li class="ap-o-footer-nav-item"><a href="/ru/events/amp-cs-2019/" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"></use></svg></div>AMP Contributor Summit 2019</a></li> </ul> <h5 class="ap-o-footer-nav-title">Брендовые материалы AMP</h5> <ul class="ap-o-footer-nav-menu"> <li class="ap-o-footer-nav-item"><a href="/static/files/brand-material/AMP_Mini_Styleguide.pdf" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#download"></use></svg></div>Стандарты оформления</a></li> <li class="ap-o-footer-nav-item"><a href="/static/files/brand-material/AMP_Logo_Rebrush.zip" class="ap-o-footer-nav-link"><div class="ap-a-ico ap-o-footer-nav-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#download"></use></svg></div>Логотипы</a></li> </ul> </div> </div> <div class="ap-o-footer-line-bottom"> <div class="ap-o-footer-openjsf"> <amp-img src="/static/img/logo-openjsf.svg" alt="Logo of the OpenJS Foundation" width="315" height="100" layout="responsive"></amp-img> </div> <ul class="ap-o-footer-legal-nav-menu"> <li class="ap-o-footer-legal-nav-item"><a class="ap-o-footer-legal-nav-link" href="https://terms-of-use.openjsf.org" rel="noopener">Terms of Use</a></li> <li class="ap-o-footer-legal-nav-item"><a class="ap-o-footer-legal-nav-link" href="https://privacy-policy.openjsf.org" rel="noopener">Политика конфиденциальности</a></li> <li class="ap-o-footer-legal-nav-item"><a class="ap-o-footer-legal-nav-link" href="https://www.linuxfoundation.org/cookies" rel="noopener">Cookie Policy</a></li> </ul> </div> <div class="ap-o-footer-copyright"> © <a href="https://openjsf.org">OpenJS Foundation</a> and AMP Project contributors. All rights reserved. The <a href="https://openjsf.org">OpenJS Foundation</a> has registered trademarks and uses trademarks. For a list of trademarks of the <a href="https://openjsf.org">OpenJS Foundation</a>, please see our <a href="https://trademark-policy.openjsf.org">Trademark Policy</a> and <a href="https://trademark-list.openjsf.org">Trademark List</a>. Trademarks and logos not indicated on the <a href="https://trademark-list.openjsf.org">list of OpenJS Foundation trademarks</a> are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them. <br><br> The services available at <a href="https://cdn.ampproject.org">cdn.ampproject.org</a> are provided by Google and the respective <a href="https://policies.google.com/privacy?hl=en">privacy policy</a> applies. </div> </div> </footer> <aside class="ap-o-translation-hint"> <p class="ap-o-translation-hint-wrapper">Sadly this page isn't translated yet, but will be shortly - check back soon!</p> </aside> <amp-analytics type="gtag" data-credentials="include" data-block-on-consent> <script type="application/json"> {"extraUrlParams": {"cd2": "${ampdocHost}"}, "requests": {"CWV_EVENT": "${base}?v=1\u0026t=event\u0026tid=${gtag_id}\u0026cid=0\u0026ec=cwv", "base": "https://google-analytics.com/collect/"}, "triggers": {"banner": {"on": "click", "selector": "#top-banner", "vars": {"event_action": "click", "event_category": "guides-and-tutorials", "event_label": "banner", "event_name": "banner"}}, "breadcrumbLink": {"on": "click", "selector": ".ap-m-breadcrumbs-crumb", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "breadcrumbs", "event_name": "breadcrumbs"}}, "cls": {"extraUrlParams": {"cls": "${cumulativeLayoutShift}"}, "on": "visible", "request": "CWV_EVENT"}, "defaultPageview": {"on": "visible", "request": "pageview", "vars": {"title": "{{title}}"}}, "fid": {"extraUrlParams": {"fid": "${firstInputDelay}"}, "on": "visible", "request": "CWV_EVENT"}, "formatToggle": {"on": "click", "selector": ".ap-m-format-toggle-link", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "format-toggle", "event_name": "format-toggle"}}, "lcp": {"extraUrlParams": {"lcp": "${largestContentfulPaint}"}, "on": "visible", "request": "CWV_EVENT"}, "navigation": {"on": "click", "selector": ".ap--header a, .ap-o-burger-menu-link", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "navigation", "event_name": "navigation"}}, "scrolledEnd": {"on": "scroll", "scrollSpec": {"verticalBoundaries": [90]}, "vars": {"event_action": "end", "event_category": "guides-and-tutorials", "event_label": "scroll", "event_name": "scroll"}}, "scrolledHalf": {"on": "scroll", "scrollSpec": {"verticalBoundaries": [50]}, "vars": {"event_action": "half", "event_category": "guides-and-tutorials", "event_label": "scroll", "event_name": "scroll"}}, "searchButton": {"on": "click", "selector": "#searchTriggerOpen", "vars": {"event_action": "open", "event_category": "search", "event_label": "search", "event_name": "search"}}, "sidebarLink": {"on": "click", "selector": ".ap-o-sidebar a", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "sidebar", "event_name": "sidebar"}}, "sidebarToggle": {"on": "click", "selector": "label[for=\"sidebar-desktop\"], label[for=\"sidebar\"]", "vars": {"event_action": "toggle", "event_category": "guides-and-tutorials", "event_label": "sidebar", "event_name": "sidebar"}}, "tocLink": {"on": "click", "selector": ".ap-o-toc a", "vars": {"event_action": "link", "event_category": "guides-and-tutorials", "event_label": "toc", "event_name": "toc"}}, "tocToggle": {"on": "click", "selector": ".ap-o-toc label", "vars": {"event_action": "toggle", "event_category": "guides-and-tutorials", "event_label": "toc", "event_name": "toc"}}}, "vars": {"config": {"G-TYM9BH1XCX": {"groups": "default"}}, "gtag_id": "G-TYM9BH1XCX"}} </script> </amp-analytics><amp-geo layout="nodisplay"> <script type="application/json"> { "ISOCountryGroups": { "eu": ["preset-eea"], "doubleOptIn": ["de", "at", "no", "gr", "lu"] } } </script> </amp-geo> <amp-consent id="consent" class="ap-o-consent" layout="nodisplay"> <script type="application/json"> { "consentInstanceId": "consent", "promptUI": "consent-popup", "consentRequired": false, "geoOverride": { "eu": { "consentRequired": true } } } </script> <div id="consent-popup" class="consent-popup"> <button type="reset" class="ap-o-consent-close" on="tap:consent.dismiss" role="button" tabindex="0" aria-label="Отклонить"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close"></use></svg> </button> <p class="ap-o-consent-text"> We use cookies to understand how you use our site and to improve your experience. By continuing to use our site, you accept our <a href="https://policies.google.com/technologies/cookies">use of cookies</a> and <a href="https://policies.google.com/privacy">privacy policy</a>. </p> <button on="tap:consent.accept" class="ap-a-btn" role="button" aria-label="Принять использование cookie">Понятно!</button> </div> </amp-consent> <amp-install-serviceworker src="/serviceworker.js" data-iframe-src="https://amp.dev/serviceworker.html" layout="nodisplay"></amp-install-serviceworker> </body> </html>