Вы не знаете HTML-таблицы. Фрэнк Тейлор выходит за пределы базовых понятий и разбирает терминологию таблиц, API Table Object Model, семантику заголовочных ячеек с атрибутами scope и headers, а также практические паттерны для создания доступных и хорошо структурированных таблиц с <thead>, <tbody>, <tfoot> и хелперами на JavaScript. #html #a11y

https://blog.frankmtaylor.com/2026/03/05/you-dont-know-html-tables/

Неожиданные кастомные селекты. Патрик Броссет создаёт три креативные демки с новым кастомизируемым элементом <select>: изогнутую стопку папок с CSS-трансформациями и sibling-index(), веер игральных карт с anchor positioning и круговой эмодзи-пикер на тригонометрических функциях CSS. Все демки сохраняют доступность и адекватно деградируют в неподдерживающих браузерах. #css #html

https://css-tricks.com/abusing-customizable-selects/

Кастомные элементы с поддержкой форм на практике. Роб Левин делится опытом добавления поддержки Form-Associated Custom Element в библиотеку AgnosticUI с помощью ElementInternals API. Статья описывает две стратегии валидации: делегирование нативным элементам формы и реализацию валидации напрямую, с пошаговыми примерами для input, radio и combobox, включая проблемы изоляции Shadow DOM. #webcomponents #html

https://frontendmasters.com/blog/form-associated-custom-elements-in-practice/

Squarespace и веб-стандарты: как мы помогли добавить ленивую загрузку видео и аудио в HTML. Скотт Джел рассказывает, как инженеры Squarespace предложили loading="lazy" для элементов <video> и <audio>, работали с WHATWG, написали Web Platform Tests и сотрудничали с командами Mozilla, Apple и Chromium, чтобы фича стала официальным стандартом 23 марта 2026 года. #html #performance

https://engineering.squarespace.com/blog/2026/squarespace-and-web-standards-how-we-helped-bring-html-video-and-audio-lazy-loading-to-todays-browsers

Как сделать так, чтобы вашей статьёй делились: советы из десяти лет курирования рассылки. Скотт Вандехей, который более десяти лет собирал фронтенд-ссылки, делится практическими советами: добавляйте Open Graph теги, используйте уникальное изображение для шеринга, пишите описательные заголовки, добавляйте краткую аннотацию, правильно настраивайте канонический URL и всегда указывайте дату публикации. #html #learn

https://cloudfour.com/thinks/getting-your-article-shared-tips-from-ten-years-of-newsletter-curation/

Полностью локальные встраиваемые примеры кода. Александр Овганнисян создал веб-компонент, который рендерит изолированные песочницы для кода через <iframe srcdoc> без сторонних сервисов вроде CodePen или CodeSandbox. Компонент берёт HTML, CSS и JavaScript из элемента <template> и создаёт полностью локальный изолированный превью. Работает везде, где поддерживаются HTML и JavaScript, и не имеет зависимостей. #html #js

https://www.aleksandrhovhannisyan.com/blog/local-code-embeds/

Конец адаптивных изображений. Мэт Маркиз, бывший председатель Responsive Image Community Group, оглядывается на десять лет борьбы с атрибутом sizes и рассказывает, как sizes="auto" вместе с loading="lazy" наконец передают эту работу браузеру для большинства картинок. Поддержка уже есть в Firefox, Safari и Chrome, а длинные значения sizes можно оставлять только для картинок в первом экране. #html #performance

https://piccalil.li/blog/the-end-of-responsive-images/

В интернете снова весело: первые эксперименты с HTML в <canvas>. Амит Шин разбирает экспериментальный API Canvas Draw Element за флагом в Chrome 146, который рисует нативный HTML на <canvas>, сохраняя семантику, формы и взаимодействие. С помощью атрибута layoutsubtree и drawElementImage() он показывает синхронизацию трансформаций, манипуляции пикселями для эффектов цвета и искажений, отклик на движение мыши и WebGL-шейдеры. #html #api

https://frontendmasters.com/blog/the-web-is-fun-again-first-experiments-with-html-in-canvas/

HTML Sanitizer API. Ахмад Альфи рассказывает о новом браузерном API для защиты от XSS без DOMPurify. Безопасные методы setHTML и parseHTML всегда удаляют опасное содержимое, а setHTMLUnsafe и parseHTMLUnsafe уважают ваши настройки. Списки разрешённых и запрещённых элементов и атрибутов дают гибкий контроль. Подходит для комментариев, WYSIWYG-редакторов и предпросмотра Markdown, но серверная санитизация по-прежнему обязательна. #security #html

https://alfy.blog/2026/05/07/html-sanitizer-api.html

Декларативные частичные обновления HTML. Барри Поллард и Ноам Розенталь представляют две идеи для веб-платформы: инструкции обработки <?marker> и <?start>/<?end> в паре с <template> позволяют серверу вставлять HTML в нужные места документа без последовательной доставки. Новые JS-методы setHTML(), appendHTML() и streamHTML() дают единообразное API для частичных обновлений. Полифилы есть на npm. #html #api

https://developer.chrome.com/blog/declarative-partial-updates

