October 5, 2016 Read this e-mail on the WebFrontEnd Focusformerly HTML5 WeeklyThe State of HTML Mobile Frameworks in 2016 Kris EricksonA look into the current state of HTML mobile UI frameworks for building hybrid apps.Real Art Direction on the Web Jen SimmonsA step-by-step design process for creating layouts as unique as your content. Learn how Flexbox, Grid, Shapes, Multicolumn, Viewport Units, and more can be combined together to revolutionize how you approach page design. 31 minutesGrid Layout Is A Much Needed Step-Change for CSS Matt Hinchliffe“Grid layout is expressive and logical and it solves a number of fundamental gripes.”Building a responsive HTML5 app? Learn the must-know techniques with this free whitepaper Progress SponsoredIf you’re a HTML5/JS dev, maybe you have already jumped in on a responsive project and would like to learn more. If not, responsive web design will probably be a requirement in the near future. This whitepaper will give you the must-know responsive web.Grid By Example: A Free Video Series on Learning CSS Grid Layout Rachel AndrewCSS Grid expert Rachel Andrew has put together a handy set of short videos covering different aspects of creating your own CSS Grid layouts.A Look at a Redesign with CSS Shapes Eric MeyerSmall but mighty, CSS ‘float shapes’ and feature queries could provide the latest boost to your front-end development toolset.g9.js: Generate Automatically Interactive Web Graphics bijectionDraw graphics, then g9 automatically makes them interactive for end users. There’s a great set of code-driven explanations and demos to learn more.Jobs Senior Front-End Engineer (San Francisco, US)We’re looking for an experienced front-end engineer to join our small team of focused, dedicated technologists. Join us and help build our market leading Enterprise Dashboard. Quri Senior Front End EngineerEveryone should have the power to create professional-quality videos. As a member of the Animoto team, you’ll be developing a responsive, elegant web experience and pioneering the next generation of video creation software. Animoto Don’t love your job? You Should – Try Hired and Find the Right Fit.Hired puts the power back in your hands, by having companies apply to you, not the other way around. With Hired you only talk to companies you’re interested in. HiredIn brief CSS Grid Layout Module Level 1 at Candidate Recommendation news CSS Grid Layout has transitioned to become a Candidate Recommendation. Rachel Andrew WebKit Introduces MotionMark: A New Graphics Benchmark for Browsers news WebKit Software Remodeling Corgibytes’ CEO Andrea Goulet compares remodeling software to how we remodel houses, focusing on biggest value fixes first. It’s about slowly transforming the codebase to become as efficient as possible. Corgibytes SPONSOR An Illustrated Guide to the SVG ‘path’ Element tutorial Described as ‘the ultimate drawing element’. Chris Coyier 10 Things You Probably Didn’t Know You Could Do with Chrome’s Dev Console tutorial Swagat Kumar Swain Responsive Table Layout tutorial Data tables on the web are used to communicate important information to a user. Yet so many of these aren’t mobile-optimized. Here’s one easy way to do just that. Matt Smith How to Add or Remove a CSS Class with Vanilla JavaScript tutorial Sitepoint Things to Watch Out for When Working with CSS 3D tutorial Ana Tudor explores some of the things which surprised her whilst working with CSS 3D, and reviews the challenges encountered so that you might avoid the same. CSS Tricks ‘Progressive Webapps’ is the New Ajax video 32 minutes. Chris Wilson How Front-End Development Can Improve Artificial Intelligence opinion Three ways in which front-end development can improve AI technology. Ines Montani Why You Should Avoid document.write, Specifically for Script Injection opinion Damien Jubeau Frontend Developer at Honeypot (Berlin, Germany) If you have a deep knowledge in JavaScript, Web Standards (HTML5, CSS3), UI/UX, a passion to create the best apps imaginable, and are seeking a new challenge with an awesome team, apply to Honeypot. Honeypot SPONSOR Landmarks: Navigate a Web Page via WAI-ARIA Landmarks tools Matthew Tylee Atkinson stylelint: A Modern CSS Linter tools GitHub Blend: Create and Customize Beautiful CSS3 Gradients. tools A handy browser tool to create CSS3 gradients. Colin Keany text-spinners: Pure Text, CSS Only Inline Loading Indicators code A clever and flexible approach. Optimizing Text Content for Screen Readers code Quick tip on how using opacity and the ::after element can optimize screen-reading output. Here’s a short video demonstrating it in action. Šime Vidas Super Mario Kart Map Recreated in 3D with CSS demo A fun use of CSS 3D functions to create a playable Mario Kart demo — use the arrow keys. Code available on the CSS3Dprototypes repo. xem Curated by Peter Cooper and published by Cooper Press.Unsubscribe : Change email address : Read this issue on the WebPublished by Cooper Press Ltd. Fairfield Enterprise Centre, Louth, LN11 0LS, UK Source link