Веб-разработка — страница 4

Pagination - Simple PaginationСимпатичный эффект при переключении страниц, созданный на чистом CSS.https://codepen.io/Azametzin/pen/ZEVKJNX

Звуки — это круто! Я начинал свой карьерный путь с геймдева. Мы делали игры для соцсетей: фб, вк, одноклассники. Я думаю вы даже в некоторые из них, если крутили бутылочку, собирали свой гарем или рубились в Clash Royale Tyrane. В играх очень важен дизайн.Причём дизайн комплексный: гейм-дизайн, дизайн интерфейса и звуковой дизайн вместе создают тот самый уникальный опыт для пользователя, который выделяет игру из тысячи похожих, который заставляет пользователя возвращаться снова и снова, и даже платить деньги.И это так странно, что веб-игры очень сильно отличаются от веб-сайтов. На сайтах всё серьёзно, если есть звук, то это либо сайт с музыкой, либо с видео. Использовать звуки моветон.Или нет?Я на днях зарегался в lovable и там на онбординге есть звуки, и они не бесят, а наоборот добавляют эффекта погружения в мир магии продукт. Более того, я начал замечать, что и на многих других современных сайтах стали появляться звуки. Да, это чаще всего какие-то промосайты, лендосы, а не интернет-магазины. Но я вижу тренд в эту сторону. Видимо кто-то однажды запретил разрабам старой школы использовать звуки, а новое поколение не слышало этих запретов. Думаю что в скором времени веб зазвучит! И даже в своих пет проектах я добавил звуков, потому что пользователю это удобно.Встречались ди вам сайты с интерфейсным звуками?Я нашел для вас лучшую подборку интерфейсных звуков в формате shadcn. Звуки потрясающие, такими проект не испортишь. Забирайте!https://www.soundcn.xyz/?category=UIИ не забудьте добавить кнопку «без звука» рядом со значком смены темы. Это будет правильно.Лайк, репост, подписка ⤵️

Визуализация: nth-child – как выбирать элементы на странице #почитатьДавайте разберёмся с :nth-child(). Это встроенная возможность CSS, которая помогает выбрать элементы на странице по их порядку внутри какого-нибудь контейнера, например, списка или блока. Хочется выделить каждый второй элемент? Или, скажем, каждый третий, начиная с четвёртого? С :nth-child() это легко! Можно просто написать номер, чтобы взять, к примеру, пятый элемент, или использовать что-то вроде «чётные» или «каждые три», чтобы всё красиво стилизовать.⏱Читать статью

Объединение HBO Max и Paramount+ — задача посложнее, чем скрестить ужа и ежаДэвид Эллисон, скорее всего, и сам не знает, как это сделать. В экстазе после победы над Netflix глава Paramount Skydance сделал опрометчивое заявление о намерении объединить стриминги Paramount+ и HBO Max. Лучше бы промолчал, потому что идея завиральная. Никто просто не понимает, как это вообще возможно — прецедентов подобному союзу еще не было.Проблема кроется в масштабе обеих платформ и различиях под капотом. На одной стороне весов находится не такой большой, но вполне успешный Paramount+, который уже давно нуждается в глобальном техническом обновлении. На другой — куда более развитой HBO Max, который лучше с точки зрения пользовательского интерфейса и обладает обширной международной сетью (110 стран по всему миру). Просто закрыть сервис WBD нельзя: на него завязаны ценные для новой компании рынки. Переносить контент с Paramount+ и закрывать этот атавизм — в целом можно, но вообще-то стыдно (кто кого в итоге захватил?). Остается вариант как-то интегрировать площадки друг с другом, чтобы слить воедино аудиторию, но этому мешают принципиальные различия в коде. "У одного проблемы с интерфейсом, у другого проблемы с серверами", — замечает эксперт Дэн Рэйберн. Как не склеивай, а идеальный стриминг первого эшелона не получится. Ситуацию усугубляет невозможность команд сервисов коммуницировать до официального закрытия сделки по продаже активов, а значит драгоценное время на перестройку растрачивается зря. Единственный адекватный способ интеграции — вялотекущее поглощение по примеру Hulu и Disney+. Хотя масштабы в данном случае совершенно иные, да и вряд ли такое безопасное решение устраивает Эллисона, пообещавшего подписчиками и инвесторам бесшовный переход в новую реальность.

