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

---

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

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

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

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

[2] CSS: #css

[3] Javascript: #js

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

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

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

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

[8] Полный стек технологий БЭМ: https://www.youtube.com/watch?v=VsGl-xZtxFg&feature=youtu.be

[9] Весёлая консолька: http://css.yoksel.ru/funny-little-console/

[10] SVG-файлы изнутри и вывод векторных изображений на canvas «вручную» (ч.1): https://habrahabr.ru/company/nanofl/blog/276519/

[11] Способы генерации SVG-спрайтов на примере библиотеки svg-sprite: https://habrahabr.ru/post/276463/

[12] Искуссная работа с `feColorMatrix`: http://alistapart.com/article/finessing-fecolormatrix

[13] Использование SVG в вебе: https://hashnode.com/post/start-simple-using-svgs-on-web-cikiox3se00i9sf53929d4qet

[14] Баш скрипт для создания SVG спрайта из папки с SVG файлами: https://github.com/edenspiekermann/sprite.sh

[15] FontReaper: https://github.com/Vekseid/FontReaper

[16] Performance Weekly. Issue #1 : https://perfception.com/ru/2016/02/08/weekly/

[17] Как HTTP/2 изменяет веб: лучшие практики веб-производительности: https://blog.newrelic.com/2016/02/09/http2-best-practices-web-performance/

[18] Веб-произведительность: более двадцати экспертов делятся своими советами и ошибками: https://www.keycdn.com/blog/web-performance-advice/

[19] Веб-производительность топ 50-ти мировых блогов: http://royal.pingdom.com/2016/02/12/web-performance-of-the-worlds-top-50-blogs/

[20] Google AMP будут поддерживать платный доступ к контенту: http://www.searchengines.ru/news/archives/google_amp_budu.html

[21] Введение в AMP (Accelerated Mobile Pages): https://www.youtube.com/watch?v=lBTCB7yLs8Y

[22] Видеоформаты, поддерживаемые HTML5, сейчас доминируют в вебе: http://arc.applause.com/2016/01/28/html5-video-codec-usage/

[23] Why npm Scripts?: https://css-tricks.com/why-npm-scripts/

[24] Размышления о базах данных с тqочки зрения фронтенд разработки: http://nolanlawson.com/2016/02/08/how-to-think-about-databases/

[25] WebGL для всех: http://ipestov.com/webgl-for-all/

[26] Как написать расширение для синтаксической подсветки в Atom: http://www.sitepoint.com/how-to-write-a-syntax-highlighting-package-for-atom/

[27] Как использовать эффективно ARIA с HTML5: http://www.sitepoint.com/how-to-use-aria-effectively-with-html5/

[28] Урок для начинающих по Webpack: https://github.com/AriaFallah/WebpackTutorial/tree/master/part1

[29] HTML5 Validator — утилита для командной строки для проверки валидности статических HTML5 файлов: https://github.com/svenkreiss/html5validator

[30] Небольшая заметка об атрибутах alt=”” и title: https://www.paciellogroup.com/blog/2016/02/short-note-on-use-of-alt-and-the-title-attribute/

[31] Вверх и вниз по Web-стэку: https://medium.com/ben-and-dion/running-up-and-down-the-web-stack-2b11f9214477

[32] Как внести свой вклад в проект с открытым кодом на GitHub: https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github

[33] Система доступов в GitHub несовершенна: https://blog.devspace.io/github-s-permission-system-is-flawed-de8836d9e7cc

[34] git-blame-someone-else: https://github.com/jayphelps/git-blame-someone-else

[35] Я веб-разработчик и я застрял с самым простым приложением последние 10 дней: https://medium.com/@pistacchio/i-m-a-web-developer-and-i-ve-been-stuck-with-the-simplest-app-for-the-last-10-days-fb5c50917df

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

[37] Лучшие концепты UI, реализованные на CodePen: https://stories.uplabs.com/can-you-code-this-ui-concept-vol-2-9c9763269640

[38] Pure CSS TV Show Widget: http://codepen.io/jcoulterdesign/pen/dGwzqX/

[39] Работаем с переменными CSS с помощью JS: http://codepen.io/wesbos/pen/adQjoY?editors=0110

[40] Flex Box Editor: http://briandiehr.com/#/layout-editor?_k=knscom

[41] Как я использую Sass с Polymer?: https://www.youtube.com/watch?v=xA2hxpGS7yw&feature=youtu.be

[42] Orna4Node: http://ornaorg.github.io/Orna4Node.html

