Website Design June 24th, 2021
Creating an effective website involves the strategic planning of design elements. This consists of more than using colourful images or adding a video: everything from the layout to how to get users to continue scrolling needs to be planned. In this article, we outline some major design elements that look great and add value to your website.
Typographic hierarchy is the practice of structuring text or data to emphasize important information. This is a common practice used on websites used to ensure critical information is drawing the needed attention.
For example, the Cognitive & Interpersonal Therapy Centre (CITC) works closely with individuals struggling with anxiety, depression, and other mental illnesses. As you can see in the image below, their header text uses a typographic hierarchy. The main goal of the CITC is to help individuals manage their mental illnesses, so the first and largest text immediately offers this added value.
With the smaller text, we elaborate on how CITC helps people manage and reduce stress. This order allows us to draw attention to major points, then transitions them into reading the additional related text.
Subtle animations are a great way to be creative while catching a user’s attention. Now, before elaborating, let’s be clear on what a subtle animation is: subtle animations are small movements applied to design aspects of the website. This could be as large as using a video in your header, or as small as having icons bounce up and down.
Another example is having your copy be “pulled” onto the screen so it appears as users scroll. Either way, subtle animations should be applied strategically to essential pieces of content.
The purpose of subtle animations is to capitalize on the innate need for the human eye to focus on moving options. We are naturally built to be drawn to moving objects in our peripherals. Due to this, animations not only draw attention but also entice people to continue scrolling!
This is a crucial part of ensuring your page flows and that people are viewing the valuable content. However, there is a downfall to subtle animations: depending on the animation type, and how many are used per page, animations can slow your site’s load speed. This can thereby affect your bounce rate and overall SEO if not executed properly.
The most underappreciated design technique is the utilization of white space. A common misconception is that a good website has pages that are filled with an endless array of images and limitless copy. However, this often leads to overwhelming and overcrowded websites.
Instead, the best means is to tactfully integrate the white space to draw a user’s attention to important sections.
For example, if you are listing your company’s values, you don’t want to crowd the text with images. By doing so, users will have a difficult time focusing on the values, and therefore be less likely to actually read them.
As you can see in the following image, Marathon Insurance Group implements this strategy effectively on their page. Rather than having a full banner image crammed with certifications, they minimized the imagery in an artistic way. Now, the user’s eye is immediately drawn to the text, then the certifications. Once they’ve seen the certifications, the shape of the image points them down the page to continue their scrolling journey.
The colour scheme of your website has a significant impact on its visual appeal due to three primary reasons. The first is that it aligns with your brand. This is important to uphold branding and thereby improve your brand recognition and brand recall.
The second reason relates to the impact different colours have on users’ emotional responses. This is a practice that has been implemented in marketing following further research. The psychology of colours elaborates that colours such as blue will generate a calming response, whereas green is perceived as natural and healthy. Or if you want to establish a positive website, you wouldn’t want black to be a prominent part of your colour scheme.
Finally, your colour scheme will build off of the above points. On your website, ensure that text or buttons use colours that catch people’s eyes. This could be as simple as black text on a white background, or as complex as implementing primary colours into your call-to-action buttons.
As seen below, Sigma Container Corporation was able to use its own brand colour to accent key points. Most notably, they used their shades of red as colour accents for major selling points, icons, and buttons to draw attention!
Planning for a high-value website can be difficult without the right guidance. Due to this, we at TechWyse are committed to educating companies on the ever-growing website best practices. By considering the above elements, you can tactfully assess your website and make informed decisions to improve it. Do you need additional support to make your website POP? Contact TechWyse today to learn more about our proven website design services.