Лента Telegram На волне подготовки к блокировке телеги, накидал простое зеркало в вебе для своих каналов.Идея такая, что несколько раз в день делаю парсинг постов и сохраняю в базу последние 50. Пока почитать можно текстовые посты и посты с картинками (видосы, гс и кружки пока не прикрутил)Посмотреть что получилось можно тут https://tg-feed.ruМожно залогиниться через телегу и настроить свою ленту. Каналов пока не особо много, можно самому добавить те, что нравятся. Но чтобы не присесть за распространение какой либо незаконной инфы, предложенные каналы сначала проходят модерацию.Буду рад любому фидбеку!Всем добра ✌️

Как проверить, что попадёт в бандлПисать эффективный frontend — это очень важно. Во времена, когда Интернет имеет достаточно высокую скорость, разработчики не сильно заморачиваются на тему того, каким будет размер их приложения. А зря.С моей точки зрения, быстрый Интернет — это когнитивное искажение, которое возникает вследствие постоянного обитания в таковом. Когда в больших города с Интернетом чаще всего всё в порядке, в городах поменьше можно наблюдать картину, в которой существует какой-нибудь slow 4G, а то и 3G. Если вспомнить про страны, в которых Интернет в принципе не сильно развит, то проблема встаёт ещё острее.Именно по этой причине я всегда смотрю на то, сколько трафика качает пользователь. Чтобы это приходилось реже перепроверять, важно понимать, как бандлер работает с импортами, а еще перепроверять, как реализованы используемые библиотеки. Это не значит, что нужно идти и лезть в исходный код библиотек, достаточно использовать сервис, о котором расскажу дальше. Вот вам пример одного и того же намерения, но потенциально разного результата:

import { string } from 'valibot';console.log(string);

import * as v from 'valibot';console.log(v.string);

Вы можете сходу сказать, что из этого тяжелее? Скорее всего второй вариант. Почему? Потому что такой способ импорта потянет за собой все side-effect-ы, которые есть в библиотеке. Почему "скорее всего"? Потому что зависит от того, как разработчик реализовал эту библиотеку.Чтобы проверить, какой трафик вы потянете из этой библиотеки, можно использовать сервис bundlejs.com. Используйте там код, упомянутый выше, жмите кнопку Build, и справа в консоли увидите объем трафика, который скачает пользователь, чтобы заиспользовать этот функционал. Важно: не забывайте использовать импортированные значения, иначе они будут tree-shake-нуты (удалены) бандлером, и размер будет невалидный. Для этого я использовал console.log.Какие выводы следует сделать из этого поста?1. Пишите библиотеки без side-effect-ов. Это отдельный здоровый топик, который я разбирал тут, тут и тут. Просто придерживаетесь определенных правил, и у тех, кто использует библиотеку, проблем не будет.2. Проверяйте то, что используете. Зная про проблемы импорта import * as N, я решил на всякий случай проверить, не потяну ли действительно всю библиотеку просто из-за одного значения. А использую я иногда такой импорт, потому что он чуть удобнее прямого импорта сущностей.Хорошо писать библиотеки — это искусство. Нужно понимать, что является side-effect-ом, а что нет, понимать, как подсказать сборщику разработчика, что указанный вызов или функция являются чистыми, знать, как разбить код таким образом, чтобы связанность была как можно меньше, и сборщик мог откинуть ненужный код. Но именно в этом и кроется профессионализм — в способности максимально эффективно закрыть боль пользователя.———Стрим сегодня вечером. Ориентировочно в 17:00 Мск. До встречи!

Упс.. я тут маленько навайбкодила 😀Очень хочу начать собирать свои кейсы и красиво оформить их на сайте. Кейсов накопилось уже немало, но на нормальный дизайн и вёрстку нужно время, а времени у меня мало. Поэтому решила попробовать пойти другим путём — и собрать страницу кодом с помощью AI.Готовый результат — через 2 часа 🔥 вместо 6-8 часов дизайна и верстки в Tilda (это я ещё минимальная оценка). Получилось вполне прилично, поделюсь на днях и заодно расскажу про кейс. Это мой первый опыт вайбкодинга, и что особенно порадовало — для html-верстки действительно не нужны особые знания. А вот что пригодилось, так это умение правильно писать запрос и вносить корректировки в дизайн. Тут у меня случился небольшой флэшбэк во времена работы в Ozon — вспомнила, как ставила ТЗ и оставляла бесконечные правки копирайтерам и дизайнерам. Получается, ещё тогда немного вайбкодила? 😀В тему AI, в Notion выкатили официально кастомных AI-агентов, про которых были разговоры в конце прошлого года. Протестирую и приду к вам со свеженькими мыслями: как и для чего их использовать (а главное, надо ли). А пока интересно понять, как у вас с AI. Насколько активно вы его используете?Голосуем 👇🔥 Да, уже пробую вайбкодинг и создаю агентов👀 Пока только пишу запросы в ChatGPTШаблоны Notion от Маши

