The digest of interesting materials from the world of web development and IT for the last week No. 196 (January 25 - 31, 2016)

We bring to your attention a selection with links to useful resources, interesting materials and IT news

Web development

CSS

Javascript

Browsers

Design

news

Entertaining

Web development

Responsive Image Breakpoints Generator , a new online tool for making responsive images easier
Security Panel View in DevTools
Problem with Chromium WebViews
Jake Archibald: 2016 - the year of web streams)
Alternatives to Parse Locking Service (Parse alternatives)
Call me E-schmail: taming a monster whose name is HTML Email (Call Me E-schmail: Conquering the Beast that is HTML Email)
HTML5 hidden and aria-hidden attribute support in 2016 (The state of hidden content support in 2016)
Web Animation Analysis on Top 30 Sites from Awwwards.com (Web Animation Trends: 31 Top Websites Deconstructed)
Lesson on creating a Pull Request (Pull Request Tutorial)
When you know the basics, but still can not kodit (When You Know the Basics, but You Still Can not Code)
Matching process with frontenderami (Aligning your Front End Process)
New functionality in CodePen - JS Console
Creating a simple offline page with Workers the Service (the Create a really, really simple page of offline using the the Service Workers)
Lesson from Sara Soueidan on creating an animated SVG banner using GSAP (Supercharge SVG animations with GSAP)
A Gulp-Based External SVG Symbol Sprite Icon System by Una Kravets
Three plugins that should be included in each configuration of Grunt and Gulp (3 Plugins Every Gruntfile & Gulpfile Needs)
Unofficial code generator for inserting CanIUse data widget (The (Unofficial) CanIUse Embed)
Productive web:
- Brad Frost Performance Budget Builder
- On web performance experts share tips and errors (Web Performance: 20+ Experts Share Their Advice and Mistakes)
- 18 Tips for Website Performance Optimization
Spectacular web

CSS

Minimum required fonts . The translated article CRITICAL WEB FONTS community css-live.ru
Variables as the basis of CSS architecture when working with preprocessors . Translation of Variables: The Backbone Of CSS Architecture on Progressor
A very simple guide to CSS3 animations from frontender.info
Display: contents and his new friends rush to the rescue
Explanation of the new display: contents property with code examples (Vanishing boxes with display contents)
voxel.css - a lightweight library for rendering 3D objects using CSS (GPU acceleration / CSS3 transitions) (A lightweight 3D CSS voxel library)
Pure CSS masonry layouts ( pure CSS masonry layouts)
Expanding Sass c via PostCSS (EXTENDING Sass with PostCSS)
About the CSS import rule
CSS Refactoring Without Losing Your Client Or Your Mind
Use of modern CSS to create an adaptive grid with pictures (Using Modern CSS to Build a Responsive Image Grid)
CSS Font Features for WebKit
A new look at the Float Label pattern implemented with CSS (Revisiting the Float Label pattern with CSS)
Writing an awesome Sass with OOSass (Writing Kick-Ass Sass With OOSass)
Bulma - another CSS framework built on Flexbox (Bulma - a modern CSS framework based on Flexbox)
Hint.css 2.0 - library for adding popup bounces
Learn CSS Layout: the pedantic way online book

Javascript

Frameworks
- What would your JS framework look like if you were a cat? (Which cat is your JavaScript framework?)
- My reaction to React (My Reaction to React)
- React and the economics of dynamic web interfaces
- Nine things every beginner should know in React.js (9 things every React.js beginner should know)
- Creating a React Universal Blog App: A Step-by-Step Guide
- Creating a chat application in 40 minutes with React and Meteor (Building a live chat app in 40 minutes with React and Meteor)
- Angular vs React: step-by-step comparison (Angular vs React: A Side-By-Side Comparison)
- Angular JS 2.0 to Revolutionize UI / UX Development
ES6:
- Features and ECMAScript ES2016 as the standard (ES2016 Features & ECMAScript as a Living Standard)
- Simple examples to help you better understand the ES6 (the Simple the examples to help you Understand ES6)
- Creating ES6 Javascript for the Browser with Gulp, Babel, and More)
Hardcore JS or Power in 30 lines (Hardcore JavaScript or Power of 30 lines)
The Complete Guide to the graphs in JavaScript (JavaScript charts: of The Definitive guide)
Understanding Transducers in JS
What to expect from JS in 2016 - language improvements (What to Expect from JavaScript in 2016 - Language Enhancements)
A selection from the series You Dont / Might Not Need ...
What can we learn from jQuery, which has symbioticly advanced the web platform? (What can we learn from how jQuery symbiotically pushed the Web Platform forward?)
The study of the native JS functions and how to use them (Learning JavaScript Native Functions and How to Use Them)
The heart and soul prototype OO: concatenation inheritance (The Heart & Soul of Prototypal OO : Concatenative Inheritance)
Why is everyone talking about isomorphic / universal JavaScript and what are its characteristics (Why Everyone is Talking About Isomorphic / Universal JavaScript and Why it Matters)
Presentation: Modern JavaScript: The Smalltalk Influence
The move towards PROMIS for geo-location (Moving to Modularized Promises via Geolocation)
Filtering and sorting a list of words (Filtering and Sorting a List of Strings )
Inconsistent state JavaScript toolkit (The Controversial State of JavaScript Tooling)
Babel Reference - Using and Creating Plugin (Babel Handbook)
Libraries and component architectures (Front-end Application Libraries and Component Architectures)
Unit Testing Your JS with Mocha and Chai (Unit Test Your JavaScript Using Mocha and Chai)
Introduction to jCanvas: jQuery with HTML5 Canvas (Introduction to jCanvas: jQuery Meets HTML5 Canvas)
Plugins
- A collection of plugins and tooltips for creating tooltips (73 Tooltip Plugins Made With jQuery, CSS, JavaScript or More!)
- Loud links - A simple tiny Javascript library to add interaction sounds to your website.)
- Viewer.js - JavaScript image viewer
- trunc-html - trimming html by a given number of characters (trunc-html - truncate html by text length)
- vivus - library for implementing SVG animations (vivus, bringing your SVGs to life)
- datedropper is a jQuery plugin that provides a quick and easy way to manage dates for input fields)

