Анимированная иконка прокрутки на чистом CSS.

https://codepen.io/marctannous/pen/ogLMxy

Пару недель назад мы обновили профиль, а теперь рассказываем что к чему.
https://htmlacademy.ru/blog/131-new-profile-2

Автор статьи предлагает рассмотреть подход, при котором адаптивные компоненты в CSS создаются в относительных единицах: %, em и rem. Изменяя при этом не только размер шрифта, но и значения других свойств: отступов, теней и закруглений рамок.

Много практических примеров для разных компонентов, включая решение для страницы сайта целиком.

41-й выпуск «Веб-стандартов»: HTML 5.1, async, вариативные шрифты, календарик, опасные API, WebAssembly, JS-шаблоны, Webpack, position: sticky, графика, Stack Overflow, тесты и игрушки — https://soundcloud.com/web-standards/episode-41

Даниэль Рейс, наблюдая за коллегами, собрал интересные способы отладки с использованием различных методов в объекте console.

Наглядное объяснение псевдоклассов в CSS с помощью DOM-дерева.

https://medium.freecodecamp.com/explained-css-pseudo-classes-cef3c3177361

CSS-фигуры расширяют возможности использования различных геометрических форм в макетах. Например, с помощью новых свойств shape-outside и shape-margin, можно размещать контент, обрамляя фигуру нестандартной формы.


Пока эти свойства работают только в Chrome, Opera и Safari с -webkit-shape-outside.

Как-то раз Женя пришёл к нам в гости и остался. Привет, расскажи о себе.

https://htmlacademy.ru/blog/133-evgenij-shchepotev

42-й выпуск «Веб-стандартов»: Safari TP17, доступность, Fetch не торт, результаты 10K Apart, травим мобильных пользователей, людоедский фронтенд и JS-in-JS, в гостях Андрей Оконечников — https://soundcloud.com/web-standards/episode-42

Набор фоновых SVG-узоров с возможностью настройки цвета и прозрачности.

https://www.heropatterns.com/

Руководство по созданию CSS-анимации, следуя которому вы научитесь делать её красивой и плавной.

Проверяем все формы на сайте, например, сервис может найти такие ошибки:
— Некорректные типы элементов формы.
— Неуникальные идентификаторы.
— Отсутствие обязательных полей.
— Потерянные кнопки.

Создаём веб-комикс, чтобы попрактиковаться в использовании гридов.

Технология поддерживается пока не всеми браузерами.