Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №92 (12 — 18 января 2014)

Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости

Веб Разработка

• Gulp — как глоток свежего воздуха после Grunt
• RAD-js — Фреймворк для быстрого построения мобильных приложений
• Фронтенд Средиземья: часть первая (перевод)
• Первый взгляд на Web Хранилище в HTML5
• ID не сделают ваш документ более семантическим
• Блоки — как кирпичики, бандлы — как дома. Просто о БЭМ и bem-tools, теперь и на русском
• Отдел вёрстки с нуля — видео с докладом о стратегии и тактики создания слаженных команд, а так же организации процессов совместной разработки
• Компилятор Sass запустили в браузере
• pngquant — библиотека и утилита командной строки для сжатия png с потерями
• Сравнение 18 программ по оптимизации изображений
• Разрушение мифов: CSS Animations vs. JavaScript
• Ломаем миф о разрушении мифа на тему сравнения работы анимации в CSS и JavaScript
• Пуленепробиваемые доступные иконочные шрифты
• Как создать веб-шрифт используя код
• 5 лучших веб инструментов по мнению «элитных» авторов с Themeforest
• Понятие «PSD to HTML» умерло
• Когда стоит использовать target=”_blank”
• Синтаксис против смысла
• Подход к дизайну веб контента может измениться
• Фрагментация Andorid: продолжающаяся история
• Принимаем голосовой ввод данных в HTML5 формах
• 10 тэгов HTML, которые вы, возможно, не используете
• За пределами Bootstrap и Foundation: фреймворки, о которых вы никогда не слышали
• Руководство для начинающих по использованию Grunt с Magento
• Десять простых и легких способов уменшить вес страницы
• Небольшая одержимость скоростью загрузки страницы
• Делаем веб слаще с Food Network и пирожным
• Book Preview — клевый эффект для создания превью книг

CSS

