Web Design | Balancing ‘How it Looks’ and ‘How it Works’

Web Design | Balancing ‘How it Looks’ and ‘How it Works’

Blog Cover Designs

Web design has evolved enormously since the late 90s and for many of us with a virtual office, its functionalities are important.

We have come a long way from the early days of basic html and flash. But, as any knowledgeable UX designer (user experience design) will tell you, just because you can do something doesn’t mean you should.

While new technology trends may look impressive, especially to industry insiders, the first thing to remember is that web design should always serve the end user.

If great design and fancy features get in the way of usability, you may be aiming at the wrong target. User friendliness is paramount.

Below are some key points we have numbered in bullet points so it’s easy to follow step by step.

Site speed

1. Complicated interactive features and high res images look great but they significantly slow down your page load time.

2. Slow page load times directly impact your traffic so it is something you must pay attention to on any website.

3. There have been numerous studies to research the impact slow site loading speed has on views and purchases.

4. Research done by Gomez indicates that most web users expect a website to load and be usable after two seconds.

5. Research conducted by Microsoft’s Bing team suggests that the expectation of two seconds has negative consequences.

6. Even just a two second delay in a site’s response time can cause a 3.8% spike in customer dissatisfaction.

Beware loss of revenue

7. It is projected that this translates as a 4.2% loss in revenue and as well as reducing the number of clicks by 4.4%.

8. Akamai indicated that a load time of over four seconds means that a third of your traffic will not be returning to your site.

9. It should be noted that Google search returns also factor site speed into the search parameters.

So even if you have all the right SEO content, and high share ratings, if your site takes a long time to load due to its flashy graphics then no one is going to find it.

It will, most likely, be buried on page six of a search engine’s results. (Ask yourself: how often have you gone past the first page?)

10. A speedier website will mean a higher amount of traffic from Google results. In turn, this will have an impact on customer satisfaction.

These are two things which are incredibly important for your online success. This doesn’t mean that your website needs to be without style, though.

There are many tips out there on how to maximise style and speed. Check out this page for a list of tools to help you make your website less bulky.

Menu and menu structure

11. The current trend in web design is clean and flat.

Websites designed with these principles look great but there can be a problem. When a website is pared down too much and a user can’t work out how to get around the website, you’ve run into a user experience nightmare.

12. You might find the ‘look’ of the website is cleaner when the menu doesn’t interrupt your design, but the menu element must be immediately and intuitively obvious to every user.

13. There are acceptable ways to pare down your menu design.

Studies have shown that the search function on a website is only ever used as a last resort when users can’t find the clickable link they need.

14. Reducing the search function to a magnifying glass that extends into a textbox when clicked not only looks elegant but also saves space on the menu bars.

15. The use of commonly recognised symbols for functions can also extend beyond the search function. It can include symbols such as a house to represent your home page, mail to represent an email form or a basket to represent your online shopping cart.

Expand useful information on demand

16. Another great way to save space is to use a hidden menu that expands when it is clicked.

17. This allows you to organise information in a logical hierarchy, so that users can expand the tabs and options in which they are interested.

18. The ‘hamburger menu’ is controversial in web design circles but the general web user now understands what it represents.

19. This means that the information users are looking for is organised and stored in an understandable way without overloading them with superfluous information.

web design

Don’t break too many moulds

20. When we design, there is always an instinct to make something distinct. As a creative, the drive to make something that has never been done before is strong.

21. With website design, it is important to reign that instinct in. While you definitely want to stand out, making basic design decisions that vary too much from web standards will confuse the user.

22. This comes back to a psychological theory of prototypical knowledge.

Humans interpret information in a set and standard pattern. If you organise things logically in a similar way to most other websites out there, users will instinctively know how to use your website.

OrbitMedia has analysed a variety of websites to define the standard features of a website.

Adhere to common standards

23. All sites have the company logo and banner at the top, which makes sense as this establishes the brand. This is a fundamental basic as visitors will always start at the top of a page when browsing.

24. The contact us button is placed in the right corner of 44% of websites analysed. This shows a standard awareness of the area consumers expect to find it.

25. 88% of websites also have the main navigation bar across the top of the page. Therefore it is easy for users to navigate straight from the get go.

26. These standards are important to observe not only because they make the website easier to use but research also shows they have a significant effect on conversion.

27. The only reason to break convention and do something entirely different would be for brand identity.

If you do this, don’t just assume it works. Test it, test it and test it again.

Avoid things that “move” without user input

28. There is an ongoing fascination in web design circles with things that move, be that hero banner sliders, auto playing videos or parallax scrolling.

29. The problem with these sort of things is, however, is that they are often distracting and are proven to have a negative user effect.

30. If you are dead set on keeping the moving element on your website, make sure to consider the following.

31. Set an appropriate time limit on the movement that is taking place on the screen.

There is nothing worse for a user than getting halfway through a paragraph to find that an advert has popped up. Even worse when it causes the screen to scroll down, meaning that the information that they were reading has been lost.

32. People read at different speeds, and a for a variety of reasons. Having this happen sixty times in the space of a minute will cause the reader frustration.

So, set a limit where even the slowest of readers wouldn’t be too distracted by the movement.

Give the user control

33. Provide controls for the content on the page so the user can close it, move it out of their way or pause it.

34. By giving them control over the moving feature you will limit the frustration they will feel .It will no longer be a distraction or a pest as they read your website.

35. Do not have any content set to start automatically, especially videos. Users don’t like it and, in many cases, the user will close your website’s tab to stop the noise.

Losing meaning with minimalist content

36. As already mentioned, the current trend is less is more, which is great until the ‘less’ becomes not enough.

37. Your website still has to sell your business and communicate your message in a very short period of time.

38. The trend towards minimalism can result in insufficient focus on things like headlines or images which are fuzzy.

39. If you don’t give the user enough information about your company they will end up confused.

40. You have to find the right balance for the content, business, and page that you are designing.

An ideal customer or user

41. When writing the content of the page it is always a good idea to imagine who the target audience is. What do you want them to take away from this page?

42. As specialists, we tend to forget that the audience we are talking to might not be well versed or have much knowledge of the products, services, or information provided by the website.

43. As such it is always a good idea to write from the perspective of informing them – this will ensure that you don’t leave out the basic and fundamental details they need to know. Plus the content will make sense to them and is fully explained.

44. It is important to use headings and subheadings on pages too.

Headings and subheadings provide a reader with a concrete reference in which to interpret the text and information on the webpage. As such it will be easier to process and understand.

45. It also allows you to put some white space on the page and reduce the amount of information they have to process in large blocks.

46. To gain a solid balance between minimalism and delivering the right information, practice and learn solid proofreading and editing methods.

47. Rather than doing away with content completely, lean copy can give the message you need to get across and still give you that stripped back look you love.

Click here to get Free Traffic to your website. This is a paid option with guaranteed results.

Share It You Legend

Alexander is a full-time freelance writer and digital designer. He is passionate about intelligent web design. You can read more of his writing here.


Freebie Account

1 Article

2 Article

3 Article

Skip to toolbar