#399 — July 10, 2019 |
Frontend Focus |
Firefox 68: BigInts, Contrast Checks, and the QuantumBar — Version 68 is now available, featuring support for big integers, whole-page contrast checks, and a new implementation of a core Firefox feature: the URL bar.
Dan Callahan (Mozilla) |
CSS Lists, Markers, And Counters — There’s a lot more to styling lists using CSS than you might think, says Rachel Andrew, including using the new Rachel Andrew |
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 sponsor |
Dark Patterns at Scale: Findings from a Crawl of 11K Shopping Websites — The findings from a large-scale study, analyzing ~53K product pages from ~11K shopping websites to characterize and quantify the prevalence of dark user interface patterns. Princeton University and University of Chicago |
An Intro To Screen Reader Testing for Sighted Developers — This quick guide will give you an introduction to the why and how of testing your website’s user experience using screen readers. Uncaught Reference Error Blog |
Chrome to Get Video Play/Pause Button on the Toolbar — Google Chrome users will soon have a quicker way to pause auto-playing media across all tabs in their browser. This feature is in the Canary build now. Catalin Cimpanu |
The Future of Websites: Headless CMSes? — An increasing number of CMS’s have been shunning traditional database-driven systems in favor of API driven ones, known as “headless CMS”es. Here’s a run through some pros and cons of the approach. Dan Fries |
💻 Jobs |
Frontend Senior Software Engineer & Architect at TrainingPeaks — Bring your engineering best practices to the brand helping athletes and coaches around the world analyze and plan their training. TrainingPeaks |
Front-end Engineer — Goldstar is looking for Front-end Engineers with React expereince onsite in Portland, Oregon and Pasadena, California. Goldstar |
Job Searching Without the Searching? Try hackajob 🔎 — Let your skills do the talking. Get matched to roles based on your favourite frontend frameworks. hackajob |
📙 Tutorials & Opinion |
The Many Ways to Include CSS in JavaScript Apps — A look at the ways in which CSS can be handled within a JavaScript application — something of a controversial topic in the land of frontend development. I like option 1. Dominic Magnifico |
CSS Architecture for Multiple Websites — Elad shares his knowledge and experience from writing a reusable and scalable CSS architecture for use across multiple websites. Elad Shechter |
The Little Legacy Code That Could: A Fable of Software Ownership — A lack of software ownership isn’t a simple problem, but we have a few recommendations that can help your teams. CircleCI sponsor |
Developing a Robust Font Loading Strategy for CSS-Tricks — Zach takes a look at the font loading behavior for the latest redesign of the popular CSS-Tricks site. Zach Leatherman |
Fun Places to Learn CSS Layout – Grid Layout — We’ve linked to a few of these in the past, but here’s a good round-up of some fun places, tutorials and sandbox sites to help you learn Grid Layout. Stéphanie Walter |
Responsive Design Ground Rules — Some ground rules to follow to keep your responsive design robust and predictable. Polypane |
Creating A Multi-Level Hierarchical Flyout Navigation Menu Using Only HTML and CSS Abhishek Ghosh |
A Little Reminder That Pseudo Elements are Children, Kinda Chris Coyier |
How Google Pagespeed Works: How to Improve Your Score Ben Schwarz |
🔧 Code, Tools & Resources |
Pie Chart Maker: An Easy Way to Create Pie Charts — A free tool to create good looking customizable pie charts. Insert your data and it offers up a JPG, PNG, or even an animated version to embed. Beautiful Dingbats |
p5.js: A Client-Side JS Platform for Creative, Arty Coding — This mature project has just had a big release. Check out some of the examples in the live p5.js playground for a feel for how cool this is – it makes putting together visualizations and visual experiments very easy. Processing Foundation |
Web Audio DAW: Using the Web Audio API for Dynamic Sound Synthesis — A Javascript library for manipulating audio using the HTML Web Audio API. “It’s like jQuery for your ears”. Raphael Serota |
Proactively Identify & Improve Issues Before They Affect Customers with Datadog Synthetics Datadog sponsor |
simpleParallax: A JavaScript Library for Parallax Effects — A straightforward, tiny library which adds parallax animation to any image. Geoffrey Signorato |
FormPersistence.js: Preserve HTML Form Data Across Sessions — If people start to fill out a form, why not keep the data around in their local storage in case they leave and come back? Finn Thompson |
|