[43] Как улучшали CSS на bet365: http://bet365techblog.com/improving-css-at-bet365

[44] Почему DockYard перешел на PostCSS: https://dockyard.com/blog/2016/02/11/transition-to-postcss

[45] Техника Fab Four для создания отзывчивых писем без Media Queries: https://medium.com/@hteumeuleu/the-fab-four-technique-to-create-responsive-emails-without-media-queries-baf11fdfa848

[46] Почему я люблю писать CSS в Visual Studio Code: http://generatedcontent.org/post/139138022310/why-i-love-visual-studio-code-for-css-html

[47] Subgrids thinking out loud: http://blogs.igalia.com/mrego/2016/02/12/subgrids-thinking-out-loud/

[48] PostCSS: http://postcss.org/

[49] Sass: The @extend Directive: http://vanseodesign.com/css/sass-the-extend-directive/

[50] Подходит ли вам Sass: http://developer.telerik.com/topics/is-sass-right-for-your-css/

[51] Async CSS w/ link[rel=preload]: http://filamentgroup.github.io/loadCSS/test/preload.html

[52] Будущее загрузки CSS: https://jakearchibald.com/2016/link-in-body/

[53] Как я тестирую CSS: https://spin.atomicobject.com/2016/02/09/css-testing/

[54] Введение в PostCSS: http://www.sitepoint.com/an-introduction-to-postcss/

[55] Уроки по CSS на самоклейках: https://medium.com/@baddrawings/16-css-lessons-via-post-it-notes-103d64809e7

[56] Pixel Art в CSS: http://pixelart-to-css-react.herokuapp.com/

[57] Релиз Babel v6.5.0: https://github.com/babel/babel/releases/tag/v6.5.0

[58] Релиз Grunt 1.0.0 rc1: http://gruntjs.com/blog/2016-02-11-grunt-1.0.0-rc1-released

[59] jQuery Mobile v1.5 | Все еще жив: http://www.gajotres.net/jquery-mobile-1-5-its-alive/

[60] ES6: объекты WeakMap, Set и WeakSet изнутри: http://css-live.ru/articles/es6-obekty-weakmap-set-i-weakset-iznutri.html

[61] ES6 WeakMaps, Sets, and WeakSets in Depth: https://ponyfoo.com/articles/es6-weakmaps-sets-and-weaksets-in-depth

[62] css-live.ru: http://css-live.ru/

[63] ES6: Методы объекта Map изнутри: http://css-live.ru/articles/es6-metody-obekta-map-iznutri.html

[64] ES6 Maps in Depth: https://ponyfoo.com/articles/es6-maps-in-depth

[65] ES6 в деталях: символы: http://frontender.info/es6-in-depth-symbols/

[66] Fallback-действия в ES6 Promise: https://habrahabr.ru/post/276913/

[67] Используйте ECMAScript 6 СЕЙЧАС: https://blog.isomr.co/use-ecmascript-6-now/

[68] Матиматические функции ES6, которые вы можете использовать уже сегодня: https://dzone.com/articles/introducing-javascripts-math-functions

[69] Angular 1.5: Компоненты: https://habrahabr.ru/post/277087/

[70] Сначала основы, потом фреймворки: https://medium.com/@sharifsbeat/fundamentals-then-frameworks-c35697d291e8

[71] Я научилась продуктивно работать с React за неделю, и вы тоже сможете: https://css-tricks.com/productive-in-react/

[72] A Lazy Isomorphic React Experiment: http://blog.scottlogic.com/2016/02/05/a-lazy-isomorphic-react-experiment.html

[73] Введение в Ember для Angular разработчиков: http://thejsguy.com/2016/02/10/introduction-to-ember-for-angular-developers.html

[74] Избегайте частичной привязки методов в React компонентах: https://medium.com/@roman01la/avoid-partial-application-in-react-components-3c9e36d7f735

[75] Детальное рассмотрение модуля AngularJS ngMessages: http://www.sitepoint.com/closer-look-angulars-ngmessages-module/

[76] LineChart: http://www.primefaces.org/primeng/#/linechart

[77] angular2-autosize: https://github.com/stevepapa/angular2-autosize

[78] Почему Java разработчики будут принимать Angular 2 и TypeScript: https://www.voxxed.com/blog/2016/02/why-java-developers-will-embrace-angular-2-and-typescript/

[79] Объектно-ориентированный JavaScript: немного практики: http://jsraccoon.ru/oop-example-validation

