Tilda Blog

How To Use White Space In Web Design

The principle of proximity improves navigation on your website. It helps the visitors quickly distinguish the sections on the page and see what elements are connected to each other. As a result, it positively affects the user experience.

We perceive objects next to each other as one group. Why? Cause the connections among elements are determined by the distances between them.

We perceive the first composition as a single group, and the second as two separate groups, due to the greater distance between the elements.

How To Use It In Website Design

By applying the principle of proximity, you can separate website sections from each other. To do this, make the spacing between blocks larger than the spacing between the elements within a block. This way you apply the rule: The inner should be smaller than the outer.

On Tilda, paddings between blocks are configured in the Settings tab. You can choose a top or bottom padding and select the value for it.

How It Works Within a Block

One block can contain several groups of elements. To separate them visually, make the distance between groups larger than the spacing between the elements within a group. E.g., if there is 50px between the copy and the button, then the distance to the next group should be greater.

How You Can Apply It To TypographyThe rule of the internal and external also works in typography. Within a paragraph, the distance between words is internal and the distance between lines is external, hence larger. If you add a heading, it becomes an external part, and the distance between it and the copy should be greater than the line height.
Made on