Что такое код hw_api >insertcollection


Содержание

FPublisher

Web-технологии: База знаний

Документация PHP

hw_api->insertcollection

(No version information available, might be only in CVS)

hw_api->insertcollection — Inserts a new object of type collection

Описание

hw_api_object insertcollection ( array $parameter )

This function is a shortcut for hwapi_insert(). It inserts an object of type collection and sets some of the attributes required for a collection.

Список параметров

The parameter array contains the required elements ‘object’ and ‘parentIdentifier’ and the optional elements ‘parameter’ and ‘attributeSelector’. See hwapi_insert() for the meaning of each element.

Что такое API

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

Итак, начнём с определения. API (Application Programming Interface) — это интерфейс программирования, интерфейс создания приложений. Если говорить более понятным языком, то API — это готовый код для упрощения жизни программисту. API создавался для того, чтобы программист реально мог облегчить задачу написания того или иного приложения благодаря использованию готового кода (например, функций). Всем известный jQuery, написанный на JavaScript является тоже своего рода API. Если рассматривать конкретно данный пример, то jQuery позволяет намного облегчить написание кода. То что обычными средствами JavaScript можно было сделать за 30 строк, через jQuery пишется через 5-6. Если рассматривать API в общем, то можно найти очень много сервисов, представляющих решения для разработки. Самый известный на сегодняшний день — это сервис code.google.com, предоставляющий около полусотни разнообразных API! Это и интерфейс для создания Android-приложений, и различные API для работы с AJAX, и различные API приложений, которые можно легко подстроить под свой лад.

Ведь есть ли смысл писать код своими руками? Зачем трудиться над тем, что уже создано? Разве есть смысл отказываться от бесплатных решений (а фактически, и от бесплатной помощи) в web разработке? Если вы ответили на все эти вопросы «НЕТ», то считайте, что вы поняли суть API.

Но ещё хочу оговориться. Начинающим разработчикам НЕ следует пользоваться полуготовыми решениями, так как в будущем они не справятся с реальной задачей. Поэтому, если вы начинающий web программист, то не используйте полуфабрикаты! Учитесь думать своей головой, строить различные алгоритмы, чтобы понять суть программирования. Так же говорю, уже обращаясь ко всем, что API — это не готовые решения, это среда, интерфейс для создания своих проектов. Вы же не едите замороженный котлеты из магазина? Вы сначала их пожарите, не так ли? Эта аналогия очень ясно отображает суть API.

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

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

hw_api::insertcollection — Inserts a new object of type collection