[80] Выбирая ванильный JavaScript в 2016: https://medium.com/vanilla-javascript/choosing-vanilla-javascript-in-2016-6f38a8302ee5

[81] Усталость от JavaScript усталости: http://www.2ality.com/2016/02/js-fatigue-fatigue.html

[82] Взаимодействие JavaScript с железом: https://www.smashingmagazine.com/2016/02/hardware-hacking-with-javascript-internet-of-things/

[83] ECMAScript String Padding: https://ponyfoo.com/articles/ecmascript-string-padding

[84] Вежливое введение в функциональный Javascript: http://jrsinclair.com/articles/2016/gentle-introduction-to-functional-javascript-style/

[85] JavaScript метод requestAnimationFrame() для плавной анимации: http://www.javascriptkit.com/javatutors/requestanimationframe.shtml

[86] Расширенные свойства в Javascript: http://www.jstips.co/en/advanced-properties/

[87] Делаем многомерный массив плоским: http://www.jstips.co/en/flattening-multidimensional-arrays-in-javascript/

[88] Быстрый совет: Управляем замыканиями переопределяя их: http://www.sitepoint.com/quick-tip-master-closures-by-reimplementing-them-from-scratch/

[89] Как создать простой загрузчик с JavaScript Promis-ами: https://davidwalsh.name/javascript-loader

[90] Использование Webworkers чтобы сделать React быстрее: http://blog.nparashuram.com/2016/02/using-webworkers-to-make-react-faster.html

[91] Привлекательность Scala.js: http://blog.ramnivas.com/technology/2016/02/09/the-allure-of-scalajs.html

[92] beautify-text: https://github.com/bevacqua/beautify-text

[93] Lazy- загрузка изображений с помощью Igaro JavaScript фреймворка: http://www.sitepoint.com/lazy-loading-images-igaro-app-javascript-framework/

[94] Приложение, дающее совет по JavaScript каждый день: http://getjs.tips/

[95] В Chrome скоро будет прекращена поддержка протокола SPDY: http://www.opennet.ru/opennews/art.shtml?num=43860

[96] Изменение Хрома ломает визуальный вьюпорт: http://www.quirksmode.org/blog/archives/2016/02/chrome_change_b.html

[97] Обновление Web Audio в Chrome 49: https://developers.google.com/web/updates/2016/02/webaudio

[98] Новинки DevTools: https://developers.google.com/web/updates/2016/02/devtools-digest-devtools-go-dark

[99] Гладкая прокрутка в Firefox 46 с APZ: https://hacks.mozilla.org/2016/02/smoother-scrolling-in-firefox-46-with-apz/

[100] Обновление Firefox 44.0.1. Представитель Mozillа вошёл в Совет по архитектуре Интернета: http://www.opennet.ru/opennews/art.shtml?num=43838

[101] Chrome для Android получил поддержку «физической сети»: http://www.3dnews.ru/928267/

[102] Сервис генерирования отмазок: http://copout.me/

[103] Обновленный бренд Uber: https://brand.uber.com/

[104] zfort.com: http://www.zfort.com/

[105] HTML-909: http://html909.com/

[106] beatboxacademy.ca: http://www.beatboxacademy.ca/

[107] macroinvertebrates.org: http://www.macroinvertebrates.org/#/

[108] gabrielfaucon.com: http://gabrielfaucon.com/

[109] Почему китайские сайты выглядят такими заполненными?: https://econsultancy.com/blog/67466-why-do-chinese-websites-look-so-busy

[110] Сайт с удачным применением SVG анимации: http://drawabetter2016.com/

[111] Генератор валентинок от Spotify с необычным поведением фона: https://spotify-valentines.com/

[112] patrik-huebner.com: http://www.patrik-huebner.com/

[113] Забавный пример сайта с треш-анимацией: http://crazydimka.ru/

[114] Почему интерфейс настольных компьютеров по-прежнему лучше планшетов — мнение: https://vc.ru/p/desktop-ux-teaches-mobile

[115] История и эволюция дизайна логотипов: http://www.designhill.com/infographics/history-evolution-of-logos

[116] Хорошие UX дизайнеры должны быть бойцами, потому что компромисный дизайн — это не хороший дизайн: https://medium.com/@andrewdoherty/good-ux-designers-must-be-prepared-to-fight-cbf758b10854

[117] Руководство по Sketch для iOS разработчиков: http://www.raywenderlich.com/117609/sketch-indie-developers

[118] Улучшение продуктивности путем лучшей организации папок в Photoshop: http://speckyboy.com/2016/02/09/properly-organizing-folders-photoshop/

