The digest of interesting materials from the world of web development and IT for the last week №185 (November 8 - 15, 2015)

We offer you a selection with links to useful resources, interesting materials and IT-news

Web development

CSS

Javascript

Browsers

Design

news

Entertaining

Web development

• Video from the master class “Automation for front-endders held at the HTML Academy by Robert Kharitonov
• "Automation of learning processes." Speech by Alexey Maleykov from the conference IT NonStop Petersburg
• Responsive Images - Opera's Bruce Lawson on the correct use of image sizes and <picture> at Awwwards Conference Barcelona 2015
• Toolsday - 20-minute podcast about tools for web developers.
• Creating an alpha channel for JPEG using SVG
• Introduction to Google's Accelerated Mobile Pages (AMP)
• More than twenty documents and manuals for front-end developers (No. 6)
• Dynamic sites with static speed: the art of caching websites (Dynamic sites at static speed: the art of website caching)
• Big Rig - Performance Testing System
• Performance slice : Ryanair's 2015 redesign (Performance snapshot: Ryanair's 2015 redesign)
• The Web Animations API . A quick introduction from James Y Rauhut.
• Introduction to Canvas
• New Firefox Memory Tools
• How to reuse SVG Text using the tref element (How To Reuse SVG Text With The tref Element)
• Recreating the Google logo using SVG and GreenSock
• ServiceWorker:
  
  • My first Service Worker . Jeremy Keith shares his impressions
  • Built-in html SVG <img> using ServiceWorker (Inline SVG <img> using ServiceWorker)
  • Making a simple website accessible offline using ServiceWorker (Making a Simple Site Work Offline with ServiceWorker)
  • Create a progressive application using ServiceWorker (Making a Progressive App with ServiceWorker)
  
  
• Spectacular web:
  
  • Weekly selection of beautiful effects on CSS / SVG / JS # 12
  • Creative animation of a hamburger menu icon in SVG format with the Segment library (Animating an SVG Menu Icon with Segment)
  • Interactive Presentation of Mary Lou Room Interior
  • Electrical Effect with CSS and Javascript
  • The concept of a colorful dynamic calendar using CSS
  • Wolf animation
  • Render of light refractions (JavaScript and WebGL)
  • Animated GitHub-corners
  
  

CSS

