July 31, 2019 #402 — July 31, 2019Read on the WebFrontend Focus I Used The Web For A Day On A 50 MB Budget — Data can be prohibitively costly, especially in developing countries. Chris Ashton puts himself in the shoes of someone on a tight ‘data budget’ and offers (a lot of) practical tips for reducing our own sites’ footprint. There is genuinely a lot of useful stuff in this post — read it! (And I might be showing my age here but I remember when aiming for 30KB total was a thing..!)Chris AshtonForm Design: From Zero to Hero All in One Blog Post — A quick and to-the-point guide for designing forms that “everyone can use and complete as quickly as possible”.Adam Silver Image & Video Management Made for Front-End Developers — Simplify and automate the process of uploading, manipulating, optimizing, and delivering images and videos across every device at any bandwidth. Try Cloudinary. See how easy media management can be. Get your own free account today.Cloudinary sponsorThe Real ‘Dark Web’: The Quiet Majority of Web Developers? — An interesting opinion piece that reflects upon the quiet majority of Web developers, and how the minority of developers using cutting edge tools and techniques are not truly representative.Charlie OwenSites Could Be Liable for Helping Facebook Secretly Track Your Web Browsing, Says EU Court — The argument is that users should have to consent to being tracked with ‘Like’ buttons.Adi RobertsonNew (US) Bill Would Ban Autoplay Videos and Endless Scrolling — US lawmakers are taking aim at Web-based features that are ‘designed to be addictive.’ Early days, but this could become a commonly discussed topic in years to come.Makena Kelly? JobsSenior UI Designer (Munich) — Shape the product design of the leading digital wealth management FinTech in Europe, located in the heart of Munich.Scalable Capital GmbHWe’re Trusted by Over 100k Developers to Help Them Find Their Dream Job — Get matched with companies like Apple, Skyscanner and KPMG based on your skills. They apply to you, salary upfront and no recruiters.hackajob? Articles, Tutorials & OpinionCreating an Accessible Inline List with Bullets Between Items — Basically a horizontal list with a character between each item, a · bit · like · this.Artem Sapeginoutput: HTML’s Native Live Region Element — A look at the output element and it’s suitability for creating a native toast element (plus accessibility considerations and quirks).Scott O’Hara? Design System Magic with CSS Houdini — A look at how Houdini features can be used in your design systems today.Samuel RichardBackend for Frontend – How to Develop Custom SPAs with Tailored API — Need to refresh your software without breaking the business logic on the backend? Introduce the Backend for Frontend.The Software House sponsorAn Overview of CSS Animation Libraries — A look at the current landscape of CSS animation libraries and how they vary.Chris Coyier? Writing Tests For CSS Is Possible! Don’t Believe The Rumors — Overcoming “egoprogrammophobia” by writing tests to refactor your CSS.Gil TaylorHow to Add Flexbox Fallback to CSS Grid — Adding a flexbox fallback to a calendar built with CSS Grid.Zell LiewQuick Tip: Responsive Iframes — What you need to do to make an iframe responsive on a website. It’s trickier than it looks and CSS is definitely involved.Chris CoyierThe State of JavaScript: 2019 and Beyond. Get the WhitepaperProgress Kendo UI sponsorWhy You Should Definitely Learn How to Use CSS-in-JSBrent Jackson? Code, Tools & Resources A Satisfying Liquid Simulation — Merges WebAssembly and WebGL together. Shake the window about to see it in action. Uses the LiquidFun engine and the regl WebGL library.Lorenzo CadamuroA Web Tool to Create ‘Striped Text’ and Get Styled Components Code — One of several visual design tools on Components.ai. This one lets you dynamically create a stripy text effect and provides CSS and Styled Components code to use in your apps.Components.aix-autosuggest: Autosuggest Results Based On Input — A JavaScript autosuggest input. Here’s a demo.Ivan Nikoli?Gradient Magic — A growing gallery of unique CSS Gradients.Jordan Marshall ? Upcoming EventsWebAIM: Web Accessibility Training, August 13-14 — Logan, Utah — Covers everything from basic web accessibility principles to advanced accessibility techniques.Front Conference, August 29-30 — Zurich, Switzerland — A two-day double-track conference for everyone involved from concept to implementation.Web Unleashed 2019, September 13-14 — Toronto, Canada — Covers a variety of front-end topics leaving you ‘informed, challenged and inspired’.CSSConf, September 25 — Budapest, Hungary — A community conference dedicated to the designers and developers who love CSS.? …and finally A good reminder that it’s always worth knowing about the actual technology you’re using as well as the interfaces to it. A bit like knowing how to add by hand as well as how to use a calculator.. Source link