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

---

Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/news/117546

Ссылки в тексте:

[1] Веб-разработка: #webdev

[2] CSS: #css

[3] Javascript: #js

[4] Браузеры: #browser

[5] Дизайн: #design

[6] Новости: #news

[7] Занимательное: #intresting

[8] Готовим WebP правильно: https://habrahabr.ru/post/281124/

[9] Веб-стандарты. Выпуск №10 : https://soundcloud.com/web-standards/episode-10

[10] «Это мой код»: https://medium.com/@FelixIT/%D1%8D%D1%82%D0%BE-%D0%BC%D0%BE%D0%B9-%D0%BA%D0%BE%D0%B4-f993e0458e1e

[11] В сентябре 2016-го ожидается релиз HTML5.1: http://whatpixel.com/html51-expected-release-rc-2016/

[12] AMP by Example: https://ampbyexample.com/

[13] Список проектов, уже использующих AMP HTML: https://www.ampproject.org/who/

[14] Быстрый совет о том, как сделать инлайнинг стилей для AMP проще с помощью Jade или PHP: http://webdesign.tutsplus.com/tutorials/quick-tip-make-amps-inline-css-easier-with-jade-or-php--cms-26191

[15] Записи докладов с Microsoft Edge Web Summit 2016: https://channel9.msdn.com/Events/WebPlatformSummit/edgesummit2016

[16] Заметки Aaron Gustafson по итогам 2016 Edge Web Summit: https://www.aaron-gustafson.com/notebook/my-top-takeaways-from-the-edge-web-summit-2016/

[17] Знали ли вы, что у инстаграмма есть не только фото с едой, но и неплохой технический блог? Вот свежая заметка про использование и производительность : http://engineering.instagram.com/posts/193415561023919/performance-usage-at-instagram/

[18] Чеклист для подбора лучшего решения CDN : https://www.keycdn.com/blog/fastest-cdn/

[19] Начинаем работать с Browserify: https://scotch.io/tutorials/getting-started-with-browserify

[20] Семантика кастомных html элементов: https://www.paciellogroup.com/blog/2016/04/custom-element-semantics/

[21] Записывайте почти все в вашем браузере с помощью MediaRecorder API: https://hacks.mozilla.org/2016/04/record-almost-everything-in-the-browser-with-mediarecorder/

[22] Принципы создания сайта, доступного с клавиатуры: http://www.accessiq.org/news/features/2016/04/principles-of-the-keyboard-accessible-website

[23] Создание простых, доступных веб-форм: https://medium.com/net-magazine/create-simple-accessible-web-forms-535cd253dee2

[24] Быстрый совет: как правильно использовать элементы Figure и Figcaption: http://www.sitepoint.com/quick-tip-the-right-way-to-use-figure-and-figcaption-elements/

[25] Использование Foundation 6 с ASP.NET: http://developer.telerik.com/featured/using-foundation-6-asp-net-core/

[26] Процесс работы с SVG для создания доступных иконок: http://www.sitepoint.com/a-working-svg-workflow-for-accessible-icons/

[27] Создание стрелочек на SVG: http://thenewcode.com/1068/Making-Arrows-in-SVG

[28] Экспериментальное демо Angry Bots, игры на Unity, портированной на WebAssembly. : https://webassembly.github.io/demo/

[29] Еженедельная подборка красивых эффектов на CSS/SVG/JS #32: http://css-live.ru/cssjssvg-s-podvypodvertom/ezhenedelnaya-podborka-krasivyx-effektov-na-csssvgjs-32.html

[30] 4 мифа о PostCSS: https://habrahabr.ru/post/280988/

[31] PostCSS Mythbusting: Four PostCSS Myths Busted: http://www.sitepoint.com/postcss-mythbusting/

[32] Почти полное руководство по flexbox (без самих flexbox): https://habrahabr.ru/post/281254/

[33] Almost complete guide to flexbox (without flexbox): http://kyusuf.com/post/almost-complete-guide-to-flexbox-without-flexbox

[34] Автоматизация регрессионного тестирования CSS: http://prgssr.ru/development/avtomatizaciya-regressionnogo-testirovaniya-css-2016.html

[35] Automating CSS Regression Testing: https://css-tricks.com/automating-css-regression-testing/

[36] Основы CSS-селекторов на примере котиков: http://frontender.info/basic-css-selectors-explained-with-cats/

