Avoid gaps between elements that give the illusion that the page has ended when it really hasn’t

Avoid gaps between elements that give the illusion that the page has ended when it really hasn’t

False bottoms are when your page gives the illusion that the page has come to an end somewhere in between sections where it really hasn't. This is usually caused by big horizontal empty spaces or horizontal lines.

sample of a false bottom

Here’s a few ways to counter this:

  • Identify possible ‘false bottoms’ and decrease those gaps reasonably
  • Extend elements through the fold
  • Consider overlapping design elements
  • Consider indicating more content using visual cues such as:
    • texts and graphics (can be animated)
  • scroll-down buttons (that can be clicked)
  • links to target locations within the same page