Designing websites and landing pages is no easy thing. Even the best designers fail to create designs that “work” when they need to. But how do you know if your design is working? Easy. A design works when readers absorb and internalize your message and then respond according to the prompts given to them.
It’s easy to tell if a web design is working. Web designers have special analytics tools to gage the success of their designs based on things like click rates, heat maps, and the all important conversions. The difficulty comes when designs are NOT working, and we aren’t sure how to fix them or what’s going wrong. That’s when bad design happens.
When bad design happens (and it happens to a lot of designers), it’s time to go back to the basics. Here are 7 fundamentals that the best web designers master to ensure their designs always work.
1. Space
Space, or “white space” in graphic design speak, refers to the emptiness around design elements. Many believe that emptiness is the sign of an incomplete design, but that simply is not true, in fact, often times it is the misuse of white space that causes a design to fail.
White space is an essential element to graphic design. It’s so important, you could even say web design is fundamentally the skillful arrangement of white space. It’s the glue that holds design elements together, it invites readers into a design by giving them an entry point, provides movement for a reader to follow, and can be used to cleverly ask the reader to engage in the design by asking them to complete the design for themselves.
White space can make or break a design. Use it well and see your web designs succeed. Use it masterfully and create something truly breathtaking.
2. Unity or Gestalt
“Gestalt” is a german word used at the inception of modern graphic design to describe a design’s wholeness. It describes how the individual elements of a design are less important than the design as a whole. In other words, the message of a design is more important than what you use to convey the message. Even the best web designers can get lost in the details and lose focus of the reason a website or other design is needed, which is why it’s essential to have a thorough process laid out to keep designs focused and unified.
Unity also tells us that elements of a design must work together toward a common goal. Any design—a web page or a business card, a logo or a bumper sticker—they all have a voice or character that we hear in our heads as we read along. If design elements have too many different voices, the design becomes muddy or unclear, and the message is lost.
One word of warning—while unity is essential to making a design work, be cautious of carrying unity too far into bland similitude, which can be just as distracting and destructive to a design’s goal. Contrast creates interest, so use it well. Keep elements in context of the whole, and watch your design work.
3. Color
There’s a lot to consider when choosing colors for your designs. There's an entire world of literature devoted the understanding of how people respond to and interact with specific colors. It's as important to understand the psychology of color as it is to understand how colors are created. Additive colors, created by combining red, green, and blue light, appear very different from subtractive colors that you see on a printed page. As a graphic designer, we have to understand fully how to create color before we can use it well.
Color can add to a design as much as it can take away from a design. It can aid in organization, give emphasis, & provide direction. It can communicate hierarchy, too. Darker type (high contrast) is always read first, as is text in red. But color can become a meaningless mess if overused. Too much color can be distracting and can muddy the message of a design, so be judicious when you use it. Remember that just as the message is more important than any one design element, contrast in color is more important than colorfulness.
4. Point, Line, & Plane
These three are the building blocks of visual designs. A point can be defined as the smallest unit of marking, a line as the trace of a point in motion, and a plane as a trace of a line in motion. Typically we think of these elements as a dot, a stick, and a flat area respectively. But what if they weren’t?
By playing creatively with these elements, we invite our readers to engage with our designs playfully as well. Web design is not just accurate communication, it’s about connecting ideas in a novel way to leave a lasting impression on your readers (and maybe even get them to make a purchase).
5. Scale & Dominance
Scale refers to the relative size of elements on a page. By altering scale, we can attract attention and create larger-than-life drama. This is a foolproof way to capture a reader’s attention and help them focus into a message.
Dominance describes how a design element can stand out on a page to create an entry point for readers, and affect the meaning of other design elements. This can determine a focal point of a design, and make old ideas feel fresh and new.
6. Hierarchy
The best design moves a reader through information in order of its importance. Hierarchy establishes what’s most important and outs that in front of a reader first. Humans can only hold about 3 levels of importance in their minds at once, so we often see the best web designers use an initial dominant idea followed by a secondary thought and then everything else grouped together. This can be tricky when you have a lot of information to convey at once. Consider how you may be able to cut information out, or redistribute it to make more sense somewhere else so your designs stay on track and communicate your message.
7. Balance
Balance is the state of equalized tension. It can be created through symmetry, or formal balance, which can feel static, constant, and calm. Balance can also be asymmetrical. When placed on a scale, a pound of gold will find balance with a pound of feathers, but will obviously not look the same. In design, elements can be dissimilar and still find balance. The trick to asymmetrical balance is the masterful use of white space.
The third type of balance is called “overall” balance and is usually the result of an overfilled page. The result is balanced but lacks hierarchy and can be overwhelming and noisy, which can be difficult on your readers. It’s best to avoid this type altogether if possible.
Balance is essential to unity. If design elements are out of balance, the singular design message is lost, and the design has failed. Keep your designs balanced by focusing on white space distribution and hierarchy of information.
Graphic design and web design are truly more science than art. There is a process to the choices we designers make to create cool designs for our clients, and when we break the process, we can end up with unclear designs that simply don’t work. By mastering these fundamentals of design, we can accomplish our task of creating designs with clarity and purpose, resulting in engaging, exciting, and readable messages that convert site visitors to lasting customers.
No matter where you are on your creative journey, Clay Schmidt Creative is here to help. Whether you’re looking for a new design for a business card, website, logo, or even a new font to tie your brand identity together, our graphic design services are the best in Tampa Bay and St. Petersburg area.
Contact us today for a free consultation.