(PHP 4, PHP 5 hw_api::insertcollection — Inserts a new object of type collection

Описание

This function is a shortcut for hwapi_insert() . It inserts an object of type collection and sets some of the attributes required for a collection.

Список параметров

The parameter array contains the required elements ‘object’ and ‘parent >hwapi_insert() for the meaning of each element.

Добавьте Google Аналитику на AMP-страницы

AMP (Accelerated Mobile Pages) – платформа, с помощью которой можно создавать веб-страницы для статического контента с ускоренной загрузкой. Действия пользователей на AMP-страницах отслеживаются при помощи элемента , у которого есть встроенная поддержка Google Аналитики.

Как настроить отслеживание просмотров страниц

Чтобы добавить стандартный тег Google Аналитики на свою AMP-страницу, скопируйте фрагмент кода ниже и замените на идентификатор нужного ресурса. О том, как найти свой идентификатор Google Аналитики, читайте в этой статье.

Принцип работы

Элемент – это дополнительный компонент AMP, его можно использовать только как custom-element в коде тега.

AMP не поддерживает JavaScript, за исключением собственных одобренных библиотек. Поэтому конфигурация выполняется с помощью JSON. Свойство gtag_id с действительным добавляется в блок vars , а затем идет ресурс config со значением : <> .

Отслеживание событий

Чтобы отслеживать события на страницах AMP, задайте нужные значения в разделе triggers . В конфигурации триггера используются следующие свойства:

  • selector – CSS-селектор, позволяющий задать целевой элемент;
  • on – тип события;
  • vars – раздел для определения типа события event_name , куда можно также добавить дополнительные параметры.

В примере ниже показано, как настроить простое событие Google Аналитики. Создайте триггер с названием «button«, который будет активироваться при нажатии элемента с идентификатором «the-button«. Этот триггер будет отправлять в Google Аналитику значение event_name , то есть «login«, и значение method , то есть «Google«.

События Google Аналитики используются только в этом сервисе и часто применяются при создании отчетов о кампаниях. Значения для них можно задать в разделе «vars» с помощью параметров event_category , event_label и value .

Дополнительную информацию о настройке триггеров вы можете найти в документации по amp-analytics .

Изменение параметров

Чтобы переопределить параметры Google Аналитики по умолчанию или дополнить код новыми параметрами, добавьте нужные значения в раздел parameter блока config . Следующий пример кода переопределяет значения по умолчанию для page_title и page_location .

Связывание доменов


Вы можете связать несколько сайтов в разных доменах и отслеживать их как один домен. Задать домены для связывания можно с помощью команды «linker»: < "domains": [. ] >:

Возможность установления связи с вашим каноническим доменом из кеша AMP включена по умолчанию, если на AMP-страницах настроена поддержка Google Аналитики. Чтобы отключить ее, добавьте «linker»: «false» в параметры конфигурации:

Скорость загрузки сайта

Google Аналитика автоматически собирает данные о скорости загрузки, анализируя лишь небольшую часть трафика вашего сайта. Измените частоту выборки, если вы хотите собирать больше данных (или меньше). Чтобы задать частоте выборки значение 100%, добавьте в свою конфигурацию следующий код:

Чтобы остановить сбор данных о скорости загрузки, используйте следующий код:

Трафик на страницах AMP и обычных веб-страницах

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

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

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

Отладка конфигурации

Узнать, соответствует ли веб-страница спецификации AMP HTML, поможет инструмент AMP Validator. Чтобы включить его, добавьте в URL страницы компонент #development=1 .

Провести отладку конфигурации и устранить неполадки поможет расширение amp-analytics , которое выводит предупреждения и сообщения об ошибках. Чтобы включить расширение и просмотреть информацию на панели браузера, добавьте в URL страницы компонент #log=1 .

Полный пример

Это пример целой AMP-страницы с одной кнопкой. Конфигурация будет отправлять в Google Аналитику стандартные данные о просмотре страницы и событиях «button-click«.

Статьи по теме

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Что такое AMP: подробное руководство по ускоренным мобильным страницам

Время чтения: 24 минуты Нет времени читать? Нет времени?

Ускоренные мобильные страницы или AMP — технология, которая обеспечивает удобное получение информации в интернете с экранов смартфонов и планшетов. Как работает AMP? Как создать и кастомизировать ускоренные мобильные страницы? Какими инструментами могут воспользоваться владельцы сайтов на популярных CMS, включая WordPress, Joomla!, Drupal, OpenCart? С какими подводными камнями сталкиваются вебмастера при внедрении AMP, и как решить проблемы? Ответы на эти и другие вопросы в руководстве.

Что такое AMP и как они работают

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

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

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

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

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

Серферы могут пользоваться AMP двумя принципиально разными способами. Первый предполагает передачу данных с сервера владельца сайта на компьютер посетителя и отображение в браузере ускоренной версии страницы. Например, на сайте с поддержкой AMP можно настроить автоматическую переадресацию всех мобильных пользователей на ускоренные страницы. Посетитель может попасть на AMP по ссылке с помощью мобильного девайса или добавить к URL в адресной строке браузера на стационарном ПК суффикс /amp/.

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

К сожалению, Google не считает нужным показывать AMP-карусели на страницах выдачи, сформированных для моих устройств. Поэтому за пример спасибо Search Engine Land.

В отличие от Google, «Яндекс» не поддерживает технологию AMP.

Пока еще крупнейший поисковик рунета не считает ускоренные мобильные страницы дублями. Это объясняется тем, что AMP ссылаются на канонические страницы с помощью атрибута rel=»canonical».

Тем не менее «Яндекс» индексирует AMP и даже включает их в выдачу. Один из участников популярного SEO-форума рассказал, что поисковик включил ускоренные страницы в выдачу вместо основных. На жалобу техподдержка ответила, что робот не считает атрибут rel=»canonical» строгой директивой. Поэтому AMP оказались в выдаче вместо основных страниц сайта. Топикстартеру пришлось запрещать «Яндексу» индексировать ускоренные страницы в файле robots.txt.

Стоит ли использовать ускоренные мобильные страницы

Чтобы ответить на этот вопрос, нужно уделить внимание преимуществам, недостаткам и результатам внедрения AMP.

Преимущества AMP

Главное преимущество AMP — высокая скорость загрузки. В таблице результаты тестирования базовой и ускоренной версии страницы с помощью нескольких сервисов.

PageSpeed Insights от Google

62 балла для мобильных, 77 баллов для десктопов.

88 баллов для мобильных, 94 балла для десктопов.

Инструмент проверки скорости загрузки от Pingdom


Время загрузки 5,94 секунды, размер страницы 3,5 Мбайт.

Время загрузки 2,46 секунды, размер страницы 381,4 Кбайт.

Инструмент проверки скорости загрузки от GTmetrix

Скорость загрузки 18,6 секунды, размер страницы 3,49 Мбайт.

Время загрузки 3,4 секунды, размер страницы 314 Кбайт.

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

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

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

Google учитывает скорость загрузки страниц при ранжировании сайтов. Это важно в контексте тестирования mobile-first индекса. Обеспечивает ли AMP дополнительные преимущества в рейтинге?

В середине 2020 года на саммите Search Engine Journal в Чикаго представитель Google Гарри Ильес заявил, что ускоренные мобильные страницы не входят в число факторов ранжирования. Но специалист не смог однозначно сказать, что AMP не будет фактором ранжирования в будущем.

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

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

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

Недостатки ускоренных мобильных страниц

У AMP много недостатков. Вот основные:

  • Данные о посещении ускоренных страниц не попадают в отчеты «Метрики» и Google Analytics, которые формируются благодаря кодам отслеживания на основных страницах сайта. Чтобы отслеживать эффективность AMP, нужно добавить на них код отслеживания вручную или с помощью плагинов.
  • Ускоренные страницы имеют урезанную функциональность по сравнению с базовыми. На AMP нет навигационного меню, блока похожих публикаций, сайдбара, формы комментирования. Нужные элементы приходится «прикручивать» вручную или с помощью плагинов.
  • Внешний вид AMP отличается от базовых страниц не в лучшую сторону. Ради высокой скорости загрузки вы жертвуете визуальной привлекательностью сайта.
  • На AMP нет сторонних виджетов, например, виджетов групп «Вконтакте» или Facebook.
  • Если Google показывает ускоренные страницы сайта в карусели, пользователи могут читать их, не покидая SERP. Поэтому ваш сайт лишается трафика.
  • Теоретически из-за AMP могут возникать проблемы с индексацией. Пример с «Яндексом» описан выше.

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

Результаты внедрения AMP

Сначала личный опыт. Внедрил ускоренные страницы на экспериментальной площадке на WordPress в ноябре 2020 года. Проблем с «Яндексом» нет. Эта поисковая система видит AMP, но не включает их в индекс.

Google быстро индексирует AMP. Информация о них появилась в разделе Search Console «Вид в поиске – Ускоренные мобильные страницы» в течение нескольких дней после внедрения на сайте.

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

  • За неделю с 20 по 26 февраля на тестовую площадку из Google пришло 749 посетителей.
  • 397 из 749 человек — мобильные пользователи.
  • 246 пользователей из Google приземлились на ускоренные страницы.

На примере конкретного ресурса без претензии на репрезентативность видно, что Google охотно направляет на AMP посетителей. На ускоренные страницы из поисковой системы пришли 32,84 % от общего числа пользователей или 62 % мобильных пользователей. Оставшиеся 38 % владельцев смартфонов и планшетов попали на базовые страницы с адаптивной версткой.

Вот данные, на которые стоит обратить внимание:

  • За три месяца с момента реализации посетители ускоренных страниц только один раз нажали на объявление AdSense. На ускоренных страницах висит прямоугольный блок 300 на 250 под основным контентом. Другие форматы объявлений пока не тестировал.
  • Показатель отказов AMP значительно выше, чем у стандартных страниц. По данным Google Analytics он достигает 98 %. Это может быть связано с некорректным отслеживанием эффективности ускоренных страниц сервисом Google Analytics. При переходе пользователя с AMP на обычную страницу система мониторинга засчитывает новое посещение. При этом показатель отказов для ускоренных страниц растет, а глубина сессии уменьшается.
  • Показатель просмотренных за сеанс страниц у посетителей AMP ниже чем у посетителей адаптивных страниц. Пользователи намного реже переходят на другие страницы сайта с помощью блока похожих публикаций, чем посетители обычных страниц.
  • На ускоренные страницы практически все пользователи попадают из поисковой системы Google. За неделю Google Analytics зафиксировала несколько посещений с неопределенным источником трафика.
  • Посетители ускоренных страниц редко переходят на полную версию, несмотря на наличие ссылки в футере. За неделю с 20 по 26 февраля сервис аналитики зафиксировал только 10 переходов.
Илон Маск рекомендует:  Что такое код imap_num_recent

После реализации AMP скачкообразного изменения трафика из Google не было. Сохранилась динамика умеренного роста посещаемости. На посещаемость из «Яндекса» и других источников ускоренные страницы также не повлияли.

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

  • По результатам исследования Google заявил о более высокой эффективности контекстной рекламы на AMP по сравнению с обычными страницами. Показы объявлений в видимой части экрана выросли на 80 %, а CTR рекламных блоков выросли на 90 %.
  • Участники известного русскоязычного форума о поисковых технологиях относятся к AMP преимущественно негативно. Вебмастера не замечают изменений трафика. Некоторые специалисты считают, что Google придумал AMP, чтобы лишить сайты трафика. В данном случае речь идет о возможности просмотра контента ускоренных страниц на странице выдачи.
  • Любопытные данные от Search Engine Watch. Журнал Wired благодаря AMP получил рост CTR ссылок в поисковой выдаче на 25 %. А кликабельность объявлений на ускоренных страницах выросла на 63 %. Ежемесячная посещаемость сайта журнала Slate после внедрения AMP выросла на 44 %.
  • Представители CNN в интервью The Wall Street Journal сказали, что AMP и обычные страницы монетизируются с помощью рекламы одинаково эффективно.

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

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

Как установить AMP на WordPress

Пользователям WordPress повезло: ускоренные мобильные страницы можно реализовать буквально в течение минуты. Для этого установите и активируйте плагин AMP.

Созданные с помощью плагина страницы проходят проверку в валидаторе AMP.

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

В разделе General при необходимости загрузите логотип сайта. Рекомендованный размер изображения — 190×36. С помощью кнопки Custom Logo Size вы можете указать произвольный размер логотипа.

С помощью кнопки Front Page вы можете указать произвольную страницу в качестве главной на AMP-версии сайта.


Обратите внимание на функцию AMP on Pages. Базовый плагин создает только ускоренные версии страниц записей. Если вам необходимы AMP-версии статических страниц, переключите кнопку в положение On.

В разделе Analytics подключите отслеживание посещений AMP с помощью Google Analytics. Для этого укажите Google Analytics ID.

С помощью кнопки Use Google Tag Manager можно подключить Google Analytics с помощью диспетчера тегов Google.

В разделе Design вы можете изменить внешний вид ускоренных страниц. С помощью кнопки Launch Post Builder запустите drag-and-drop редактор дизайна. Добавляйте и удаляйте элементы страницы, выберите цветовую схему, цвет заголовка и фона.

Меню Design Selector позволяет выбрать готовые варианты дизайна. В поле Custom CSS можно добавить пользовательские стили.

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

В разделе Menu настройте отображение меню на ускоренных страницах сайта. Для этого перейдите по предложенной ссылке.

В разделе Advertisement настройте отображение объявлений AdSense. Плагин предлагает четыре варианта размещения рекламы: над шапкой на всех страницах, под футером на всех страницах, а также над и под контентом на страницах публикаций.

Чтобы разместить объявление под контентом на страницах публикаций, включите кнопку AD #4. Выберите размер объявления. Создайте объявление в аккаунте AdSense и добавьте идентификаторы пользователя и рекламного блока в предложенные поля. Данные возьмите из кода созданного объявления.

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

Блоки рекомендуемого контента приносят доход при переходах посетителей по рекламным ссылкам, а также стимулируют внутренние переходы на сайте. При выборе размера 300×600 блок выглядит так (см. иллюстрацию).

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

В разделе Social Share подключите кнопки шеринга социальных сетей. В разделе Structured Data загрузите изображение для микроразметки ускоренных страниц. Google может использовать его при формировании поисковой выдачи. Также укажите размер изображений, которые будут использоваться в сниппетах при публикации ссылок на ускоренные страницы в социальных сетях.

В разделе Notification можно настроить отображение уведомлений. Например, вы можете сообщить посетителям об использовании cookies. В разделе Translation Panel переведите меню страниц на русский язык.

В разделе Disqus Comments можно подключить на ускоренных страницах систему комментирования Disqus. Для этого переключите кнопку Disqus Comments Support в положение On, укажите URL ресурса в системе Disqus и путь к файлу комментариев на сервере.

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

В разделе Advance Settings можно включить ускоренную версию главной страницы, а также страниц рубрик и архивов. За эту функцию отвечают кнопки Homepage Support и Archive Page Support соответственно.

С помощью кнопки Non-AMP Homepage link in Header and Logo можно включить ссылку на полную версию главной страницы в названии сайта и логотипе. Используйте эту возможность, чтобы перенаправлять посетителей ускоренных страниц на базовую версию сайта.

Кнопка Mobile Redirection включает автоматическое перенаправление всех мобильных пользователей с адаптивной версии сайта на AMP.

Не перенаправляйте всех пользователей на AMP. В ускоренных страницах нуждаются не все посетители сайта. Редирект вынудит владельцев смартфонов и планшетов пользоваться сокращенными версиями страниц с ограниченной функциональностью. Это может привести к падению эффективности сайта.

Более того, если Google видит только десктопную версию сайта и AMP, для mobile-first индекса он выбирает версию для стационарных ПК. Это может привести к потере трафика из-за отсутствия адаптации ресурса к мобильным устройствам.

Обязательно включите ссылку на полную версию страниц в футере с помощью кнопки Link to Non-AMP in footer. Это поможет пользователям переходить на базовые страницы с нормальной функциональностью.

В разделе Extension можно приобрести и подключить платные надстройки для плагина. Например, вы можете воспользоваться дополнительным инструментом для управления рекламой на ускоренных страницах или добавить на AMP микроразметку «Рейтинг».

В разделе Fix AMP Errors можно подключить платную поддержку. Разработчики плагина помогут разобраться с настройками и избавиться от уведомлений об ошибках в Search Console.

Блок Import/Export позволяет перенести настройки ускоренных страниц с одного сайта на другой.

Итак, на сайтах под управлением WordPress можно реализовать ускоренные страницы в течение нескольких минут. Чуть больше времени вы потратите на настройку внешнего вида и функциональности с помощью плагина AMP for WP.

AMP для Drupal

Чтобы внедрить ускоренные мобильные страницы на сайтах под управлением Drupal, воспользуйтесь следующими инструментами:

Для работы модуля AMP необходимы плагины Token и Chaos Tools. Если вы планируете показывать на ускоренных страницах объявления AdSense, установите расширение Google AdSense Integration.

На странице настроек модуля AMP на вкладке AMP Configuration подключите отображение ускоренных версий для публикаций и страниц. Выберите тему, которая будет использована для создания AMP. Укажите Google Analytics ID для отслеживания посещений страниц. Также вы можете использовать для учета просмотров AMP-пиксель.

На вкладке AMP Metadata укажите название сайта. При необходимости загрузите логотип и выберите его размер.

После настройки проверьте отображение ускоренных версий страниц. Для этого к URL добавьте значение «?amp». Например, ускоренная версия страницы http://primer-saita.ru/node/1 будет доступна по адресу http://primer-saita.ru/node/1?amp.

AMP для Joomla!

Чтобы внедрить ускоренные страницы на сайтах под управлением CMS Joomla!, воспользуйтесь расширением wbAMP. Полная версия этого плагина обойдется вам в 44 доллара США в год. Сборка для сообщества доступна бесплатно.

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

Оставьте дефолтное значение суффикса для URL AMP. В этом случае для просмотра ускоренных страниц достаточно добавить значение amp. Например, ускоренную версию страницы http://primer-saita.ru/koshki можно будет найти по адресу http://primer-saita.ru/koshki/amp.

Также на странице основных настроек укажите информацию о сайте и данные издателя. Выберите подходящий тип микроразметки: NewsArticle для новостных заметок и BlogPosting для публикаций в блоге.

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

Заполните раздел «Правило для com_content». Если вы планируете показывать ускоренные страницы только для публикаций, в поле «Представление» укажите значение Article. В поле «Категории» выберите категории, публикации в которых будут иметь AMP-версии. В полях ID, ID номер материала и «Задача» укажите значение «*». В этом случае AMP будут созданы для всех публикаций в выбранных категориях.


Другие настройки в бесплатной версии плагина недоступны.

Существует еще один коммерческий инструмент для создания ускоренных страниц на сайтах под управлением Joomla!: плагин JAmp. Он стоит 39 евро. На тестовом сайте плагина можно увидеть, как инструмент трансформирует стандартную страницу в ускоренную.

В отличие от WordPress и Drupal, для Joomla! нет полностью бесплатного инструмента для создания AMP.

AMP для интернет-магазинов

Технология AMP предназначена в первую очередь для контент-проектов: новостных ресурсов, блогов. Стоит ли создавать ускоренные страницы ecommerce-сайтам?

Авторы проекта AMP утверждают, что онлайн-магазины могут и должны использовать ускоренные страницы. Главный аргумент в пользу внедрения технологии на ecommerce-ресурсах — повышение скорости загрузки мобильных страниц положительно влияет на конверсию. Кстати, eBay экспериментирует с AMP с середины 2020 года.

AMP для OpenCart

Чтобы создать ускоренные страницы для сайта под управлением OpenCart, воспользуйтесь модулем Accelerated Mobile Pages. Это платное решение. Тестовую версию ускоренных мобильных страниц, созданных с помощью модуля, можно посмотреть по ссылке.

Также вы можете испытать модуль AMP for Product Pages. Это бесплатное решение. Надстройка создает AMP только для страниц товаров. Для работы AMP for Product Pages нужен модуль SEO Friendly URLS.

Я не могу рекомендовать бесплатный модуль AMP for Product Pages, так как за полтора рабочих дня не смог заставить его работать на тестовом ресурсе. После установки и активации программы на OpenCart версии 2.3.0.2 ускоренные страницы на сайте не появляются. Надстройка добавляет в хедер страниц ссылку на AMP-версию. При переходе по ссылке появляется ошибка 404.

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

Возможно, проблема связана с отсутствием реального опыта администрирования сайтов под управлением ОС OpenCart. Пользователи профильного форума отзываются о модуле AMP for Product Pages преимущественно позитивно.

AMP для Magento

Если ваш интернет-магазин работает на платформе Magento, воспользуйтесь платным плагином Accelerated Mobile Pages. Модуль создает AMP для главной, страниц категорий и товаров.

Демонстрационная версия ускоренных страниц сайта на Magento доступна по ссылке.

AMP для PrestaShop

Ускоренные страницы для магазина на платформе PrestaShop можно создать с помощью платного модуля PrestaShop AMP. Он генерирует ускоренные версии главной, страниц категорий и карточек товаров.

Возможности модуля можно оценить на тестовом сайте.

Внедрять или нет

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

Для сайтов под управлением Drupal также есть бесплатное решение, которое можно быстро установить и настроить. А вот для Joomla! и движков для интернет-магазинов плагины для создания AMP придется покупать.

Есть ли смысл использовать AMP, если их функциональность и внешний вид уступают стандартным страницам, а явных преимуществ в ранжировании пока нет?

«Яндекс» не поддерживает технологию и иногда неправильно индексирует ускоренные страницы. Google может передумать и закрыть проект.

Но почему-то кажется, что Google не передумает, а «Яндекс» будет вынужден играть по правилам глобального лидера поискового рынка. Логика простая: доля мобильного трафика растет и будет расти. Люди будут выходить в интернет не только с помощью телефонов и часов. На очереди кофеварки и стиральные машины. Поэтому технологии отображения контента на экранах мобильных устройств будут развиваться.

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

Используем AMP как библиотеку общего назначения для создания быстрых динамических сайтов

Изменить первое впечатление очень трудно. И я говорю не только о людях. Технологии также часто становятся заложниками первого впечатления — своей первой версии. И потом несмотря на годы развития, новые возможности и устранение старых недостатков, в массовом сознании технология остается той самой несовершенной, своей первой версией. Тем, кто не пытается бороться с такого рода когнитивными искажениями, остаётся только смотреть на успехи конкурентов, использующих знакомые технологии в новых сценариях, с немым вопросом: «А что, так можно было!?».

Наиболее ярким примером технологии, которая шагнула далеко вперёд по сравнению с тем, чем она была в самом начале, на мой взгляд является AMP — Accelerated Mobile Pages. Многие разработчики воспринимают AMP как способ положить статический контент своего сайта (статьи, новости, заметки и т.д.) в кэш Google, чтобы при открытии из поиска этот контент загружался мгновенно (о высокой скорости загрузки AMP страниц свидетельствует иконка молнии в результатах поиска :)). Естественно, если вам нужно добиться именно такого результата, то с AMP это сделать будет очень легко. Но AMP — это гораздо больше чем просто технология для работы со статическим контентом или кэшем Google. AMP уже давно используется как библиотека общего назначения, основанная на web компонентах, для создания быстрых динамических страниц и даже сайтов целиком, на которые пользователи попадают как из поиска, так и из других источников, включая прямые заходы. С этой точки зрения AMP можно поставить в один ряд с Polymer, React или Angular. Естественно с оглядкой на то, что AMP предназначена для простых (чтобы это не значило) сайтов, где основной упор делается на контент, а динамическая составляющая ограничена.

