Page Fade Out & Fade New Page In

General
1

Hi there,

I saw a page fade out/in animation on a website a while ago.

I was wondering how to achieve this in Cwicly?
And the main point, would a fade out/in influence the page loading time?

2

I think page loading transitions were a thing to improve the experience of a website’s visitor when the internet was a lot slower than today.

Today, I think page loading transitions, in most cases, make UX a lot worse.
Why?
Because it increases the time (significantly) until a user gets served with the content.

It’s in the same category as manipulating the scroll behavior or the scrolling bar.
In most cases, it’s horrible UX.

But there, of course, are exceptions.
Either way, one can freely decide what to implement on a website.

Unfortunately, I can’t recommend any scripts to you.
As mentioned, it was a lot more popular back in the days and I didn’t find any modern solution.
Seems like there isn’t that much interest anymore.

I think there are a couple of easy ones to use and implement.
They all rely on jQuery as far as I can remember.
So if you are interested in that, I can hint you some proper solutions.

The only scripts I am interested about are barba.js and swup.js.
I used them in some custom projects but couldn’t figure out how to implement inside WordPress.
Main issue is the dynamic content and different scripts which needs to be swapped per page.

Of course it would.

But, it would be that little, the only way to recognize it is through a measuring tool.

Plus, due to the page loading transition, which increase the time until the new content is displayed, it wouldn’t be recognizable anyway.

So, should Cwicly have such a feature natively available?
If you are interested in it, just create a feature request and let’s see what the users think about it.

Maybe, this will be possible with interactions at some point.

1 Like
3

Wow @Marius,

thank you for the detailed reply.

I looked at some scripts, but I am not that familiar with scripting, so I jumped directly to testing in Cwicly. But I could not achive any results with Interactions jet, hence the question.

Don’t get me started :rofl:

Now that you mention it, I think that the page loaded quite slowly :thinking:

I haven’t even thought about the UI availability with a fading effect. I like fast pages and agree that it would influence the UX in a bad way by waiting until the fading is done.
And it is probably not a good Idea to flash a 0.3 second fade out/in effect into someone’s face ^^

Will revisit this topic if I have a site that has really slow loading speeds… Well with Cwicly that might be really hard :yum:

1 Like