Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
Веб-разработка |
CSS |
Javascript |
Браузеры |
Дизайн |
Новости |
Занимательное |
Веб-разработка
- Подкаст «Веб-стандарты», Выпуск №7
- 22 видео с московской конференции Web Standards Days, проходившей в декабре
- Три основных браузера добавили поддержку низкоуровневого бинарного формата WebAssembly
- Web-приложения в режиме offline. ServiceWorker и CacheStorage
- Google: работы с техническими аспектами сайта недостаточно для выхода в топ
- Я не умный, я просто сидел над этим дольше, чем ты — история Грэма Фултона.
- Возможные методы для создания профессиональной анимации в SVG (The following are the possible ways to create professional animations in SVG)
- Подборка с инструментарием и ресурсами для экосистемы Chrome DevTools (Awesome tooling and resources in the Chrome DevTools ecosystem)
- Issue-дайджест от Addy Osmani за последнюю неделю: Service Worker Debugging, RAIL on 3G, Offline Analytics, Progressive Web Apps, Rollupify & другое
- Ответ разработчиков Google на некоторые вопросы: Paul Lewis: "Answers to Questions About Performance", Matt Gaunt: Web Development is a Balancing Act
- Оптимизация производительности:
- Управляем оптимизацией производительности под мобильными устройствами (Managing Mobile Performance Optimization)
- Как улучшить ваше значение YSlow (How to Improve Your YSlow Score)
- Приоритизация ваших ресурсов с помощью rel='preload' (Prioritizing Your Resources with link rel='preload')
- Разбираемся с Веб Компонентами (Understanding Web Components)
- Как можно использовать адаптивные веб-компоненты уже сегодня (How You Can Use Responsive Web Components Today)
- Семь причин, по которым стоит использовать генератор статических сайтов (7 Reasons to Use a Static Site Generator)
- Семь причин, по которым НЕ стоит использовать генератор статических сайтов
- Про rel=noopener (About rel=noopener)
- how2: терминальный stackoverflow (how2: stackoverflow from the terminal)
- Практическое введение в Material Design Lite от Google (A Practical Introduction to Material Design Lite by Google)
- Новинки последней версии шаблонизатора Marko (What's New in Marko v3)
- Видеообзор новых возможностей WebStorm 2016.1: улучшенная поддержка ECMAScript 6 и TypeScript, CSS Custom Properties, Angular 2, отладка асинхронного client-side, JSON Schema и многое другое
- Эффектный веб:
- Еженедельная подборка красивых эффектов на CSS/SVG/JS #29
- Концепт перетекания активной подсветки полей ввода с помощью CSS/SVG
- Boom, Wham, Pow! Создание эмоциональной типографики для комиксов с помощью фильтров SVG
- Как создать анимированную интерактивную барабанную установку на SVG
- Впечатляющая реализация коробки с пластинками с помощью 3D движка на WebGL и Three.js.
CSS
- Переменные в CSS: зачем они нам?. Перевод стати CSS Variables: Why Should You Care? на frontender.info
- Оформление незагруженных изображений. Перевод статьи Styling Broken Images на css-live.ru
- Объяснение CSS свойства will-change и текущей поддержки браузера в блоге Джонатана Снука
- Создание отзывчивой сетки в 2016-м (Designing a Responsive Grid in 2016)
- Шрифты:
- Антипаттерн для веб-шрифтов: Data URI. Перевод статьи Web Font Anti-pattern: Data URIs там же
- Иконочные лигатуры с помощью псевдо-элементов и иконочных шрифтов (Ligature Icons via Pseudo Elements and Icon Fonts)
- Веб типографика поломана. И вот как мы можем это исправить. (Web typography is broken. Here’s how we can fix it)
- Задаем стили для текста в Zeplin (Defining text styles in Zeplin)
- CSS Flexbox вполне логичен (ну, почти) (CSS Flexbox Is Entirely Logical (Almost))
- Генерируемый пользователем контент в мире CSS методологий и привязки к классам (User Generated Content in a Classy World)
- Экспериментальная лаборатория от Jen Simmons: клевые демки с CSS лейаутами
- CSS Exclusions and Grid Layout
- Советы по работе с медиа-запросами (Managing Media Queries)
- PX, EM или REM Media Queries?
- Продвинутые CSS селекторы, о которых вы могли не знать, а если и слышали, то не использовали (Advanced CSS selectors you really may not have heard of — and if you have, you may not have used them)
- 8 советов по CSS, которые вы не будете ненавидеть (8 Tips to Write CSS You Won't Hate)
- Насчет :not и специфичности (On :not and Specificity)
- Как сделать всплывающие названия полей форм с HTML5 валидацией (How to Make Floating Input Labels With HTML5 Validation)
- Шаблоны содержания и отображения с помощью Expressive CSS (Content & Display Patterns with Expressive CSS)
- Градиенты с текстурой на чистом CSS (Textured Gradients in Pure CSS)
- Aleut.css — статический фреймворк на Sass, с идеями BEM, OOCSS и нацеленностью на производительность и масштабирование
- grd — компактный CSS-фреймворк для сеток на Flexbox
- Результаты масштабного опросника по CSS (The Results of The Ultimate CSS Survey)
JavaScript
- Декораторы в typescript: оружие против сложности или бесполезная «свистелка»?
- Подкаст RadioJs, Выпуск 37: semver, секрет привлекательности node.js, идёт ли Фронтенду деловой костюм, 5 шокирующих действий на которые пошли Custom Elements чтобы попасть в WebKit и другое
- Глубокие корни усталости от Javascript (The Deep Roots of Javascript Fatigue)
- Почему я пишу модули на чистом JavaScript (Why I Write Plain JavaScript Modules)
- JavaScript — это дисфункциональный язык программирования (JavaScript is a Dysfunctional Programming Language)
- Шесть способов, как забиндить ключевое слово this в JavaScript в React, ES6 и ES7 (6 Ways to Bind JavaScript’s this Keyword in React, ES6 & ES7)
- Три способа отобразить строку в обратном порядке в JavaScript (Three Ways to Reverse a String in JavaScript)
- Заметка в блоге разработчиков Ebay: Путь к следующему JavaScript (The Path to JavaScript Next)
- Разбор фрагмента JavaScript кода на Hacker News (The Single Piece of JavaScript on Hacker News)
- Введение в jQuery Deferred объекты (An Introduction to jQuery’s Deferred Objects)
- Быстрый совет: установка нескольких версий Node.js использование nvm (Quick Tip: Install Multiple Versions of Node.js using nvm)
- Футуристический движок для запуска тестов (ava — futuristic test runner)
- Все JS библиотеки должны быть написаны на TypeScript (All JS libraries should be authored in TypeScript)
- Douglas Crockford о проекте новом Seif (Douglas Crockford: The Seif Project)
- Несколько новых видео на канале Netflix UI Engineering: React.js для интерфейсов TV, Netflix JavaScript Talks — RxJS Version 5
- ES6/7:
- Стрелочные функции и bind()
- es6features.com: Изучаем основные возможности ES6 (Explore Top ES6 Features)
- Пожалуйста, перестаньте ссылаться на предложенные функции JS, как на ES7 (Please stop referring to proposed JavaScript features as ES7)
- Фреймворки:
- Создание иконочной системы на SVG c помощью React (Creating an SVG Icon System with React)
- Печальное состояние экосистемы Backbone (The Sad State of the Backbone Ecosystem)
- Leveling Up With React: React Router
- React Router & Webpack на продакшене
- Новый NPM, упрощающий разработку на React (New NPM will simplify React JavaScript development)
- Анимации с React, Redux, и d3 (Animating with React, Redux, and d3)
- Angular 2 и будущее HTML5 приложений (Angular 2 and the future of HTML5 apps)
- Гляди-ка, без сервера: разработка приложений с Angular 2 MockBackend (Look Ma, No Server: Developing Apps with Angular 2 MockBackend)
- Как работать с асинхронными данными в Firebase и Angular (Mastering asynchronous data in Firebase and Angular — Firecasts #5)
- Плагины:
- Force.js — плавная прокрутка и анимация страницы на ванильном JS (но с поддержкой jQuery)
- JsSpeechRecognizer — библиотека для распознования слов
- calendar-heatmap — создание тепловой карты, представляющей отрезки времени с данными в виде коммитов GitHub
- Substance — wysiwyg-библиотека для редактирования веб-контента
Браузеры
- Тестирование Firefox 46-beta и Firefox Developer Edition 47
- Developer Edition 47 – эмуляция User agent, popup debugging и многое другое
- Что нового в Chromium 49 и Opera 36
- Вкладки в Chrome для Android по умолчанию снова собраны воедино
- V8 версия 5.0 (V8 Release 5.0)
- Mozilla готовит к запуску браузерный движок нового поколения Servo
- Для браузера Microsoft Edge появились первые три расширения
Сайты с интересным дизайном и функциональностью
- Интерактивная веб-инсталляция на тему освоения космоса.
- printedbysomerset.com — концептуальный сайт с «картонным дизайном» и фотореалистичной спрайтовой анимацией
- nuuneoi.com — крутое портфолио, реализованное в стиле старой восьмибитной игры
- Вертикальный скролл-сайт с качественным параллакс-эффектом
- thedabney.com — скролл-сайт с минимилистичным дизайном и интересными эффектами перехода
- Впечатляющие сайты веб-дизайнерских агенств (40 Impressive Design Agency Websites)
Дизайн
- Как можно использовать Github для совместной работы над дизайном
- «Студия Лебедева» проиллюстрировала рабочий процесс ювелирного завода идеально зацикленными коубами
- Дизайн каждого сайта на Bootstrape-е (Hey Look, It's Every Bootstrap Website Ever)
- В защиту однородного дизайна (In Defense of Homogeneous Design)
- Восемь неинтуитивных уроков, полученных в роли дизайнера (8 Unintuitive Lessons on Being a Designer)
- Что если дети презентуют ваши идеи? (What if kids presented your ideas?)
- Шесть вдохновляющих примеров использования игрового дизайна (6 Inspiring Examples of Gamification in Design)
- Коллекция графических интерпретаций букв латинского алфавита и цифр (Letter Kit)
- Mackey Saturday — дизайнер, создавший логотип Инстаграмма (Mackey Saturday)
- Инструменты и графические редакторы:
- 10 очень особенных и полезных трюков в Sketch
- Коллекция лучших инструментов дизайнера
- Возможности прототипирования в Sketch через Silver Flows
- 6 обязательных книг о Photoshop на русском для новичков и профессионалов
- Глобальная замена цвета в Sketch (Global color replacement in Sketch)
- Framer & Sketch: настроенный процесс (Framer & Sketch: An Intentional Workflow)
- Первомайская перезагрузка для перезапуска сайтов и портфолио веб-дизайнеров
- Adobe выпустил Experience Design CC (Adobe launches Experience Design CC)
- Превью-релиз Adobe Experience Design CC (Project Comet)
- Первые впечатления от Adobe Experience дизайн (First impressions with Adobe Experience Design)
- Что такое Adobe XD (или ‘Проект Comet’) и зачем он вам? (What is Adobe XD (or ‘Project Comet’)? And Should You Care?)
- Скоро появится версия Affinity для Windows (Affinity is coming to Windows)
- Типографика:
- Крутая кинетическая типографика
- Системные шрифты могут быть красивыми. Веб-шрифты — это не требование для замечательной типографики
- UX/UI:
- Главный инструмент у каждого UX-эксперта
- Терминология в области UX (User Experience Design & Research Jargons)
- UXD и исследование жаргонов (User Experience Design & Research Jargons)
- Свет и тьма в UI дизайне. Вопрос выбора (Light and Darkness in UI Design. Matter of Choice.)
- 7 методов как измерять UX вашего сайта (7 Ways to Measure Your Website’s UX)
- Уроки:
- Подробный урок по дизайну приложения под iOS в Sketch: Часть 3 из 3
- Заливка текста с помощью Craft в Sketch
- Выравнивание цвета кожи в Adobe Photoshop
- Новое небо для лучшего вида в Adobe Photoshop
- Текст с эффектом яркого пластика в Adobe Illustrator
- Создание иллюстрации маяка в Adobe Illustrator (Create a lighthouse in Adobe Illustrator)
- Как рисовать реалистичную кожу в Adobe Photoshop (How to Paint Realistic Skin in Adobe Photoshop)
- Как сделать винтажный постер на тему путешествий в Adobe Illustrator и Photoshop (How to Design a Vintage Travel Poster in Adobe Illustrator and Photoshop)
Подборка бесплатных дизайнерских печенек
- Бесплатный вектор для дизайна о животных
- Мокапы для демонстрации дизайна визиток (130+ Free Business Card Mockup PSD Templates)
- Лучшие наборы UI (145+ Best Free UI Kits)
- Коллекция иконок кредиток (Collection of Credit Card Icons (Free Vectors))
- Набор гравюрных кистей для Adobe Illustrator (25 Free Linocut & Woodcut Brushes for Adobe Illustrator)
- Наборы кистей для Illustrator-а (20 High-Quality Free Illustrator Brush Sets)
- Набор кистей с отпечатками водяных красок (25 Free Watercolor Brush Sets for Skilled Digital Artists)
- Набор UI для мобильных приложений Avital (Avital Mobile UI Kit)
- halogen — индустриальный шрифт без засечек (download halogen — free industrial font)
- Набор иконок на тему космоса и астрономии (AI, Sketch, SVG, PNG) (Freebie: Astronomy & Space Icons (AI, Sketch, SVG, PNG))
- Набор иконок-аватарок пользователей (16 Free Vector Icons For User Avatars)
- Набор иконок с плоским дизайном на тему инструментов в графическом дизайне (Flat Line Graphic Design Tools Icon Set Freebie)
- Набор кофейных иконок (EPS, PNG, SVG) (Freebie: Barista And Coffee Lovers Icon Set (50 Icons, EPS, PNG, SVG))
- Свежие бесплатные иконки для вашего дизайна
Новости
- Twitter: Алгоритмическая лента новостей теперь активирована по умолчанию, закрывается приложение TweetDeck для Windows, опровергают намерение увеличить количество символов в твитах
- Youtube запускает Accelerator – возможность мгновенного просмотра закэшированного видео
- Alphabet планирует продать Boston Dynamics из-за неспособности последней создать коммерческие продукты в ближайшие несколько лет
- Google назвал 100 самых популярных и безопасных веб-ресурсов
- Google объявил об изменении UserAgent поискового робота для смартфонов
- Учёные из Стэнфорда создали программу, которая переносит ваше выражение лица на других людей
- Свершилось! Microsoft начала обновление Lumia до Windows 10 Mobile
- СМИ: Uber заказал у Daimler 100 тысяч Mercedes S-Class
- SoundCloud заключил сделку с одним из крупнейших мировых издателей Sony Music
- Для Wikipedia будет разработан синтезатор речи
Занимательное
- Опыт BBC, KIA и Unilever в применении искусственного интеллекта
- В кванты могут все
- Индустрия порока: как секс, наркотики и рок-н-ролл создают новые большие технологические компании
- О бедном биткоин замолвите слово
- Двое из трех разработчиков самостоятельно научились программированию — исследование Stack Overflow
- Как мы вышли на ThemeForest и начали зарабатывать на шаблонах для сайтов
- Всё о версиях Windows 10 — что такое Threshold1, Threshold2 и Redstone
- Компьютер научился вычислять «пьяные» твиты
- Кому поля не жмут. Десять занимательных и поучительных историй о Великой теореме Ферма
- Квантовая азбука: «Компьютер». Чем сильны квантовые компьютеры и могут ли они заменить обычные?
- Хранители: Что наши гаджеты уже знают о нас?
- Самые масштабные «проделки» Anonymous
- Apple против ФБР: ответный удар 2
- Стив Возняк высказался о конфликте Apple с ФБР
- «Нейросети можно не объяснять правила игры в го — она сама их выучит» Интервью разработчика искусственного интеллекта «Яндекса» Александра Крайнова
- Офисные кандалы: Почему люди на самом деле ненавидят свою работу
- Метроном средствами ванильного Google
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group