Browsers

Firefox 44 Release , Developer Details
Mozilla Firefox browser now supports pop-up notifications from websites
Making the Firefox developer tools accessible
Adblock Plus ad blocker turns 10 years old
Web Push notification is implemented in Firefox 44 (Web Push Arrives in Firefox 44)
Review of V8 Release 4.9 (V8 Release 4.9)
Chrome for iOS is faster and more stable
Material Design is slowly coming to Google Chrome, here's what it looks like)
Microsoft Edge Saves InPrivate Browsing History
Tor Browser 5.5 Release
Oracle will stop supplying browser-based Java plug-in

Design

General principles in creating mobile applications for a beginner UX / UI designer
Yahoo Launches New Homepage and App Design
"VKontakte" showed a version of the redesign
The dependence of website promotion on web design
Best Examples of Kinetic Typography Examples
5 Anti-Principles of Good Design
Where to place the icon in your accordion menu (Where to Place Your Accordion Menu Icons )
Making design for the meed mobile application (Designing for mobile)
Principles of simplicity in design (The Design Principles of Simplicity)
Card Design Web Design Secrets
Graphic editor:
- What's new in Sketch 3.5? (What's New in Sketch 3.5?)
- Creating Star Wars Illustrations in Sketch: A Guide for Non-Designers
- PaintCode - Sketch source control
- Sketch Image Average Color - a plugin to get the average color of an image in Sketch
- Sketch Tutorial Series (Part 3 of 5): Designing a Desktop Version
- gb-sketch-segmentcircle - Sketch plugin for creating segmented circles
- Macaw team joins InVision (Macaw team joins InVision)
Why should reconsider the attitude of designers to minimalist websites (Why Designers Should Reconsider 'Minimalistic' Websites)
The Science of Flowers and Colors: The Psychology of Color (CHROMANTICS: the psychology of color)
As Kimoji attracting new users (How Kimoji Onboards New Users)
Problem With Dribbble (The Problem With Dribbble)
How to redesign a digest of a mailing letters (How to Redesign an Email Digest)
The Future Is Near : The Damn Dozen Design Predictions for 2017 (The Future Is Near: 13 Design Predictions for 2017)
Five Fancy (But Useless) Web Components to Avoid (5 Fancy (But Useless) Web Components You Should Avoid)
I'm not smart, I'm just sitting here longer than you (I'm not smart, I just sat there for longer than you)
How to make your users enjoy themselves (How to Make Your Users Enjoy Waiting)
Five tools to know for web designers in 2016 (5 need to know tools for all web designers in 2016)
How to create a retro graphic style 50s in Illustrator as Adobe (How to the Create a 50s Fashion Illustration in as Adobe Illustrator)
Icons in web design (Icons In Web Design)

A selection of free designer cookies

A collection of 50 registration screens for iPhone 6 in Sketch format
Free Space Brushes for Adobe Photoshop
Icon Generation Templates for Photoshop, Illustrator, Sketch, and Affinity Designer (Bjango App Icon Templates)
UI Kits for iOS and Android (20 Free Mobile UI Kits for iOS & Android)
Abstract Spherical Graphics in Vector Format (12 Free Abstract Sphere Graphics in Vector Format)
Three dozen sets of UI elements (30 Free UI Kit Elements)
Set of Vector Internet Icons (Freebie: 36 Internet Icons Vectors)
Set of contour icons dedicated to science (in AI, EPS, PSD, SVG, PNG) (Freebie: Science Line Icons (AI, EPS, PSD, SVG, PNG))
Gesture Icons Inspiration and Free Packages Graphics Sets
Twelve Months Icons (PSD, AI, EPS, SVG, PNG) (Freebie: The Months Of The Year Icon Set (12 Icons PSD, AI, EPS, SVG, PNG))
Valentine's Day Icons (30 Valentine Icons for Free)
Vector Icon Set: Star Wars and Marvel Comic Heroes (Free Icon Set: Star Wars and Marvel Superheros)
Serif fonts for digital designers (40 Free Serif Fonts for Digital Designers)
OVERPASS - sans-serif font based on the Highway Gothic font (OVERPASS - an open source webfont family inspired by Highway Gothic.)

news

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

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

Last week digest .
Material prepared dersmoll and alekskorovin .

Tags: