Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
| Веб-разработка |
| CSS |
| Javascript |
| Браузеры |
| Дизайн |
| Новости |
Веб-разработка
Идеальная производительность протокола HTTP- Подкаст Веб-стандарты, выпуск 13: SpiderNode, VPN, методологии CSS, Stylelint и CSSX, параллакс, доступность.
Сборник актуальных англоязычных подкастов на тему веб-разработки
Подробное введение в методологию БЭМ на toptal (Introduction To BEM Methodology)
Видео с Fronteers Spring Conference 2016, разбитые на блоки Visual Performance, Accessible Performance и Technical performance
Видео с секции FrontTalks на DUMP-2016
Производительный client-side – запись доклада Романа Парадеева
Sara Soueidan о том, как переключиться с иконочного шрифта на SVG (Making the Switch Away from Icon Fonts to SVG: Converting Font Icons to SVG)
Инструменты и ресурсы для редактирования, конвертации и оптимизации SVG (Tools And Resources For Editing, Converting And Optimizing SVGs)
Возможности DOM, о существовании которых вы не знали (DOM Features You Didn’t Know Existed)
Подробное описание работы по улучшению показателей сайта в Google PageSpeed (Hands On Improving Google PageSpeed)
Пятнадцать фундаментальных законов разработки софта (15 Fundamental Laws of Software Development)
Styleguide — руководство по стилю для брендов (Living Styleguide Made Easy)
Webpack Boilerplate
Google's V8 JavaScript движок начал поддерживать WebAssembly, Быстрый совет: как использовать WebAssembly в браузере уже сегодня
Jam API — сервис, позволяющий превратить любой сайт в JSON accessible api с помощью CSS селекторов
Как работает JPG (How JPG Works)
Подробный обзор стандартов и возможностей видео в вебе (HTML5 Media Source Extensions: Bringing Production Video To The Web)- Эффектный веб:
Создание “The Aviator”: анимация простой 3D сцены с помощью Three.js
Про анимацию «fave» в Twitter
Анимированная сфера на CSS
Создание анимированных маркеров на Google-карте с CSS и JavaScript (Creating Animated Google Map Markers with CSS and JavaScript)- Еженедельная подборка красивых эффектов на CSS/SVG/JS #35
CSS
Будущее CSS- Игры на чистом CSS со свойством counter-increment. Перевод статьи Юны Кравец Pure CSS Games with Counter-Increment сообществом css-live.ru
- Плиточная раскладка на чистом CSS. Перевод статьи HOW TO: Pure CSS masonry layouts на prgssr.ru
- Типы данных в Sass
Пересмотренная спецификация подсеток (A Revised Subgrid Specification)
Работа с изображениями в таблицах стилей с помощью PostCSS (Working with Images in Stylesheets with PostCSS)
Улучшение качества CSS с помощью PostCSS (Improving the Quality of Your CSS with PostCSS)
Тестирование визуальной регрессии с помощью режимов наложения в CSS (Visual Regression Testing with CSS Blend Modes)
diffee — определение визуальных различий с использованием CSS режимов наложения
Как flexbox снимает боль в некоторых местах фронтенд-разработки (How flexbox alleviates some common front end development pains)
5 техник Flexbox, о которых вы должны знать (5 Flexbox Techniques You Need to Know About)
Пример использования CSSX — ванильного CSS в JS
Двигаемся от HTML Grid Systems к CSS Grid Systems
Быстрый совет: Использование CSS счетчиков со стилями для пронумерованных списков (Quick Tip: Using CSS Counters to Style Incremental Elements)
Как делать разметку для карточного дизайна с Semantic UI (How to Design Rich Card-Based Layouts with Semantic UI)
Почему Node Sass сломает ваш код и SemVer (Why Node Sass broke your code and SemVer)
JavaScript
Вышел в свет Node.JS v6.0
V8: ES6, ES7, после них- Подводные камни при передаче JSON в JavaScript
- ES6: отражение изнутри
Транспайлеры в JavaScript: что это такое почему они нам нужны? (JavaScript Transpilers: What They Are & Why We Need Them)
Взгляд на ES6 Maps (A Look at ES6 Maps)
Делаем ифреймы отзывчивыми (Making IFrames Responsive)
Давайте изучать замыкания в JavaScript (Let’s Learn JavaScript Closures)
Эффективное использование JavaScript замыканий (Use JavaScript closures efficiently)
Tessel 2: легкая интеграция интернета вещей и JavaScript (Tessel 2: Pairing JavaScript and the Internet of Things with Ease)
Как логировать JavaScript-ошибки на клиентской стороне (How to Log Client-Side JavaScript Errors)
Свежая запись в блоге разработчиков Airbnb: Турбированный рефакторинг JavaScript с помощью codemods (Turbocharged JavaScript refactoring with codemods)
Быть JavaScript разработчиком — это не Candy Land (Being a JavaScript Developer is no Candy Land)
Избегаем монокультуры JavaScript (Avoiding a JavaScript Monoculture)
Прототипное объектно-ориентированное программирование с использованием JavaScript (Prototypal Object-Oriented Programming using JavaScript)
JavaScript тестирование: юнит тесты vs функциональные тесты vs интеграционных тесты (JavaScript Testing: Unit vs Functional vs Integration Tests)
Сколько существует пользователей npm? (how many npm users are there?)
Представление yakbak: запись и воспроизведение HTTP взаимодействий в NodeJS (Introducing yakbak: Record and playback HTTP interactions in NodeJS)
Стандартизация стилей JavaScript (JavaScript Standard Style)- Фреймворки:
- React-компоненты с привкусом БЭМ
Вы (возможно) не нуждаетесь в JavaScript фреймворке (You (probably) don't need a JavaScript framework)
Текущие и грядушшие JS фреймворки, за которыми можно следить в 2016-м (Up-and-coming JavaScript frameworks & libraries to watch out for in 2016)
Три более легкие альтернативы Реакту: Preact, VirtualDom и Deku (3 Lightweight React Alternatives: Preact, VirtualDom & Deku)
Зачем использовать React? (Why use React?)
Как сделать хорошую структуру React приложений? (How to better organize your React applications?)
AlphaBeta — декларативное сплит-тестирование для React (AlphaBeta — declarative split testing for React)
Курируемая коллекция ссылок на тему React/Redux (React/Redux Links)
Redux Immutable Reducer
Ключевые концепции Angular 2 (THE CORE CONCEPTS OF ANGULAR 2)
Angular 2 ESNext Starter — стартовый пакет для разработки c ES6/ES7, Babel (Angular 2 ESNext Starter)
Использование кросс-платформенных приложений с Angular 2 (Creating Cross-Platform Apps with Angular 2)
algebrite — библиотека для решений задач по алгебре, написанная на JavaScript (algebrite — Computer Algebra System in Javascript)
grafi.js — JavaScript Image Processing Library
es-search — поиск по структуре кода, используя CSS-подобные селекторы (es-search — search ECMAScript structurally)
Enumish — создание Enum-подобных объектов
Браузеры
- Релиз Firefox 46, перешедший на GTK3+ в Linux
- Технические детали о Firefox 46 в блоге Марата Таналина
- Тестирование Firefox 47-beta и Firefox Developer Edition 48 с поддержкой WebExtensions
- Microsoft заблокировал все браузеры в Cortana для Windows 10, кроме Edge
- WebKit отказывается от префикса "-webkit-" для экспериментальных возможностей
- Обновление web-браузера Vivaldi 1.1
Сайты с интересным дизайном и функциональностью
julie poignot — симпатичный сайт-портфолио дизайнера
sugar.vision — симпатичный сайт с концептуальным дизайном и скролл-анимацией 
misplaced.design — сайт с организованным хаосом в дизайне- Классные сайты с горизонтальным скроллингом
Прекрасные дизайны сайтов для церквей (40 Beautiful Church Website Designs)
gameandfishfacts.com — симпатичный сайт с фоновым видео и флип-анимацией
madebyfew.com — страничка с удачным использованием параллаксом
Lookbook 2016 — вертикальный скролл-сайт с параллаксом, интересными эффектами и анимацией
bizpoint.com — новая социальная сеть с ненавязчивым дизайном и претензиями на лавры Yelp (пока только в пределах Турции)
Дизайн
Веб-сайты продолжают использовать «тёмные паттерны»: интерфейсы, предназначенные для обмана
Шрифт Яндекса — Yandex Sans- Еще о деталях создания Yandex Sans в блоге одного из авторов
- Я.Субботник для дизайнеров — запись трансляции
- Почему дизайн Facebook именно такой и как принимаются решения внутри компании
- 5 UX способов начать разработку дизайна правильно
- Индикаторы прогресса в мобильном UX-дизайне
Кнопки в системах дизайна: 12 советов Buttons in Design Systems
Дружественное руководство по цветам в визуализации информации (Your Friendly Guide to Colors in Data Visualisation)
Этот интерфейс — это (хорошая) шутка (This Interface Is A (Good) Joke!)
10 недавних инноваций в веб-дизайне для вашего вдохновения (10 Recent Innovative Web Designs For Your Inspiration)
Анализ эффективности гамбургерного меню в веб-дизайне (Analyzing the Effectiveness of Hamburger Menus in Web Design)
Мнения экспертов: делает ли плоский дизайн веб скучным? (Experts Weigh In: Is Flat Design Making The Web Boring?)
Может ли дизайн быть «правильным»? 
125 советов по оптимизации юзабилити вашего сайта (125 Easy Tweaks to Optimize Your Website’s Usability Today)
Как разработать эффективный дизайн форм логина (How to design effective login forms with great UX)
Пять способов улучшения дизайнерских презентаций (5 ways to improve your design presentations)
Почему всплывающие подсказки ужасны и почему их стоит использовать для продуктов (Why tooltips are terrible and why you should use them for your product)
Пять ошибок, которые стоит избегать при создании дизайна взаимодействия с пользователем (5 Mistakes to Avoid When Designing Micro-interactions)
Отладка дизайна (Design debugging)
Концепт приложения Facebook Camera (Facebook Camera)
Апрельское обновление Adobe Experience дизайн CC (April Update of Adobe Experience Design CC)
Дизайнеры: не давайте возможности слишком просто ошибаться (Designers: Don’t make it too easy to mess up)
Прототипирование индикатора загрузки используя Principle (mac) (Prototyping a circular loading indicator using Principle for mac)
Coca-Cola представила новый дизайн упаковки (Coca-Cola Unveils New Global Packaging)
Как сделать лучший дизайн приложений для заметок (Designing a Better Notes App)
Процесс дизайна формы авторизации (Designing UX Login Form and Process)
Веб дизайнеры, можете ли вы говорить на языке web-а? (Web designers, can you speak web?)
Апрельский поиск ресурсов: как насчет добавления Fedora в ваше CV? (Sourcehunt Design April: How About Adding Fedora to Your CV?)
Как оживить портретные фото, используя Photoshop Actions (How to Relight Portraits in Post With These 6 Dramatic Photoshop Actions)
Новый логотип для Guinness от Design Bridge (New Logo for Guinness by Design Bridge. Putting the Harp in Sharp)
Color Lisa — цветовые палитры лучших художников
Подборка бесплатных дизайнерских печенек
- Векторный клипарт, посвященный работе
- Бесплатные текстуры, подаренные нам природой
Wyre: много шаблонов для создания карт сайтов (Wyre: Web Layout Flowcharts)
Набор UI в PSD формате Chat App UI Kit (Free Chat App UI Design Kit PSD)
Avital: набор UI для мобильных iOS приложений (Avital: Free UI Kit For Mobile Apps)
Мокапы для демонстрации дизайна (10+ Free High Quality PSD Mockups)
Набор иконок с плоским дизайном на тему дизайна (Download 36 flat graphic design icons—free!)
Набор иконок на тему гостиниц и СПА (Freebie: Hotel And Spa Icon Set (55 Icons PNG, SVG))
Montano — рукописный шрифт (Montano was a font that started on paper for a skillshare class, which later turned into a digital font.)
Романтичный рукописный шрифт Mightype (Mightype Hand Lettering Font – Free Download)
Quish — рукописный кистевой шрифт (Quish is a handwritten display typeface, designed with a brush and rough styling in some of the letters)
FONTEA — плагин для использования семисот Google-шрифтов в Photoshop-е
Новости и Занимательное
- Сильный доллар и расходы на привлечение трафика отразились на доходах Alphabet
- Twitter заключил партнёрское соглашение с Yelp
- На хромбуках появятся миллионы Android-приложений
- Средний размер веб-страницы превысил размер установщика оригинального Doom
- «Яндекс» запускает модерацию изображений в соцсетях
- GitHub и SourceForge признаны неприемлемыми для размещения кода проектов GNU
- Mozilla ищет новое пристанище для проекта Thunderbird
- Google интересовалась покупкой Telegram
- Поколение Minecraft: Как компьютерная игра стала новым Lego для детей всех возрастов
- Oculus Rift и HTC Vive: какой шлем виртуальной реальности выбрать
- Топ-5 «безумных» вещей, которые запускали на смарт-часах
- SpaceX Илона Маска планирует отправить космический корабль на Марс уже в 2018 году
- macOS: настало время шагнуть вперед
- Тотализаторы будущего: киберспорт и криптовалюта
- SpaceX отправит корабли Red Dragon на Марс в 2018
- Обновление Windows 10 появилось в прямом эфире прогноза погоды
- Google собирается улучшать города
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group
