Mobile website keeps crashing and I have no idea why

Design help General
1

Helloooo

So my website seems to work okay on desktop but it constantly crashes on mobile. I have no idea why (just an average jo tryna make a site) so I was hoping someone might be able to have a look and maybe have some ideas of things I could try to fix it. Also open to any general optimisation suggestions as it’s performance isnt the best. I work in media and need to have a lot of work displayed so the page size is quite big but any tips would be great!

here’s the link - www.creaturemedia.com.au

here’s the read only link - Webflow - Creature Media

Thanks in advance!

2

Hi! First of all, congratulations on great design! Love it!

Some tips on performance.

  1. Replace all images with Webp
  2. Something I try to do is make sure any of my images aren’t greater than 1600px in height or width. Nobody is going to view the image in 5000px width unless they’re plugged into a projector or something.
  3. Make sure you have minimize CSS, minimize JS checked
  4. Make sure you have hit cleanup for both styles and interaction or else all those unused animations and styles are going to still be there slowing down the website.

Hope this helps.

3

Thanks so much for the positive feedback! it’s been a couple years of tinkering and changing but im pretty happy with where its at.

  1. assuming this is a much more web friendly format? will aim to get that done
  2. yeah I have generally been limiting size to hd so 1920px long edge
  3. absolutely no idea how to do this but will have a google
  4. i’ve never done this so will have a google and try see how

Thanks for the pointers!!

4
  1. You can do this from webflow assets panel now. Just select all jpg, jpeg, and png assets (make sure other formats like svg, pdf etc are not selected) then hit compress and webflow will do it for you
  2. Thats great!
  3. To minimize CSS and JS go to Site Setting for the project, then navigate to Publishing and as you scroll down you’ll find toggles for “Minimize CSS” and “Minimize JS”.
  4. So in your Designer, on the left side (where you find the tab options for Pages, Navigator), hover through and find Style Selector. Open this table and on top there is a paint brush which should say “Clean Up” when hovered. Hit this button and it will remove all the unused styles and classes from your code

Similarly for JS, go to interactions on the right side and you’ll find the paint brush near the title as well. Hit “Clean Up” and it will delete all the unused interactions from your code.

This overall will improve your speed massively as you have a ton of unused things there when I checked. I’m including screenshots to both of these as they might be a little hard to find.

Screenshot 2024-08-01 at 3.55.41 PM
Screenshot 2024-08-01 at 3.55.41 PM279×919 29.8 KB

To Clean Up unused CSS

Screenshot 2024-08-01 at 3.59.05 PM
To Clean Up unused JS

Good Luck!

Also what exactly is the issue with mobile? Can you provide more context or screenshots for me to take a look?

5

Thanks so much for all the info, that was super helpful! the mass compress feature was such a relief haha. Compressing now but will try update how the changes affects the performance :)