Do’s and Don’ts of Effective Web Design

In the same way the tip of an iceberg can make it appear deceptively small, websites can also appear simple and easy to design. However, underneath that screen of pixels, a plethora of work is put into giving users a seamless experience compelling them to buy into the company and its products or services.

Each aspect of the website holds a purpose and design considerations; such as strategically placing the navigation pane at the top. This helps to guide users in navigating through the site and is easy to find. As another example, high resolution images from a custom photoshoot serve the purpose of convincing users that the company behind the websites are also of a higher calibre, and less likely it’s run by one guy in his underwear, operating from a basement, faking it out with stock imagery. So, bottom line, websites aren’t just created with a click of a button. There’s a lot of creative thinking and planning in making a website work effectively. Here’s a few we stand by –

Dos

1- Do have a clear navigation

Just like relying on clear road signs when driving so you can take the right way to get to your destination, navigating through a website is no different. As a user, you’d like to be able to click through and find what you’re looking for relatively quickly. Unless you’ve got bucket loads of free time, no one wants to search through a maze of pages to look for the answer. You can only hit the back button so many times before hitting the exit. Onextrapixel revealed that the norm for navigation panes are generally: home, products/services, about us, and contact us. This follows a user’s logical thinking in finding out what you do or offer, then reading a little more about you if you’ve piqued their interest enough with a good first impression on the homepage. If all is good and well, they can then progress onto the ‘Contact’ page to find out how to reach you or book in your service.

While the creative in you might be dying to do something different for the sake of originality, you can also run the risk of confusing your users. You don’t need to reinvent the wheel if it’s already working!

2- Do make it look nice

First impressions are everything right?  It’s definitely supported by Nmédia’s research on credibility and aesthetics, which found that users judge the quality of your business within 4 seconds of viewing your website.

It’s important to ensure that your website is aesthetically pleasing. When picking pictures, a colour palette and fonts, really question yourself. Don’t choose things individually; they need to work together harmoniously. Do you need 5 different fonts? Does a fluro rainbow colour scheme really suit your company’s website? Hint: NO.

Another visual tip is to invest in quality images! Would you be convinced of the quality or legitimacy of a company’s products if images are pixelated and dull? A case study conducted by Optimics revealed that simply using a high quality larger image increased their sales by 9.46%, as opposed to a smaller image. Good quality visuals aren’t only to please aesthetically but also speaks volumes of a company’s credibility. It’s not hard investing in quality, especially if it’s what will put you ahead.

There’s way too much going on in this website. Where do we begin? Bright rainbow colour scheme, poor choice of font, it just doesn’t tie in together.

3- Do interact with your users

Two Options: a website that only has words and pictures – or- a website that has words and pictures and an assortment of well-placed videos, social media sharing tools, helpful chatbots and call-to-actions. Which would you find more engaging? It’s not a tough choice, is it? In order to convert users, active engagement should be encouraged in every aspect of a website.

Simply asking for feedback from users is enough to show you care about their opinions and their satisfaction. Maybe chuck in some incentives like a 10% discount for signing up to your monthly email too. They feel like they’ve made a saving and you get to reach out regularly with email marketing; it’s a win-win for everyone! And don’t be afraid to display feedback on your site, even if there’s some mediocre ones. Econsultancy found that bad reviews can actually improve conversions by 67%. As long as you act on the problems they won’t haunt you forever and can give your customers a sense that you are honest, have nothing to hide and are willing to improve.

Even with 8 non-5-star ratings, they still have a significant amount of 5-star ratings and with amazing customer reviews like Nina’s, it’s a guaranteed conversion driver.

Call-to-actions (CTAs) are also paramount to conversion. CTAs encourage users to read more, buy now, or sign up to your newsletter and send you an enquiry. They’re basically that extra “push” to help you close the deal. But be wary. Sarah Lynn Design warns against plastering your page full of CTAs – that’s just an eyesore. No one wants someone constantly yelling Buy! Buy! Buy! at them. Be strategic. Use sizing, colour and placement to your advantage so that your CTAs complement your page but also stand out enough.

Chatbots are also taking over the world with over 100,000 bots now on Facebook Messenger, according to Chatbots Magazine. While some companies use real people to respond to chats, others use AI software which have been programmed to respond to a wide variety of messages instantaneously. This can enhance the user experience, especially if users have questions and want speedy replies or don’t want to talk directly to a sales assistant. In an era where we can hide behind our screens, you can cater to your portion of customers who are phone-shy. In a Facebook IQ study, 56% of respondents were found to prefer messaging over calling customer service while 53% of respondents were more likely to shop with a business they could message. While it’s a little bit more work to implement, it could definitely be worth your time in helping you convert more sales.

4- Do optimize the websites for different devices and platforms

Cisco has revealed that mobile traffic has been predicted to grow by 61% annually into 2018. With so many users turning to the convenience of mobile rather than desktop to browse, shop, purchase and research, it’s a no-brainer to ensure that websites are optimized for all devices. It’s arguably one of the best practices as it ensures a website can communicate its message effectively regardless of a device’s screen size and orientation. This ensures that there is consistency between different digital platforms and a seamless user experience.

In considering a responsive web development Webydo suggests using Scalable Vector Graphics or SVGs over Bitmap images where you can. SVGs are handy as it is a HTML5 technology allowing vector images to be displayed in code so that the image is crystal sharp, regardless of the user’s screen size. Additionally, the loading times of vectors are incredibly fast, which contributes to a faster site speed. Faster site speeds directly correlate with better user experiences, giving your website that extra fighting chance to fend off the frustrations of an impatient user or one in a rush.

How does your website look on a PC/laptop/tablet/smartphone? And don’t even get us started about the dimensions and resolutions!

5- Do put some effort in customizing that 404 Error Page

