Веб-стандарты

@web-standards.ru

207 Followers 0 Following

Новости фронтенда и еженедельный подкаст. Ведущие: Вадим Макеев, Алексей Симоненко, Никита Дубко, Андрей Мелихов, Полина Гуртовая. https://web-standards.ru/

Заголовок Rebuilding FIFA Standings Layout with CSS Subgrid над турнирной сеткой из флагов стран и фото автора, рядом блок CSS-кода с subgrid.
Скриншот инструментов разработки с логотипом Firefox поверх и текстом «Firefox 153».
Заголовок SVG Filters on Type и слова Ink Bleed, Foundry, Mercury, Woodtype и Signal, оформленные разными фильтр-эффектами, над кодом SVG-фильтра и фото автора.
Заголовок Playing with text-fit над HTML-панелью с кодом h1 { text-fit: grow; } и крупно отрисованной строкой This might be very nice! рядом с портретным фото.
Веб-стандарты: Вадим, Алексей.
Do we still need frontend build tools? Блоки кода: теги link rel=modulepreload и import-выражения с type json, text, bytes и css на размытом синем фоне из кода.
Announcing TypeScript 7.0. Диаграмма Compile Times Between TypeScript 6 & 7: у VS Code сборка сократилась со 125.7s до 10.6s, ускорение 11.9x, а также Sentry, Bluesky, Playwright и tldraw.
Заголовок «The design platform for web shaders» рядом с визуальным редактором Shaders: глянцевый золотой додекаэдр на фиолетовом градиенте, панели слоёв и настройки градиентов.
Заголовок «Polyfilling the gaps» над банкой Polycell Multi Purpose Polyfilla на фоне стены из синей квадратной плитки.
Заголовок «State of Devs 2026», пиксельный логотип «The State of Devs 2026» и разделы опроса: Career, Workplace, AI, Health, Worldview, Hobbies, About You.
Веб-стандарты: Никита, Дэн, Вадим, Полина.
What’s new in ECMAScript 2026. Список фич: Array.fromAsync, Error.isError, Math.sumPrecise, Uint8Array to/from Base64, Iterator Sequencing, JSON.parse source text access, Upsert.
Заголовок «Getting Started With Anchor Positioning» рядом с 3D-персонажем с каштановыми волосами в жёлтой толстовке на синем волнистом фоне.
Диалог «Manage notifications» с каналами уведомлений и триггерами вроде «…becomes widely available», под заголовком «Introducing Baseline Alerts».
Заголовок «Time-based background colour transitions with temporal and css color-mix» на пиксель-арт фоне: голубое небо с облаками и птицами над деревьями и цветами.
Два дропдауна «Toggle picker» со списками языков программирования, рядом подпись «The Goldilocks Height» и заголовок «The Goldilocks customizable select height».
Веб-стандарты: Полина, Никита.
Заголовок «Introducing the Safari MCP server for web developers» рядом с изометрической многослойной иконкой-компасом WebKit, дата «Jul 1, 2026 by Saron Yitbarek».
Графика с текстом «New in Chrome» и числом 150 рядом с логотипом Chrome на фоне красной сетки.
«A11y.quest» и «128 questions to level up your accessibility game», метки WCAG, ARIA, Semantic HTML, Keyboard, Contrast, рядом фото Дэйва Дэвиса и логотип с четырёхконечной звездой.
Заголовок «Modern CSS theming with light-dark(), contrast-color(), and style queries» над четырьмя карточками: Local Theming, Auto Text Color, Elevation, Style Branching, рядом фото Юны Кравец.
Заголовок «Your Grid Lanes will likely fail WCAG 2.4.3» рядом с фото Мануэля Матузовича, masonry-сетка из пронумерованных плиток, соединённых зигзагом линий, который показывает порядок табуляции.
Веб-стандарты: Никита, Алексей, Вадим.
Заголовок «What’s missing from SVG», фото Патрика Броссета и разломанный на части логотип SVG на бежевом фоне.
Ветки сакуры с лепестками, падающими на фоне голубого неба, и заголовок «Experimenting with random() in CSS».
Заголовок «Animating The Dialog Element Using View Transitions», маленькая кнопка Hello World в правом верхнем углу, переходящая в диалог с кнопкой Close, рядом — CSS-фрагмент для dialog::backdrop и HTML-фрагмент с button command=show-modal.
Заголовок «Improving card patterns with anchor positioning» рядом с CSS-кодом и макетом карточки с пунктирным оверлеем ::after, останавливающимся над тёмной кнопкой.
Жёлтый логотип Babel над заголовком «Releasing Babel 8 today: ESM-only, drop ES5 default, and a smooth migration path» от Babel Team.
Веб-стандарты: Никита, Вадим.
Заголовок «The Fundamentals and Dev Experience of CSS @function» на фоне стилизованного боулинга в розово-фиолетовых тонах с кеглями и шаром, ниже круглый портрет автора.
Заголовок «Context-aware headings in HTML» рядом с фото автора, два окна браузера показывают вложенные заголовки с метками H1, H2 и H3 в инспекторе доступности Firefox.
Скриншот инструментов разработки Firefox с панелью Inspector, HTML-разметкой и CSS-правилами, поверх — логотип Firefox и текст «Firefox 152».
Заголовок «Introducing the Field Guide to Grid Lanes» рядом с фото Джен Симмонс, окна браузера показывают раскладки Waterfall и Brick, демо Photos, Recipes, Newspaper.
Заголовок «What JS knows, now CSS knows.» рядом с панелью Live, где показаны pointer.x 99% и pointer.y 24%, ниже карточки clock, FPS, viewport, scroll velocity и accent hue.
Веб-стандарты: Полина, Алексей.
Заголовок «Web Technology Sessions at WWDC26» над окном Safari с сеткой фотографий и панелью инспектора grid-lanes, тремя портретами докладчиков и логотипом WWDC26.
«The quiet problem with unnecessary async». Код: async getConfig и без async. «Keep APIs honest. Instead of designing around what a function might someday become, design around what it is today».
Заголовок «CSS Animated SVG Maps» под картой мира из точек с метками, соединёнными изогнутыми линиями, проходящими между континентами, на чёрном фоне.
Иконка Safari рядом с заголовком «Safari 27 beta» на синем фоне со стилизованным 3D-пространством.
Заголовок «Introducing the CSS Property Type Validator Stylelint Plugin» с фото автора, @property --brand-color с syntax: color, но используется как background-image: var(--brand-color) в .card.
Веб-стандарты: Никита, Полина.
Логотип Website Spec, заголовок «What a good website does» и подзаголовок «A platform-agnostic specification of the technical features every decent website should have».
Графика с текстом «New in Chrome» и числом 149 рядом с логотипом Chrome на фоне синей сетки.
Логотип utilitybend и тёмные квадраты с красными и тёмными линиями в промежутках, заголовок «CSS is filling the gaps with rules. A way to style gaps in grid and flex».
Заголовок «The State of CSS Centering in 2026» белым на тёмном, рядом оранжевый квадрат и слово «CENTER» с засечками между оранжевыми пунктирными направляющими, ниже логотип CSS-Tricks.
Заголовок «Enter And Exit CSS Transitions», подпись display: none над пустым квадратом с пунктирной рамкой, стрелка и подпись display: block над жёлтым квадратом.
Веб-стандарты: Вадим, Никита.
Replacements.fyi (module_replacements), подпись «type a package name. we’ll tell you what you don’t need» и примеры: is-number, is-odd, left-pad, object-assign.
Два блока с подписями «Using CSS Keyframes» и «Using a JavaScript loop» и слайдерами, между ними персонаж вниз головой, кнопка Play и «Are JavaScript animations less performant than CSS?»
«Better fluid sizing with round()», подзаголовок о предсказуемых плавных размерах, два фиолетовых круга с подписями 119px и 100px, фото Ахмада Шадида и код с clamp() и round().
Логотип Chrome for Developers, заголовок «Declarative Partial Updates», фото двух авторов, иллюстрация браузера и код с <?marker name="placeholder"> и парным <template for="placeholder">.
Лого Evil Martians, Нина Торгунакова Frontend Engineer, заголовок «600+ million people write right-to-left: two fixes your app needs» и пришелец пишет слева направо и справа налево.
Веб-стандарты: Вадим, Алексей, Полина, Никита.
Два терминала с web-features-cli: wf "view transitions" -s bugs -s positions со списком багов и позиций, и wf "container queries" с Baseline Widely available since 2025-08-14.
Заголовок «State of CSS 2026», розовый кристалл с логотипом CSS и разделы опроса: Shapes & Graphics, Colors, Interactions, Layout, Other Features, Other Tools, CSS Usage, Resources, About You.
«Build with Modern Web Guidance», команда npx modern-web-guidance@latest install и поддерживаемые инструменты Claude Code, Copilot CLI, Antigravity CLI и npx skills.
Скриншот инструментов разработки Firefox с панелью Inspector, HTML-разметкой и CSS-правилами, поверх — логотип Firefox и текст «Firefox 151».
Обложка «State of Web Dev AI 2026» с диаграммой по вопросу «AI tools are a threat to my job security»: Disagree 21%, Neutral 28%, Agree 31%, а также Claude 69%, ChatGPT 49%.
Веб-стандарты: Никита, Алексей.
Заголовок «Browsers Treat Big Sites Differently» поверх бумажных вырезок с логотипами: Google, Yahoo!, YouTube, NFL, Spotify, TikTok, Slack, Outlook, ESPN, Discord, Apple и Netflix.