Отдельно хочется отметить, что несмотря на название — Accelerated Mobile Pages, AMP может использоваться для создания любых сайтов, как десктопных, так и мобильных. Сайт проекта — ampproject.org является замечательным примером того, что можно сделать с AMP для десктопа.

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

Как выглядит готовый лендинг вы можете увидеть на гифке выше.

AMP посвящено множество статей, среди которых можно встретить весьма критические. В основном эти статьи концентрируются на одной стороне технологии AMP, а именно на кэше. Ведь если страница сайта кладётся в кэш, и потом при клике из поиска открываются не напрямую, то это неизбежно накладывает ограничения. Пользователи как бы идут в обход вашего сайта. Возникает сакраментальный вопрос: кому это выгодно? Может быть выгоднее всегда отдавать контент напрямую? Судя по тому что AMP активно используется издателями контента, большей части из них точно выгодно использовать кэш — их сайты из поиска открываются мгновенно. Главной проблемой кэша, является то, что в адресной строке браузера пользователь видит не адрес самого сайта, на котором размещаются AMP страницы, например www.vedomosti.ru, а адрес в кэше, в данном случае он будет таким: www.google.com/amp/s/www.vedomosti.ru.

Такое поведение не является злонамеренным способом увести пользователей с вашего сайта. Это скорее техническая проблема, которую не получилось решить другим способом. Над решением данной проблемы разработчики AMP активно работают. Поможет в этом новый стандарт Web Packaging. Благодаря ему данные при загрузке в кэш подписываются сертификатом домена-источника, и в итоге при отображении AMP страниц из кэша, в адресной строке будет отображаться изначальный домен, а не адрес в кэше.

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

