We’ve just updated our website!!! Now Blocs + Animated SVG
https://www.consyncdigital.com/
Power of Blocs App!
We’ve just updated our website!!! Now Blocs + Animated SVG
https://www.consyncdigital.com/
Power of Blocs App!
Looks nice @mackyangeles, the tile should be “Blocs + Keyshape = Animated SVG”
I’m just curious why not 1 SVG vs using 2 like you did ?
Hi @Blocs_User, thank you! yep! Keyshape is awesome!
Why not 1 SVG vs using 2? I have to set it as background. So I have to separate the bloc for content
@mackyangeles Sweeeet! very nice indeed. How exactly did you achieve this? Could make a wild guess but would love to know if you feel like sharing.
Just create an Animated SVG via Keyshape and set it as background
@mackyangeles I just looked this is up on the website Can I use... Support tables for HTML5, CSS3, etc and SVG browser compatibility varies widely depending on the usage. Have you have tested this with browsers like IE and Edge to see what happens?
Surprisingly, it works fine on latest Edge but not on IE11 with Win10 (all up to date).
When factoring using “cool effects” you might want to check page speed…just a tip.
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fconsyncdigital.com%2F
Google Page Stats:
PSI estimates this page requires 6 render-blocking round trips and 55 resources (6.7MB) to load. Fewer round trips and bytes results in faster pages.
The proper way to test page speed is by an actual test …the results do have to be with a “grain of salt” a bit but customers do just leave slow loading sites. It also affects your SEO. If you check your google analytics for example you will see the bounce rate improve in your favor with faster loading pages. Especially the home page…
May I ask, once you create it in Keyshape what export format and options do you use to make it work in Blocs ? Thanks for your help.
Cheers
Phil
Animated SVG format
Hi Thanks for your prompt reply. @mackyangeles
However, under format only the following options are available :
And under Animation the options are :
I have tried a number of different combinations but cannot get it right.
Which options have you chosen ?
Thanks again for your help.
Cheers
Phil