Если вам кажется, что в мире ничего не происходит интересного кроме ИИ, то это, слава богу, не так:https://httptoolkit.com/blog/dictionary-compression-performance-zstd-brotli/ТЛДР: если сжимать по-умному, опираясь что можно переиспользовать то уже скачано, то трафик можно снизить ооочень сильно.А так - в остальном только ИИ и происходит

variable fonts: шрифт как пространство, а не точка2016 год: OpenType 1.8 добавляет поддержку variable fonts. Один файл вместо десяти начертаний — но главное не в экономии трафика.Шрифт перестаёт быть статичным объектом. Буква может плавно менять вес, ширину, наклон, контраст — и всё это в реальном времени, по осям вариации.Decovar — шрифт с 17 осями. Засечки можно «включать», декоративные элементы — добавлять, пропорции — искажать. Не выбор из готового, а дизайн самого пространства возможностей.Зачем это графическому дизайнеру:- Типографика реагирует на скролл, звук, поведение пользователя- Анимация без подгрузки новых файлов — всё в одном variable font- Возвращаем идею уникального оттиска, но в цифре🔗 Поиграть со шрифтами можно на Axis-Praxis.org#refs by bloomsyde

🌟 SEO для изображений: как выбрать миниатюру для Google и DiscoverGoogle обновил рекомендации по SEO-изображениям и документацию для Google Discover и пояснил, как сейчас система выбирает, какое изображение показывать в поиске и на каруселях Discover.Что важно знать ⤵️✨ Источники для миниатюр:Google использует разметку schema.org и метатег og:image для выбора изображений.✨ Как указать изображение:— Свойство primaryImageOfPage из schema.org с URL или объект ImageObject.— Свойство mainEntity или mainEntityOfPage с привязкой к ImageObject.— Метатег og:image.✨Рекомендации по изображению:— Оно должно отражать содержание страницы и её тематику.— Не используйте логотип или стандартные картинки.— Избегайте картинок с текстом и сильно отличающихся соотношений сторон.— Предпочтительно высокое разрешение.Корректная разметка и выбор изображения повышают шанс, что Google покажет именно вашу миниатюру в поиске.📘 Подробнее в справке Google____@prcynews

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

Рабочий дневник: День 403Как я слайдер делал🔧 На работе попалась секция, которую многие называют каруселью. Название пришло с детской площадки, где качели сменяют друг друга по кругу. Ваш КЭП. В вебе слайды так же «крутятся» в одном контейнере и показывают контент по очереди. Хотя формально слайдер и карусель это разные вещи. Карусель обычно зациклена: элементы крутятся бесконечно. Слайдер это про листание, и у него есть конец, без возврата к первому элементу.✋ Свой первый слайдер я верстал руками, но быстро понял: это путь в никуда. Уже тогда были готовые решения, и я не нашёл ничего лучше Swiper. Увы, но у него есть проблема: слишком раздутый API и свои стили. Те, кто пытался подогнать компоненты Bootstrap под свою систему дизайна, меня поймут.В этот раз хотелось чего-то попроще, и внезапно я наткнулся на Embla Carousel. В отличие от монолитного Swiper в ~50 КБ, Embla решает проблемы за 6 КБ.❓ Тут возникает резонный вопрос: а почему бы не написать самому на 1 КБ? У нас же есть GPT! Есть, но тогда придётся много логики тащить руками. Например, затухание, как отпускаешь палец. Это уже физика, requestAnimationFrame и обработка touchstart/move/end. Плюс ещё mousedown/move/up и pointer events.Ещё важный момент: Embla состоит из модулей. Благодаря пакету embla carousel wheel gestures можно добавить прокрутку колёсиком мыши по горизонтали.🔫 Если такое делать руками, то надо перехватывать wheel, переводить deltaY в смещение по X, дабы не сломать скролл страницы, делать throttle или debounce. Еще всё это нужно подружить со snap и инерцией карусели. В итоге простая задача про вёрстку слайдера превращается в целый эпик. Мы этого хотели?Крч, в следующий раз не думайте, а берите Embla для карусели. Я заресерчил :)📊 #статистика в IT 1563д | 4732ч