[119] Анимация для начинающих: как анимировать процесс бега персонажа: http://design.tutsplus.com/tutorials/animation-for-beginners-how-to-animate-a-character-running--cms-25730

[120] Процесс создания дизайна логотипа Arriva: https://medium.com/@veerlepieters/the-design-process-of-the-arriva-logo-2a3a6ecbca4f

[121] Дизайн, процесс, и совместная работа в Stripe: https://medium.com/in-progress/design-and-collaboration-at-stripe-304626b59312

[122] Как мы старались сами сделать дизайн обложки своей книги (и как Jessica Hische спасла ситуацию): https://medium.com/galleys/how-we-tried-to-design-our-own-book-cover-and-how-jessica-hische-saved-the-day-58551087cfea

[123] Как работают дизайнеры в 2015-м: https://2015.avocode.com/

[124] Отбеливание социальных медиа: http://www.elischiff.com/2016/2/9/social-media-whitewash

[125] Дизайн игры Cave Story: https://www.soldierfromthesurface.com/games/cavestory/

[126] Как я пробовал устроиться в Blablacar,: https://medium.com/sketch-app-sources/i-applied-for-a-job-at-blablacar-4e6f5dd06cf3

[127] The First Title-Pages: http://ilovetypography.com/2016/02/14/the-first-title-pages/

[128] Новый год, новый Hopper: https://medium.com/@hopper_travel/new-year-new-hopper-aad3cec198a0

[129] Определяющие принципы DDD: https://medium.com/salesforce-ux/defining-principles-to-drive-design-decisions-b647b68fb057

[130] Использование психологии для улучшения ваших конверсий в 2016-м: http://www.sitepoint.com/using-psychology-to-boost-your-conversions-in-2016/

[131] Обзор iPad Pro от UX дизайнера: https://medium.com/mindsea-development-inc/a-ux-designer-s-review-of-ipad-pro-2c20d0934cb7

[132] Первый взгляд на Adobe Animate CC: http://www.webdesignerdepot.com/2016/02/first-look-at-adobes-animate-cc/

[133] Магические трюки в фотошопе: https://bjango.com/articles/magictricks/

[134] Как состарить фото в Adobe Photoshop: http://design.tutsplus.com/tutorials/how-to-age-a-photo-in-adobe-photoshop--cms-25741

[135] Как создать эффект античного металлического текста в Adobe Photoshop: http://design.tutsplus.com/tutorials/how-to-create-a-3d-antique-metal-text-effect-in-adobe-photoshop--cms-25786

[136] Уроки по созданию иллюстраций персонажей: http://www.vandelaydesign.com/outstanding-character-design-tutorials/

[137] Великолепные логотипы ресторанов для вдохновения: https://medium.com/@zorzini/25-stunning-restaurant-logos-for-your-inspiration-edb6aa2bba8

[138] Новый логотип и айдентика для VSCO: http://www.underconsideration.com/brandnew/archives/new_logo_and_identity_for_vsco_done_in_house.php

[139] Растущее количество логотипов в форме сердец: http://www.emblemetric.com/2016/02/10/heart-rate-rising/

[140] Текстовый эффект со множественной обводкой в Adobe Photoshop: http://www.dejurka.ru/tutorial/multi-stroke-text-effect-photoshop/

[141] Деревянный эффект для текста в Adobe Illustrator: http://www.dejurka.ru/tutorial/wood-texture-text-effect-illustrator/

[142] Лучшие в 2015: шрифты для дизайнеров: http://www.noupe.com/design/best-of-2015-100-free-fonts-for-designers-95285.html

[143] Плагины к Sketch: http://sketchapp.com/extensions/

[144] Коллекция фото пищи: http://foodshot.co/

[145] Chat — миниалистический набор UI: http://www.invisionapp.com/chat

[146] Пять десятков наборов кистей к фотошопу: http://line25.com/articles/free-photoshop-brushes

[147] Набор UI Elton : https://pixelbuddha.net/freebie/elton-ui-kit

[148] Иконки к Дню святого Валентина (SVG): https://dribbble.com/shots/2510005--Freebies-Valentine-Day-icon

[149] Набор иконок посвященный дому и недвижимости (AI, CSH, EPS, SVG, Webfont, Sketch): https://www.smashingmagazine.com/2016/02/freebie-home-appliance-and-real-estate-icons/

[150] ANURATI — стильный декоративный заголовочный шрифт: https://www.behance.net/gallery/33704618/ANURATI-Free-font

