Show Me the Data - A Blog About University and College Websites

Rock-solid websites are the foundation of effective digital marketing, communications, e-commerce and social media campaigns.

But, you can’t know if your higher education website is rock-solid without checking it.

We study higher education websites to identify and benchmark the critical issues and we publish the results here.

Our automated higher education website quality assurance service is founded on our research so you can find and fix issues from privacy and security, through social media usage and SEO, to website analytics and content.

How To Make A Mobile Friendly Website: Links Too Close Together (3/5)


Fixing “Links Too Close Together” Failures

Our previous posts have addressed preparing your website for mobile-friendliness.  We looked at the background to what being mobile-friendly means, the Google mobile-friendly test tool and we set out solutions to the two easiest of the five problems Google’s test tool highlights.

We turn our attention to a more complex problem that the tool identifies.

Links Too Close Together

Google uses the alliterative term tap targets to refer to web page areas that allow users to interact with a site, be these links to other pages, selection items or buttons.  A “Links Too Close Together” failure means that the mobile-friendly test deems the tap targets to be too small or too close.

Google’s Android User Interface guidelines recommend that tap targets be at least 7mm (48 CSS pixels) in size, within a properly set viewport.  And, Google says the gap between tap targets should be at least 5mm (32 CSS pixels) both horizontally and vertically.

This specification sounds easy to meet, but consider the situation in which you have a link for a small icon or very short word.  Forgetting about mobile friendliness it would be easy for the tap target to be too small to pass the size and spacing guidelines.  But, what about the situation in which links appear consecutively within a text paragraph such as: We think you should visit link1, link2 and link3?  This commonly occurring text format is very likely to produce tap targets that are too close together to pass the mobile-friendly test.  What can be done?

If you have multiple content contributors, or a large number of close links, it may be impractical to ‘reword’ each instance and increase the gaps between and the size of the links.  A more systematic approach is needed.

A solution is to use CSS styling to include margins around the links to increase spacing and use padding to increase the tap target size.  This solution may cause pages to render clumsily under certain circumstances.  

When links are included in text and the anchor text is long or includes many words the browser is likely to break the link across lines.  Breaking in this way will cause readability issues especially with multiple adjacent links.  We recommend limiting the anchor text length, judiciously including non-breaking spaces between words and separating links with other text.

You can use Google's PageSpeed Insights to determine which tap targets are problematic and will need to be fixed to pass Google's mobile-friendly test.

In the next post we address: Text Too Small to Read. In the post we cover using CSS media queries to increase the base text size for mobile viewing and improving readability for visitors using mobile devices.



Sign Up for Email Delivery:

We collect the following solely to email you new blog posts.

* indicates required

MailChimp stores your details. We do not share data with third parties.



eQAfy helps higher education institutions manage their web estates and helps websites be error-free and
deliver their intended user experience and meet their marketing and communications objectives

Run a sample QA audit


Photo Credit: +Simple |



Sign Up for Email Delivery:

We collect the following solely to email you new blog posts.

* indicates required

MailChimp stores your data.
There's no sharing with third parties.
Unsubscribe or ask to be removed at any time.


eQAfy Logo


Higher Education Website QA


Rock-solid websites are a foundation of effective digital marketing, communications and social media campaigns.

You’ll only know if a site is undermining campaigns, harming reputations or creating risk exposures by checking it.


Run a sample QA audit

25 Most Recent Blog Posts