Frontend-пятиминутка #2: PositionsРазбираем еще один типичный вопрос с собесов: "какие виды позиционирования вы знаете и чем они отличаются?".Вопрос унылый, как бабка Ленина, но жить нам с ним приходится, и в карточках я рассказала + набросала на квадратиках все, что вам тут следует знать.Что важно (и об этом я в самих карточках написала, но подчеркну):Не путайте родителей с предкамиРодители - ближайшие предки элемента, буквально 1 уровень выше. Все остальные обертки над ним - предки. И позиционирование считается от предков любого уровня, отвечающих условиям из карточек.〰️〰️〰️〰️〰️〰️〰️Если у вас есть вопросы по теме - пишите, разберемся.Если у вас "болят" какие-то вопросы с фронтенд-собесов, тоже пишите в комменты. Потихоньку разберу в пятиминутках!#frontend_пятиминутка

floccus: Приватная синхронизация закладок между браузерами и устройствамиfloccus — это расширение с открытым исходным кодом для браузеров и мобильных устройств, предназначенное для приватной кроссплатформенной синхронизации закладок. Инструмент решает проблему изоляции данных между различными экосистемами (например, Firefox, Chrome, Edge, Safari), позволяя пользователю сохранять полный контроль над своими данными без использования фирменных облачных сервисов браузеров.Основные возможности- Широкая поддержка бэкендов: Синхронизация возможна через Nextcloud (с использованием приложения Bookmarks), любой сервер WebDAV (стандарт XBEL), Google Drive или локальные файлы (через LoFloccus).- Кроссбраузерность и кроссплатформенность: Работает на всех основных десктопных браузерах, а также имеет отдельные приложения для Android и iOS, обеспечивая доступ к закладкам на любом устройстве.- Сквозное шифрование: Поддерживает шифрование данных (AES-GCM) на стороне клиента перед отправкой на сервер, что гарантирует невозможность прочтения закладок даже администратором сервера.- Гибкие стратегии синхронизации: Возможность выбора направления синхронизации (двусторонняя, только загрузка на сервер, только скачивание) и интервалов автоматического обновления.- Управление папками: Позволяет сопоставлять конкретные локальные папки браузера с определенными папками на сервере, поддерживая сложную иерархию.Преимущества- Полная приватность: Ваши закладки не проходят через серверы разработчиков браузеров; вы сами выбираете место хранения данных.- Отсутствие привязки к вендору: Свободное перемещение между браузерами без потери структуры избранного.- Надежность: Автоматическое создание резервных копий перед каждой синхронизацией для предотвращения потери данных при конфликтах версий.Скачать с GitHub⬇️Поддержать автора⬇️✅SBER: 2202 2050 1464 4675

Как быстро бустануть позиции в Гугле без ссылок? 📤Вижу, что вам хорошо зашел прошлый пост про буст позиций в Гугле без ссылок. Значит продолжаем - ловите 2 часть! ❤️Как повторить?1. Выбираем потенциальные для роста страницы в GSC (подробнее писал об этом здесь) или любые другие по вашему приоритету.2. Парсим вопросы и ответы (PAA) в Гугле по всем ключам кластера вашей страницы.3. Генерируем через ИИ похожие ответы на спаршенные вопросы из Гугла. В качестве примера скармливаем в ИИ спаршенные ответы из серпа.4. Размещаем на своей странице в блоке FAQ эти вопросы и свои ответы на них. Важно, вопросы не переписываем, указываем их также, как вы их спарсили в Гугле.5. Отправляем страницу на переобход в Гугл, ждем обхода Гугл бота и проверяем позиции в Гугле у вашей страницы через 1-3 недели.Почему это работает?Когда вы отвечаете на вопросы, которые уже задавали пользователи в Гугле по вашему кластеру - вы закрываете реальный интент на своей страницы. И чем больше будет у вас на странице вопросов и ответов - тем сильнее закроете на ней интент.Было полезно? - Поделись постом 🤝#тексты #интент #ии #эксперимент #google

О более приятных трендах — видеоэссе о Web Revival, движении лоу-тек интернет-площадок, где самоорганизация, открытый код и хостинг, а также творческое переизобретения эстетики y2k позволяет создавать пользователям уникальные миниатюрные сайты-блоги, арт-галереи и визитки (Melon King один из самых известных креаторов таких микро-платформ). Оцените их сами.

Инженер за неделю собрал альтернативу Next.js Cloudflare показала эксперимент, в котором всего один инженер в паре с нейросетью с нуля написал совместимую замену Next.js за 1100$ на токены. Идея родилась из давней боли фронтендеров. Деплоить тяжелый Next.js в serverless-инфраструктуру (вроде Cloudflare Workers) то еще удовольствие, приходилось городить костыли с адаптерами типа OpenNext. А теперь Cloudflare просто переписала всё нужное поверх быстрого сборщика Vite. Новинка не просто мимикрирует под API Next.js (совместимость 94%), но и унижает оригинал в бенчмарках. В тестовом проекте vinext собрался быстрее, чем хвалёный Turbopack, а размер клиентского бандла похудел на солидные 56%. Миграция выглядит до смешного просто, меняешь слово next на vinext в конфигах, и папки app продолжают работать. А вместо того, чтобы глупо рендерить весь сайт целиком, Cloudflare прикрутила умную фичу, система смотрит аналитику и собирает заранее только те страницы, на которые реально заходят люди. Конечно, проект требует обкатки на реальном проде, однако прецедент явно стоит внимания.

