#376 — January 30, 2019

Read on the Web

Frontend Focus

HTML Is and Always Was A Compilation Target – Can We Deal with That? — There’s an ongoing debate in Web development circles over the value of well-formed, easily readable HTML versus more mechanical code that does the job but has been ‘compiled’ from other sources.

Christian Heilmann

Microsoft to Drop Internet Explorer 10 Support in 2020 — Very few of us are surely using IE10 anymore but it lives on in various enterprise deployments. MS is ditching it, however, and pushing such customers to IE11 with a “compatibility mode” instead.

The Register

Learn How to Plan a React Application — Start your next React project with confidence. Learn strategies for tooling, frontend and UX, testing and performance to boost your (and your team’s) productivity. Get your free copy.

Progress KendoReact sponsor

The 10 Year Challenge: How Popular Websites Have Changed — You may have seen the #10YearChallenge doing the rounds on social media. Well, here’s a similar side-by-side look at how some of the most popular websites have changed over the last decade.

Arun Venkatesan

Designing for The Web Ought to Mean Making HTML and CSS — A follow up of sorts to the points raised in Chris Coyier’s ‘The Great Divide’, making the case for designers knowing the coding side of things. This provides an interesting contrast to Christian Heilmann’s item (above) too.

David Heinemeier Hansson

Changes for Developers in Firefox 65 — Version 65 launched yesterday, bringing with it a new Flexbox inspector, WebP image support, new APIs & more.

Mozilla

Google Takes Its First Steps Toward Killing the URL — Google is considering ways to “rework how browsers convey what website you’re looking at” which could ultimately make URLs more hidden and behind the scenes.

Lily Hay Newman (WIRED)

? Jobs

Frontend Developer at X-Team (Remote) — Join the most energizing community for developers. Work from anywhere with the world’s leading brands.

X-Team

Find A Job Through Vettery — Vettery specializes in developer roles and is completely free for job seekers.

Vettery

? Articles, Opinion & Tutorials

Slide an Image to Reveal Text with CSS Animations — Creating an effect where an image slides away to reveal text underneath.

Jesper Ekstrom

Table Design Patterns on the Web — How to use the table design pattern to create/display tabular data on the web.

Chen Hui Jing

The Shape Detection API: A Picture is Worth a Thousand Words, Faces, and Barcodes — Runs through what the Shape Detection API can do, and where you may want to put it into action.

Thomas Steiner (Google Developers)

How Do You Figure? — Highlights what you need to know about the HTML

A Look At CSS Hyphenation in 2019 — Covers current browser support, and how to use it today.

Michael Scharnagl

IMAGECON 2019: Transforming the Digital Experience. Registration Now Open — Join other developers and rich media experts for 2-days of sharing knowledge about creating great digital media experiences.

Cloudinary sponsor

?  How to Make VR with The Web — A seven-part video series with Josh Marinacci covering how to make a virtual reality project in your browser with three.js & WebVR.

Mozilla Hacks

SVG Filter Effects: Poster Image Effect with — Learn how feComponentTransfer works and how you can posterize images with this powerful SVG filter primitive.

Sara Soueidan

The JSConf and CSSconf EU Finances — JSConf EU is a not-for-profit conference but that doesn’t mean it’s cheap to put on. Here are the numbers behind its success.

JSConf EU

Applying Styles Based on User Scroll Position with Smart CSS

Rik Schennink

A Detailed Guide to CSS Animations and Transitions

Mayank Pratap

? Code and Tools

WordArt Recreated in Pure CSS — One for the old school Microsoft Word users amongst you. Type your own text and the text style will change based on the style choosen.

Katherine Kato codepen

Hotkey: Trigger an Action on an Element When a Keyboard ‘Hotkey’ is Pressed — Binds hotkeys to any link with a data-hotkey attribute set. Developed by GitHub itself.

GitHub

Shop Like a Developer – Discover and Experiment with Hot New Cloud Services ?

Manifold sponsor

A Minimalist’s CSS Cheat Sheet — Very simple, very easy to navigate, and has links to further documentation for each item if you need it.

Adam Marsden

Palettte App: A Color Palette Generator — A unique palette generator that lets you create smooth swatches with tools to edit hue, saturation and more.

Gabriel Adorf