Илон Маск рекомендует:  Разбор XML на примере Sitemap.xml

Что делает сайты быстрыми? Быстрыми их делаете вы, разработчики! Никакой магии нет, быстрые сайты быстры потому, что их разработчики заботятся о производительности и работают над тед тем чтобы сделать сайты лучше. Существует набор лучших практик и трюков, позволяющих создавать сайты, которые быстро загружаются, а также быстро работают. Например, лучше загружать тяжёлые картинки только в тот момент, когда пользователь к ним прокручивает, а не сразу при открытии страницы. Также стоит ограничить общее количество загружаемых ресурсов, использовать асинхронные скрипты и т.д. Проблема только в том, что все эти практики нужно запомнить, держать в голове, а также постоянно контролировать их применение. Это сложно. Всегда есть соблазн сделать что-то, что не будет соответствовать лучшим практикам, но будет проще в реализации.

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

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

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

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

Какие же ограничения накладывает AMP? Самое главное ограничение — страницы не могут содержать произвольный JavaScript код. Единственно, для чего можно использовать ограниченный JavaScript — это связывание данных. Также нельзя подключать внешние JavaScript и CSS файлы. Исключения есть: это сама библиотека AMP, а также перечень одобренных компонент (вы можете принять участие в разработке AMP и создать свои компоненты). Весь CSS должен быть на самой странице, а его объем ограничен 50-ю килобайтами. Кроме того нельзя использовать часть HTML тэгов, таких как , вместо них используются web-компоненты, входящие в поставку AMP. Например, вместо применяется компонент . Это необходимо, для того чтобы AMP мог контролировать загрузку ресурсов. Также есть небольшие ограничения на CSS, вызванные соображениями производительности (нельзя использовать модификатор !important и не GPU-ускоренные анимации). Собственно это всё. AMP предоставляет богатый набор компонент, что отчасти нивелирует невозможность написания произвольного JavaScript кода. Набор компонент включает например amp-date-picker, amp-sidebar, amp-user-notification, amp-facebook-like, amp-access, с помощью которого можно реализовать поддержку аутентификации, и многие-многие другие. А в совсем крайних случаях, когда нет другого выхода, можно использовать iframe’ы c не-AMP содержимым.


Перед началом работы с AMP, я рекомендую изучить документацию на сайте проекта — ampproject.org. Кроме того, полезно заглянуть на сайт ampbyexample.com, где собраны прекрасные примеры, большую часть из которых можно практически без изменений использовать в реальных проектах. Если вам требуются готовые шаблоны, то они доступны на сайте ampstart.com.

