When we optimise client websites, some common web design mistakes keep popping up during our SEO audits. These web design mistakes appear in popular free and commercial themes and websites created by digital agencies, cause usability issues, and may result in lost sales. Below we list some common web design mistakes, why they are bad for user experience and SEO, and how to correct them.
The following web design mistakes are not necessarily the fault of web designers. It could be the website owners who asked for certain features in the first place, or the coding mistakes by web developers. The mistakes could also have been introduced by the editors using a page builder.
Web design mistake 1 - video background
Video background is setting a video file as background for a header, section or the whole page through CSS code. This is different from embedding a video player.
Why video background is an issue
Video files are usually big in size. A video of a few seconds can easily be a few megabytes in size. Some carelessly selected background videos could be dozens of megabytes. When a browser loads a web page, it automatically downloads and plays the linked video file. This results in slow pages, excessive data download, and potentially high data cost to the website owner and users. Battery consumption is another concern for users browsing on mobile devices.
Alternatives to video background
In many cases, a video background is not really necessary. If you just want a background that moves in slow motion, you can achieve the same effect with images and a few line of CSS code. If you are creating a theme for others to use, simply do not even offer this option.
If the video does convey some important message, it is better to upload the video to a website optimised for serving videos, and embed a video player on the web page. You can set the video player to start streaming upon user interaction.
If you really want a background featuring a real video, you are better off embedding a video player, and setting it as background using CSS positioning.
Web design mistake 2 - multiple sliders
A slider consists of multiple hidden elements often containing images, and displays the elements in a preprogrammed way.
Having multiple sliders on the page means downloading and hiding images. This is often the culprit of bloated and slow web pages. In many cases, a well-chosen image is far more effective in communicating the message, without any slider.
Web design mistake 3 - duplicate or missing H1 heading
The HTML heading tags (H1 to H6) are important for search engine robots to understand the structure and key messages of a web page. A logical content structure is similar to a tree. It consists of a single H1 tag (level 1 heading), branching out to the next level of headings.
Unfortunately, the heading tags are often abused by less experienced people to adjust the font size. Having multiple H1 tags on the page, or missing H1 tag, may prevent robots from understanding your page content as you intended.
The worst web design mistake
If you have read so far, you might think video background is the worst web design mistake. Here is a witty quiz for you - what web design mistake is even worse than a video background?
Sometime ago I tested a webpage using a fully charged mobile phone, to my surprise I received a low battery warning pretty soon. When I examined the page code on my laptop, there were numerous astonishing videos playing in the background, non-stop, hidden under the top layer elements! I may be old school, but a smart phone is no longer smart when the battery is dead during an emergency, when you need a phone the most. A poorly designed website like this is essentially driving users away.
A well designed website is not just how it looks. Rather it is how it works. A good website puts users first, and provides a pleasant user experience regardless of how they visit your website. Users are more likely to become your customers and come back to your website, if you are considerate towards them. Can you image any users coming back to your website happily, after receiving a shocking bill for mobile data?
Since these mistakes are found in websites by digital agencies and in commercial themes, we can conclude that professional web designers and developers could be guilty too, if they overlook SEO and user experience. SEO requires the skills of multiple disciplines, which some designers and developers don’t understand.
We optimise your website for business results by creating content, promoting content, and focusing on user experience. If you are new to SEO or have tried SEO before but haven’t got results, contact us to find out how we can turn your website into a useful marketing tool generating leads for you.
About the author - Oliver Liu