Site logo

[Resolved] Fix for “mobile content wider than screen” report by google

Home Forums Support [Resolved] Fix for “mobile content wider than screen” report by google

Home Forums Support Fix for “mobile content wider than screen” report by google

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • #2040575
    Michael

    Hi. For some reason, our home page is being flagged now by Google’s Mobile Usability review as, “The following issues were found on your site:
    Content wider than screen”. The page’s overall GB container — in all desktop/tablet/mobile view modes — is set to full-width. How could we have this issue then?

    I do notice though that as I scroll the home page downward on a mobile device, a small amount of horizontal shift of the page is possible. Could this be related? Or is it just an artifact of my Google 4+ screen’s proportions?

    What’s the fix? Thanks.

    #2040603
    Ying
    Staff
    Customer Support

    Hi Michael,

    You have negative margin set for the buttonsblock on mobile:
    https://www.screencast.com/t/tLNvcIJUy2

    Remove the negative margin, the issue should be fixed.

    #2040606
    Michael

    Awesome. Solved! Thank you so much.

    #2040609
    Ying
    Staff
    Customer Support

    No problem 🙂

    #2064429
    Michael

    Actually, no longer resolved… Google reported today that there is still the problem — just in two pages though, our home page and https://whatcommilliontrees.org/about-whatcom-million-trees-project/ Looking at all left/right margins, I don’t see any negative values. Do you? If not, then what else could be the issue? Thanks.

    #2064443
    Leo
    Staff
    Customer Support

    Can’t see anything obvious on those pages.

    Do you still have a staging site set up?

    If so can you try disabling all plugins except GP Premium and GB there to see if the issue still exists?

    #2064448
    Michael

    Thanks for your reply, Leo. The staging site intentionally isn’t visible to google. And even if it was added tonight to google search console, it might be weeks before google would report the problem. True?

    #2064452
    Ying
    Staff
    Customer Support

    I checked the about us page and see an obvious negative margin set for a container:
    https://www.screencast.com/t/sagoMkWjsnQo

    Check all the elements to see if there’s any other negative margin applied on mobile.

    #2064461
    Michael

    Nice catch Ying. 🙂 Somehow I missed that one. Searching the home page for every container in mobile view, there were two that were -1 on the right. Maybe that was triggering it there. Thanks. I’ll mark this resolved again unless Google still reports a problem.

    #2065054
    Ying
    Staff
    Customer Support

    You are welcome 🙂

    #2065198
    Michael

    Darn, Google reported just now that there are still mobile “too-wide” problems with those two pages. Anything else that could trigger this issue other than negative margins?

    #2065532
    David
    Staff
    Customer Support

    Hi there,

    just a pointer – what you may be seeing as a false positive from Googles mobile usability testing.
    First thing to do is to check the site on a real device and ask some other users to…. Leo and I can confirm it looks good to us. And we both reside on different continents which is a great test to do.

    So why the false positive? Google Bot cannot always load 100% of the necessary resources to render the page correctly. Sometimes that is because:
    a) the Resources are being blocked by the sites robots.txt ( i checked your site and that is not the case ),
    b) a cached CSS file is causing an issue and clearing those caches ( such as Autoptimize ) may resolve it.
    c) google bots resources are under great demand at the time of testing and the crawl quota budget it allocates to testing your site is not enough to load all the necessary resources such as style sheets to render the page correctly. Leading to Content too wide, text too small, clickable elements to close together issues being reported.

    What to do?
    If you’re only seeing a couple of mobile usability issues being reported, i would ignore it and run a mobile friendly test on the site in a couple of days.

    If ALL or the majority of your URLs are failing mobile unability then the site needs some better optimization.

    #2065782
    Michael

    Okay, thanks David for the comprehensive explanation. I will clear caches again and run the mobile test in a few days. I’m most worried about our Home page… it looks/works fine on mobile (as you saw) but I’m concerned that this issue will keep Google organic search from ranking it very high.

    #2066172
    Longinos

    Hi Michael, and sorry for spaming this….
    In search console when you do a “URL inpection” you can see a link “View tested page”, when click on it, you see a rigth panel with the html code, a image and a link “More info”, in his one you can see “Page resources”. Normally googlebot lack to load some css and js resources and the page don´t render as it do to a normal user. Some times throw the wider than screen or buttons are too close or some like that, but all related to don´t load a css resource.
    Try to inspect the url until all resources are loaded.

    #2066289
    David
    Staff
    Customer Support

    Just for some peace of mind – have a listen to John Mullers response here:

    https://generatepress.com/forums/topic/mobile-friendly-2/#post-2049852

Viewing 15 posts - 1 through 15 (of 21 total)
  • You must be logged in to reply to this topic.