The right balance of visual design elements is crucial to a composition’s appeal, user perception and the overall artistry. Web designers are familiar with the three principles of design and how they contribute to the engagement level of a site, but often clients are not. They may request a logo to be increased in size or decreased and just that small change could throw off the entire composition. In this post we’ll explore three principles of design that experts and novices alike should familiarize themselves with.

Dominance Equates to Attention

When it comes to design, an element which exudes dominance over another immediately grabs the viewer’s attention. Dominance can be embodied by the size of an object, color, shape or a number of other factors which make it stand out from the background.

In the image below, the larger square on the left panel is dominant over the smaller square but not to the same degree as in the second panel. The large square in the second panel clearly is more dominant due to its size in relation to the composition.

Visual dominance does not have to be limited to size or proportion. Color can also serve as a focal point to demonstrate dominance as well as value, depth, texture, saturation, density, white space and orientation. Brand names and titles, for example, are typically larger intentionally for branding purposes. Likewise, you can make objects subordinate by juxtaposing them against elements which create contrast. In essence, for an object to exert dominance it has to stand out from the elements around it.

Keep in Mind Focal Points

Focal points, the second element of design we’ll discuss, is what holds the viewers attention or interest. In theory, the focal point should be apparent second to the dominant element. In some instances, the focal point and dominant elements may be one in the same, depending on the designer and message conveyed. In the image below, notice how the red sphere is the focal point. While it’s not dominant over the other elements in size, it does draw the eye’s attention due to the contrast of colors.

Visual Hierarchy

The last element we’ll explore is visual hierarchy. By the name, it may be apparent that this indicates distinct visual levels. Typically these are visual levels of dominance to dictate the scale of importance. We use visual hierarchy on a daily basis when scanning newspapers, magazines and web pages. The objects at the top (headline, titles, etc.) tend to be the largest and most significant factors so they are prioritized on the hierarchy scale. Next we may scan subheadings, followed by text. In design, it works the same way. Naturally our eyes scan from top to bottom so the design may flow in a linear fashion.

These elements all contribute to the aesthetic appeal of a website or visual medium. In some instances, clients and designers may have different opinions regarding the right balance of contrast, focal points, and dominance. It’s important to remember that personal taste contributes to a user’s perception of aesthetics so there isn’t necessarily a right or wrong way in design. All members of the team should recognize how the elements work in unison with one another to create the grander picture.