[37] Basic CSS Selector Syntax Explained Using Cats: https://robots.thoughtbot.com/basic-css-selectors-explained-with-cats

[38] Что такое CSS Modules и зачем они нужны?: https://css-tricks.com/css-modules-part-1-need/

[39] Что на самом деле такое “CSS хак”?: http://www.sitepoint.com/what-is-the-definition-of-a-css-hack/

[40] Модульный CSS c помощью React: https://medium.com/@pioul/modular-css-with-react-61638ae9ea3e

[41] Emoji: как пройти путь от U+1F355 к [иконке emoji, которую вырезает редактор хабра при публикации]: http://meowni.ca/posts/emoji-emoji-emoji/

[42] HTML/CSS: Z-axis Adventures: https://medium.freecodecamp.com/z-axis-html-css-z-index-layout-adventures-2419cefdc2ed

[43] Проблема с iOS Safari и shrink-to-fit: http://bitsofco.de/ios-safari-and-shrink-to-fit/

[44] 16 Unix-правил для CSS: https://blog.colepeters.com/the-16-unix-rules-of-css/

[45] Будущее CSS: https://medium.com/@jkymarsh/future-css-dbc2cb8f1baf

[46] Игры на «чистом CSS» (+html) c помощью Counter-Increment: http://una.im/css-games/

[47] Трансформации CSS и их перспектива: http://codepen.io/nicolasjengler/post/css-transforms-and-their-perspective

[48] Раскрасска SVG в фоновых изображениях CSS: http://codepen.io/noahblon/post/coloring-svgs-in-css-background-images

[49] Используете ли вы принцип единой ответственности?: http://snook.ca/archives/html_and_css/are-you-single

[50] Меняем курсор с помощью CSS для улучшенния UX (или забавы ради): https://css-tricks.com/using-css-cursors/

[51] Sass Me — визуализация функции SASS color: http://sassme.arc90.com/

[52] React v15.0 : https://facebook.github.io/react/blog/2016/04/07/react-v15.html

[53] Node v5.10.0 (стабильный): https://nodejs.org/en/blog/release/v5.10.0/

[54] Релиз Grunt 1.0.0: http://gruntjs.com/blog/2016-04-04-grunt-1.0.0-released

[55] Как я стал рок-звездой Javascript: https://medium.com/javascript-scene/how-i-became-a-javascript-rock-star-df03e00dd03b

[56] Использование веб-компонентов в ванильном JS: http://code.tutsplus.com/courses/use-web-components-in-vanilla-javascript

[57] Объяснение Debouncing и Throttling на примерах: https://css-tricks.com/debouncing-throttling-explained-examples/

[58] Оптимизация производительности JavaScript с Firefox Dev Tools: https://hacks.mozilla.org/2016/04/optimizing-javascript-performance-with-firefox-dev-tools/

[59] Шпаргалка по JavaScript-паттернам с примерами на jQuery: https://github.com/nnupoor/js_designpatterns

[60] Инструменты, позволяющие изучать JavaScript применяя его на практике: http://developer.telerik.com/featured/tools-learn-javascript/

[61] В защиту гипер-модульности JavaScript: https://medium.freecodecamp.com/in-defense-of-hyper-modular-javascript-33934c79e113

[62] Опрос по основной стратегии отладки в JavaScript: https://twitter.com/brianloveswords/status/717749353914490881

[63] Потоковые литералы шаблонов: https://jakearchibald.com/2016/streaming-template-literals/

[64] Четыре типа утечек памяти в JS и как от них избавиться: https://auth0.com/blog/2016/01/26/four-types-of-leaks-in-your-javascript-code-and-how-to-get-rid-of-them/

[65] Обзор модульных систем: CommonJS vs AMD vs ES2015: https://auth0.com/blog/2016/03/15/javascript-module-systems-showdown/

[66] Техники отладки Javascript: https://www.youtube.com/watch?v=3EXNtmgf87s

[67] 2 Javascript функции для ускорения верстки: http://glivera-team.github.io/javascript/2016/04/06/js-functions.html

[68] ES5 руководство по JavaScript: https://habrahabr.ru/post/281110/

[69] Прокси изнутри: http://css-live.ru/articles/es6-proksi-iznutri.html