[151] Hadron Sans — декоративный шрифт: https://www.behance.net/gallery/31562601/Hadron-Sans-FREE-font

[152] Коллекция шрифтов: http://www.webdesignfreebies.net/fonts/collection-of-free-fonts-and-typefaces-4/

[153] Шрифты с личностью: https://www.smashingmagazine.com/2016/02/free-fonts-with-personality/

[154] Mockup файлы под дизайн для напитков: http://www.dejurka.ru/graphics/free-drink-mockup/

[155] Бесплатный вектор на транспортную тему: http://www.dejurka.ru/graphics/free-transport-vector/

[156] Бесплатные шрифты в вашу коллекцию: http://www.dejurka.ru/graphics/free-fonts-5/

[157] Слухи подтвердились — Opera Software продаётся в Китай: https://habrahabr.ru/post/276955/

[158] Google позволил редактировать блоки выдачи Сети знаний: http://www.searchengines.ru/news/archives/google_pozvolil_edit.html

[159] Google откажется от рекламных баннеров в формате Flash: http://www.searchengines.ru/news/archives/google_otkazhet.html

[160] Google объявил о скором закрытии фотосервиса Picasa: https://tjournal.ru/c/23001-google-obyavil-o-skorom-zakritii-fotoservisa-picasa

[161] Google работает над самодостаточным шлемом виртуальной реальности, не требующим дополнительного оборудования в виде смартфона или ПК: http://itc.ua/news/google-rabotaet-nad-samodostatochnyim-shlemom-virtualnoy-realnosti-ne-trebuyushhim-dopolnitelnogo-oborudovaniya-v-vide-smartfona-ili-pk/

[162] Установлен абсолютный рекорд скорости передачи данных: 1,125 Тбита/с: https://geektimes.ru/post/271024/

[163] Twitter изменил алгоритм показа сообщений в ленте вопреки заявлениям Джека Дорси: http://www.searchengines.ru/news/archives/twitter_izmenil_alg.html

[164] Подписчики YouTube Red получили доступ к первым эксклюзивным фильмам и телепередачам YouTube Red Originals: http://itc.ua/news/podpischiki-youtube-red-poluchili-dostup-k-pervyim-eksklyuzivnyim-filmam-teleperedacham-youtube-red-originals/

[165] Издатель журналов Fortune и People выкупил социальную сеть Myspace: https://vc.ru/n/its-myspace-time

[166] В США систему управления робомобилем Google решили считать водителем: http://www.3dnews.ru/928185/

[167] Microsoft выпустила приложение для определения породы собак по фото: https://tjournal.ru/c/22894-microsoft-vipustila-prilozhenie-dlya-opredeleniya-porodi-sobak-po-foto

[168] В Китае проходит самый масштабный тест Тьюринга: http://itc.ua/news/v-kitae-prohodit-samyiy-masshtabnyiy-test-tyuringa/

[169] Firefox OS мертва: http://www.knowyourmobile.com/os/19888/firefox-os-dead-says-mozilla

[170] Поговорим о Gmail: Как развивался популярный почтовый сервис: https://spark.ru/startup/pechkin-mail/blog/13796/pogovorim-o-gmail-kak-razvivalsya-populyarnij-pochtovij-servis

[171] Видео дня: анимированная карта «подводного интернета»: http://itc.ua/news/video-dnya-animirovannaya-karta-podvodnogo-interneta/

[172] «Кажется, команда Medium опять напилась»: https://vc.ru/p/medium-drunk-release-notes

[173] DARPA: имплантат «стентрод» для управления протезом внедряют в мозг через вены: http://www.3dnews.ru/928110/

[174] Мертвые программисты не пишут код: http://ain.ua/2016/02/09/631532

[175] Создан мозговой имплантат для управления экзоскелетом: http://www.computerra.ru/139745/stentrode-implantable-electrode-for-bci/

[176] Океан интернета: на интерактивную карту нанесли подводные кабели, которые удерживают мир в онлайне: http://ain.ua/2016/02/09/631645

[177] Internet Archive запустил музей DOS вирусов: http://itc.ua/blogs/internet-archive-zapustil-muzey-dos-virusov/

[178] Ученые доказали существование гравитационных волн через 100 лет после предсказания Эйнштейна: http://ain.ua/2016/02/11/632217

[179] IT и горная промышленность: как с помощью одной системы оптимизировать все процессы: http://ain.ua/2016/02/12/632302

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

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

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

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

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