Как исправить "такие" кавычки на «такие»?Самый сложный и важный проект - Кавычник-ёлочник - сервис, который заменяет обычные кавычки - "" на «кавычки-ёлочки». При это учитывает контекст - если у вас тут дюймы - не заменит.Бесплатно тут - https://barakaev.ru/quoter⭐️ - @adsinsn » Канал в МаксеP.S. И не надо мне рассказывать про какие-то магические сочетание пятнадцати клавиш одновременно - я чит-коды не уважаю!

Нашел интересную софтину - бесплатный аналог #Photoshop, который еще и работает в браузере с любого устройства без установки! Может быть полезноhttps://www.photopea.fr/

Про новый сайт — alesworld.ru Рассказываю, как мы его делали. Во-первых, я его очень-очень хотел! Потому что когда у тебя не просто шесть книг, а шесть фандомов с кучей ответвлений, комиксов и прочего, по закрепам всё не рассуёшь. Нужен был информативный сайт.А прошлый сайт?Раньше он у меня был, если помните. Но потом жахнули санкции, всё заблочили, и он прекратил свою работу.Чего там делать-то...Сделать новый мы вдвоём банально не успевали. А ещё очень долго думали, как и в каком формате его делать, потому что появился мильон всяких "нельзя": нельзя магазин, нельзя книги, то и это нельзя. Дело сдвинулось с мёртвой точки благодаря читателям. Появилась Карса, предложила свои силы в этом деле и собрала первый одностраничный лендинг (без которого мы хз когда вообще добрались бы до этой области). Он появился ещё в ноябре. Запускать его нельзя было - не хватало функционала.Но это был старт для нашей "каши из топора".Новый сайт.В декабре мы разбирались преимущественно с жилищно-бытовыми вопросами обустройства новой базы для летних поездок. Ну и выживанием, всякотакое. А вот в январе почувствовали, что пора, и стали активно ковырять сайт.В итоге перековыряли всё настолько, что на изначальную версию он не похож вообще - там только названия на страничках фандомов остались практически хд А остальное переделано и сделано с нуля. Дело в руки взяла Польша. Вообще она художница, но имеет дизайнерское образование и скиллы, и, как мы выяснили, может делать не только проекты для Третьяковки и гостиничного бизнеса, но и сайты.Он перестал быть одностраничным. У него появилась структура. Мы вместе с Польшей сделали дизайн минималистичным, подходящим для каждого из моих весьма разносторонних миров (нужно было что-то, что сгодится и под сайфай, и под средневековье). Вит подготовил сто листов формальностей, которые теперь законодательно должны присутствовать на любом сайте, иначе всё, повешенье. Так что теперь оно существует! Троекратное ура не спавшим героям))🇸🇩🇸🇰🇸🇴 🇸🇷🇹🇰 🇸🇱🇹🇰🇸🇽🇸🇰🇹🇩— Инфостранички для каждого фандома;— Инфо об авторе;— Контакты и ссылки на ещё доступные соцсети;— Статусы предзаказов;— Текущие предзаказы.🇸🇩🇸🇰🇸🇴 🇹🇯🇸🇮🇹🇫🇹🇩🇸🇰— Появится свой магазин;— Заработает раздел с книгами и информацией о них (на отдельном домене)Из разряда мечтаний я хочу что-то вроде чата\болталки для своих. Но это, вероятно, в приложении логичнее делать.Рад пожеланиям, предложениям, поздравлениям ^^