• Do we really need specificity in CSS?
• Flexbox for interfaces: basic patterns
• PostCSS Quick Start Guide: Continuing with Plugin Overview
• Getting started with SASS and Bourbon
• 5 Ways to Improve Sass with Bourbon
• Do not use gradient generators! (Don't use gradient generators)
• Writing CSS in growing teams (Writing CSS on Growing Teams)
• CSS in the modern world (CSS in the Modern World)
• CSS Effects for Images # 6: Infrared Photography (CSS Image Effects # 6: Infrared Photography)
• PostCSS deep dive: how to create your own plugin (PostCSS Deep Dive: Create Your Own Plugin)
• PostCSS becomes 1.5 times faster
• eBay Tech Blog: how our CSS framework helps ensure accessibility
• Patterns for scaling CSS (Patterns for scaling CSS)
• Opacity A to Z
• Using System Fonts in Web Design: A Quick Practical Guide (Using the System UI Fonts In Web Design: A Quick Practical Guide)

Javascript

• Aggregation and awareness
• ES6:
  
  • Overview of ES6 at 350 points. Part two
  • ES6: arrow functions from the inside
  • ES6: template literals from the inside
  • A brief history of the ES6 toolkit
  • Using ES6 and ES7 in a browser, with Babel 6 and Webpack (using ES6 and ES7 in the Browser, with Babel 6 and Webpack)
  • Top 10 ES6 Features Every JS Developer Should Know (Top 10 ES6 Features Every Busy JavaScript Developer Must Know)
  • Haskell in ES6: Part 1 (Haskell in ES6: Part 1)
  
  
• What's in ECMAScript 2016 (ES7)?
• JavaScript eats up the world ( javascript is eating the world )
• Ten questions asked at the interview
• Functional Programming in Javascript (Functional Programming in Javascript)
• Six Things You Should Know About Babel 6
• What's new in TypeScript - Bill Ticehurst (What's new in TypeScript - Bill Ticehurst)
• Using native HTML5 Drag and Drop API (Using HTML5's Native Drag and Drop API)
• Face Proximity Detection with JavaScript Face Detection
• An Overview of JavaScript Templating Engines
• Ten habits of a happy Node-hacker (2016) (10 Habits of a Happy Node Hacker (2016))
• Twitter survey: Do you use a semicolon?
• Accelerate JavaScript performance with asm.js (Supercharging JavaScript performance with asm.js)
• Chess game: Asm.js wins over normal JS (Asm.js Chess Battle)
• Framework:
  
  • Matreshka.js - Three possibilities
  • AngularJS tips from the PayPal team
  • Anatomy of large Angular applications (Anatomy of a large Angular application)
  • Creating components in Angular 2 with Typescript and ES5 (Creating Components in Angular 2 with Typescript and ES5)
  • The Internals of AngularJS, Part 2 (AngularJS 'Internals In Depth, Part 2)
  • Getting Started in Angular 2 - Rado Kirov and Naomi Black (Getting started in Angular 2 - Rado Kirov and Naomi Black)
  • Excerpts from AngularConnect 2015 (Highlights from AngularConnect 2015)
  • Keynote - Brad Green, Igor Minar and Jules Kremer from the AngularConnect 2015 Conference (Keynote - Brad Green, Igor Minar and Jules Kremer)
  • Rollup: how we used React.js and npm to separate the UI code in AdRoll (Rollup: How we use React.js and npm to share UI code at AdRoll)
  • Jeff Morrison - Flow, or how I stopped worrying and checking types in the React code (Jeff Morrison - Flowing
  
  
• Plugins and libraries:
  
  • Three plugins to make Single Page Application better.
  • antimoderate - a library for progressive loading of images in the style of Medium
  • jsCodeStructure - analysis of the structure of your JS project (the relationship between JS files)
  • drool - automated detection and analysis of memory leaks
  • wu.js is a library providing high order functions (like map, filter, reduce) for ES6 iterators
  • gridmanager.js - column and row constructor in the Bootstrap / Foundation grids, as well as the built-in editor
  • notie.js - simple plugin without dependencies for creating notifications (alert / growl style)
  
  

Browsers

• Google Chrome support on Windows XP / Vista will end in April 2016
• Firefox browser is available on iOS for everyone
• 6 features that should be in every browser
• The vulnerability of Chrome on Android allowed to hack the phone with one click on the link
• Testing Firefox 43-beta and Firefox Developer Edition 44

Sites with interesting design and functionality

• Creative site-portfolio studio Oleg Chulakova
• Sites made in Belgium
• Sites on which you can travel
• resume.shreyanschandak.com - an interactive resume with scrolling in different directions, animation and funny panache
• loremipsum.ro - an old-school style website
• theforecaster-interactive.com - website, stylized newspaper
• epicurrence.com - vertical scrolling site with interesting parallax and non-standard effects
• mksgraphisme.com - an animated scrolling site in the style of Nintendo
• 22 creative sites with unusual layouts
• wove.com/ - an impressive presentation site
• Car history - a large number of scrolling effects

Design

• Incorrectly used mobile interface patterns
• Font Lato: Sketch vs Android Studio
• 284 lectures on UI and web design gathered on one site
• Inspiring Examples of Logo Animation (Inspiring Examples of Subtly Animated Logos in Web Design)
• Using A / B testing to improve the conversion of your site (Using A / B Testing to Improve Your Site Conversion Rate)
• Why web graphics can reduce the number of readers (Why web graphics can reduce readership)
• Shadows to create volume in web design
• The Importance of Leadership When Presenting Prototypes
• How a five-cent eye patch made a million in history (How a 5-cent Eye-Patch Created a Million Dollar Story)
• Nine points to make sure design trends don't hold you back (9 Ways That Design Trends Are Holding You Back)
• Dashboard designs (Showcase Of Beautiful Dashboard UI Designs)
• What I learned by doing small things on Facebook (What I've Learned Designing Small Things at Facebook)
• Long-term impact of flat design: how a trend slowly decreases user efficiency (Long-Term Exposure to Flat Design: How the Trend Slowly Decreases User Efficiency)
• If this is not an iPhone, this is not an iPhone (If it's not an iPhone, it's not an iPhone)
• Pantone smoothie
• Nine States of Design (Nine States of Design)
• When simplicity is not a solution - design for a very different audience (When Simplicity is the Answer - Designing for Vastly Different Audiences)
• How I work with color (How I Work with Color)
• Tips for Finding the Perfect Image (3 Pro Tips For Finding the Perfect Image)
• Let's talk about white app icons.
• Graphic editor
  
  • Font Icons in Sketch and Grunt
  • State Switch Master plug-in - state switching master
  • We draw brushes of sunshine in Adobe Photoshop
  • Photoshop in 60 seconds: seamless patterns (Photoshop in 60 Seconds: Seamless Patterns)
  • Best Photoshop plug-ins for UI designers (Top Photoshop Plugins for UI Designers)
  • How to create a trio of cute pencils in Adobe Illustrator (How to Create a Trio of Cute Pencil Characters in Adobe Illustrator)
  
  
• UI / UX:
  
  • Improve your persuasive skills to succeed as a UX designer. (Improve your persuasion abilities to succeed as a UX designer)
  • Future UI beyond the command line
  • UX Long Term (Longterm User Experience)
  • Adapting empathy maps for UX design
  • How to maintain the consistency of the UX product? (How to maintain product UX consistency?)
  
  

A selection of free designer cookies

• Free photos of people with smartphones
• photostockeditor - high resolution photo
• Free promotional backgrounds and color streamers (Free download: 49 promo backdrops and gradients)
• Mockups to show logos (60+ Free Logo PSD Mock-up Templates)
• Adaptive template online store Aloha (Aloha Shop Responsive Template)
• 15 Free Gesture Icon Sets (15 Free Gesture Icon Sets for Mobile Developers)
• 20 flat vector icons (Freebie: 20 Flat Vector Icons)
• Voyage Icons Set (40 icons, AI, EPS, SVG, PNG) (Freebie: Voyage Icon Set (40 Icons, AI, EPS, SVG, PNG))
• Creative Fields Icon Set
• Five sets of web icons (5 Free Sets of Web Icons to Download Today)
• Three dozen useful icon sets (30 Free Icons Sets That You Must Have)
• FontBase is a font management software for Windows. (FontBase is a blazing fast for Windows.)
• Three dozen unusual flashy fonts (30+ Quirky, Free Fonts We're Shouting Out)
• LIQUIDE - sans serif font (LIQUIDE - Free Typeface)

news

• Yandex indexing robot began to use JavaScripts and CSS
• WSJ: Apple launches mobile money transfer service between users
• Offline navigation and search added to Google Maps
• Apple will close Beats Music on November 30
• Apple A9X performance comparable to Intel Core i5 processors
• Apple Music and Spotify have a competitor - YouTube Music
• Big November update in Windows 10: what's new
• Microsoft launched an online photo emotion analyzer
• Soon, Gmail will warn about emails that have arrived via an unprotected connection.
• Yandex will close the Rich Content API as an unpopular service.
• "Yandex" appealed to the European Commission about the monopoly of Google in Android
• Facebook introduced the Notify news service application.
• Google has a one-stop service for managing personal data.
• In New York, 200 trees will receive their e-mail

Entertaining

• 18-year-old teenager made a short video about the service station and won $ 400 thousand from Mark Zuckerberg
• Bitcoin vs. BitcoinXT: the main cryptocurrency is close to annihilation
• Japan will launch its own machine to the moon
• 8 of the most expensive deals in the history of the IT industry
• Why I do not use smart watches?
• Why did Elon Musk, Mark Zuckerberg and Sergey Brin invest money in space
• Soviet radiation shelter: much cooler and more complicated than it seems
• Hacker attacks in the movie and in reality
• 10 most popular YouTube commercials in October
• The demise of the Rutracker and useful insights
• Cool cosplay with Blizzcon 2015
• BlizzCon 2015 - two days of one multiverse. Reportage
• Guide to Tackle Common Issues with UX Design
• uMake - Sketches in 3D become reality (Sketching in 3D)

We apologize for any typos or broken / duplicate links. If you notice a problem - please write in a personal, we are trying to fix them quickly.

Digest from last week .
Material prepared dersmoll and alekskorovin .