Веб-стандарты. Страница 40

10 современных однострочных CSS-разметок. Юна Кравец рассказывает о современных возможностях CSS, благодаря которым можно коротко и ёмко строить сложную адаптивную разметку — https://web.dev/one-line-layouts/

Принцип цикады на CSS-переменных. Лия Веру показывает, как при помощи простых чисел можно генерировать псевдослучайные узоры в веб-дизайне — https://lea.verou.me/2020/07/the-cicada-principle-revisited-with-css-variables/

Порядок отрисовки в CSS. Мартин Робинсон на примерах разбирается, как браузер решает, в каком порядке отрисовывать элементы при их наложении друг на друга — https://abandonedwig.info/blog/2020/07/03/css-painting-order.html

Редкие CSS-свойства. Ахмад Шадид рассказывает о полезных свойствах, которые редко применяются, но хорошо решают конкретные задачи — https://ishadeed.com/article/uncommon-css/

Кастомные CSS-свойства не работают без фолбека. Матиас Отт объясняет, как работает каскад с кастомными свойствами и без них, в переводе Дмитрия Гордиенко — http://odinokun.com/2020-07-06-kastomnye-css-svojstva-ne-rabotayut-bez-folbeka.html

00:01:32 События
00:05:04 Firefox 78
00:15:13 Новинки V8 8.4
00:26:19 Интересное с Web.Dev Live
00:52:10 Сравнение WebP и JPEG
01:04:24 Небезопасные API

Выпуск №237: Firefox 78, новинки V8 8.4, интересное с Web.Dev Live, сравнение WebP и JPEG, небезопасные API. В гостях Полина Гуртовая. Слушайте на Ютубе https://youtu.be/OEE4Q7awGww, читайте на Медиуме https://medium.com/p/e4306705d7ab

Когда Sass и новые возможности CSS мешают друг другу. Ана Тюдор рассматривает случаи, в которых Sass конфликтует с кастомными свойствами и CSS-функциями, как с этим бороться и почему препроцессоры всё ещё нужны для некоторых решений — https://css-tricks.com/when-sass-and-new-css-features-collide/

TailwindCSS — очередной фреймворк или новый шаг эволюции? Евгений Петрянкин разбирается, какие проблемы решает TailwindCSS и почему он набирает популярность в веб-разработке — https://habr.com/p/508844/

Как подключить и оптимизировать нестандартные шрифты. Саша Смыгина про все варианты подключения и настройки: от Google Fonts до предзагрузки и сабсетинга — https://htmlacademy.ru/blog/boost/frontend/fonts-loading?utm_source=tg_web_standarts&utm_medium=special&utm_campaign=fonts_loading03072020

Рисование на CSS или CSS Houdini Paint API. Лизи Линхарт замеряет производительность двух способов отрисовки на странице и рассказывает, для чего CSS Houdini может быть полезен, а когда скорее вредит — https://lisilinhart.info/posts/css-houdini-performance

Полное руководство по медиа-выражениям в CSS. Синтаксис, способы применения, типы, примеры использования и будущие возможности — https://polypane.app/blog/the-complete-guide-to-css-media-queries/

35 видео с конференции Web.Dev Live в трёх плейлистах: все новинки, тренды и лучшие практики веб-технологий от Google.

1 день https://www.youtube.com/playlist?list=PLNYkxOF6rcIDC0-BiwSL52yQ0n9rNozaF
2 день https://www.youtube.com/playlist?list=PLNYkxOF6rcIBhuGsbO6t8-OBE5-fVPe7K
3 день https://www.youtube.com/playlist?list=PLNYkxOF6rcIDJHOcBzho38p6WTn3vESvQ

Новинки Firefox 78: псевдоклассы :is() и :where(), поддержка :read-only и :read-write без префиксов, новый движок регулярных выражений и другие. Подробнее в обзорах:

Марата Таналина https://tanalin.com/blog/2020/07/firefox-78/
Флориана Шольца и Харальда Киршнера https://hacks.mozilla.org/2020/06/new-in-firefox-78/

Со­ве­ты по слож­ным CSS-ил­лю­стра­ци­ям. Несколько свойств, техник и множество примеров Джи Томпкинса, которые помогут вам быстрее и качественнее рисовать на CSS. В переводе на «Веб-стандартах» — https://web-standards.ru/articles/complex-css-illustrations/

Действительно ли WebP лучше, чем JPEG? Йоханнес Сиипола сравнивает сжатие изображений разных размеров разными кодировщиками — https://siipo.la/blog/is-webp-really-better-than-jpeg

Tooling.Report. Инструмент для сравнения сборщиков по различным параметрам, позволяющий более осознанно подбирать сборщик для проекта — https://bundlers.tooling.report/

Прямая трансляция второго дня Web.Dev Live начнётся в 15:00 (GMT+3). В программе: новинки DevTools, V8 и Puppeteer, PWA, локальные хранилища, прогрессивное улучшение, новые API для Zoom в вебе.

Программа https://web.dev/live/
Трансляция https://youtu.be/r3QPKK0JPtI