Can someone test this site on a phone?

Design help General
1

I’m trying to figure out where the problem is with this site:

http://einclick.webflow.io/

When I open the site on my Moto G, the site loads but is completely unresponsive to anything I do. The mobile menu won’t open, I can’t ‘pull down’ the page to refresh, but I can use Chrome’s menu to hit the refresh link, but the site does not refresh. It’s like it’s completely locked up.

I installed FireFox on the Moto G, and boy was it ever slow to load up but otherwise works fine once loaded.

I went back to Chrome to get the version number and was able to open my mobile menu, go to the About Us section but now the site is unresponsive again.

Mobile Chrome Version 45.2454.94
Android version 5.0.2 (Lollipop)

Public Link: https://preview.webflow.com/preview/einclick?preview=66d86a2f153450d4e0429baf04714cf4

2

Didn’t test it on my phone, but it’s working in Chrome’s mobile emulator…

It’s a super useful tool in Chrome’s developer tools that allows you to mimic all kinds of devices. Read more about it here… Documentation - Chrome Developers

3

it’s totally hosed on an iPhone Safari.

4

Thanks but it seems that we need a true test instead of an emulator. useful tool but ultimately the real world is what helps.

And given that it doesn’t work on @Revolution’s iPhone, this seems to be a bigger problem than an isolated device now.

Thanks all.

5

Suggestion. pull your navbar out of the section.
Place the section level… just below the body. Fixed Top.

6

your teaser has 2 containers.

Why not just make a new section for the 2nd container.

I see that you are classing (some of) your containers as well.

I generally don’t class my containers (my preference)…
instead I insert a div and class that to my needs.

I think the issue is your Percentages… you have 100% and 15 top padding.

Try removing the top padding to see if the percentage issue is fixed.

Also maybe use 100vh for min height.

7

The main problem I can see straight away is that the page size is 4.4Mb, which will kill load speeds. Shouldn’t be more than a 1Mb ideally.

Also totally freezes on an iPhone and the logo isn’t retina quality.

Also, just my personal opinion, but the design needs a lot of work imo, as is very powerpoint like currently.

8

Can’t say that I disagree with anything you noted. Sadly, much of what you have noted is out of my control. the logo I got from the client, there is no other version. The design is something the Client wants, to no bitter end on my part for trying to change it.

As for page size. Can try to trim back the image sizes but not much else I can do really.

What I wouldn’t give to have a client who utterly listens to my advice when it comes to designs…

9

Tell me about it. I do work with a few local councils, and is painful at times.

1 Like
10

I need a sales guy. Someone who can really work wonders with words. While I’m good enough with the tech stuff, not so good at getting bonehead clients who don’t understand that the website isn’t for them…it’s for their target audience!

To be honest, I’m surprised that this site is as ‘clean’ as it is. Designing for Asians can be nerve wracking. They honestly believe that ‘more stuff’ means they are ‘more knowledgeable’ and that’s a direct quote from them. So, grind my teeth, bite my tongue and plow steadfastly forward into insanity.

I appreciate the feedback. While I can work things, I still have a long way to go to really get the proper hang for overall design.

1 Like
11

For additional compression with zero loss of quality I use tools like imageoptim.com which can save an extra 10 to 20% off of the average already compressed file, as it strips out all the unnecessary meta data etc. But that’s for mac only, as is CodeKit (https://incident57.com/codekit/) which I also use. But I’m sure there’s a pc alternative if that’s what you are working on.

12

I was trying to see where all that weight was coming from and you have a 1.7Mb image being used at 200px wide in the news section. For retina quality it needs to be 400px, so I’ve resized it to 400px and reduced the file size to 32kb for you. See attached.

That alone will cut 40% from your page weight.

2 Likes
13

Thanks.

Seems I got the page down to 1.4MB but mobile loading is still not working on my Moto G. Page loads, slowly, but then…dead. Can’t do a damn thing with it.

14

I noted that those two annoying scripts were still ‘showing’ on mobile, disabled them but still no change :frowning:

15

Ah, that helps out tons. Makes more sense. Thanks.

16

It’s totally freezing up my web browser if I scale the browser down to mobile size and refresh it. So there’s something seriously wrong there.

I know probably annoying to do, but you might be better off starting a fresh site and then bringing in the sections one by one and testing as you go to find where the issue is.

So wireframe it and getting all the text content working properly first, and only once that’s complete then get into styling it and doing animations etc.

Or export it and open in a code editor, and chop out a section at a time to test. But those widgets seems a likely candidate at a guess.

17

Hmm, I set the widgets not to display on mobile, I’ll remove them and see how that works at a start.

Site is supposed to launch real soon…so redoing it isn’t exactly optimal :confused:

18

You mean this for each section correct? I tried this, it killed any content within it. I set the max and min to 100VH, the page showed nothing of the container/paragraph inside the section then.

19

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.