Спецификация для веб-сайтов. Йост де Валк опубликовал универсальную спецификацию технических возможностей, которыми должен обладать качественный сайт. Документ охватывает основы и семантический HTML, SEO и структурированные данные, доступность, безопасность и CSP, производительность и Core Web Vitals, интернационализацию, а также готовность к агентам через Markdown-эндпоинты, JSON-LD и RSS. #html #a11y

https://specification.website

Контекстно-зависимые заголовки в HTML. Мануэль Матузович рассказывает про headingoffset — новый HTML-атрибут, который сдвигает уровни вложенных заголовков в дереве доступности, не меняя самих тегов. Заворачиваем секцию в headingoffset="1", и <h1> внутри становятся <h2> для скринридеров. Атрибут headingreset позволяет отключить эффект. Особенно полезно для веб-компонентов, рендерящих заголовки в Shadow DOM. Доступно в Firefox Nightly за флагом. #html #a11y

https://www.matuzo.at/blog/2026/content-aware-headings

A11y​.quest: 128 вопросов, чтобы прокачать навыки доступности. Дэйв Дэвис сделал интерактивный тест, проверяющий знания по семантическому HTML, ARIA и другим темам. Вопросы отсортированы по сложности, их можно перемешивать и отслеживать точность ответов и серии. #a11y #html

https://a11y.quest/

HTML-бойлерплейт 2026 года. Мануэль Матузович разбирает каждую строку в <head> и объясняет, зачем она нужна: кодировка перед заголовком, вьюпорт, Open Graph и отдельная таблица стилей для печати. В этом году добавились метаэлемент text-scale для системного размера текста на мобильных, SVG-фавиконка с поддержкой тёмной темы, ссылка на маркдаун-версию страницы для LLM и fediverse:creator для атрибуции в Mastodon. #html #learn

https://www.matuzo.at/blog/2026/html-boilerplate

Знакомимся с HTML-элементом <geolocation>. Даниэль Шварц разбирает новый элемент из Chrome 144, который заменяет Geolocation API разметкой: autolocate переиспользует ранее выданное разрешение, watch следит за перемещением, а onlocation обрабатывает результат. Таймауты браузер берёт на себя. Псевдокласс :granted стилизует кнопку, isValid и invalidReason сообщают о проблемах, а строгие правила стилизации защищают от перехвата кликов. #html #chrome

https://piccalil.li/blog/a-look-at-the-geolocation-html-element-and-how-it-works/

Ну и ладно, напишу свой текстовый редактор! Дэвид Бушелл пробует три способа собрать редактор в браузере и показывает, чем приходится жертвовать. Канвас даёт полный контроль, но лишает выделения текста, истории отмен и вставки нескольких строк. Атрибут contenteditable с плейн-текстом возвращает нативное редактирование и доступность, но тормозит после определённого числа символов. Быстрее всех оказался обычный <textarea> с подсветкой синтаксиса поверх. #html #performance

https://dbushell.com/2026/09/01/text-editor/

В HTML больше не нужен initial-scale. Деклан Чидлоу и Питер-Пол Кох с разницей в несколько часов пришли к одному выводу: в <meta name="viewport"> достаточно width=device-width. Часть initial-scale=1 добавляли, чтобы починить зум в старых версиях iOS, а Safari теперь и без неё правильно пересчитывает вьюпорт при смене ориентации. Минус 19 байт в каждом документе. #html #browser

https://vale.rocks/micros/20260902-1350

https://quirksmode.org/quirksblog/2026/0902-initial.html

Адаптивные iframe в Chrome 154. Себастьян Бенц и Брамус Ван Дамм рассказывают о свойстве frame-sizing: встроенный фрейм сам растёт под свой контент, без передачи высоты через postMessage. Встраивающая страница задаёт frame-sizing: content-height, а встроенный документ разрешает это элементом <meta>, где можно ограничить список источников. После изменения контента новый замер запрашивают через window.requestResize(). Пока за флагами в Chrome и Edge. #html #css

https://developer.chrome.com/blog/responsive-iframes

Безопасный рендеринг комментариев в Markdown: setHTML(), DOMPurify и Trusted Types. Агустин Барриентос показывает, как marked.js сохраняет сырой HTML в комментариях и почему фраза «мы санитизируем» мало что значит, когда настройки библиотек по умолчанию так различаются. Он описывает один явный список разрешённого в формате SanitizerConfig, применяет его через setHTML(), а где его нет — через DOMPurify, а Trusted Types не даёт обойти защиту через innerHTML. #security #html

https://agustinbarrientos.com/writing/senior-eye/rendering-markdown-comments-safely/

Фреймы, которые наконец подстраиваются под контент. Ахмад Альфи показывает, как frame-sizing: content-height в Chromium подгоняет <iframe> под содержимое без postMessage. Встроенная страница разрешает это мета-элементом responsive-embedded-sizing прямо в HTML, а после изменений вызывает window.requestResize(). В других браузерах пригодятся @supports и фолбек на postMessage. #html #css

https://alfy.blog/2026/10/09/iframe-that-finally-fit-their-content.html