Создание AMP лендинга

Давайте создадим лендинг страницу интернет магазина велосипедов со списком товаров, фильтрацией и поиском. Наши товары будут загружаться динамически. В целях обучения мы не будем использовать готовые шаблоны, а сделам всё с нуля. Код проекта, можно найти на GitHub: https://github.com/spugachev/amp-article

Репозиторий содержит backend на Node.js, а также AMP страницы, которые находятся в папке public. Для запуска проекта необходимо клонировать репозиторий и выполнить следующие команды в папке проекта (должен быть установлен Node.js).

Шаблон страницы

Создадим минимальную AMP страницу. Ее код представлен ниже. В проекте, который вы скачали с GitHub, главная страница public/index.html намеренно оставлена пустой, ее мы и будем использовать для написания кода.

Первое, что бросается в глаза в приведенном выше примере — HTML разметка содержит явное указание на то, что это AMP страница. Достигается это либо добавлением символа молнии в тег html (к сожалению символ молнии Хабр вырезает), либо добавлением слова «amp» туда-же. Без такого указания страница не будет проходить валидацию, и не будет добавлена в кэш Google при индексировании.

Далее необходимо подключить JavaScript библиотеку AMP:

Также надо указать канонический адрес страницы. Если существует не-AMP версия страницы, то указывается ее адрес. В противном случае указывается адрес самой AMP страницы.

Кроме того, необходимо добавить meta тег для задания масштабирования, а также шаблонные CSS стили. Данные стили нельзя менять. Они нужны для того чтобы при загрузке страницы, но до загрузки JavaScript библиотеки AMP, на экране не мигал не стилизованный контент. В случае если библиотека по каким-то причинам не загрузится, контент в любом случае будет показан через восемь секунд.

Разместим в верхней части страницы изображение с помощью компонента amp-image. Благодаря заданию параметра layout=»responsive», изображение будет растянуто на всю ширину контейнера.

Здесь и далее я не буду приводить CSS стили, и их можно найти в репозитории проекта на GitHub. Итак.

Запустите проект и откройте главную страницу в браузере. Если к адресу страницы добавить параметр #development=1, то страница будет автоматически валидироваться, а информация об этом будет выведена на консоль браузера. Для этих же целей можно использовать расширение для Chrome под названием AMP Validator.

Загрузка и отображение данных

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

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

  • amp-bind для поддержки связывания данных (data binding),
  • amp-mustache для работы с шаблонами в mustache формате
  • а также amp-list для работы со списком, который будет загружать и отображать данные.
    Подключим необходимые файлы в заголовке страницы:

Добавим на страницу компонент списка:

Для компонента задано свойство src, которое определяет откуда будут браться данные (в нашем случае будет выполнен GET запрос по адресу “//localhost:3000/api/bikes”), а также свойство items, которое позволяет искать массив элементов для списка внутри JSON ответа от сервера. Так как у нас сам ответ является массивом, то значение свойства items указывает на корень ответа.

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

Добавьте приведенный выше код, обновите страницу и посмотрите на список товаров, выведенный на страницу. Простой разметкой и без написания JavaScript кода — мы выполнили загрузку данных и отобразили данные на странице (с помощью списка и шаблона).

Фильтрация данных

Каждая AMP страница имеет состояние. Его можно рассматривать как объект с иерархией свойств. Состояние страницы можно изменять в обработчиках событий с помощью функции AMP.setState.

Добавим фильтр, позволяющий отображать только велосипеды, которые есть в наличии. Для этого разместим на странице чекбокс, по клику на который, будем изменять состояние страницы, присваивая переменной onlyAvailable значение (в соответствии с тем выбран чекбокс или нет). Название переменной — произвольное, её можно было бы назвать как угодно. Обратите внимание, что AMP реализует свой способ обработки событий. Можно обрабатывать сразу несколько событий, и для каждого события можно иметь несколько действий.

Механизм связывания данных позволяет производить связывания переменных состояния страницы со значениями свойств в HTML разметке. Для того чтобы библиотека AMP могла производить такое связывание, имя свойства, которое должно получить значение, необходимо взять в квадратные скобки — [ ]. Например, мы будем добавлять или убирать CSS класс ‘active’ (это нестандартный класс и он задается нами) в зависимости от значения переменной onlyAvailable.

В режиме разработки (#development=1) состояние страницы можно вывести на консоль браузера с помощью функции AMP.printState();

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

Теперь воспользуемся отфильтрованным списком как источником данных для компонента amp-list. Для этого свяжем свойство src компонента с макросом filteredBikes. А также свяжем свойство высоты компонента с количеством элементов. Это необходимо, так как высота компонента amp-list автоматически под количество элементов подстраиваться не будет. В данном примере число 340 — это высота карточки товара, а 16 — отступы сверху и снизу.

Обратите внимание на то, что явная загрузка данных с помощью задания свойства src=»https://localhost:3000/api/bikes» осталась. Убирать ее нельзя. При загрузке AMP страницы по соображением производительности связывание данных автоматически не выполняется. Оно будет выполнено только после действий пользователя, таких как нажатие на чекбокс.

Откройте получившуюся страницу и проверьте, что фильтрация работает корректно.

Поиск

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

Backend в нашем проекте поддерживает поиск. Для выполнения поиска товаров нужно добавить параметр “q” к уже знакомому нам GET запросу. Мы не будем останавливаться на реализации серверной части, а посмотрим, как выполнить новый запрос к серверу при изменении состояния страницы.

Выполним связывание данных для параметра src компонента amp-state, который уже использовался нами для получения начальных данных для фильтрации. При изменении переменной query состояния страницы, будет выполняться новый поисковый запрос.

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

Итог: мы создали интерактивную AMP страницу с поддержкой загрузки и связывания данных. Выполнили установку и изменение состояния страницы, научились работать с шаблонами, а также реагировать на пользовательский ввод. Как видите, AMP прекрасно позволяет разрабатывать интерактивные динамические страницы, даже, не смотря на серьёзные ограничения в применении JavaScript. Попробуйте теперь сказать что AMP — это для статики ;). Мы знаем, что AMP может намного больше!

AMP Toolbox

При загрузке AMP страниц в кэш и отдаче их из кэша, Google проводит множество оптимизаций. Когда вы отдаёте AMP страницы с вашего сайта напрямую, то, естественно, никаких дополнительных оптимизаций не производится. Если вы хотите ускорить прямую отдачу AMP страниц, воспользуйтесь библиотекой AMP Toolbox. Она предоставляет в том числе middleware для Express, поэтому обычно использование AMP Toolbox вместе с Node.js — вопрос добавления нескольких строк кода. При этом скорость загрузки страниц увеличивается!


Дальнейшие шаги

Аналитика

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

AMP поддерживает два основных компонента для сбора данных: amp-pixel для установки простого пикселя и amp-analytics для более сложных решений аналитики. Также компонент amp-experiment позволяет проводить A/B тесты на AMP страницах.

С помощью amp-analytics вы можете подключить Google Analytics, Яндекс Метрику и другие провайдеры (например Baidu Analytics).

Добавить аналитику на страницу очень просто. Сначала необходимо подключить соответствующую библиотеку с компонентом amp-analytics.

И далее поместить компонент на страницу и настроить параметры. Для Google Analytics это будет выглядеть следующим образом.

Для Яндекс Метрики код очень похож.

Естественно это самые минимальные настройки. Для любого аналитического решения необходимо задать в настройках какие именно данные вы хотите собирать.

При использовании компонента amp-analytics возникает проблема с отслеживанием пользователей на AMP и не AMP страницах. Хочется чтобы id пользователей везде были одинаковыми. Чтобы пользователь, загрузивший вашу страницу из кэша Google, а потом перешедший по ссылкам на ваш сайт напрямую, с точки зрения аналитики считался бы одним и тем-же пользователем. Для этого необходимо использовать Client ID API. Более подробно о том, какие настройки необходимо сделать, написано в справке Google Analytics.

Service Worker’ы и PWA (Progressive Web Apps)

В случае достаточно сложных сайтов, а также уже существующих сайтов, будет трудно написать или вообще переписать все на AMP. Поэтому обычно те страницы, на которые пользователи попадают из внешних источников (страницы входа), делают AMP страницами. Они будут быстро открываться как из кэша, так и напрямую. Но дальше, когда пользователь кликнет на ссылку на AMP странице, он попадет на ваш основной сайт. И тут важно, чтобы основной сайт при переходе с AMP страницы грузился мгновенно. Достичь этого позволяет механизм сервис воркеров (Service Workers). При открытии AMP страницы, она должна установить сервис воркер для основного сайта, а сервис воркер в свою очередь выполнит загрузку и кеширование необходимых файлов. Благодаря этому ссылки на AMP странице будут открываться мгновенно, так как всё или почти всё, что нужно для открытия следующих страниц, уже будет находиться в кэше.

Для установки сервис воркера используется компонент amp-install-serviceworker. Подключается он таким-же способом, как и все остальные AMP компоненты.

Пример его использования представлен ниже.

Если пользователь зайдет на ваш сайт напрямую, компонент установит сервис воркер, заданный параметром src. Но в случае загрузки AMP страницы из кеша, он не сможет это сделать, так как установка сервис воркеров для других доменов запрещена. Поэтому вам необходимо создать на сайте страницу, на которой будет находиться код установки сервис воркера. При загрузке из кеша, amp-install-serviceworker откроет страницу в iframe, и сервис воркер будет установлен.

PWA (Progressive Web Apps) — это подход к тому, как надо строить современные web приложения, приближающиеся к нативным по пользовательскому опыту. Сердцем PWA являются сервис воркеры. Можно встретить мнение, что AMP и PWA в является в какой-то степени конкурентами. На самом деле, они дополняют друг друга. PWA концентрируется на длительных и по возможности регулярных взаимодействиях с пользователями. При этом AMP концентрируется на первом взаимодействии, когда пользователь приходит извне. PWA никак не улучшает именно этот аспект — первое взаимодействие. Поэтому очень многие проекты используют AMP как точку входа, которая переводит пользователя в PWA. И это очень разумно. Если же у вас не предполагаются регулярные, длительные или сложные взаимодействия с пользователем, то можно обойтись и одним AMP.

Заключение

В данной статье мы рассмотрели одно применение AMP, хотя на самом деле есть еще много интересных сценариев. Например, AMPHTML ads — это прекрасный способ создания рекламы, которая быстро грузится. Ведь если на AMP страницах, открывающихся моментально, будут располагаться медленно загружаемые баннеры, пользователи такую рекламу скорее всего просто не увидят. Да и на обычных страницах — медленно загружаемая реклама раздражает пользователей. Поэтому логично саму рекламу (рекламные креативы) делать с помощью AMP.

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

Кроме того, сейчас разрабатывается версия AMP для электронной почты (AMPHTML for email), которая позволит создавать красивые интерактивные письма с помощью AMP.

Не забывайте также, что AMP можно использовать просто как формат вставки контента на вашем сайте. Например если в React или Angular приложении требуется отображать новости, статьи или карточки товара, то их можно хранить в AMP формате, предзагружать и потом мгновенно показывать в web приложении (или даже в нативном приложении). Не обязательно использовать AMP для всей страницы целиком — AMP содержимым могут быть и маленькие кусочки контента.

С помощью AMP вы можете создавать как сайты целиком, так и отдельные страницы, баннеры, истории, а также использовать AMP как быстрый и компактный формат вставки контента.

Илон Маск рекомендует:  Что такое код domdocumenttype &#62;public_id

Сергей Пугачёв, Google Developer Expert
PS. Статья является личным взглядом на AMP и может не совпадать с мнением Google или работодателя автора ;)

