The digest of interesting materials from the world of web development and IT over the past few weeks, №117 (July 10 - 27, 2014)

We are back from vacations and with new forces we bring to your attention a selection with links to useful resources, interesting materials and IT news.

Web development

• HTML5 doctype has become the most popular in RuNet
• What is HTML import and how does it work?
• Collection of all the necessary information on the SVG from Chris Coyier
• Scaling BEM methodology for small projects
• Understanding the coordinate system and transformations in the SVG (Part 1) - viewport, viewBox, & preserveAspectRatio
• We go beyond the responsive web, moving to adaptive
• Responsive images: use cases and comment snippets to start with.
• Device prioritization: testing responsive design
• You may lose users. if RWD is your only strategy for mobile devices
• Using Github to manage projects
• Hg and git comparison
• From webcam to animated gif
• DomFlags is an extension for Chrome that allows you to add shortcuts to DOM elements for easy navigation through the tree.
• An interesting article on the redesign of the Harvard Law Review
• Scale out Node.js and WebSockets with Redis
• Resources for HTML5 game developers , provided by Mozilla
• Onsen UI - high-performance HTML5 UI framework for creating mobile applications - the answer is PhoneGap.
• More responsive one-page application built with AngularJS and Socket.IO: library creation
• How to debug and profile your HTML5 apps and websites on Windows Phone using Visual Studio 2013
• How to develop for mobile devices, if you do not have them in stock
• Constantly growing collection of web bugs under mobile devices
• BOOTSTRA.386 - theme for Bootstrap with the corresponding design

CSS

• CSScomb 3.0: beautiful code with one team
• Responsive Web Design:
  
  • A look at the current state of affairs with RWD (and how to speed up the transition to it)
  • How heavy is the RWD website?
  • tuktuk - responsive 12-colum grid framework
  • flexible.gs - perspective grid, while having problems with compression of the minified version
  • Media Queries: a look at the various properties of media expressions
  • Guide to Responsive-Friendly CSS Columns
  
  
• SVG:
  
  • SVG Preloaders
  • Strangeness of Stroke in SVG
  • PatternBolt - a set of templates and a generator of SVG backgrounds packed in a CSS or SCSS file
  • Adaptive logos of popular brands using svg
  
  
• Preprocessors:
  
  • Less mixins you need when using a preprocessor
  • Accelerate the development of themes for Bootstrap using the library of less variables
  • Everything you need to know about Sass 3.4
  • Automating CSS Animation with Sass
  • Less CSS based frameworks
  • Sass Source Maps in Chrome
  • Mixins in CSS preprocessors
  
  
• Understanding Above the Fold CSS:
  
  • Authoring Critical Above-the-Fold CSS
  • CriticalCSS by filamentgroup
  • Critical-path CSS by addyosmani
  
  
• CSS on GitHub- mdo overview post
• CSS in Lonely Planet
• Khaki when working with priority selectors
• Ten examples of replacing native applications using the latest version of CSS
• We solve the problem with a large code base CSS
• Image Comparison Slider on pure CSS
• "3.14 Things I Didn’t Know About CSS" by Mathias Bynens
• Angelina Fabbro 's CSS In Your Pocket - Mobile CSS Tips From The Trenches with CSSConfUS2014
• "Origin and Importance in the CSS Cascade" Screencast

Javascript

• Functional Javascript. We write our lenses, part 1
• With great strength comes a big responsibility - the safety technique in AngularJS
• 18 surprises when reading jQuery source code
• Interview for a JavaScript developer post
• Blocks of the same height with Flexbox and Fallback on JS
• 18 surprises when reading jQuery source code
• Interesting ideas for pop-up messages
• Compilation of must-see videos on JS
• Refactoring Stories
• Basics when working with ES6 Generators
• Why JS-development should be delighted with Object.observe ()
• Introduction to Classes in ES6
• Date Tips
• Five advanced APIs that you can use for mobile web pages.
• How to use the Battery API
• Framework and node.js:
  
  • Best ways to use Angular.js
  • Bonegular - Backbone Style Models and Collections for AngularJS
  • Creating YouTube directives in AngularJS
  • Angular JS Style Guide for Todd Motto Teams
  • AngularJS and Polymer roles
  • Built With Ember - a collection of web applications created with Ember.js
  • We write addons to Node.js
  • Google API Node.js Client
  • Creating a Sentiment Analysis Application with Node.js
  • Getting started with Bookshelf.js
  
  
• Plugins:
  
  • Recreation of the wave effect when clicking from the material design from Google
  • Rome - date and time picker component without dependencies
  • sense.js - simple gestures support for mobile web browsers
  • Multi-Column-Dropdown - Single Selection Multi-Column-Dropdown
  • Smart Fixed Navigation - advanced fixed navigation
  • Custom design for cool effects
  • Waves - click effect, inspired by Google's Material Design
  
  

Web tools

• 5 ways to combine the capabilities of popular web services
• Top Ten open source tools for web designers and web developers
• HTML Minifier

news

