Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
| Веб-разработка |
| CSS |
| Javascript |
| Браузеры |
| Дизайн |
| Новости |
| Занимательное |
Веб-разработка
Цена использования фреймворков- Вёрстка писем: 60 полезных ресурсов, руководств и исследований
- WebGL для всех
- Создание веб-сайта. Курс молодого бойца
- Инструмент проверки микроразметки Google теперь показывает ошибки AMP-страниц
- Объясняем про GSP-формат: как добавить видео из YouTube в письмо?
Отзывчивые изображения уже появились в ядре WP (Responsive Images Now Landed In WordPress Core)- Почему ваши изображения не используют Chroma-Subsampling? (Why aren’t your Images using Chroma-Subsampling?)
- Начинаем работать с прогрессивными веб-приложениями (Getting started with Progressive Web Apps)
- Reimagining Single-Page Applications With Progressive Enhancement
- О поддержке SVG в письмах (A Guide for SVG Support in Email)
- Жизненное руководству по HTML5 собеседованию (The Vital Guide to HTML5 Interviewing)
- Что было на вершине GitHub-а в 2015-м (What topped the GitHub charts in 2015)
- Stackoverflow 2015 Developer Survey
- Как работает Веб: Часть 1, для новичков, часть 2: модель клиент-сервер и структура веб-приложений (How the Web Works)
- Front-end инструменты: некоторые из моих находок в 2015 (Front-end Tools: Some of My Favorite Finds of 2015)
- Совмещаем программирование и преподавание в одной карьере (Combining coding and teaching into a career)
- Service Workers:
- Beyond Offline. 7 рецептов по использованию Service Workers от разработчиков Mozilla
- Оптимизация загрузки SVG с помощью Service Worker (Optimising SVG load with Service Worker)
- Начинаем работать с инструментарием Service Worker (Getting started with the Service Worker Toolbox)
- Эффектный веб:
- Еженедельная подборка красивых эффектов на CSS/SVG/JS #18
- Большой обзор красивых многоуровневых меню с codepen
- Эффектный индикатор прогресса скроллинга страницы (Reading Progress Indicator)
CSS
- Классный CSS: подход к таблицам стилей Sass как к программе
- Методология CSS-модулей
- Флексбоксы прощаются с экспериментальным статусом
- Выбираем между min-width и max-width в медиа-запросах (Choosing between min-width and max-width media queries)
- Как создать гибкие шаблоны с помощью Susy и Breakpoint (How to create flexible layouts with Susy and Breakpoint)
- Expressive CSS — очередной статический фреймворк
- A Responsive Guide to Type Sizing
- Шаблоны использования flexbox c кодом и примерами
- Less. Путеводитель для новичков
- Странная работа свойства `flex-grow` (`flex-grow` is weird. Or is it?)
- О Flexbox Grid в Foundation 6
JavaScript
- Мысли вслух о TypeScript
- Как на самом деле будет выглядеть рынок JavaScript в 2016 году
- Упрощенный жаргон JS (Simplified JavaScript Jargon )
- Усталость от Javascript (Javascript Fatigue)
- JavaScript: обзор 2015-го года (JavaScript: 2015 in Review)
- JavaScript: объяснения простыми словами (JavaScript: Explained in Simple Words)
- Remy Sharp: Как должны работать табы (How Tabs Should Work)
- Фреймворки:
- Быстрый старт за 5 минут с Angular 2
- Angular 2 для разработчиков React
- Хватит стайлить компоненты React с помощью JS (Stop Styling React Components with Javascript)
- Создаем сборку Angular 2 с Gulp, TSLint и DefinitelyTyped
- ES6:
- ES6 Rest/Spread, Defaults and Destructuring
- ES2015 — некоторые особенности, которые вы будете всегда использовать (ES2015 — Some features you'll always use)
- Tree-shaking с webpack 2 и Babel 6 (Tree-shaking with webpack 2 and Babel 6)
- Радости замыкания с ES6 (The Joys of Block Scoping with ES6)
- bala.js — убийца jQuery в 400-с-мелочью символах кода *tutorial
- Sharer.js — создаем кастомные элементы для шаринга в социальных сетях
- Установка прошлых или будущих версий npm пакетов (Installing past or future versions of npm packages)
- Как Vorlon.js помогает улучшить ваш веб-код (How Vorlon.js Helps You Improve Your Web Code)
- RxJS прекрасен. Почему я перешел с него? (RxJS is great. So why have I moved on?)
Браузеры
- Браузерные войны: история противостояния Netscape, Internet Explorer, Mozilla Firefox и Google Chrome
- Push-уведомления в Firefox 44 и выше
- Тестирование Firefox 44-beta и Firefox Developer Edition 45
- В Firefox 45 появится WebExtensions, совместимый с Chrome интерфейс разработки дополнений
- В Firefox 45 появится поддержка временной установки неподписанных дополнений
- Developer Edition 45 – Animations, Memory Tools and More
- Google досрочно прекратит поддержку SHA-1 в Chrome
Сайты с интересным дизайном и функциональностью
- Самые посещаемые сайты РФ, США и КНР по версии Goldman Sachs
- Первый веб-сайт был запущен 25 лет назад
- qz.com/gift-guide — одностраничный горизонтально-вертикальный сайт
- cryptarismission.com — сайт со впечатляющими эффектами на canvas и псевдо-3d
- newdealdesign.com — сайт с необычным эффектом прогрузки
- Social Wars
Дизайн
- Собеседование на UX дизайнера
- Landing page. Что такое. Из чего состоит. Виды. Процесс работы
- Итоги года:
- 20 лучших концептов в стиле Material Design за 2015 год — выбор MaterialUp
- Оглянемся на дизайн 2016-го года (A Look Back at Design in 2016)
- Лучшие статьи по дизайну на Medium в 2015-м (Medium’s Best Design Writing of 2015)
- Лучшее в дизайне в 2015-м по версии Muzli (Muzli choices in the design world for 2015)
- Год в дизайне (The Year in Design)
- Обзор DN в 2015 (DN Overview of 2015)
- Обзор года от Pingdom (Year in Review)
- Лучшая и худшая айдентика 2015-го: часть I: наиболее выдающиеся, часть 2-я: обзор лучших (End of Year ListThe Best and Worst Identities of 2015)
- Графические редакторы:
- Как приложение Sketch вынудило Adobe улучшить Photoshop? (Has Sketch App Forced Adobe to Improve Photoshop?)
- Удобная IOS сетка для дизайна мобильных приложений в Sketch
- Copy & Paste Guides — Плагин для копирования и вставки гайдов
- Прототипирование в Marvel и Sketch: часть 2 из 2
- 5 способов продвинуться из туториалов в сторону профессионального дизайнера (5 ways to move from tutorials to pro designer)
- Практическое руководство по отзывчивому mobile-first дизайну (A Hands-On Guide to Mobile-First Responsive Design)
- 9 технических трендов, которые изменят веб-дизайн (9 tech trends that will change web design)
- Как тренировать человека: дизайн для более здоровых привычек (How to Train Your Human: Designing for Healthier Habits)
- Не ругайте Steve Harvey: плохой дизайн стал причиной фиаско на Мисс Вселенной (Don’t Blame Steve Harvey: Bad Design Caused the Miss Universe Fiasco)
- Исследование форм для создания персонажей Звездных войн: руководство для не-дизайнеров (Exploring Shapes to Create Star Wars Characters: A Guide for Non-Designers)
- Иллюстрации и графический дизайн для игры «Секрет Гитлера» (Secret Hitler Illustration & Graphic Design)
- Как я «вижу» в действительности (How I really ‘see’)
- О редизайне приложения Airtable для iPhone (Putting a Database in Everyone’s Pocket)
- Анимации интерфейса. Сила движения (Interface Animation. The Force of Motion)
- Невостребованный редизайн приложения: Yelp (An Unsolicited App Redesign: Yelp)
- Концепт редизайна Goodreads (Reimagining Goodreads)
- Чему виртуальная реальность может научить о UX (What VR Can Teach Us About UX)
- Искусство рукописи от Dina Rodriguez (The art of hand lettering by Dina Rodriguez)
- Как убедиться, что команда разработчиков понимает дизайн? (How do you ensure that the dev team understands the design?)
- Проект Comet от Adobe: чего ожидать от публичной беты в 2016-м (Adobe’s Project Comet: What to Expect from the 2016 Public Beta)
- История создания китайского шрифта (The long, incredibly tortuous, and fascinating process of creating a Chinese font)
- Уроки:
- Дизайн рождественских иконок в Sketch
- Применение текстуры к 3D-тексту в Adobe Photoshop
- Рассыпающийся 3D-текст в Adobe Illustrator
Подборка бесплатных дизайнерских печенек
- Книга: руководство по созданию вайрфреймов (для дизайнеров, ПМ-ов, инженеров и других) (Free Ebook: The Guide to Wireframing)
- Рождественские ресурсы для дизайнеров (Christmas Freebies for Designers)
- Векторные огни для вашего дизайна
- Векторная рождественская графика (15 Free Awesome Christmas Vectors for Your Design Toolkit)
- Цветные контурные иконки (SVG, PNG) (Freebie: Colored Line Icons (SVG, PNG))
- Иконки и графические элементы для новогоднего дизайна
- Набор рождественских контурных иконок с плоским дизайном (100 Free Christmas Icons in Flat and Line Styles)
- Лучшие 50 наборов иконок из 2015 (Top 50 Free Icon Sets from 2015)
- Сезонные иконки: зимнеяя тематика (Seasonal Icons: Winter Inspiration and Free Packages)
- Шрифты: полная коллекция для 2016-го (Free Fonts: Ultimate Collection for 2016)
- Ретро и винтажные шрифты (20 Free Retro and Vintage Fonts2)
Новости
- 451 по интернету: в HTTP появился новый статус для заблокированных властями сайтов
- SpaceX успешно посадила первую ступень Falcon 9
- Старый «КиноПоиск» останется основным ресурсом и поглотит новую версию в качестве раздела
- Google и Microsoft запустили Санта-трекеры, позволяющие детям исследовать мир
- По мнению Дастина Киркленда, косвенно Ubuntu использует более миллиарда человек
- Mozilla работает над планшетом, маршрутизатором, медиаприставкой и умной клавиатурой
- Google создаст «умный» мессенджер
- В YouTube появились интерактивные видео Spotlight Stories
- Microsoft купила сервис для внедрения в Skype «облачных» звонков
- Google запустил API для поиска по Сети знаний
- Facebook променяла Flash на HTML5
- Взломать загрузчик Linux можно нажатием одной кнопки 28 раз
Занимательное
- Суперкомпьютеры: тренды и проблемы развития по мнению бывшего инженера IEEE Rebooting Computing
- Соцсети и интернет: взгляд социолога
- Virtual Reality – пришло ли время?
- Экономика большого киберспорта: Перспективы, доходы игроков и бюджеты
- Boston Dynamics запрягла в рождественскую упряжку оленей-роботов
- 10 главных научных достижений 2015 года
- Coub назвал лучшие коубы 2015 года
- 10 главных видеоигр года
- Лучшие приложения 2015 года по мнению The Next Web
- На ошибках учатся: Провалившиеся проекты основателей Github, Youtube, Twitter, GoPro
- Идеальное ИТ-будущее. Бесплатная футурология без регистрации и СМС
- Самые резонансные хакерские атаки уходящего года
- Лучшие игры 2015 года
- Производственный процесс
- География пиратства: Африканский iTunes, бразильские видеоклубы и подпольный интернет на Кубе
- Жуткая сторона интернета вещей и умных домов
- «Всё грузится медленно, но я привык»: Китайцы и экспаты о жизни с самым закрытым интернетом в мире
- Что дарят своим сотрудникам на Новый год и Рождество российские и зарубежные компании
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Apathetic
>Как создать гибкие шаблоны с помощью Susy и Breakpoint
И снова не могу пройти мимо. Я пользовался этими инструментами и так и не понял, в чем их преимущество перед прочими инструментами.
Разберу. Вот взять Susy. Система, конечно прекрасная, но что в ней такого прям замечательного, что могло бы побудить меня, например, перейти на неё вместо Semantic.gs, которому уже четыре года, но который до сих пор прекрасен, (с небольшими доработками и прикрученным флекс-боксом) актуален, и примерно в четырнадцать тысяч раз меньше?
Или Breakpoints — в какой-то момент ради этой библиотеки я даже раздумывал, не вернуться ли (опять) к SASS. Но, знаете, я охренел от того, насколько не сочетается функционал библиотеки (две с половиной возможности, не считая передачи контекста — этим вообще хоть кто-то пользуется?) с её размером. Не претендуя на хоть какое-нибудь качество кода я за полчаса накалякал на коленке миксин на LESS, который делает ровно то же самое (не считая, да, передачи контекста).
Что это за гигантизм?
derSmoll
Примерно те же мысли по поводу Susy