В поисках самого лучшего эмулятора терминалаКак подметил Тонский, пока мы пытались сделать хорошие интерфейсы — зумеры ушли в консоль. А для консоли нужен эмулятор терминала, чтобы вывозить все эти реакт-приложения (что? да!)Сначала немного теории. Что такое эмулятор терминала? Это программа, которая эмулирует древнюю железку — терминал. Например вот VT100. То, что в обиходе называет терминалом, на самом деле эмулятор такой железки.Что такое эскейп последовательности? Нам нужно отправить в шелл или в программу, запущенную в консоли комбинацию клавиш, которую мы нажали. Но у нас нет никакой возможности, кроме как закодировать это набором символов. Как-то так `^[b` для option + left. Попробуйте сами — нажимаем `ctrl + v` и дальше нажимаем нужную нам комбинацию клавиш. Проблема в том, что нет нормального стандарта на эскейп последовательности. Если в базовых option+left и т.д. все ещё более менее совпадают, то shift+enter кто во что горазд кодирует. Как система понимает, с каким эмулятором она работает? Знание об этом храниться в $TERM. Например, для terminal и item2 это будет `xterm-256color`. Для других терминало может быть другое значение. В системе есть целый справочник `/usr/lib/terminfo` где сказано, как читать эскейп последовательности для вашего эмулятора терминала.Родной эмулятора терминала macOS — отлетает сразу, у него нет эскейп-последовательностей на shift + enter (а нам надо! мы же хотим в клод коде промпты писать!). И не круто же, из коробки белый фон. Мы такое не уважаем, эмулятор терминала должен всем показать, что ты крутой хакер. iterm2 дефолт, но конечно достал. Не быстрый, из коробки пользовать им невозможно (ну реально раздражает каждый раз после установки идти проходить квест по настройке эскейп последовательностей в диких менюшках). Ну и просто старый. Фу. Но куда бежать?Ghostty. Быстрый (написан на zig), нативный, с простым конфигом. Ну просто лепота. Но есть одно но, большинство линуксов ничего о нём не знает. И когда вы подключитесь по ssh и откроете клод код — shift + enter работать не будет. В ghostty это понимают и предлагают автоматический режим для закидывания terminfo на любую машинку куда вы подключаетесь. Даже два режима: прокидывай terminfo, либо автоматически подменяй $TERM на xterm-256color (нам не катит, мы же ищем shift + enter). Если вы готовы немножко помусорить на удалённых машинках, то всё ок.Kitty Тоже быстрый, но не такой нативный и красивый как Ghostty. Супер конфигурируемый, мощь. Проблема с terminfo присутствует.Warp. AI во все поля. Чтобы зайти — нужно создать в облаке учётку и залогиниться. Это я не понял и не уважаю. Не по нашему это, не по хакерски. Дизлайк, отписка.Пока остановился на Ghostty за красоту. Но релизы там какие-то ну совсем редкие. Наверное дальше пойду на Kitty

Мой актуальный набор плагинов для контентных сайтов.Вместо Antispam Bee можно и Akismet, но у меня с ним исторически как-то не сложилось. А сейчас тем более, т.к. он осуществляет самую настоящую трансграничную передачу персональных данных.Yoast Duplicate Post — опционально. #плагины

Вовлеченный заказчик - половина успеха Это правило имхо работает для любого вида деятельности. Но в ИТ я это особенно остро ощущаю. Видимо, потому что здесь это 80% успеха.Самый лучший вариант - это осмысленный заказчик или тот, у кого «подгорает» проект или какая-то бизнесовая задача не решается классическим путем. Из очевидного, такой заказчик и сам будет уделять столько времени сколько нужно и помогать привлекать все необходимые ресурсы, от финансового до административного. Из неочевидного этот заказчик максимально будет пробовать новое, стараться создавать более неэффективные процессы. Потому, что знает о ловушке, описанной в принципе Конвея, что «организации проектируют системы, которые копируют систему коммуникаций в этой организации». И не будет автоматизировать текущие, привычные неэффективные процессы. Работать с такими одно удовольствие. Ибо это не работа, а реальное партнерство. Второй тип заказчиков - те, кто не был инициатором, но при разработке нового решения увлекся и стал «ранним последователем». Когда решение или продукт искренне заинтересовали человека. И он старается помогать, тестировать, давать обратную связь, вовлекает других сотрудников. Таких заказчиков надо холить и лелеять. Потому, что они помогают приземлить идеи в реальность. Бывают заказчики не вовлеченные. Таких, к счастью, ничтожно мало: проекты у них не взлетают и сами они быстро заканчиваются. А в вашей работе какие типы заказчиков чаще встречаются?

Как это сделаноВ прошлый раз дорогим вам зашла тема с фантазиями коллег. А теперь статистика обращений показывает, что многим интересна конкретика, типа:Вот ссылка хххх и я хочу понять, как они это сделали.Может, эксперимент? Мы разобрали живой сайт и сегодня говорим о меню — вещь утилитарная, но не всегда технически очевидная и часто недооцененная.Проект житейский — станция техобслуживания, простигосподи. Намеренно выбрали "скучную и задротскую" для дизайнера сферу. Концептуальные проекты о красивых предметах — это хорошо, но реальная работа — тоже хорошо.Сайт проекта — https://offroadfrentz.comИнструменты:▪️ANX016. Закрепить блок▪️ANX015. Конструктор меню, попапов, виджетов, тултиповВидеоразбор на удобных для вас площадках — https://annexx.cc/how-it-works-1От вас просим обратную связь, пожалуйста. Посмотрите видос — насколько интересно, понятно? Есть ли желание видеть здесь такие обзоры?--Да не убудет энергии и вдохновения в чертогах дизайнерского сознания в трудах ваших и не превзойдет лень и суматоха повседневная над чистым сиянием упорства и усердия.Аминь.