[70] ES6 классы: http://jsraccoon.ru/es6-classes

[71] Новая возможность языка в ES2016: Array.prototype.includes: http://frontender.info/array-prototype-includes/

[72] Загрузка ES6 модулей: более сложна чем вы думаете: https://www.nczonline.net/blog/2016/04/es6-module-loading-more-complicated-than-you-think/

[73] Выжимка о ES6: http://kamranahmed.info/blog/2016/04/04/es6-in-depth/

[74] Angular 2 Beta, обучающий курс «Тур героев» часть 1: https://habrahabr.ru/post/281190/

[75] Добро пожаловать в мир React: http://jsraccoon.ru/react-intro

[76] Функциональный фронтенд с React: http://blog.scottlogic.com/2016/04/04/a-functional-front-end-with-react.html

[77] Улучшаем производительность React с помощью Babel: https://medium.com/doctolib-engineering/improve-react-performance-with-babel-16f1becfaa25

[78] Подборка ресурсов для изучения ReactJS: http://blog.debugme.eu/best-resources-to-learn-reactjs/

[79] Простая аутентификация с React и Auth0: https://davidwalsh.name/react-authentication

[80] Переезд на React на проекте с Rails и Angular: http://eatcodeplay.com/the-transition-to-react-in-rails-angular-app/

[81] Почему стоит рассмотреть использование React Native для мобильных приложений: https://www.smashingmagazine.com/2016/04/consider-react-native-mobile-app/

[82] После шести месяцев разработки мы запустили проект на Angular 2: http://m12.io/blog/we-launched-angular-2-project

[83] Лучшие ресурсы по изучению AngularJS за март 2016: https://medium.mybridge.co/top-10-resources-to-learn-angularjs-from-march-2016-fb2a7cba940e

[84] Angular 2 Style Guide: https://github.com/mgechev/angular2-style-guide

[85] Coloor —: http://krasimirtsonev.com/blog/article/lazy-load-your-images-with-coloor

[86] atrament.js: http://fiala.uk/atrament.js/demo/

[87] InlineTweet.js: http://ireade.github.io/inlinetweetjs/

[88] object-fit-images: https://github.com/bfred-it/object-fit-images

[89] glio.js — определяет, когда пользователь уводит мышь за сайта границы сайта: http://luisvinicius167.github.io/gliojs/

[90] EdgeHTML issue tracker: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/

[91] Microsoft Edge Web Summit 2016: Microsoft анонсировала RemoteEdge для Mac и Linux: http://microsoftportal.net/microsoft/7049-microsoft-edge-web-summit-2016-microsoft-anonsirovala-remoteedge-dlya-mac-i-linux.html

[92] Microsoft показала новые возможности для Microsoft Edge: http://microsoftportal.net/microsoft/7050-microsoft-pokazala-novye-vozmozhnosti-dlya-microsoft-edge.html

[93] Microsoft Edge будет разумно использовать флэш-контент для повышения производительности и экономии энергии: http://microsoftportal.net/windows-9/7060-microsoft-edge-budet-razumno-ispolzovat-flesh-kontent-dlya-povysheniya-proizvoditelnosti-i-ekonomii-energii.html

[94] Современная классика — браузер Vivaldi 1.0: https://habrahabr.ru/company/vivaldi/blog/281020/

[95] В Firefox переходит на Widevine CDM для воспроизведения защищённого DRM видео : http://www.opennet.ru/opennews/art.shtml?num=44207

[96] Пользователи устаревших ОС скоро начнут видеть сообщение о том, что Chrome перестанет обновляться: http://itc.ua/blogs/polzovateli-ustarevshih-os-skoro-nachnut-videt-soobshhenie-o-tom-chto-chrome-perestanet-obnovlyatsya/

[97] Тренды браузеров апрель 2016: взлет Samsung: http://www.sitepoint.com/browser-trends-april-2016-samsungs-surge/

[98] О том, что знает о вас любой браузер: http://webkay.robinlinus.com/

[99] bulldogyoga.com: http://www.bulldogyoga.com/

[100] nextrembrandt.com: https://www.nextrembrandt.com/

[101] Sweet Magnolia: http://www.sweetmagnoliagelato.com/

[102] airforce.com: https://www.airforce.com/

[103] bolden.nl: http://www.bolden.nl/

[104] madeinhaus.com: https://www.madeinhaus.com/

