(Update. Brian points out that view transitions might be a big thing when it comes to progressive web apps (PWAs, initialism collectors). This makes sense to me in the context of trying to move things away from closed apps to the open web.)
There’s been a lot of excitement about “view transitions” coming soon to browsers. This will make it easy to animate transitions between pages, regardless of whether you’re building a Single Page App (SPA) or Multi Page App (MPA, AKA a traditional “website”). This is best demonstrated by Dave Rupert’s demo:
meta tag and a few lines of CSS, much like you can set up a website dark mode really easily.
Similarly, you can go ahead and use the code right now, even though it only works in bleeding edge releases of Chrome. Until it’s been implemented you’ll just get the traditional page experience. This is the same “progressive enhancement” approach you can use with
text-wrap (even if it does mean you’ll fail HTML validation if you inline your CSS. So it goes.)
So that’s all good, but I’m a bit… underwhelmed. This seems fairly gimmicky to me, in the same way as being able to style your website scrollbars.
I’m assuming there aren’t the same accessibility problems – it’s also cool you can turn transitions off by wrapping them in a
not (prefers-reduced-motion: reduce) media query. I’ll also assume they don’t cause performance problems on low spec devices, and that there’s a fallback if the target page takes ages to load.
No, my only questions are is this actually that amazing? and what problem does it solve? Have web developers been dreaming of this for years? One of the selling points of SPAs is that they offer “instant” transitions, and this does enable us to achieve the same effect on traditional websites.
Perhaps we’ll see a glut of these animations once browser support ramps up, and then the interest will die down as they become an annoyance. Perhaps a few more art-directed sites will explore how they can be used, but most will continue to simply display a new page when visitors follow links. This doesn’t strike me as a particularly broken way of doing things. But then I could be wrong, and this is how movement between web pages will look in the future. I guess then it could become the default browser behaviour, with no coding required at all.