Kinsta

(This is a sponsored post.)
Huge thanks to Kinsta for sponsoring CSS-Tricks this week! We’re big fans of WordPress around here, and know some of you out there are too. So this might come of interest: Kinsta is WordPress hosting that runs on Google Cloud Platform. And in fact, it’s officially recommended by Google Cloud for fully-managed WordPress hosting.
What does that matter? Well, when you go with a cloud host you’re entering a new realm of reliability. For …
The post Kinsta appeared first on CSS-Tricks.

Link: https://synd.co/2IaNs3o

Scroll to the Future

This is an interesting read on the current state of scrollbars and how to control their behavior across operating systems and browsers. The post also highlights a bunch of stuff I didn’t know about, like Element.scrollIntoView() and the scroll-behavior CSS property.
My favorite part of all though? It has to be this bit:
In the modern web, relying heavily on custom JavaScript to achieve identical behavior for all clients is no longer justified: the whole idea of “cross-browser compatibility” is …
The post Scroll to the Future appeared first on CSS-Tricks.

Link: https://evilmartians.com/chronicles/scroll-to-the-future-modern-javascript-css-scrolling-implementations

VuePress Static Site Generator

VuePress is a new tool from Vue creator Even You that spins up Vue projects that are more on the side of websites based on content and markup than progressive web applications and does it with a few strokes of the command line.
We talk a lot about Vue around here, from a five-part series on getting started with it to a detailed implementation of a serverless checkout cart
But, like anything new, even the basics of getting started can …
The post VuePress Static Site Generator appeared first on CSS-Tricks.

Link: https://css-tricks.com/vuepress-static-site-generator/

Museum of Websites

The team at Kapwing has collected a lot of images from the Internet Archive’s Wayback Machine and presented a history of how the homepage of popular websites like Google and the New York Times have changed over time. It’s super interesting.
I particularly love how Amazon has evolved from a super high information dense webpage that sort of looks like a blog to basically a giant carousel that takes over the whole screen.

Direct Link to Article — Permalink…
The post Museum of Websites appeared first on CSS-Tricks.

Link: https://www.kapwing.com/evolution-of-products

Wufoo and Worldpay

(This is a sponsored post.)
Huge thanks to Wufoo for sponsoring CSS-Tricks this week! Like it says in the sidebar on this very site, we’ve been using Wufoo for literally over a decade. It’s the easiest and most powerful way to build web forms on the web.
Here’s something brand new from the Wufoo team: now in addition to payment providers like PayPal and Stripe, you can choose Worldpay.

This will be a huge upgrade for international users, …
The post Wufoo and Worldpay appeared first on CSS-Tricks.

Link: https://ad.doubleclick.net/ddm/clk/303181152;128762502;s

It’s Time for an RSS Revival

Brian Barrett:
Tired of Twitter? Facebook fatigued? It’s time to head back to RSS.
I’m an RSS reader lover, so I hate to admit it, but RSS ain’t going mainstream. It was too nerdy 20 years ago and it’s too nerdy now. RSS is still incredibly useful technology, but I can’t see it taking off alone.
For RSS to take off, it needs some kind of abstraction. Like Flipboard, where you can get started reading stuff right away and …
The post It’s Time for an RSS Revival appeared first on CSS-Tricks.

Link: https://www.wired.com/story/rss-readers-feedly-inoreader-old-reader/

Working With the new CSS Typed Object Model

Eric Bidelman introduces the CSS Typed Object Model. It looks like it’s going to make dealing with getting and setting style values through JavaScript easier and less error-prone. Less stringy, more number-y when appropriate.
Like if we wanted to know the padding of an element, classically we’d do:
var el = document.querySelector(“#thing");
var style = window.getComputedStyle(el);
console.log(style.padding);
And we’d get "20px" as a string or whatever it is.
One of these new API’s lets us pull it off like this:…
The post Working With the new CSS Typed Object Model appeared first on CSS-Tricks.

Link: https://developers.google.com/web/updates/2018/03/cssom

Going Offline

Jeremy Keith has written a new book all about service workers and offline functionality that releases at the end of the month. The first chapter is posted on A List Apart. Now that the latest versions of iOS and macOS Safari support service workers, I can’t think of a better time to learn about how progressive web apps work under the hood. In fact, here’s an example of a simple offline site and a short series on making …
The post Going Offline appeared first on CSS-Tricks.

Link: https://abookapart.com/products/going-offline

`:focus-visible` and backwards compatibility

Patrick H. Lauke covers the future CSS pseudo class :focus-visible. We’re in the early days of browser support, but it aims to solve an awkward situation:
… focus styles can often be undesirable when they are applied as a result of a mouse/pointer interaction. A classic example of this are buttons which trigger a particular action on a page, such as advancing a carousel. While it is important that a keyboard user is able to see when their focus …
The post `:focus-visible` and backwards compatibility appeared first on CSS-Tricks.

Link: https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/

“Just”

Brad Frost’s “Just" article from a few years ago has struck a fresh nerve with folks. It’s a simple word that can slip out easily, that might be invoked to keep text casual-feeling, but the result can be damaging. Brad:
The amount of available knowledge in our field (or any field really) is growing larger, more complex, and more segmented all the time. That everyone has downloaded the same fundamental knowledge on any topic is becoming less and less probable. …
The post “Just” appeared first on CSS-Tricks.

Link: http://bradfrost.com/blog/post/just/