Бесплатная аналитика вместо Яндекс Webvisor: ставлю Clarity на сайт за 2 клика (2026)
Microsoft Clarity на Eleventy через Claude Code — бесплатная замена Яндекс Webvisor: запись сессий, тепловые карты, rage clicks, dead clicks. Разбираю, законно ли использовать Яндекс Метрику из США после продажи Яндекса российским инвесторам. Claude анализирует структуру проекта, предлагает архитектуру, маскирует email через data-clarity-mask и только после одобрения пишет код. Деплой через GitHub → Cloudflare Pages. ЧТО ВЫ УЗНАЕТЕ: → Как выбрать бесплатный аналог Яндекс Webvisor для статичного сайта с Eleventy → Почему Яндекс Метрика из США рискованна — правовой и репутационный разбор → Как подключить Microsoft Clarity на сайт через Claude Code без ручного кода → Как маскировать email через data-clarity-mask="true" с версионированием в Git → Как проверить, что скрипт Clarity появился на сайте через Ctrl+U в браузере → Как работает связка PyCharm + Claude Code + GitHub + Cloudflare Pages для деплоя ▶ ПЛЕЙЛИСТ: Аналитика https://www.youtube.com/playlist?list=PL6D9b9lf9gb2mii-Nfi7OG31GxvBHPLi9 ▶ ПЛЕЙЛИСТ: Создание сайта с нуля https://www.youtube.com/playlist?list=PL6D9b9lf9gb3fQ4DddlVDtIlvFHAM85pS ▶ Google Analytics через браузерного агента Claude https://youtu.be/JYrxaiSUIcY ▶ Claude Code 2026: Project Design и контракт с ИИ https://youtu.be/bHSjFmsiCKU ▶ Деплой сайта на Cloudflare Pages + GitHub https://youtu.be/phS7-o7WVgc ─── ТАЙМКОДЫ ─────────────────────────── 0:00 Приветствую зрителей и объясняю концепцию: снимаю всё без вырезок, показываю все ошибки — это развивает вас как программиста лучше, чем любая выхолощенная инструкция. 0:55 Тема видео: делаю аналитику по сайту. Сайт уже создан — 300 страниц плюс. Перед запуском контекстной рекламы и для улучшения SEO хочу понять поведенческую реакцию пользователей. 1:43 Мне очень нравился Яндекс Webvisor — видно, куда человек скролит, как загружается контент, где кликает. Прошу ИИ найти актуальный аналог, который не замедляет страницу. 3:06 Ответ Claude: Microsoft Clarity — бесплатно навсегда, без лимитов по трафику и сессиям. Запись сессий, тепловые карты, rage clicks, dead clicks, интеграция с Google Analytics, лёгкий SDK. Минус: Microsoft использует поведенческие данные для обучения своих моделей. 3:47 Спрашиваю: работает ли яндексовский сервис и законно ли использовать Яндекс Webvisor из США? В июле 2024 Небсгруп продала активы Яндекса за 5,3 млрд — теперь это полностью российская компания. Данные уходят на серверы в России. Прямых санкций нет, но есть практические и репутационные риски. Выбираю Microsoft Clarity. 5:55 Прошу Claude создать ТЗ: как установить Microsoft Clarity на самописный статичный сайт с Eleventy. Подход: сначала ТЗ, затем загружаю файл дизайна проекта из корня, чтобы Claude уточнил под реальную структуру. 7:19 Первый вариант ТЗ неправильный — я ещё не зарегистрировался в Clarity. Суть: код вставляется в header и подтягивается во все страницы. Регистрация заняла два клика — сразу выдали код. 9:09 Прошу Claude прочитать все MD-документы в корне проекта. Выделяю его в отдельное окно на весь экран — прочитал правила, карту проекта, готов к работе. 10:15 Копирую код отслеживания из Clarity и ТЗ от браузерного агента. Даю Claude свободу оспорить инструкцию: предлагай, планируй, спорь — и только после моего одобрения создавай код. 12:20 Анализ от Claude: добавить скрипт Clarity в head после блока GA4 — оба инструмента рядом, легко обслуживать. Нужно маскировать поле capture email. 12:57 Два варианта маскировки email. Вариант А: CSS в панели Clarity — не версионируется в Git. Вариант Б: атрибут data-clarity-mask="true" в коде — версионируется в Git, явно видно. Claude рекомендует Б: если пересоздать проект в Clarity, маскировка не потеряется. Соглашаюсь. 13:52 Итоговый план: скрипт Clarity после GA4 + data-clarity-mask="true" к полю email. Мой подход: не даю писать код, пока не утвержу архитектуру. 14:44 Нажимаю «Применить». Claude замаскировал email как обсудили. Прошу создать текст для коммита. 15:34 Объясняю стек для новых зрителей: Claude Code в PyCharm от JetBrains. Вручную коммичу и смотрю изменённые файлы — визуальный контроль за ИИ. Бывало, Claude говорит что работает, а файлы не меняются: просто списывает токены и обманывает. 16:47 Деплой: GitHub → Cloudflare Pages автоматически. Нажимаю Ctrl+U, проверяю исходный код — вижу Google Tags, затем появляется Microsoft Clarity. Всё работает. 17:53 Microsoft Clarity подключён. Смотрю на органическом трафике из Google, при необходимости настраиваю — потом заливаю контекстную рекламу. 18:15 Прошу подписываться и ставить лайк. ─── ИНСТРУМЕНТЫ ──────────────────────── ▶ Установка Claude Code на Windows 11 → https://youtu.be/LRZjphm0NaY ▶ Установка PyCharm Community Edition → https://youtu.be/_BN5kArV07s ▶ Подключение PyCharm к GitHub → https://youtu.be/kHe3go_wDjU ▶ Claude Code плагин в PyCharm → https://youtu.be/tb5DZoS04oo #ВайбКодБлогер #ВайбКодинг #MicrosoftClarity #ClaudeCode #ЯндексWebvisor #SEOАналитика #Eleventy #CloudflarePages #WebАналитика #ИИРазработка
Microsoft Clarity на Eleventy через Claude Code — бесплатная замена Яндекс Webvisor: запись сессий, тепловые карты, rage clicks, dead clicks. Разбираю, законно ли использовать Яндекс Метрику из США после продажи Яндекса российским инвесторам. Claude анализирует структуру проекта, предлагает архитектуру, маскирует email через data-clarity-mask и только после одобрения пишет код. Деплой через GitHub → Cloudflare Pages. ЧТО ВЫ УЗНАЕТЕ: → Как выбрать бесплатный аналог Яндекс Webvisor для статичного сайта с Eleventy → Почему Яндекс Метрика из США рискованна — правовой и репутационный разбор → Как подключить Microsoft Clarity на сайт через Claude Code без ручного кода → Как маскировать email через data-clarity-mask="true" с версионированием в Git → Как проверить, что скрипт Clarity появился на сайте через Ctrl+U в браузере → Как работает связка PyCharm + Claude Code + GitHub + Cloudflare Pages для деплоя ▶ ПЛЕЙЛИСТ: Аналитика https://www.youtube.com/playlist?list=PL6D9b9lf9gb2mii-Nfi7OG31GxvBHPLi9 ▶ ПЛЕЙЛИСТ: Создание сайта с нуля https://www.youtube.com/playlist?list=PL6D9b9lf9gb3fQ4DddlVDtIlvFHAM85pS ▶ Google Analytics через браузерного агента Claude https://youtu.be/JYrxaiSUIcY ▶ Claude Code 2026: Project Design и контракт с ИИ https://youtu.be/bHSjFmsiCKU ▶ Деплой сайта на Cloudflare Pages + GitHub https://youtu.be/phS7-o7WVgc ─── ТАЙМКОДЫ ─────────────────────────── 0:00 Приветствую зрителей и объясняю концепцию: снимаю всё без вырезок, показываю все ошибки — это развивает вас как программиста лучше, чем любая выхолощенная инструкция. 0:55 Тема видео: делаю аналитику по сайту. Сайт уже создан — 300 страниц плюс. Перед запуском контекстной рекламы и для улучшения SEO хочу понять поведенческую реакцию пользователей. 1:43 Мне очень нравился Яндекс Webvisor — видно, куда человек скролит, как загружается контент, где кликает. Прошу ИИ найти актуальный аналог, который не замедляет страницу. 3:06 Ответ Claude: Microsoft Clarity — бесплатно навсегда, без лимитов по трафику и сессиям. Запись сессий, тепловые карты, rage clicks, dead clicks, интеграция с Google Analytics, лёгкий SDK. Минус: Microsoft использует поведенческие данные для обучения своих моделей. 3:47 Спрашиваю: работает ли яндексовский сервис и законно ли использовать Яндекс Webvisor из США? В июле 2024 Небсгруп продала активы Яндекса за 5,3 млрд — теперь это полностью российская компания. Данные уходят на серверы в России. Прямых санкций нет, но есть практические и репутационные риски. Выбираю Microsoft Clarity. 5:55 Прошу Claude создать ТЗ: как установить Microsoft Clarity на самописный статичный сайт с Eleventy. Подход: сначала ТЗ, затем загружаю файл дизайна проекта из корня, чтобы Claude уточнил под реальную структуру. 7:19 Первый вариант ТЗ неправильный — я ещё не зарегистрировался в Clarity. Суть: код вставляется в header и подтягивается во все страницы. Регистрация заняла два клика — сразу выдали код. 9:09 Прошу Claude прочитать все MD-документы в корне проекта. Выделяю его в отдельное окно на весь экран — прочитал правила, карту проекта, готов к работе. 10:15 Копирую код отслеживания из Clarity и ТЗ от браузерного агента. Даю Claude свободу оспорить инструкцию: предлагай, планируй, спорь — и только после моего одобрения создавай код. 12:20 Анализ от Claude: добавить скрипт Clarity в head после блока GA4 — оба инструмента рядом, легко обслуживать. Нужно маскировать поле capture email. 12:57 Два варианта маскировки email. Вариант А: CSS в панели Clarity — не версионируется в Git. Вариант Б: атрибут data-clarity-mask="true" в коде — версионируется в Git, явно видно. Claude рекомендует Б: если пересоздать проект в Clarity, маскировка не потеряется. Соглашаюсь. 13:52 Итоговый план: скрипт Clarity после GA4 + data-clarity-mask="true" к полю email. Мой подход: не даю писать код, пока не утвержу архитектуру. 14:44 Нажимаю «Применить». Claude замаскировал email как обсудили. Прошу создать текст для коммита. 15:34 Объясняю стек для новых зрителей: Claude Code в PyCharm от JetBrains. Вручную коммичу и смотрю изменённые файлы — визуальный контроль за ИИ. Бывало, Claude говорит что работает, а файлы не меняются: просто списывает токены и обманывает. 16:47 Деплой: GitHub → Cloudflare Pages автоматически. Нажимаю Ctrl+U, проверяю исходный код — вижу Google Tags, затем появляется Microsoft Clarity. Всё работает. 17:53 Microsoft Clarity подключён. Смотрю на органическом трафике из Google, при необходимости настраиваю — потом заливаю контекстную рекламу. 18:15 Прошу подписываться и ставить лайк. ─── ИНСТРУМЕНТЫ ──────────────────────── ▶ Установка Claude Code на Windows 11 → https://youtu.be/LRZjphm0NaY ▶ Установка PyCharm Community Edition → https://youtu.be/_BN5kArV07s ▶ Подключение PyCharm к GitHub → https://youtu.be/kHe3go_wDjU ▶ Claude Code плагин в PyCharm → https://youtu.be/tb5DZoS04oo #ВайбКодБлогер #ВайбКодинг #MicrosoftClarity #ClaudeCode #ЯндексWebvisor #SEOАналитика #Eleventy #CloudflarePages #WebАналитика #ИИРазработка