Атрибут ping элемента ссылки HTML5

Тег <a> — один из самых старых и базовых элементов в HTML. Он используется для создания гиперссылок. Приняв во внимание развитие веб-технологий, HTML5 представил несколько новых фич для улучшения веб-разработки. Одна из таких фич — атрибут ping, который обеспечивает дополнительные возможности отслеживания кликов по ссылкам.

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

Что собой представляет атрибут ping элемента ссылки?

Атрибут ping — опциональный атрибут тега <a>. С его помощью можно указать один или несколько URL, на которые поступит уведомление, если по ссылке кликнут. Эти уведомления отсылаются в виде POST-запросов на указанные URL-адреса.

Пример синтаксиса:

<a href="https://example.com" ping="https://tracker.com/log">Visit Example</a>

Здесь клик по ссылке переводит пользователя на страницу https://example.com. При этом на https://tracker.com/log отправляется HTTP POST-запрос.

Как работает атрибут ping?

Когда пользователь нажимает на ссылку с атрибутом ping, браузер отправляет HTTP POST-запрос на указанный(-е) URL(ы). Место назначения ссылки (href) загружается как обычно.

POST-запрос ping содержит такую информацию, как URL-адрес ссылки, по которой был совершен переход, и URL-адрес страницы, с которой перешел пользователь (для последнего используется заголовок Referer)

Преимущества использования атрибута ping

• Упрощенная аналитика. Атрибут ping позволяет владельцам сайтов отслеживать переходы по ссылкам без использования JavaScript или сложных механизмов отслеживания.
• Сокращение накладных расходов. В отличие от JavaScript, с помощью которого обычно реализуется отслеживание, атрибут ping легок и не оказывает существенного влияния на производительность страницы.
• Улучшенный пользовательский опыт. Пользователи сразу же переходят на целевую страницу, а отслеживание происходит в фоновом режиме.
• Улучшенное соблюдение конфиденциальности. По сравнению со сторонними скриптами отслеживания, ping обеспечивает более простой и потенциально менее навязчивый способ сбора данных о переходе по ссылке.

Использование атрибута ping на практике

Юзкейсы

1. Отслеживание кликов по ссылкам. Администраторы сайтов, желающие отслеживать эффективность ссылок, могут использовать ping для логирования кликов.

<a href="https://example.com" ping="https://analytics.com/log">Visit Example</a>

2. Партнерский маркетинг. Партнерские сети могут использовать ping для отслеживания реферальных кликов.

<a href="https://product.com" ping="https://affiliate.com/track">Buy Now</a>

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

<a href="https://promo.com" ping="https://ads.com/click-track">Learn More</a>

Вопросы конфиденциальности при использовании атрибута ping

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

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

Поддержка атрибута ping браузерами

Большинство современных браузеров, включая Chrome, Firefox и Edge, поддерживают атрибут ping. Однако некоторые пользователи могут отключить его по соображениям конфиденциальности.

Чтобы проверить, поддерживает ли ваш браузер атрибут ping, выполните следующие действия:

1. Откройте инструменты разработчика в браузере.
2. Кликните ссылку с атрибутом ping.
3. Найдите POST-запрос ping в логах сети.

Как отключить атрибут ping в браузерах

Пользователи, заботящиеся о конфиденциальности, могут отключить атрибут ping.

Chrome

1. Откройте настройки Chrome.
2. Перейдите в раздел Конфиденциальность и безопасность > Cookies и другие данные сайта.
3. Заблокируйте сторонние файлы cookie и трекеры.

Firefox

1. Откройте Параметры Firefox.
2. Перейдите в раздел Конфиденциальность и безопасность > Усиленная защита от слежения.
3. Выберите строгий режим.

Расширения

Расширения для браузеров, ориентированные на конфиденциальность, такие как uBlock Origin или Privacy Badger, могут блокировать запросы ping.

Альтернативы атрибуту ping

Для разработчиков, которым нужен больший контроль или совместимость, альтернативой может стать отслеживание кликов с помощью JavaScript.

Пример:

document.querySelector('a').addEventListener('click', function() {
  fetch('https://tracker.com/log', {
    method: 'POST',
    body: JSON.stringify({ link: this.href }),
  });
});

Но этот подход требует дополнительного написания кода и влияет на производительность веб-страницы.

Заключение

Атрибут ping тега <a> в HTML5 предлагает простой и эффективный способ отслеживания кликов по ссылкам. В отличие от JavaScript, который часто применяется в этих целях, ping отличается легковесностью.

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

Перевод статьи “Exploring the HTML5 <a> Tag Ping Attribute”.

Запись Атрибут ping элемента ссылки HTML5 впервые появилась techrocks.ru.