Использовать почтовые клиенты для @mail.ru — теперь только на за деньгиhttps://habr.com/ru/news/1001172/В этом месяце, в феврале 2026 года, началась постепенная раскатка на пользователей почтового сервиса @mail.ru новых условий использования электронной почты: отныне подключать почтовые клиенты (Outlook, ThaBat, Thunderbird, и др.) к свою ящику можно только имея платную подписку "Mail Space", которая стоит около 400 рублей в месяц.Обсуждая ситуацию с другими пользователями выяснилось, что "платность" доступа к электронной почте через почтовые клиенты появилась ещё не у всех юзеров, а где-то у половины. Но, надо полагать, скоро охват будет стопроцентным.С одной стороны, можно понять желание продуктовых менеджеров увеличить посещаемость веб-версии ради показа рекламы. С другой - урезание привычной базовой функциональности почтовой службы ради этого выглядит довольно цинично.

Как самому внедрить микроразметку на WordPress и других CMS (с доступом к шаблонам) На самом деле всё не так сложно, если у вас есть две составляющие: 1. Платная нейросеть (Gemini, ChatGPT, Claude, Grok и т. д.). Если вы до сих пор пользуетесь бесплатными версиями — не пожалейте 1500 рублей на годовую подписку (через платформы вроде GGSel или аналоги). Это окупится не только в работе, но и в обучении чему-то новому. 2. Базовое умение читать HTML/PHP. Вам не нужно уметь программировать с нуля. Главное — понимать структуру: видите слово footer — понимаете, к чему это относится; видите открывающийся тег — понимаете, как он закрывается. Достаточно посмотреть пару бесплатных видео про основы HTML. Если вы смогли разобраться, как запустить бизнес или создать сайт, то и здесь проблем не возникнет. Потратьте 1–3 дня на изучение, и у вас появится понимание того, как «построен» ваш сайт и какой блок за что отвечает. Пошаговый алгоритм: 1. Отправьте нейросети URL типовой страницы (услуги или категории товаров) и напишите запрос: «Проанализируй мою страницу как SEO-специалист высшего класса с упором на микроразметку. Напиши, какие типы разметки я могу сюда добавить, дай их краткое описание и объясни, какой профит они дадут». (Если вы уже знаете, что вам нужно — этот пункт можно пропустить). 2. Выберите первый тип разметки для внедрения, например, BreadcrumbList (хлебные крошки). 3. Нужный код может лежать в отдельном файле или в общем шаблоне страницы. — Откройте свой сайт, нажмите правой кнопкой мыши на нужный элемент → «Исследовать элемент» (Inspect). — Скопируйте название класса (class) или всю строку кода. — Через Ctrl + F в админке сайта или на хостинге найдите файл, где прописан этот блок. 4. Обязательно сохраните копию оригинального файла себе на компьютер. Если что-то пойдет не так, вы сможете всё быстро восстановить. 5. Копируйте целиком весь код файла и отправляйте нейронке с запросом: «Вот код шаблона страницы. Добавь в него микроразметку типа BreadcrumbList в формате, (выбранный формат,если не знаете какой — пишите microdata). ВАЖНО: Я не программист, поэтому высылай код СРАЗУ ЦЕЛИКОМ, без сокращений. После добавления проверь разметку на ошибки как SEO-специалист и разработчик. Если ты ошибешься, меня уволят.». 6. Скопируйте полученный код и проверьте его в валидаторах (вставляйте именно фрагмент кода, который выдала нейросеть): — https://validator.schema.org/ — https://webmaster.yandex.ru/tools/microtest/?tab=html — https://search.google.com/test/rich-results?hl=ru Если есть ошибки — делайте скриншот, копируйте текст ошибки и отправляйте нейросети на доработку. 7. Замените старый код в шаблоне на новый. Очистите кэш сайта и проверьте страницу в режиме инкогнито. Визуально всё должно остаться прежним: стили не должны «поехать». Если что-то сломалось — просто верните код из бэкапа (пункт 4) и опишите проблему нейросети. 8. Снова проверьте страницу через валидаторы, но уже по прямой ссылке (URL). 9. Повторите процесс для других типов разметки. 10. Когда закончите со всеми типами, вставьте итоговый URL в валидатор Яндекса, скопируйте весь распознанный код и попросите нейросеть еще раз убедиться в отсутствии логических ошибок. Важные нюансы: — Всегда делайте бэкап файла перед редактированием. — Если чувствуете, что задача слишком сложная и риск «уронить» сайт велик — лучше подготовьте ТЗ в нейросети (пункт 1) и отдайте внедрение программисту на Kwork. Это стоит недорого. — Микроразметка появляется в поиске не сразу. Отправьте страницы на переобход в вебмастерах и подождите 1–2 недели. — Правильная разметка — это рекомендация для поисковика, она не гарантирует 100% отображение расширенного сниппета, но значительно повышает шансы.

