Having an orderly and balanced view which allows the viewers to immediately determine what they are looking for.
Things that have a connection stay close together. When separated, it is natural to assume that they do not have any ties with one another.
Examples of Proximity in Web Design
Web Forms are good examples of proximity as the labels and fields are grouped together. This helps the user understand the form quickly and completes it correctly.
When grouping items together, we put together things that are similar.
Examples of Similarity in Web Design
The buttons are similar and are expected to perform similarly. The white tabs suggest that they all have the same function while the red tab grabs the user’s attention to get them to sign up.
When looking at something, we often separate out a foreground (figure) and a background (ground). The foreground is the primary subject that the user should focus on and the background is generally ignored.
Examples of Figure-ground in Web Design
The most basic principle in web design is to allow the user to see that an action is possible. A button that pops out from its background is a simple example of ‘Figure-Ground’ relationship.
When we see a line, our eyes follow it towards the direction that the line is going till where it ends.
Examples of Continuation in Web Design
When designing an interface, there needs to be a consideration for the ‘Continuation’ principle as the user’s eyes will follow a certain path, pausing on the most prominent graphic elements.
When given incomplete information, humans find patterns to seek completion and fill in the bits and pieces that do not actually exist to fill up what is missing.
Examples of Closure in Web Design
An example of ‘Closure’ is when users are prompted to guess invisible elements by looking at the visible elements. In this example, 4 images are hidden but there are enough visual elements for the user to understand that the next image is just one click away.
The term Gestalt means “form” or “shape” in German. It is important for a website to look neat, specifically in a way that allows the users to feel more connected. Such uses of optical illusions make use of the brain to allow users to feel connected with a site as they browse. It is beneficial to consider Gestalt principles while designing websites, as all of them work cohesively to help achieve a better structure and graphic design for your website.