Что такое код hw_api &#62;insertcollection

hw_api->insertcollection — вставляет новый объект типа collection.

Описание

object insertcollection (array parameter)

Эта функция является аббревиатурой hwapi_insert() . Она вставляет объект типа collection и устанавливает некоторые атрибуты, необходимые для collection. Массив parameter содержит необходимые элементы ‘object’ и ‘parentIdentifier’ и необязательные элементы ‘parameter’ и ‘attributeSelector’. См. в hwapi_insert() значение каждого элемента.

Что такое код hw_api &#62;insertcollection

(no version information, might be only in CVS)

hw_api->insertcollection — Inserts a new object of type collection

Description hw_api_object hw_api->insertcollection ( array parameter )


Пред. Начало След.
hw_api->insertanchor Уровень выше hw_api->insertdocument

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

Что такое код hw_api &#62;insertcollection

hw_api->insertcollection — вставляет новый объект типа collection.

Описание

object insertcollection (array parameter)

Эта функция является аббревиатурой hwapi_insert() . Она вставляет объект типа collection и устанавливает некоторые атрибуты, необходимые для collection. Массив parameter содержит необходимые элементы ‘object’ и ‘parentIdentifier’ и необязательные элементы ‘parameter’ и ‘attributeSelector’. См. в hwapi_insert() значение каждого элемента.


DATA API

Соглашения

Приняты следующие соглашения при использовании Data API:

  • Пустые поля всегда возвращаются в ответе со значением null . В случае массива возвращается пустой массив, в случае объекта возвращается пустой объект;
  • Все поля связанные с датой и временем передаются в формате YYYY-MM-DD hh:mm:ss;
  • Запросы к API выполняются всегда с помощью метода POST;
  • Все параметры в запросах/ответах, а также в структурах данных в формате JSON и название методов именуются в стиле Snake Case — разделение слов через нижнее подчёркивание;
  • Данные возвращаются только в JSON формате согласно спецификации RFC 7159. Заголовок Accept игнорируется;
  • Кодировка данных UTF-8;
  • Заголовок Content-Type должен быть «application/json; charset=UTF-8» ;
  • Заголовок Content-Length должен содержать корректную длину сообщения, следуя спецификации HTTP/1.1

Добавить IP-адрес в список разрешенных

По умолчанию доступ к API запрещен всем, чтобы можно было делать запросы необходимо IP-адрес хоста с которого делается запрос добавить в белый список. Это можно сделать через личный кабинет «Администратор -> Аккаунт -> Правила и настройки безопасности» вкладка «API».

Если необходимо разрешить доступ всем IP-адресам, то нужно добавить в список разрешенных 0.0.0.0/0

Если запрос делается из под агента, то его IP адрес должен быть добавлен в белый список клиентского аккаунта

Пользователи API и аутентификация

К пользователям и ключам доступа применяются права доступа аналогичные правам доступа в личном кабинете

Доступ по ключу

Ключи генерируются на уровне пользователя в разделе личного кабинета «Аккаунт» → «Управление пользователями»
Существует два типа ключей:

Постоянный ключ имеет неограниченное время действия.
Временный ключ имеет конкретную дату окончания действия ключа.

Доступ по логину и паролю

Используется аутентификация с использованием сессий

Отчёт по запросам к API

В личном кабинете «Отчёты»->»Служебные»->»Запросы к API» можно построить отчёт по запросам к API

Базовый URL для доступа к API

Базовый URL для доступа к API соответствует следующему шаблону:

