Выпуск №160: Перевод документации React, статьи про вёрстку, логический CSS, SVG-фильтры, цветные шрифты, полезные инструменты и Юля Бухвалова в гостях. Ссылки на Медиуме https://medium.com/p/79bb0f67e2bd или на Ютубе https://youtu.be/eBXOX3SvxUA
Size: a a a
2019 February 11
Ссылки, которые никуда не ведут, должны быть кнопками. Крис Хайльман рассказывает про <button> и объясняет, как выбрать и зачем вообще это нужно — https://christianheilmann.com/2019/02/05/links-that-dont-go-anywhere-should-be-buttons/
Тёмная сторона гридов. Мануэль Матузович о потенциальных неприятностях, которые несут гриды для пользователей и доступности интерфейсов. Первая часть трилогии вперемешку с интересными фактами про Pink Floyd — https://www.matuzo.at/blog/the-dark-side-of-the-grid/
2019 February 12
Новинки беты Chrome 73: конструируемые стили, matchAll для регулярных выражений, пассивные события прокрутки мыши, атрибуты imagesrcset и imagesizes для <link rel=preload>, псевдоэлемент ::part, новое совместимое размытие теней и другое — https://blog.chromium.org/2019/02/chrome-73-beta-constructable.html
Подходы к адаптации таблиц в вебе. Хуэй Дзинь Чэнь с вариантами прокрутки, разбиения на части, постраничной навигации и поиска — https://www.smashingmagazine.com/2019/01/table-design-patterns-web/
Интерфейсы будущего: инлайновый SVG. Хейдон Пикеринг разбирается в возможностях SVG на примере бургерной кнопки меню, которая превращается в крестик, в коротком юмористическом видео — https://youtu.be/1CDTw_UpQoQ
Эффекты с SVG-фильтрами: подстраиваем изображение под текстуру поверхности с помощью <feDisplacementMap>. Сара Суайдан продолжает серию статей на Codrops — https://tympanus.net/codrops/2019/02/12/svg-filter-effects-conforming-text-to-surface-texture-with-fedisplacementmap/
2019 February 13
Как сделать интерактивные элементы удобнее на мобильных. Советы Ире Адеринокун по расположению и разметке — https://bitsofco.de/tips-for-making-interactive-elements-accessible-on-mobile-devices/
Где подходит TypeScript и какой ценой даётся внедрение? Два перевода на Хабре: «Цена TypeScript» Эрика Элиотта https://habr.com/p/437464/ и «TypeScript в PayPal» Кента Доддса https://habr.com/p/437986/
2019 February 14
«А давайте перепишем шапку MDN на React?», или «React против веб-компонентов». Предложение Дэвина Флэнагана из Mozilla превратилось в интересную дискуссию — https://github.com/mdn/sprints/issues/967
2019 February 15
Состояние CSS 2019. Новый опрос от создателей «Состояния JS»: технологии, инструменты, окружение, ресурсы, мнения и ваш портрет. Опрос https://stateofcss.com/ и анонс https://medium.com/p/e1e4268df64d
Puppeteer — мой новый сервер для разработки. Эрик Бидельман рассказывает, как команда https://web.dev придумала не разворачивать весь проект локально, а забирать живой сайт и подменять контент локально для простого редактирования статей — https://ericbidelman.com/posts/2019/02/pptrstagingserver
API Intersection Observer v1 появится в Safari, анонс с примерами использования в блоге WebKit https://webkit.org/blog/8582/intersectionobserver-in-webkit/, а в Chrome уже планируют улучшенную версию API v2, которая позволит точнее проверять реальную видимость объектов https://developers.google.com/web/updates/2019/02/intersectionobserver-v2
2019 February 18
Выпуск №161: Chrome 73 и CSS 2019, SVG, таблицы, гриды и кнопки, будущее Фоторамы и Артём Поликарпов в гостях. Ссылки на Медиуме https://medium.com/p/2a243ce8546d или на Ютубе https://youtu.be/7FuUojUdl0w
Инклюзивные компоненты: список дел. Хейдон Пикеринг про разметку классического интерфейса для TodoMVC, которая сделает его доступным и удобным. В переводе на «Веб-стандартах» — https://medium.com/p/40a324436b3e
Imagemin для сжатия картинок. Практикум Кейти Хемпениус по сжатию картинок с помощью Imagemin в Grunt, Gulp и Webpack с плагинами для обработки и экспорта форматов от GIF до SVG и WebP — https://web.dev/fast/use-imagemin-to-compress-images
2019 February 19
Архитектурные решения для разных типов приложений. Джейсон Миллер (автор Preact из Google) рассматривает 12 типов (от соцсетей до лёгких игр) и предлагает наиболее эффективную архитектуру для каждого — https://jasonformat.com/application-holotypes/
Типы полей форм из HTML5: где они сейчас? Дрю Маклиллан про восемь типов полей и их поддержку в браузерах: поиск, телефон, ссылка, почта, число, диапазон, цвет и дата — https://www.smashingmagazine.com/2019/01/html5-input-types/