Верстальщик от бога

Разноцветное выделение в CSS #почитать ::selection — это круто, но использование селекторов типа :nth-child(5n+2) — это гораздо интереснее. ⏱Читать статью

Расширенное использование attr() в CSS #почитать Теперь можно брать значения из атрибутов HTML, имеющих типы, так что если в элемент поместить атрибут data-font-size="2.2rem", то его значение можно присвоить. ⏱Читать статью

Создаём свой Telegram-клон с помощью Next.js и TailwindCSS #почитать Рассмотрим процесс создания клона веб-версии Telegram с использованием Next.js, TailwindCSS и Stream SDK. ⏱Читать статью

Модернизация с Web-платформой: уменьшение движения #почитать Демонстрация того, как современная веб-платформа может упростить уменьшение движения на старой кодовой базе. ⏱Читать статью

Зачем нужны логические свойства CSS #почитать

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

⏱Читать статью

Как понимать новые функции CSS #почитать

Допустим, вы проводите популярный опрос по веб-разработке, посвященный CSS, и вам нужно решить, что включить в релиз этого года. Вы можете подумать, что можете просто ввести “новые функции CSS 2025” в Google. Но хотя это и дает многообещающих зацепок, оно выводит множество шаблонного контента, который провозглашает CSS Grid “следующим большим событием”, несмотря на то, что поддерживается уже более восьми лет. Нам нужен другой подход. В этой статье я сосредоточусь на CSS, но все ресурсы, ссылки на которые приведены здесь, охватывают все функции веб-платформы, включая JavaScript и HTML.

⏱Читать статью (en)

Золотое сечение в дизайне 2025: современные подходы к применению в веб и мобильном дизайне #почитать Золотое сечение (φ ≈ 1.618) — это математическая константа, которая представляет собой отношение двух величин, при котором отношение суммы этих величин к большей из них равно отношению большей к меньшей. Простыми словами: если у нас есть отрезок длиной A+B, то A/B = (A+B)/A ≈ 1.618. В 2025 году актуальность золотого сечения только возросла. Почему? Во-первых, исследования нейродизайна показывают, что человеческий мозг обрабатывает изображения, построенные по принципу золотого сечения, на 15-20% быстрее, чем произвольно структурированные композиции. ⏱Читать статью

Когда мобильной версии мало: зачем и как включать «Версию для ПК» #почитать Представьте, вам присылают макет интерфейса: - Desktop-версия, содержит очень много функционала. - Mobile-версия, отображает сообщение "Функционал не доступен. Откройте приложение на Desktop". Начнёте ли спорить и доказывать, что так делать нельзя? Возможно у вас получится переубедить ваших коллег. А что если не получится? Тогда в этом случае, максимум что вы можете сделать — включить поддержку отображения Desktop версии на мобильных устройствах с помощью опции "Версия для ПК", чтобы пользователи могли воспользоваться недоступным функционалом. ⏱Читать статью

Коллекция HTML/CSS лайфхаков #почитать

А недавно я подумал: а вдруг есть фронтендеры, которые хотят сделать ужасный интерфейс? Ну не любят они пользователей. Или хотят сделать пакость работодателю, который их обидел. Где им взять советы?

⏱Читать статью

пятничное

Как работает position: sticky и почему он часто не прилипает #почитать

position: sticky — штука, которая превращает relative-элемент в fixed-элемент, как только он доезжает до заданного инсет-порога, и отлипает в момент, когда скроллинг выталкивает родителя за край. Работает круто, пока вы не включите overflow, не забудете задать top, не положите элемент в flex c align-items: stretch, не сделаете таблицу из <thead> и не упрётесь в кейс с вложенными скролл-контейнерами.

⏱Читать статью

МТС приглашает разработчиков на масштабную ИТ-конференцию True Tech Day 6 июня. Участие бесплатное. В программе — спикеры российского и международного ИИ-рынка, лидеры бигтехов и ученые. Тебя ждут 4 трека и 40+ докладов. Какие темы будем обсуждать: — GPT для роботов: как ИИ учится взаимодействовать с реальным миром. — Мультиагенты — главный AI-тренд 2025. Речь не просто о чат-ботах, а о системах, которые умеют спорить, сотрудничать и достигать целей. — Автоматизация архитектурных аудитов с помощью ИИ: создание архитектурного datalake для сбора данных из Git, Kubernetes, мониторинга и других источников. — Новая архитектура под AI: что приходит на смену микросервисам и как архитектор становится дизайнером когнитивного интерфейса. — Архитектура «as code»: как автоматизировать проверку актуальности схем и генерировать их из реальной инфраструктуры, чтобы разработка всегда соответствовала замыслу архитектора. — Разбор RAG: что это, зачем нужно, архитектурные подходы и их слабые места, как измерять качество и избегать ложных метрик. Среди спикеров: Иван Оселедец (AIRI), Пабло дель Веккио (NTT DATA), Кен Чжун Ли (Kyung Hee University), Алексей Друца (Яндекс), Александр Абрамов (Сбер), Павел Бабин (MWS GPT), Валентин Малых (MTS AI), Антон Скогорев (Т-Банк), Артем Якимчук (Сколтех) и другие эксперты. Тебе точно стоит быть, если ты: — разработчик, архитектор или технический руководитель; — хочешь понять, что реально работает, а что — хайп. Когда: 6 июня Где: Москва, МТС Live Холл и онлайн Регистрация по ссылке.

4 часа нетворка и супер полезных докладов для фронтендеров… Звучит, как идеальный вечер вторник🚀 Приходите 3 июня на Frontend meetup, который пройдёт в московском офисе Авито. Обещают доклады про: - внедрение Suspense SSR Architecture в проекты на React; - генерацию реактивных моделей из GraphQL-схем; - интеграцию зависимостей (DI) через библиотеку tsyringe; - а вот эту тему раскрыть не можем! Всё узнаете 3 июня оффлайн. Только не забудьте зарегистрироваться по ссылке.

CSS @supports #почитать Определение поддержки возможностей CSS и обеспечение интеллектуального отката с помощью @supports ⏱Читать статью

Web Performance API: Измерьте важное #почитать От медленного к быстрому: Использование JavaScript Performance API для оптимизации веб-приложений ⏱Читать статью