— https;

  • — api.comagic.ru, api.uiscom.ru;
  • — версия API (см. раздел Версионность)
  • Версионность

    Текущая версия Data API 2.0

    Data API поддерживает версионность. Версия указывается в базовом URL как vX.Y , где X — номер мажорной версии, Y — номер минорной версии

    Если была выпущена новая версия, то старая считается устаревшей и соответственно при обращении к старой версии API в мета-параметрах (см. раздел Мета-параметры) будет возвращаться параметр «current_version_deprecated» со значением «true»

    Максимальное количество поддерживаемых версий — 2
    Период поддержки устаревшей версии 2 месяца

    Лимиты и ограничения

    Баллы списываются только за успешные запросы, т.е в отчете по запросам к API (см. раздел Отчёт по запросам к API) он помечен как успешный.

    Информация о лимитах возвращается во всех ответах в мета-парметрах (см. раздел Мета-параметры) кроме случаев когда лимиты не учитываются;

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

    Информация о лимитах в мета-параметрах:

    Название параметра Описание
    day_limit Текущий лимит баллов в день
    day_remaining Какое количество баллов осталось до достижения дневного лимита
    day_reset Время в секундах через которое дневной лимит будет сброшен
    minute_limit Текущий лимит баллов за минуту
    minute_remaining Какое количество баллов осталось до достижения минутного лимита
    minute_reset Время в секундах через которое минутный лимит будет сброшен

    Методы и их стоимость в баллах

    Тип операции Стоимость в баллах
    Все операции 1

    Расширение лимитов

    На странице «Аккаунт» -> «Тарифы и опции» в личном кабинете можно расширить лимиты.


    Обработка ошибок

    Параметры сообщения об ошибке

    Название Тип Обязательный Описание
    error object да Объект с содержимым ошибки
    code number да Не уникальный код ошибки (см. раздел Группы кодов ошибок )
    message string да Cообщение об ошибке
    data object да Объект с деталями ошибки
    mnemonic string да Уникальный текстовый код ошибки. При обработке ошибок рекомендуется использовать этот параметр.
    value string нет Содержит то, что передал пользователь без изменений

    В некоторых случаях может отсутствовать. К примеру, обязательный параметр вообще не был заполнен.

    extended_helper string нет Ссылка на более подробное описание ошибки и возможные решения params object нет Карта подстановок параметров для шаблона с текстом об ошибке. Т.е. содержит динамически изменяемые значения, к примеру, лимиты. Значения указанные в этом параметре могут быть использованы в сообщениях об ошибках в интерфейсе, который базируется на Data API. field string нет Название параметра, с которым связана ошибка

    Вложенные параметры отображаются через разделитель точка «.»
    К примеру: «employee.phone_number»

    JSON структура ошибки

    Группы кодов ошибок

    Код ошибки Описание
    -32700 Ошибки связанные с валидацией JSON
    -32600 Ошибки связанные с валидацией параметров запроса — id , jsonrpc
    -32601 Ошибки связанные с методом
    -32602 Ошибки связанные с валидацией параметров в вызываемом методе
    -32603 Внутренние ошибки JSON RPC сервера
    -32001 Ошибки аутентификации и ошибки с ключами
    -32003 Ошибки с правами доступа — ip адрес не в белом списке, нет прав у пользователя
    -32004 Ошибки связанные с неверной последовательностью вызываемых методов
    -32007 Ошибки связанные с виртуальным номером
    -32008 Ошибки связанные с компонентами
    -32009 Ошибки связанные с аккаунтом
    -32029 Ошибки связанные с лимитами
    -32099 Ошибки связанные с поддержкой различных частей спецификации JSON RPC 2.0 — Групповые операции, Уведомления

    Список ошибок общих для всех методов

    Текст сообщение Код Мнемоника Описание
    Invalid Request The JSON sent is not a valid Request object -32600 invalid_request Ошибки связанные с валидацией параметров запроса — id , jsonrpc
    Access token has been expired -32001 access_token_expired Применяется только к постоянному токену. Если время жизни постоянного токена истекло, то возвращается указанная ошибка
    Access token has been blocked -32001 access_token_blocked Если постоянный токен заблокирован, то возвращается указанная ошибка
    Access token is invalid -32001 access_token_invalid Указанная ошибка возвращается если постоянный/временный токен не найден
    Limit per has been exceeded. Value of current limit per is -32029 limit_exceeded Лимит превышен
    You need at least on of the following components to access this method: -32008 method_component_disabled Если не подключен компонент, который требуется для работы метода
    You need at least on of the following components to access this paremeter: -32008 parameter_component_disabled Если не подключен компонент, который нужен для заполнения параметра и создания сущности
    Your IP is not whitelisted -32003 ip_not_whitelisted IP адрес с которого делается запрос не находится в белом списке адресов. Если запрос делается из под агента, то ваш IP адрес должен быть в списках разрешеных адресов внутри клиентского аккаунта
    Login or password is wrong -32001 auth_error Неправильный логин или пароль
    Your account has been disabled, contact the support service -32009 account_inactive Аккаунт заблокирован
    Internal error, contact the support service -32603 internal_error Внутренняя ошибка, необходимо обратиться в службу технической поддержки
    Data supplied is of wrong type -32602 data_type_error К примеру, если ожидаем string а передали int
    The method does not exist / is not available -32601 method_not_found Вызываемый метод не найден
    Permission denied -32003 forbidden Нет прав на доступ к методу или API, или запрещено выполнять какое-либо действие
    Invalid JSON was received by the server. -32700 parse_error Ошибка валидации JSON
    Batch operations not supported -32099 batch_opreations_not_supported Групповые операции не поддерживаются
    Notifications not supported -32099 notifications_not_supported Был потерян параметр id в запросе. См. раздел Общие параметры для всех методов»
    The required parameter has been missed -32602 required_parameter_missed Обязательный параметр не передали
    Invalid parameter value -32602 invalid_parameter_value Возвращается во всех случаях, если было передано некорректное значение параметра или переданное значение не соответствует требуемому формату ввода
    Unexpected method parameter(s) -32602 unexpected_parameters Если в «params» были переданы параметры которые не предусмотрены JSON структурой метода или указан параметр для сортировки, фильтрации и выборки, который не существует
    The combination of parameters is not permitted -32602 invalid_parameters_combination Если параметры указанные в методе находятся в недопустимой комбинации или имеют зависмость друг от друга. Нужно смотреть документацию по методу и его параметрам.
    -32602 error Динамические ошибки

    Список ошибок для методов с глаголом get

    Текст ошибки Код Мнемоника Описание
    Invalid parameter value -32602 invalid_parameter_value Если в фильтрах было передано некорректное значение для regexp, jsquery или любых значений не соответствующих документации
    Sort by parameter is prohibited -32602 sort_prohibited Сортировка по параметру запрещена и невозможна, так как параметр для сортировки не находится в списке разрешенных для сортировки
    Filter by parameter is prohibited -32602 filter_prohibited Фильтрация по параметру запрещена и невозможна, так как параметр для фильтрации не находится в списке разрешенных для фильтрации
    Max value of requested date interval is 3 months -32602 date_interval_limit_reached Если в запросе период между указанными датами в date_from и date_till превышает 3 месяца. В основном ошибка актуальна только для методов получения отчетов, но не для всех.

    Список ошибок общих для методов с глаголом delete

    Текст ошибки Код Мнемоника Описание
    Entity not found -32602 entity_not_found Если передан уникальный идентификатор сущности, которая не найдена
    You have interdependet entities -32602 dependency_error Удаляемая сущность используется в других сущностях. Чтобы удалить, необходимо убрать удаляемую сущность из всех возможных мест где она используется
    Permission denied -32602 forbidden Удалить сущность невозможно так как она системная, к примеру группа «Черный список» в адресной книге

    Список ошибок общих для методов с глаголом create и update, set, unset

    Текст ошибки Код Мнемоника Описание
    Entity not found -32602 entity_not_found Если передан уникальный идентификатор сущности, которая не найдена
    Duplicate entity -32602 duplicate_entity Если сущность уже существует
    A new data limit has been exceeded -32602 data_limit_exceeded Ошибка возникает в случае, если было достигнуто максимальное количество данных.
    Action is not allowed for your tariff plan. You need contact support service or change your tariff plan settings in your account -32602 tariff_restrictions Любые ограничения тарифного плана
    This value is already used by another entity -32602 already_in_use Значение указанного параметра уже используется в другой сущности. К примеру, виртуальный номер уже используется в другой рекламной кампании.

    Групповые операции

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

    Принцип именования методов

    Имя JSON-RPC метода состоит из двух частей разделенных точкой: глагола и имени объекта.

    Имя объекта выбирается как существительное во множественном числе, отражающее бизнес-сущность, например subscribers .

    Имя метода должно начинаться с глагола, отражающего суть операции.

    Глаголы используемые в именовании методов

    Глагол Описание
    create Добавляет сущность.
    get Возвращает список отсортированных и отфильтрованных данных с помощью критериев фильтрации и методов сортировки. К запросу возможно применить лимит и постраничный вывод на количество получаемых данных (см. раздел Постраничный вывод). С помощью критериев фильтрации может быть так же получена одна запись, по ёё уникальному идентификатору (см. раздел Критерии фильтрации). В специальном мета-параметре возвращается общее количество записей (см. раздел Мета-параметры). С помощью специального параметра можно указать какие поля возвращать в ответном сообщении (см. раздел Представление возвращаемых данных).
    update Обновляет сущность с определённым идентификатором.

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

    delete Удаляет сущность с определённым идентификатором. add Связь одного объекта с другим. enable Подключение объекта disable Отключение объекта set Простановка свойства на другой объект, к примеру, установка тега на обращение unset Снятие свойства с другого объека, к примеру, снятие тега с обращения

    Критерии фильтрации

    Фильтрация данных применяется только к глаголу «get» (см. раздел «Глаголы используемые в именовании методов» с помощью необязательного примитива «filter» , который является объектом и может содержать:

    1. Простой фильтр;
    2. Дерево фильтров которое содержит простые фильтры с условиями.

    Простой фильтр — это объект, который содержит в себе обязательные примитивы:

    • field — поле сущности к которой будет применяться фильтрация (список заранее определён для метода);
    • operator — оператор фильтрации. Список всех операторов можно получить в разделе «Операторы фильтрации»;
    • value — значение для оператора фильтрации. Необязательное поле, если оно отсутствует, то считается пустота.

    Дерево фильтров содержит специальный примитив «filters» , который может содержать в себе как простые фильтры, так и дерево фильтров.

    Возможные ошибки при фильтрации

    Текст Код Мнемоника Описание
    Filter by parameter is prohibited -32602 filter_prohibited Фильтрация по параметру запрещена и невозможна, так как параметр для фильтрации не находится в списке разрешенных для фильтрации
    Unexpected method parameter(s) -32602 unexpected_parameters Передан ошибочный параметр или параметр, которого не существует

    Пример JSON структуры простого фильтра

    Получаем список записей у которых поле «name» имеет имя «Bob»


    Пример JSON структуры дерева фильтров с одним уровнем вложенности

    Получаем список записей у которых поле «name» имеет имя «Bob» и его возраст 25 лет

    Пример JSON структуры дерева фильтров с двойным уровнем вложенности

    Получаем список записей у которых поле «name» имеет имя «Bob» и его возраст 25 лет или список записей у которых поле «name» имеет имя «Dexter» и его возраст 2 года

    Пример JSON структуры дерева фильтров с тройным уровнем вложенности

    Условие запроса ((addv_comp_ >

    Операторы фильтрации

    Фильтрация null и not null будет =null, !=null

    Оператор Описание Учёт регистра строк Тип данных
    = Равно да number, string, null, boolean, iso8601, enum
    != Не равно да number, string, null, boolean, iso8601, enum
    Меньше чем number, iso8601
    > Больше чем number, iso8601
    Меньше или равно number, iso8601
    >= Больше или равно number, iso8601
    like Начинается с, Заканчивается на, Содержит
    да string regexp Posix да string jsquery PostgreSQL jsquery да object, array in Массив значений в отношении «or» да number, string, enum

    Сортировка данных

    Сортировка данных применяется только к глаголу «get» (см. раздел «Глаголы используемые в именовании методов») с помощью массива объектов сортировки со следующими примитивами:

    • field — поле по которому производится сортировка;
    • order — направления сортировки. Возможные значения «asc» / «desc» . «asc» — по возрастанию, «desc» — по убыванию. Параметр необязателен. Значение по умолчанию «asс» .

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

    Возможные ошибки при сортировки

    Текст ошибки Код Мнемоника Описание
    Sort by parameter is prohibited -32602 sort_prohibited Сортировка по параметру запрещена и невозможна, так как параметр для сортировки не находится в списке разрешенных для сортировки
    Unexpected method parameter(s) -32602 unexpected_parameters Передан ошибочный параметр или параметр, которого не существует

    Постраничный вывод

    Постраничный вывод может быть применён к глаголу «get» (см. раздел «Глаголы используемые в именовании методов»). Для выполнения пагинации данных используются следующие параметры:

    Параметр Значение по умолчанию Допустимое значение Описание
    offset 100 000 Сдвиг, определяет с какого номера записи возвращать «limit» записей
    limit 1000 10 000 Размер возвращаемых данных (количество записей)

    Мета-параметры

    Возвращаются при использовании глагола «get» (см. раздел «Глаголы используемые в именовании методов»).

    Присутствуют как в ошибочном, так и в успешном ответе

    Параметр «api_version» возвращается только для версий которые deprecated.

    Представление возвращаемых данных

    Отдельный список возвращаемых столбцов

    В глаголе получения данных «get» (см. раздел «Глаголы используемые в именовании методов») может быть указан специальный необязательный примитив «fields» с типом массив, который может содержать список полей которые необходимо показать в выводе. Если примитив «fields» не используется, то в выводе показываются все поля по умолчанию для вызываемого метода.

    Список полей индивидуален для каждого метода.

    Возможные ошибки в представлении возвращаемых данных

    Текст Код Мнемоника Описание
    Unexpected method parameter(s) -32602 unexpected_parameters Передан ошибочный параметр или параметр, которого не существует

    Общие поля для всех методов

    Название Тип Обязательный Допустимые значения Описание
    id string или number да Уникальный идентификатор запроса к API, который используется для связи запроса с ответом. Рекомендуется делать в виде уникального хэша или случайного числа .
    method string да Вызываемый метод
    jsonrpc string да 2.0 Номер спецификации JSON-RPC
    params object да Содержит тело запроса к API. В зависимости от вызываемого метода тело запроса меняется.

    Аутентификация

    Метод login.user
    Описание Вход и получение ключа сессии аутентификации
    Кому доступен Партнёр, Клиент

    Параметры запроса

    Название Тип Обязательный Допустимые значения Описание
    login string да Логин пользователя
    password string да Пароль пользователя

    Параметры ответа

    Название Тип Обязательный Описание
    access_token string да Ключ сессии аутентификации
    expire_at number да Timestamp когда выданный токен перестанет быть валидным
    app_id number да Уникальный идентификатор клиента

    Время жизни полученного ключа сессии аутентификации после вызова метода «login.user» — 1 час. По истечению времени жизни ключа сессии его необходимо запрашивать заново, т.е. вызывать метод «login.user» .

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

    Понравилась статья? Поделиться с друзьями:
    Кодинг, CSS и SQL