Always have a back-up plan. All links should be checked through to ensure they’re all functioning but in the off chance that an old page has been deleted and a link no longer works, users will arrive at the dreaded 404 error page. But don’t let that put a damper on the customer experience. A creative 404 error page can be an opportunity to even build a better relationship with the user. With a fun and considerate error message and a redirect to helpful links, you can replace the usual feelings of annoyance with positive surprise.

In saying this, your aim isn’t to keep users admiring the error page. That won’t help with redirecting them to your service or products. Having links back to your website or a search bar is useful in get users back on track rather than searching up other websites. Take a look Airbnb’s 404 error page.

Getting a 404 Error Page is as unfortunate as dropping your ice-cream, but Airbnb provides some helpful links to get users back on track to their website.

Don’ts

1- Don’t swamp users with content

So you know by now, good quality photos are the way to go. You’ve found hundreds and are preparing to drop them all into the website along with slabs of text elaborating your life story and how the business was born. Please don’t. Users aren’t planning on spending hours on your website In reality, if a user opens a website that’s overloaded with long paragraphs, they’re just going to give up and bounce.

Plan out your sitemap first which lists all the webpages you will have to create for your website. Afterwards, consider the types of most important points you need to cover and polish this. Drawing out a wireframe plan can help you plan your content breakdown and visualise how to present it in digestible bite-size chunks to users. Leaving behind the essay that won’t be read, you’ll instead be able to create a layout which includes written content, pictures, videos and CTAs, as a start. This balance of variable content types means your web design will  appeal to a wider audience, as you catch user’s different content preferences. Some like to learn through watching videos whilst some like straightforward bullet points. Catch them all!

You don’t have to know exactly what is going on your website yet. THIS IS JUST A PLAN. Visualise where you want to see headings, text, pictures and CTAs. Imagine whether this will work for you and your users and don’t be afraid to try a few different layouts until you reach a wireframe you really like.

2- Don’t completely neglect usability for the sake of beauty

To set the scene on the necessity to optimise loading speeds, Section.io revealed that in merely 2 seconds of loading, already 9.6% of users bounce from a page! Demonstrated in the graph below, it shows that users are pretty savage. But it’s not just the users who matter, Google actually penalises for slow loading pages, which in turn can be detrimental to your ability to rank well organically or by other means. Things that can slow down your website include lots of videos and even large images.

Despite the importance of loading speeds though, one can’t compromise too much on the visuals. The Nielsen Norman Group (NNG) has found that the aesthetics-usability effect exists, in which users are a little more tolerant to problems and errors on visually appealing pages. In reality, usability and beauty are on two ends of the spectrum and we need balance. So don’t be afraid to use videos and animations if they’ll make your page pop, just keep in mind that there’s a higher risk of sacrificing usability and increasing loading time, it’s about where to draw the line,

Videos are a double edged sword. On the one hand, they’re way more engaging than simple images, but on the other hand, they can take longer to load and users aren’t going to stay on a webpage with a constantly buffering video. Studies show that users’ attention spans drop even after 1 second of waiting for a video to load. So consider optimising loading times. Some options include hosting the video on amazon S3, hosting it on a specialized streaming video hosting server such a Brightcove or setting up your own streaming server to host your videos (which is obviously the most expensive and complex but you have more control over it).

A study conducted by Akamai Technologies has found that not surprisingly, 76% of respondents would actually just exit out of a page if they were experiencing problems such as repeated buffering. With a digital bank of information at our fingertips, it’s more important than ever to ensure loading times are optimized, to ensure it reaches your user in a seamless and non-disruptive way.

3- Don’t rely on the automatic

Amongst the list of most annoying things a website can fall into a trap of, include autoplay music and multiple pop-ups. Videos are a good way of conveying content. But are they still good if the user closes the page before they even look at it? Can you imagine the embarrassment of opening up a website with loud music and video playing, if one is in transit on a quiet train. Users can respond in quickly closing the page, leaving your website in the dark. AdAge found that certain browsers such as Google Chrome and Microsoft Edge have actually decided to kill off autoplay videos with sound since some users hate it that much.

Everyone’s guilty of closing a pop-up before reading it since there’s this prejudice that the pop-up is an ad. The Daily Egg reported that a whopping 70% of users found irrelevant pop-ups annoying. But note the keyword ‘irrelevant’. There’s always a right time and right place -so maybe a pop-up could work more effective as a timed pop-up after the user has spent some time on your site or after they’ve scrolled through to a particular section.

4- Don’t go crazy with the ads

Yes, you earn revenue from displaying ads on your website. Yes, this revenue is guaranteed, but what is the true purpose of your website? Is it a placeholder to complement ads? In the long-run, revenue generated from long-term customers is surely more valuable. At the end of the day your aim is to showcase your products or services to users. You’re the main attraction, so why give up your important digital real-estate for distracting side-acts? It could even affect your own sales, if users click on these enticing ads, be taken to a new page and forget about you.

5- Don’t open external links in the same page

Another given in web design is that internal links (links taking the user to other pages in the website) should open into the same tab while external links (links taking the user to another website) should open into a new tab. According to UX Movement, this deters them from returning to your page as they physically need to press the back button and reload the page, taking up their valuable time and interrupting the flow of your content. The inaccurate exit times will also consequently mess up your analytics.

 

Whilst we’ve just explored the tip of the iceberg when it comes to design considerations for a website, you’ve just got to start somewhere. There’s always a reason behind the madness, and through following the principles behind these design considerations, your website will be simplistic where it should be and carry the wow factor where it needs to. With a balance of following these rules and exploring the realm of one’s creativity, web design really should be a lot of fun and quite rewarding. But always keep in mind, it’s not about you, it’s about the user.

Other Interesting Posts in the Category

Some Older Posts That You May Like