#319: How Stripe Designs Beautiful Websites

Frontend Focus Issue 319 — December 6, 2017 Web Content Accessibility Guidelines For People Who Haven't Read Them A detailed look over the WCAG - a starting point in making your sites work better for all. Alan Dalton How Stripe Designs Beautiful Websites Examining the tips and tricks used to make Stripe’s frequently copied site design a notch above the rest. Lee Robinson Lint the Web Forward with Sonarwhal Sonarwhal is a linting tool for accessibility, security, and other Web best practices. Stephanie Drescher Try SpreadJS, the Most Powerful JavaScript Spreadsheet Component: Fast, Flexible, No Excel Dependency Deliver intuitive, efficient, multi-functional, pure JavaScript spreadsheets for enterprise apps. GrapeCity SpreadJS   Sponsor Cascading Web Design with Feature Queries An introduction to the concept of ‘cascading web design’, an approach made possible with feature queries. Chen Hui Jing The (Far) Future of CSS A speculative look into the future of CSS and Houdini’s goal of making CSS user-extensible. Tab Atkins Debugging React Perf with React 16 and Chrome DevTools An in-depth step-by-step visual walkthrough demonstrating how to audit JavaScript runtime performance and find slow rendering components. Ben Schwarz The Front-End Checklist A more dynamic front-end development and deployment checklist based on an article we linked last month. David Dias Jobs Frontend Developer at X-Team (Remote)We help our developers keep learning and growing every day. Unleash your potential. Work from anywhere. Join X-Team. X-Team Senior Software Engineer with ReactJS+ReduxJoin a growing engineering team that builds highly performant video apps across Web, iOS, Android, FireTV, Roku, tvOS, Xbox and more. DISCOVERY DIGITAL MEDIA Front-End EngineerIndeed Prime is a free service that connects you to hundreds of companies. Indeed Prime In Brief Evolution of 'img': GIFs Without the GIF in Safari news Safari Technology Preview is now supporting loading MP4 videos via img tags. Performance Calendar W3C Invites Implementations of CSS Color Module Level 3 news W3C $20 Free on a New Linode Account  Linux cloud hosting starting at 1GB of RAM for $5/mo. Get $20 credit on a new account. Linode Cloud Hosting  Sponsor Debugging CSS Grid Layouts with Firefox Grid Inspector tutorial Chen Hui Jing Providing Alternate Content for Screen Reader Users tutorial Sam Joehl Manageable Utility Systems with CSS Variables tutorial A look at the difference between Sass variables and new CSS variables. Kasey Bonifacio Happier HTML5 Form Validation tutorial Dave Rupert A Frontend Developer’s Guide to GraphQL tutorial CSS Tricks How to Use CSS Gradients on the Web tutorial Plenty of examples here for getting to grips with using gradients on the web. Adi Purdila Progressive Image Loading using Intersection Observer and SQIP tutorial SQIP is an SVG-based LQIP (Low Quality Image Placeholders) technique. Performance Calendar Live Coding Session: Deploying Node.js Web Apps to App Service on Linux  Learn how to build & package a Node app & deploy it through a CI system to Azure App Service on Linux. Microsoft  Sponsor AudioWorklet: What, Why, and How video Hongchan Choi, a software engineer on the Chrome team, goes in depth about what the new AudioWorklet is, why it’s a great step for Web Audio, and how it works. WebAudio PDX Why CSS Grid Is Better Than Bootstrap for Creating Layouts opinion Per Harald Borgen Bauble Toggle: A Christmas Bauble Toggle Control demo CodePen 'Strike Off' ToDo List Animation demo code When you tick an item, it gets struck out with an animation. Code My UI

by via Frontend Focus