• Baseline Study - arguably the most ambitious Google project
• Yandex.DNS has learned how to fight bots
• Google seems to be buying video streaming service Twitch
• Explorer function for travelers added to Google Maps
• The AdSense Help Center has presented a guide to optimizing sites for various types of devices.
• ComScore: Google, Yahoo and Microsoft sites are the most popular resources in the USA.
• Yelp introduced a trend tracking feature similar to Google Trends.
• China is building the largest collider in the world
• Microsoft will combine different versions of Windows into a single system.
• "VKontakte" will be engaged in special musical projects
• Zuckerberg has become richer than both co-founders of Google
• Durov changed Telegram's legal entity and launched a new application for iOS
• Facebook has a “Save” button for deferred reading of articles.
• Yahoo bought the largest mobile analytics service Flurry for $ 200 million
• Facebook has completed the takeover of Oculus VR
• Final look at WordPress 4.0: what to expect in the new version

Browsers

• View DOM events in Firefox Developer Tools
• Firefox 31 release
• Firefox 32-beta and Firefox 33-aurora exit
• Firefox 36 is expected to transition to a multiprocess architecture
• The <picture> element will appear in Chrome and Opera builds.
• New Breach Browser
• Legacy Firefox versions will be automatically updated to the latest release.
• Internet Explorer was the most vulnerable browser of the first half of 2014
• Web Font Browser Bugs

Sites with interesting design and functionality

• greaterthanorequalto.net - simple interactive text story
• madebyuppercut.com - a site with creative scroll effects
• Aprilzero- site with a large number of graphic artists and a sympathetic design
• airnauts.com - creative scrolling effects and nice animation
• dataveyes.com - creative background effects using canvas
• keecker.com - an interesting implementation of the transition between pages
• personalbrandinstitute.com - a site with an abundance of css3 and canvas animations
• vinylday - creative themed site
• Palanga Live - cool animation site and background video
• grad.uottawa.ca - bidirectional scrolling
• The Mobile Playbook - a horizontal slide site with a host of advanced effects.
• humoristas.com is a creative website with conceptual design and nice animation.
• pdg-paris8.com - another site with bi-directional scrolling
• zhanaozen.eu - non-standard approach to scroll effects
• underbelly.is - easy parallax and nice animation

Design

• Published a rating of creativity web studios Runet
• New design "Can I use"
• Stylized Maps in Illustrations
• Shadows in logo design
• Animated logos and emblems
• Creative selfie from designers and illustrators
• Ten types of designers with whom you would not like to meet
• I hate design ... now what to do about it?
• Future interface: more humane design
• Can web animation save a flat design?
• Foursquare redesign
• The secret to successful Airbnb redesign
• How to make the "empty" space work on the web
• The impact of fonts on user feedback
• White headers in web design
• Posters: 75 years of Batman
• Cosmopolis - a collection of illustrations of the largest megacities
• Magnificent portrait illustrations by Phil Noto
• Three ways to retouch splayed hair in portrait photography
• How to create the perfect 404 page
• Design principles for the newspaper layout of the site
• After redesign: new Airbnb logo and parodies on it

A selection of free designer cookies

• raumrot - the perfect choice of photos filtered by category
• More than eight high-quality photos in one place
• Free flat items
• Two dozen mock-ups with the design of posters in PSD format
• Vintage mocaps
• Set for creating wireframes for iOS 7 applications
• Three dozen creative templates in PSD format
• Four dozen monochrome icons from Artful Club
• Mintie - a set of cheerful and colorful icons in flat design
• Four dozen single-color vector icons of charging batteries and their states
• Five hundred monochrome flat icons
• Set of winter outline vector icons
• More than two hundred one-color flat vector icons
• Ten mostly decorative July header fonts
• Four dozen of the best fonts of 2014: from Dude to Bobber
• Decorative fonts, from: Nendo to Orbitron
• 30+ Free UI Kits for Web Designers
• Aaram - a family of sans serif ornamental font with rounded shapes

Demo

• Sandbox for viewing 3D primitives
• Playing HTML5 version of Microsoft's Settlers of Catan
• Gravity - an amazing example of # HTML5 in action

Entertaining

• Startups:
  
  • Startup Starters: 15 famous projects founded after 35 years
  • Startups and fakapy
  • To help startups: a pre-order has been opened for registration of the .WTF and .FAIL domains
  • 5 reasons not to go to Silicon Valley
  
  
• Why is Google office work a dream for everyone?
• How to get to work at Google and is it worth it
• Interview of Sergey Brin and Larry Page with Vinod Khosla on Khosla Ventures: the most complete version
• Bitcoin five-year plan: regulation is better than a ban!
• Key Trends 2014 on the Internet
• “Smart” sleep sensor blew up Kickstarter: half a million dollars in the first day
• NASA has provided files for 3D printing of a number of space objects.
• Toaster for selfie lovers
• 5 Google chips that interest you
• Jimmy Kimmel gave passersby cheap Casio for Apple iTime
• 50 funniest questions on IT interview

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 .