This Week's HTML5 and Browser Technology News (Issue 223)

Read this e-mail on the Web HTML Weekly Issue 223 — January 20, 2016 The Woes of Date Input HTML5 Doctor Ian Devlin documents the various implementation quirks and issues of the ‘date’ input type on mobile and desktop browsers. 22 Essential CSS Recipes Ilya Pestov A great grab-bag of things you can do with CSS along with brief code snippets. Things like gradient borders, counters, and z-index transitions. HTML Tidy Reborn: A Tool To Correct and Clean Up HTML HTACG Tidy is not a new tool but it had fallen into a non-maintained state. A group has now reinvigorated the project and is making it ideal for working with the latest HTML. Dependency-free lightbox and zoom viewer from imgix Imgix  Sponsored Imgix is a real-time image processing service and CDN. Our new libraries enable you to implement lightboxes and zoom viewers without having to create multiple copies of the image, while also delivering it at high quality and speed, to every device or browser. Designing A Product Page Layout with Flexbox Levin Mejia A designer at Shopify looks at how the flexible box model (Flexbox) can be used to create flexible layouts that work across devices. All major browsers now support it. Webmention: A Spec to Notify Remote URLs When You Link to Them W3C A W3C First Public Working Draft of a spec covering a mechanism through which sites can ask to be notified when other sites link to them. webmention.io is a service aiming to help make it easier to implement. CSS Refresher Notes Vasa If you’ve cobbled together your knowledge of CSS piecemeal over the years, as I have, this could be a handy refresher of the main concepts. Leaner Responsive Images With Client Hints Smashing Magazine Client Hints is an initiative spearheaded by Google already available in Chrome and Opera that lets you reduce both image sizes and the verbosity of responsive image markup. Timelined: Customizable Vertical Web Timelines Andrius Built vertical timelines and mix content into the line or to the left or right of it. There are static and dynamic demos to get the idea. It's Time to Rethink Vendor Prefixes in CSS SitePoint Patrick Catanzariti notes that ‘vendor prefixes are fading away as browser teams look for better solutions.’ The Chrome team intend to keep features behind their ‘experimental web platform features’ flag until they’re ready for primetime. Don't Tell Me What My Browser Can't Do Christian Heilmann Christian Heilmann implores us to write defensive code and check for capabilities in browsers rather than break at the first sign of an unfamiliar environment. Jobs Get 10 offers from top tech companies in one week.Indeed Prime is an elite new program from Indeed.com that presents in-demand tech talent like you to top employers. Indeed Prime opens the door to exciting career opportunities with one simple application. Join today. Indeed In brief 10 Years of Web Inspector news A great timeline covering a decade of WebKit’s main developer tool.   WebKit Microsoft Edge Web Summit - San Francisco, April 4th news Free registration opens soon.   Microsoft An HTML5 Player for VR 360° Video - The Next Big Thing? news tools  bitdash We'll take you from beginner to employed engineer, guaranteed course Sign up to start learning everything from HTML to Angular. We guarantee you a job after graduation or your money back.  Thinkful SPONSOR How Not To Misuse ARIA States, Properties and Roles tutorial “ARIA should not be added to HTML content that already has the desired implied semantics.”   Jonathan Avila How I Shrank My CSS by 84kb by Refactoring with ITCSS tutorial  Jordan Koschei Creating a WebGL Game with Unity 5 and 'JavaScript' tutorial Well, UnityScript really, but it’s very similar.   Michaela Lehr Optimizing SVGs for Web Use tutorial  Andreas Larsen The Benefits of Inheritance via @Extend in Sass tutorial  David Nguyen The Axis of Flexbox video Learn about the axes of Flexbox, which are different than the traditional top to bottom, left to right axes.   Guy Routledge Influencing Web Layouts with Print Layouts opinion  Chris Coyier The Current State of Web Security, An Interview with Anselm Hannemann opinion  Robin Rendle Why I Left Gulp and Grunt for npm Scripts opinion  Cory House CSS Gradient Animator tools This simple online tools produces an interesting background effect.   Ian Forrest Flag-Colors: A 600 Color Collection tools Select colors on the page or in Sass, Less, or Stylus. Brand-Colors is similar but using popular brands’ logos.   Piérre vivus.js: Animate SVGs as If They're Being Drawn code  maxwellito Animate Plus: CSS and SVG Animation Library code  Benjamin De Cock voxel.css: 3D Pixel Rendering with CSS code Makes it easy to render Minecraft-esque pixellated block layouts in the browser using 3D CSS.   Hunter John Larco tweezer.js: Small, Dependency-free, ES6 Library for Smooth Animations code  Jackson Geller Pure CSS Apple Keyboard code demo  ByPeople Alex The CSS Husky code demo A clever bit of CSS and SVG-only animation here.   CodePen Give back to the developer community - apply to teach today.  Actively seeking web developers to join our tight knit family of passionate teachers and earn royalties.  Pluralsight SPONSOR Curated by Peter Cooper and published by Cooper Press. Want to post a job? E-mail us or use our self-serve system. Unsubscribe : Change email address : Read this issue on the Web Published by Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK

by via HTML5 Weekly