Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №69 (4 — 10 августа 2013)

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

Горячая семерка

livestyle.emmet.io

Встречаем Emmet LiveStyle — бета версию плагина нового поколения для двунаправленного редактирования CSS от Сергея Чикуенка, плюс Обзор LiveStyle на smashingmagazine (восторженные комментарии included)

Адаптивный дизайн

Статья о том, как Как тестировать адаптивный дизайн не тратясь на платные инструменты , а также небольшая подборка уроков

WebGL

WebGL продолжает развиваться, демонстрируя все большие возможности. Вот некоторые из них: 3d эффекты на страницах , рендер более миллиона частиц, и напоследок, действительно впечатляющая демка, показывающая потенциал создания игр с помощью WebGL

Проблемы CSS

Перевод занимательной статьи о проблемах CSS, про которые обычно не вспоминают в учебниках по верстке. Часть 1, Часть 2

Firefox 23

На этой неделе состоялся Релиз Firefox 23. Кроме небольшого изменения в логотипе, релиз включил в себя довольно приличное количество улучшений и добавлений, среди которых долгожданный network monitor

Почему Angular.js рулит?

Этой объемной статьей от Jesus Rodriguez старается дать аргументированный ответ на вопрос

YotaPhone

Отечественный телефон с двумя экранами уже успел пошуметь на выставках электроники. Более подробно о самом устройстве и особенностях его разработки, а в частности об истории его создания можно почитать в в первом официальном Йотафон-посте на Хабре

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

• livestyle.emmet.io — бета версия плагина нового поколения для двунаправленного редактирования CSS , Обзор LiveStyle на smashingmagazine
• Prepros: open-source компилятор файлов для front-end разработки
• Исторический момент: теперь ссылка www.w3.org/TR/html/ ведет не на XHTML 1.0, как 13 лет до сих пор, а на HTML5.0 (via mattur/status)
• Использование Web Speech API для создания Voice Driven HTML5 Games
• SVG фильтры на тексте
• Как бесплатно потестировать адаптивный дизайн
• 20 CSS-уроков для адаптивного веб-дизайна
• Миграция на Bootstrap 3, Большие изменения в Twitter Bootstrap
• Управление загрузкой изображений
• Возможности хранения информации на клиентской стороне
• Изменение размеров изображения с помощью canvas
• Добавляем 3d эффекты используя WebGL
• «Простейший в мире HTML5 WISWIWYG редактор» для веб
• Новые фичи Adob Edge Animate CC

CSS

• Использование Animate.css
• Проблемы CSS: Часть 1, Часть 2
• CSS Animations Editor
• Горизонтальное и вертикальное центрирование в CSS с помощью absolute
• 6 методов центровки в CSS
• Десять селекторов, без которых вы не должны кодить
• Autoprefixer — постпроцессор для добавления вендорных префиксов
• Различные эффекты для наведения на пункты меню
• Language-wide Features in CSS
• Официальная шпаргалка по emmet
• Избавление от нижнего отступа при создании модулей
• Адаптивная навигация в стиле Facebook
• Sass mixin for offsets
• Мини-галерея в виде анимированного кубика на CSS3 и объяснение того, как он создавался

JavaScripts

• Понимание ООП на джаваскрипте (ES5), часть 2
• dalekjs — автоматическое кроссбраузерное тестирование с помощью JavaScript
• Почему Angular.js так крут?
• Основы использования UI-роутера с AngularJS
• Как рисовать многоугольники в canvas
• Backbone.js — советы и шаблоны
• Делаем модульный проект на JavaScript с помощью RequireJS
• TodoMVC 1.2 — новая версия, классическое мини-приложение на основных MVC фреймворках
• Создание jQuery плагина с Google Maps
• Плагины и библиотеки:
  
  • javascriptoo.com — большая коллекция библиотек и скриптов, отсортированных по категориям
  • Библиотеки для создания графиков
  • Sticky-Kit — плагин jQuery для создания прилипающих к верхней либо нижней части экрана элементов
  • tidyTime.js — отображаем время по человечески
  • Yadcf — фильтрация данных в колонках таблиц
  • formFive — полифил для более полной поддержки форм
  • git-html5.js — pure Javascript git implementation for your browser
  • JointJS — библиотека для создания диаграмм
  • gradientmaps.js — внедрение фотошоповского эффекта Gradient Map в веб
  • viewportSize поможет получить ширину и высоту CSS viewport используя JavaScript.
  • HTML(.js) — еще один вариант улучшения работы с DOM

Браузеры

• Браузер Chrome подружится с сенсорными экранами
• Релиз Firefox 23 (+офф. список изменений)
• Браузерная консоль в Firefox
• Прикоснитесь к Internet Explorer 2
• Плагин для Firefox стирает «отпечатки пальцев» браузера
• Первый релиз на канале Opera Developer
• Пароли, сохранённые в Google Crome, может увидеть кто угодно!

