We've become far too obedient to visual conformity, economic viability, and assumed expectations – Boris Müller.
Have you ever compared two websites together?
You may sometimes find design features of one website in another's and wonder how did that happen. Well, chances are you'll keep on seeing those resemblances as the current flow of web design is all about simplification, responsiveness and apprehendable UI design.
Today, we'll be looking at web designs of battery companies and identifying design similarities between them, how the companies are applying design techniques to their marketing strategy as well as understanding why they are doing the same thing.
The majority of these websites uses bright and contrasting colours to establish their design style. Their favourite colour wheel is RYB (red, yellow and blue), which is often used by artists to mix paint colours. These colours spread across all graphical elements on the web page – logo, icons, typography, buttons – and in the images used. Now, this way of using RYB either create a harmonious web layout or have all visual elements screaming for attention. Websites such as NTP Forklifts Australia and Battery Energy prefer to pick one colour as their main colour and apply it across the design (see examples below).
Flat Design and Grid Layout
Flat design is easy to follow. If you don't want to spend much time on gradients, textures or special effects, this is the thing for you. This two-dimensional style takes away your worries about designing stylistic graphics and keeps the focus on simplicity. Key features of this style are bold colours, simple and big typography (usually sans-serif fonts), and clean UI elements. With a grid layout, your website is looking more refined. Grids structure the website, keep your content in order and maintain the reading flow. These battery websites also have a consistent design theme across their webpages. Each section of the page is designed with a relevant heading, imagery and graphics that remind viewers of the brand's image.
Why are these websites looking alike?
What do you think of when you hear 'the battery industry'?
An image of a double-A battery comes to your mind? Or do you think of green energy? And why are there many companies using bright primary colours like red and yellow for their branding?
Understanding the meanings of colour will benefit a business in many ways.
- Red represents vitality, passion and energy.
- Yello generates happiness, friendliness and openness.
- Brands that use the colour blue set their core values like trust, loyalty and security.
- For those that also use green colour on their website and for branding (such as broadbit), the link between their business and the environment is transparent as green means eco-friendly and nature.
So in terms of using colour to deliver their values and establish a brand image, these battery companies have done their research perfectly. However, a study on web credibility from Standford suggested that when a user visits a website, their first impression is usually about the site's visual design. Hence the same use of design style and layout doesn't increase the credibility value if all websites are alike. But you know what? They may differentiate the visual differences but not realise how similar their sites are to one another.
This is one of the reasons that explain the broad application of flat design. Web designers turn to favour this minimalistic design as it is easy to be scaled down depending on the size of our screens so viewers can access the site on different devices (try to resize the window of any site you're opening and pay attention to how responsive the site is – what's doing great and what's not). It also allows a more flattered, flexible and quick-to-apprehend outlook by simplifying interface elements to take design functionality more seriously (see examples below).
The less complex texts and images are displayed, the easier users can understand the message that the brand wishes to deliver. From the examples, all graphical elements are designed simple enough to cause no reading difficulty and that outcome contributes to the effectiveness of the flat design. Users would also appreciate designs that are more recognizable, familiar and comfortable to use. Which bring us to the next section: user's expectations of a website.
What to expect
As part of website credibility, visitors look forward to:
- Fast loading time – 47% of consumers expect a webpage to load in 2 seconds or less.
- The mobile website should look as good as the desktop website or better.
- Quick navigation to the information they want – utilise your footer to highlight important links that users might want to click on.
These are just a few examples to get your head around what users want from the websites they access. A noticeable content-related pattern of these battery sites is that it contains a list of batteries, company services, store locations, search engines, why you should choose the brand and so on. It is good to see that they are trying to meet with customer's demands and needs by outlining everything they can do to support their clients. Yet, their homepage can appear long and clustered with content. Visit Marshall Batteries site and you'll know what I mean. The majority of the page is detailed FAQs and their services presented in the small and thin body text that might not be pleasant for the eye to look at for a long time.
I'm not a judgemental person but I wouldn't spend much time reading through all of that information and get distracted from what I originally searched the page for. That large amount of information could potentially cause the site to load slower and 39% of visitors will stop engaging with the content if they have to wait too long.
These are the common correlations that you can find in pretty much all existing websites. Although I too enjoy the simplicity and convenience that flat design delivers, it can become boring in the long run if web designers continue to stay in their comfort zone and restraint their creativity.
I happened to discover Web Design Museum a few days ago and was amazed at how websites used to look like in the early twentieth century. They were so unique and distinctive from one another and even though some don't look good aesthetically, you just can't get enough of the creative flow that designers back then showcased.
Now, if you could re-design any website that you like, how would you design it to make it different from the crowd?