[105] Sex by numbers: http://sexbynumbers.wellcomecollection.org/

[106] GUIBENTO.COM: http://guibento.com/

[107] Дайджест продуктового дизайна, март 2016: https://habrahabr.ru/company/mailru/blog/280794/

[108] DPI, пиксели, Retina: Как устроены экраны устройств: https://vc.ru/p/dpi-ppi

[109] Сделать редизайн сайта и облажаться: 3 провала и как их можно было избежать: https://vc.ru/p/redesign-fail

[110] Пять анти-принципов хорошего дизайна: http://www.dejurka.ru/articless/5-anti-principles-of-good-design/

[111] Дизайнер Basecamp: «Мне нравятся уродливые интерфейсы»: https://vc.ru/p/ugly-interfaces

[112] Adobe Photoshop, Affinity Designer и Sketch 3 — отличное трио для дизайна интерфейсов: http://sketchapp.me/adobe-photoshop-affinity-designer-i-sketch-3%e2%80%8a-%e2%80%8a-otlichnoe-trio-dlya-dizajna-interfejsov/

[113] Framer и Sketch: продуманное прототипирование: http://sketchapp.me/framer-i-sketch-produmannoe-prototipirovanie/

[114] Как создавать цвета, типографику и макет для iOS: http://sketchapp.me/izuchenie-cvetov-tipografiki-i-principov-dizajna-pod-apple-ustrojstva/

[115] Простота — это хорошо: https://medium.com/ux-for-india/simple-is-good-874378ccc4d2

[116] Что такое микровзаимодействие: http://microinteractions.com/what-is-a-microinteraction/

[117] Почему я люблю уродливые, грязные интерфейсы — и вы, возможно, тоже.: https://m.signalvnoise.com/why-i-love-ugly-messy-interfaces-and-you-probably-do-too-edff4a896a83

[118] Space — новая концепция дизайна от Google: http://www.google.com/design/spec-space/space/new-dimension.html

[119] Как сделать дизайн в стиле Болливуда на тему Нового года Hindu: http://design.tutsplus.com/tutorials/how-to-design-a-bollywood-inspired-poster-to-celebrate-hindu-new-year--cms-26217

[120] Художники мира: Индонезия: http://design.tutsplus.com/articles/international-artist-feature-indonesia--cms-26008

[121] Проходит ли Ваш сайт «сотовый» тест?: https://blog.prototypr.io/does-your-site-past-the-honeycomb-test-85560155af20

[122] Коллекция лучших сообщений пользователям: http://www.goodemailcopy.com/

[123] Простите за прокол пузырька вашего чата: https://medium.com/chris-messina/sorry-to-burst-your-chat-bubble-ae4dc6952447

[124] Руководство для начинающих по UX прототипированию: https://medium.com/@WebdesignerDepot/the-beginner-s-guide-to-ux-prototyping-a22afb58018d

[125] Простое руководство по выбору цветовой палитры: https://www.smashingmagazine.com/2016/04/web-developer-guide-color/

[126] Как использовать Adobe Fuse: http://design.tutsplus.com/articles/how-to-use-adobe-fuse--cms-26108

[127] Sketch, Illustrator или Fireworks? Открываем новое приложение для дизайна UI: Gravit: https://www.smashingmagazine.com/2016/04/exploring-a-new-illustration-ui-design-app-gravit/

[128] Соляризовать как Zayn: цифровой эффект сюрреалистичных черно-белых портретов: http://photography.tutsplus.com/tutorials/solarized-like-zayn-the-digital-sabattier-effect-for-surreal-black-and-white-portraits--cms-26309

[129] Triangulart: http://maxwellito.github.io/triangulart/

[130] Детали типографики отобранных сайтов Typewolf за март 2016: https://www.typewolf.com/blog/favorite-sites-of-march-2016

[131] Представлены финалисты конкурса логотипа для олимпийских игр Tokyo 2020: http://www.dezeen.com/2016/04/08/logo-designs-unveiled-tokyo-2020-olympics-graphics-news-japan/

[132] Новый логотип и айдентика для для Natsuki от Erretres: Moon Shot: http://www.underconsideration.com/brandnew/archives/new_logo_and_identity_for_natsuki_by_erretres.php