🔮 Больше не магия: React, разложенный по полочкам Если React кажется набором абстрактных концепций и «магических» хуков, проблема не в вашем понимании, а в подаче. Новый ресурс меняет это правило, превращая сухую теорию в наглядные интерактивные схемы.Визуальный конструктор, который показывает React изнутри: • Как именно работает рендеринг и что такое «снимок» компонента.• Почему обновление состояния запускает перерисовку UI.• Как «поднимать» состояние вверх, когда оно нужно нескольким компонентам.

🚀 Локальное SEO: как создать сеть ссылок за $0Зачем платить агентствам по $500 за ссылку, если можно построить кластер локального авторитета самостоятельно? Google видит рекомендации реальных бизнесов в одном городе и поднимает всех участников в топ.Пошаговый план доминирования:1. Собери Hit-лист. Найдите 5 - 10 компаний из смежных ниш в вашем городе (например: кровля + сантехника + электрика). Только живые сайты!2. Сделай оффер. Пиши прямо: *«Создаю страницу „Проверенные партнеры“, хочу рекомендовать вас своим клиентам. Если добавите меня к себе - выиграем оба»*.3. Создай страницу «Партнеры». Это должен быть качественный раздел с описанием каждого бизнеса (2-3 предложения) и прямой dofollow-ссылкой. Никаких скрытых виджетов в футере!4. Дай странице «вес». Обязательно сошлись на раздел партнеров с главной или страницы «О нас». Без внутренних ссылок страница будет «тупиковой».5. Упрости жизнь партнеру. Запиши короткое видео, куда именно им поставить ссылку на тебя. Чем меньше трения, тем выше конверсия в согласие.6. Масштабируй. Предложи обмен гостевыми постами. Ссылка из контекста статьи в 10 раз сильнее обычной ссылки из списка.Итог: 10 локальных бизнесов, ссылающихся друг на друга — это стена релевантности, которую почти невозможно пробить конкурентам одиночкам.

Делюсь полезностями 👇Мой любимый сайт где генерирую код микроразметки🤓Микроразметка — это способ объяснить поисковикам, что вообще происходит на сайте🔴кто вы,🔴чем занимаетесь,🔴какие страницы за что отвечают.А ещё микроразметка это один из немногих способов залететь в выдачу нейросетей.Какие коды микроразметки я устанавливаю на сайте ⤵️💗Organization / LocalBusinessРазмещаю на главной странице сайта. Это база: кто компания, где находится, чем занимается.💗BreadcrumbsИспользую на внутренних страницах, где есть логичная структура и иерархия.💗FAQДобавляю в блоки «Вопросы и ответы» на главной, внутренних страницах и в SEO-статьях, если там реально есть вопросы.💗ArticleИспользую для SEO-статей, чтобы поисковики корректно понимали тип контента.🔴🔴🔴🔴🔴🔴Если хотите начать разбираться в SEO с моей логичной подачей без мифов и волшебных кнопок, то в мае у меня планируется старт 9-го потока курса по продвижению.Там про теорию, практику, логику и понимание процессов. От меньшего к большему. Без воды и без обещаний топа–3 за неделю.Сейчас открыта тут предзапись Первыми о старте продаж узнают именно ребята из списка. А также они вы можете вписаться на курс по самым низким и вкусным ценам 💗

Вершина ux-мастерства и грамотного клиентского подхода — это возможность оставить жалобу на отсутствие интернета только через приложение и на сайте. Для которых, как бы, тоже нужен интернет. «Вы не сможете на нас пожаловаться, если не сможете жаловаться в принципе». Не знаю, что за сбой был у моего провайдера, но не работало вообще ничего. Кроме Телеграма 🤷🏻‍♂️ Какие-то реверсивные блокировки — хотели заблокировать Телеграм, но в бухгалтерии опять все перепутали.