Download
We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

Getting a tap targets not appropriately sized.

  • #9773
    Avatar photo[anonymous]

    I am on the latest version of Publii and mercury v2.4.0.0 site is https://cluckin.net/

    When i run my pages through pagespeed insights I am getting this warning in the mobile friendly report. If I am reading the report correctly it seems to be suggesting that the menu button and search button are too small.

    It is not affecting my page experience score in webmaster console.

    Tap targets are not sized appropriately 33% appropriately sized tap targets
    Interactive elements like buttons and links should be large enough (48x48px), and have enough space around them, to be easy enough to tap without overlapping onto other elements. Learn more about tap targets.
    Tap Target
    Size
    Overlapping Target
    Menu
    <button class=”navbar__toggle js-toggle” aria-label=”Menu”>
    24×16
    Cluckin

    Search
    <button class=”search__btn js-search-btn” aria-label=”Search”>
    15×52
    Cluckin

    #9790
    Avatar photo[anonymous]

    @themuttsknutts

    Just a thought … Before you get too involved in addressing a mobile compatibility problem, if your site code is based mostly on one of the excellent bought themes available from GetPublii.com, it’s possible (probably likely) that the Google test tool itself might be wrong. I’ve found this on multiple occasions.

    To verify, when using Google testing tools, choose the button to ‘Test Live Version’, and compare that with the Google search engine indexed version. You may find that the ‘live version’ passes all Google mobile compatibility tests. Just choose ‘Done Fixing’ and ask Google to validate your site. If your live site version tested as mobile compatible, most likely, the latest validation will come back just fine too.

    If you find that is true for you too, the most likely possible explanation is that there is a mismatch between Google testing tools. Do remember, Google is a little like a Construction / building site: nothing tends to stay fixed, they’re probably testing new ways of … doing anything and everything constantly.

    #9791
    Avatar photo[anonymous]

    @themuttsknutts

    Update: a test on https://cluckin.net/ at: https://www.google.co.uk/webmasters/tools/mobile-friendly/  shows there are multiple problems. Options seem to fix include: (a) You could address the problems one by one: this route might be lengthy and stressful. But if you like learning about coding, aren’t in too much of a hurry, etc., why not go for it. Or (2) get a consultant into help. Clearly, there will be additional costs for this option. Or (3) choose an existing bought theme from GetPublii.com — that is already mobile compatible (to-date, they all are :-), then focus on getting your content into that theme, and and including your various ad modules, etc.

    My vote would go to (3) as this probably would get you up and running sooner, keep everything under your control, is probably cheaper, and should allow you to get back to the real work of a business website: to make it work for you commercially.

    My other suggestion if speed and website quality is your thing, if you do opt to use one of the existing GetPublii.com themes, apart from the different various layout options and CSS changes you may make for colour choices, etc., unless you know what you’re doing, I suggest don’t mess too much with the coding. Why: all of those themes tend to have been designed to a remarkably high standard and GetPublii.com fix and tweak them over time to make them and Publii itself better and / or compatible with a changing web. So all this helps save time for you so you can focus on your business.

    #11409
    Avatar photo[anonymous]

    @itips3727 i got the same kind of problem but i checked on my mobile, and it is true that the font size is really small too small even for me, so google pagespeed insight warn me too about it ! https://bihr-module.com

    but with the free template i cannot increase font for mobile, so what will be the best template premium to let me manage all this please ?

    I am ready to buy it because you really did a good job with PUBLII so you deserve it (-_-)

    thanks

    #11412
    Avatar photo[anonymous]

    @bootikexpress

    Perhaps one of the start-off Art Gallery themes at: https://demo.getpublii.eu/themes/artgallery/ might work well for your site at: https://bihr-module.com

    A quick double-check with Google Lighthouse testing tools seems to show that it does address the font size issue shown in your https://bihr-module.com site.

    Though there are probably others you could choose instead.