[133] HP представила «новый» логотип: https://medium.com/@WebdesignerDepot/hp-unveil-new-logo-1b1e1950f615

[134] Новый логотип HP, который никем еще не был использован: http://www.theverge.com/2016/4/5/11367248/hp-new-logo-spectre-13

[135] Музей логотипов: рисуем линию: https://medium.com/@FimJishwick/museum-logos-drawing-the-line-63d3f27cc8fa

[136] Текстуры бумаги: http://www.evolutionarydesigns.net/blog/2016/03/04/70-free-paper-textures/

[137] Бесплатные фотографии, которые будут хорошо смотреться в качестве фона: http://www.dejurka.ru/graphics/free-background-photos/

[138] Наборы изображений с абстрактными фонами: http://www.vandelaydesign.com/abstract-background-images/

[139] Голливудские сцены, превращенные в мокапы: https://hollywood.mockuuups.com/

[140] Крутые паттерны с птицами в главной роли: http://www.dejurka.ru/inspiration/cool-birds-patterns/

[141] Бесплатный вектор на тему мотоциклов: http://www.dejurka.ru/graphics/motocycle-vector-for-free/

[142] Свежие бесплатные mockup-файлы: http://www.dejurka.ru/graphics/fresh-free-mockups/

[143] Набор контурных иконок: Интернет вещей: http://spyrestudios.com/freebie-internet-of-things-icon-set/

[144] Набор шрифтов-монограмм: http://blogsizzle.com/fonts/free-monogram-fonts/

[145] Упаковка преимущественно декоративных шрифтов: https://www.dart-creations.com/web-design/freebies/16-free-fonts-bundle.html

[146] SpaceX Элона Маска впервые успешно посадила первую ступень Falcon 9 на плавучую платформу в океане: https://vc.ru/n/spacex-landing

[147] Доля Windows 10 приближается к 15%: более 270 млн пользователей по всему миру: http://www.3dnews.ru/930920/

[148] ФБР не может взломать iPhone 5s и более поздние модели: https://xakep.ru/2016/04/08/fbi-limited-tool/

[149] «ВКонтакте» и Warner Music Group заключили внесудебное соглашение об использовании музыкального контента: https://vc.ru/n/vk-warner

[150] Rovio терпит убытки: http://www.3dnews.ru/931172/

[151] Windows 10 Insider Preview Build 14316 с Bash on Ubuntu уже доступен: https://geektimes.ru/post/273960/

[152] Medium нацелился на успех WordPress, предложив новый способ управления сайтами: http://oddstyle.ru/wordpress-2/stati-wordpress/medium-nacelilsya-na-uspex-wordpress-predlozhiv-novyj-sposob-upravleniya-sajtami.html

[153] WSJ: Apple при Джобсе взламывала iPhone для властей США и заартачилась лишь в наши дни при Тиме Куке: https://roem.ru/08-04-2016/222084/iphone-for-teem/

[154] Почему умение программировать не спасет вашу работу: http://ain.ua/2016/04/04/641719

[155] Ну что, дописались, фантасты?!!: http://www.computerra.ru/144048/nu-chto-dopisalis-fantasty/

[156] Samsung тестирует сканеррадужной оболочки глаза для смартфонов: http://www.3dnews.ru/931220/#5707a6f4b4182e6c128b456b

[157] Фотогалерея: Где начинающие карьеру разработчики и дизайнеры живут в Кремниевой долине: https://vc.ru/p/sv-rent

[158] Нейросеть вместо фотошопа: http://www.computerra.ru/144090/image-colorization-by-neuronetwork/

[159] В MIT напечатали робота из твердых, гибких и жидких материалов одновременно: http://gagadget.com/science/21538-v-mit-napechatali-robota-iz-tverdyih-gibkih-i-zhidkih-materialov-odnovremenno/

[160] Энтузиаст подключил Chromecast к ламповому телевизору 1978 года: http://gagadget.com/21542-entuziast-podklyuchil-chromecast-k-lampovomu-televizoru-1978-goda/

[161] Дайджест за прошлую неделю: https://habrahabr.ru/company/zfort/blog/280788/

[162] dersmoll: http://habrahabr.ru/users/dersmoll/

[163] alekskorovin: http://habrahabr.ru/users/alekskorovin/

[164] Источник: https://habrahabr.ru/post/281308/

Нажмите здесь для печати.