Новости

• Мобильные рынки: Более 40% активных Android-устройств используют версию Jelly Bean, Android и iOS опять делят рынок, Android захватил рынок планшетов на фоне спада продаж iPad
• Apple разрабатывает аудиогиперссылки
• Первые жертвы закона №187 — Турбофильм и Рутор
• Основатели YouTube сделали приложение-конкурента Instagram и Vine
• Пользователи YouTube, у которых больше 100 подписчиков, смогут проводить онлайн-трансляции
• В Twitter установлен новый мировой рекорд
• Телевидение впервые уступило интернету лидерство в США
• Android Device Manager поможет найти ваш смартфон, Google начала внедрение функции Android Device Manager
• Canonical официально сравнила Ubuntu Edge с Apple iPhone 5 и Samsung Galaxy S4
• Google запустил мобильное приложение рекламной системы AdSense
• Фотосайт 500px добавил красок поисковику Microsoft
• Популярный сервис Instagram добавил интеграцию с «ВКонтакте»

Сервисы

• Mikey сортирует почту в Gmail так, как должен был сделать Google
• snapnote.io — сервис для создания изображений с комментариями
• mockuphone.com — создание изображения мобильного устройства, с размещенным на нем, подготовленным вами изображением
• 20 полезных SEO-инструментов

Демо

• Более миллиона частиц рендерятся в WebGL
• Почему HTML5 это здорово
• Крутейшие возможности для создания игр в WebGL
• Возможности CSS3:
  
  • pure css3 Gran Turismo
  • CSS3-анимация и бесконечные коты
  • Запуск бумажного самолетика на CSS3 (кликнуть Send it)
  • Бесконечное погружение вглубь изображения на CSS3

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

• NASA запустило первый русскоязычный сайт
• Подборка минималистичных сайтов
• hellohikimori.com — стильное портфолио с фоновым аудио и видео
• cropp.com — сайт для любителей пиксельной графики, параллаксов и трендового дизайна
• tour.kathart.dk — веселый сайт креативной студии с огромным количеством картинок и увлекающим видео-эффектом
• joe-san.com — сайт видео-клип

Дизайн

• Yahoo покажет новый логотип 5 сентября, Yahoo! представит тридцать новых логотипов
• Эволюция интерфейсов WordPress за 10 лет
• История создания «социального портрета»
• Прекрасная типографика в веб-дизайне
• Произносим названия европейских шрифтов правильно
• Курс «основы дизайна» от codeschool
• Как сохранить привлекательность адаптивного дизайна
• Объяснение разницы между adaptive и responsive-дизайном
• Концепт дизайна iPhone 6
• Создание объемной винтажной типографики с помощью: Illustrator, Cinema 4D, Photoshop
• Первоклассные логотипы ресторанов
• Примеры набирающего обороты плоского дизайна
• Вебдизайны туристических сайтов
• Полсотни забавных 404-х страниц

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

• Исходник PSD «Perspective App Screen Mock-Up 5»
• Исходники PSD винтажных логотипов
• Набор векторных изображений посвященных дню Рождения!
• Большой набор исходников визиток
• Type & Grids: Free Responsive HTML5 Template
• Паттерны: ретро-паттерны
• Иконки: Бесплатные объемные и красочные иконки, две с половиной сотни иконок знаменитейших памятников и знаменитых сооружений, с длинными тенями
• Шрифты: PHANTOM — шрифт без засечек, Look Up — декоративный, состоящий из стрелок, Parley — декоративный шрифт для заголовков, PW Small Icons — иконочный шрифт для создания скетчей
• Collection of Free Fonts and Typefaces for August 2013

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

• Как музыка влияет на продуктивность
• Отечественный телефон с двумя экранами: история разработки
• Нестандартные дисплеи: Обзор Leap Motion , Воду превратили в сенсорный дисплей (видео)
• Nokia поддела iPhone 5 в своей рекламе (видео)
• Влияние интернет-пиратства на музыкальную индустрию
• Wargaming: 15 лет на передовой
• Оружие будущего: боевые роботы и дроны
• Солнечные батареи: как это работает
• История создания лунного ровера
• 12 вещей, которые сделают с вами Apple, Twitter и Yahoo после устройства на работу
• ТОП-10 самых дорогих сообществ «ВКонтакте» по цене за пост
• Галерея произведений, созданных разработчиками в свободное от дебага время
• Что происходит в интернете за одну секунду
• Напечатанные на 3D-принтере дроны займутся борьбой с наркомафией
• Как новый интерфейс Gmail влияет на пользователей
• Космос: Япония отправила на МКС говорящего робота, Красная миссия: бронируем билеты на Марс
• Воронежец заключил с банком договор, внеся свои правки, и собирается отсудить 24 миллиона рублей

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