Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
| Веб-разработка |
| 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: настало время шагнуть вперед
- Тотализаторы будущего: киберспорт и криптовалюта
- Google собирается улучшать города
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