• Трюки с CSS-анимациями: мгновенные изменения, отрицательные задержки, анимация transform-origin и другоеперевод
• hover.css: анимация для ваших кнопок
• CSS Level 4 и еще: чего ожидать в 2014м
• Bootstrap-Sass: официальный порт Bootstrap на Sass
• Введение в CSS 3D transforms
• Выборка по юзер-агенту с помощью CSS
• Перезапуск CSS анимации
• Адаптируйте ваши стили не только к размерам экрана, но и к уровню освещенности окружения
• По следам статьи о достижении производительности 60fps для скроллинга
• Комментарий одной строки (//) в CSS
• И опять про вертикальное центрирование с помощью CSS
• Вертикальное выравнивание с помощью CSS с помощью 3-х строк кода (IE9+)
• 6 причин, по которым я люблю Sass
• Эффект набора печатного текста с помощью CSS
• Анимация CSS Shapes с помощью CSS Animations & Transitions
• Делаем CSS-сетку с помощью calc()
• Базовое введение в переменные в CSS, которые уже доступны в webkit-браузерах
• Что не в порядке с CSS Box Model, и как это исправить (спойлер: конечно же использовать box-sizing: border-box)
• Входы и выходы из CSS сеток

JavaScripts

• Быстрая настройка и простая поддержка NodeJS приложения
• Перевод книги Эдди Османи «Паттерны для масштабируемых JavaScript-приложений»
• Будущее JavaScript MVC фреймворков (перевод)
• О создании улучшенной JavaScript-библиотеки для работы с DOM
• Сode Сombat — Учитесь кодить на JavaScript играя в игру
• Итоги прошлого года и планы jQuery на 2014й, The jQuery Foundation и стандарты
• Планы на будущее для Node.js
• Эксперимент по портированию WebKit на JavaScript
• Еще 4 хака, которые сделают ваш JS быстрее, а также критика этой статьи
• Создание игры с голосованием по картинкам с помощью Node.js (часть 1)
• grasp — поиск, замена и рефакторинг JS кода, которые основаны на его структуре, а не на тексте
• О понятиях: Callbacks, Promises, Signals, Events
• Декларативная графика
• Что такое ненавязчивый JavaScript и почему он так важен?
• Responsive Javascript — что это такое?
• Урок: контекст или что такое «this» в JavaScript
• Инструмент для визуализации и экспериментов со связями между объектами в JavaScript
• Schema-inspector — механизм для обработки и валидации JS объектов
• Манипулируем css-классами используя classList API
• AngularJS не так плох
• Практическое руководство по директивам в AngularJS (часть 1), (часть 2)
• Ember.js — тестирование
• Основы работы с Kendo UI и MVVM
• JavaScript анимация которая работает (часть 1 из 4)
• node-jscs — проверка стиля кода
• iScroll был обновлен до 5-й версии

Веб-инструменты

• Обзор бесплатных сервисов для веб-разработки
• сервис для конвертации png, jpg, gif или svg в оптимизированный base64 код
• dploy.io — деплойте ваши приложения из GitHub, Bitbucket или своего репозитория на один из множества серверов

Новости

• Облачная платформа Яндекса. Cocaine
• Яндекс научился искать по Фейсбуку, а Фейсбук будет показывать популярные темы
• Google показал динамику популярности музыкальных направлений за последние 64 года
• Google покупает производителя умной бытовой техники Nest за $3,2 млрд
• Хищные вещи века, или Зачем Google купила Nest Labs?
• Как и для чего Google приобрела Nest?
• comScore: доля поисковых запросов к Bing за год выросла на 12%
• От 3 до 7. Украинский парламент жестко урегулировал весь интернет
• Google разрабатывает новый API Fitness для Android
• Когда и какой будет Windows 9
• Android 4.4 KitKat установлена лишь на 1,4% мобильных устройств
• Бойтесь гугловцев, дары приносящих!
• Radionomy подтвердила покупку Winamp и заявила о намерении выпустить новые приложения для iOS и Android
• Саша Грей может засудить Telegram за использование её образа
• АНБ внедряет «жучки» в компьютеры для секретной беспроводной передачи данных
• RoboEarth – проект по созданию единого «мозгового центра» для роботов
• IBM в 21-й раз подряд стала лидером по количеству полученных в США патентов
• Поиск по картинкам Google оповестит о правах на использование изображений, Google упростила поиск изображений с учетом условий лицензирования
• Vimeo увеличивает скорость своих видео и переходит на HTML5 по-умолчанию

Браузеры

• Выпуск web-браузера Chrome 32
• Вышел Google Chrome 32 для Android с поддержкой сжатия трафика
• Релиз web-браузера Rekonq 2.4.2, развиваемого проектом KDE
• В Chrome теперь можно быстро вычислять «кричащие» вкладки
• Chrome 33 Beta: кастомные элементы, Web Speech и кое-что
• Проблемы с нестандартными шрифтами в Chrome 32? Любуемся растущим тредом в багтрекере с множеством скриншотов

Сайты с интересным дизайном и функциональностью

• Делим сайты пополам
• Веб-дизайн в плоском варианте
• Подборка сайтов, посвященных дизайнерским конференциям
• lamoulade.com — креативный сайт креативной студии с необычной скролл-анимацией
• Подборка сайтов с креативной навигацией
• Сайты, в которых используется видео в качестве фона шапки (header-а)
• Два десятка игровых сайтов на HTML5
• Страница от Sony с клевым эффектом параллакса
• Geox Amphibiox — креативный промо-сайт от Geox
• Nitrocharge Your Game — промо-сайт от Adidas
• hugeinc.com — стильный дизайн скролл-слайдов

Дизайн

• Как улучшить мобильную версию сайта. Рекомендации и видеосоветы
• Проектирование графического интерфейса пользователяиз песочницы
• Галочки — проект дизайн бюро Артема Горбунова
• Создаем реалистичные тени в Photoshop CC
• Сайты, на которых легко дышится
• Вдохновляющие примеры использования свободного пространства в веб-дизайне
• О современной масштабируемой веб-типографике
• Тренды веб-дизайна в 2014
• Семь трендов веб-дизайна которые вы увидите в этом году (и как пережить эти перемены)
• 2014 выглядит много-обещающим для профессиональных дизайнеров, и вот почему (инфографика)
• Вдохновляемся прекрасным дизайном упаковок и этикеток
• Чем Tublr привлекает новых пользователей
• Довольно старая, но занимательная презентация: Китайские паттерны веб-дизайн: как и почему они отличаются от традиционных (Chui Chui Tan)
• Обновление Adobe Creative Cloud:
  Adobe выпустит крупное обновление Creative Cloud
  Официальный пост о нововведениях в Creative Cloud: Adobe Creative Cloud — платформа для инноваций
  В Adobe Photoshop CC добавлен инструмент работы с перспективой
• Экспериментирование в залинкованными Smart Objects представленными в Photoshop CC
• Очередная версия редизайна посадочного талона
• Преобразовываем PSD: фото-реалистичный дизайн превращается в плоский с помощью skeuomorphism.it (плагина к Photoshop)
• Мерзкие иконки
• Фотореалистичные иконки для вдохновения
• Логотипы в которых используется изображение конверта
• Cutting Edge Logos — подстриженные логотипы
• Типографика:
  Создание типографики с фоновыми текстурами в Photoshop

  Более современная шкала для веб-типографики

  Проекты посвященные каллиграфии и типографике

  Десять самых популярных шрифтов 2013 по версии Jeremiah Shoaf

Подборка бесплатных дизайнерских печенек

• Дискретные и узорчатые кисти для иллюстратора
• Десятка лучших мест где можно будет найти бесплатные материалы в 2014
• Плоские мокапы Apple-устройств
• Пять ретро-бейджиков (PSD)
• Упаковка с перфорированными текстурами
• The Amazing Pattern Library — сборник узоров
• Иконки:
  Бесплатные ретро-иконки
  2,800 бесплатных иконок в формате PNG, лицензия предполагает размещение ссылки на авторский сайт
  Наборы с иконками выполненными в стиле минимализм
  Более десятка наборов с социальными иконками
  Шесть десятков плоских и круглых иконок посвщенных досугу
  Около пятидесяти контурных иконок
• Шрифты:
  Подборка кириллических шрифтов
  Пятничные шрифты #6: от Fenix до Regular Dense
  Девять декоративных и стильных шрифтов: от Fat до Nougat
  Homizio Nova — лаконичный шрифт без засечек
  Bebas Neue — шрифт без засечек от Ryoichi Tsunekawa
  Fancy Me — декоративный шрифт с засечками

Демо

• WebGL Эксперимент + Google Analytics + Leap Motion
• Дарт Вейдер с помощью CSS3-теней
• Глитч-эффект для текста с помощью CSS-анимации
• Windows 3.1 на JavaScript/HTML
• Подмена лица
• Демонстрация responsive дизайна

Занимательное

• По следам CES 2014:
  
  • Назад в прошлое — CES за последние 30 лет
  • Странные гаджеты на CES-2014
  • Сказ о чипах: чему CES научила нас о технике, ПО и услугах
  • Итоги CES 2014: смартфоны
  • Итоги CES 2014: гаджеты и аксессуары
  • 5 худших анонсов выставки CES 2014

• Большое тестирование батареек
• Топ 20 событий 2013 года по версии Computerra
• 20 самых интересных онлайн-курсов в первом квартале 2014 года
• Марк Цукерберг, Jelly и монстр из ванной
• Skvone — первый антисмартфон
• BlackPhone — криптосмартфон, который нельзя прослушать
• Как зарабатывают геймеры: интервью с Na’vi — мировыми чемпионами из Украины
• Главные онлайн-платформы для студентов будущего
• Запускаем старые версии Windows в браузере
• Математика и программирование: нужны ли они друг другу?. А также Как математика помогает Яндексу зарабатывать?
• Google, “Яндекс” и агентства: что изменилось на рынках SEO и контекстной рекламы в 2013 году?
• 200 факторов, которые влияют на позицию сайта в выдаче Google (инфографика)
• Сколько длится мгновение ока?
• 100 секунд о Мариссе Энн Майер (директор поисковика Yahoo!)
• Смерть сетевого нейтралитета изменит интернет. И вашу жизнь тоже
• Job Interview of an Indian

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.

Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.