top of page

Interface Design and Usability

Updated: Mar 8, 2019


If you’re reading this and you want to start building your own website for something simple like a school project, then you’ve come to the right place. This post will introduce you to interface design and usability, which are two important things that you need to consider when building a website.


This is a good example of interface design. Elements have been laid out on the web page in an organised manner.
[Figure 1] This is a good example of interface design. Elements have been laid out on the web page in an organised manner which helps to guide people around the site.


What is interface Design?


To begin, what do I mean by interface design? Well to put it simply, interface design is how the website is designed to interact with the user. For example, the way that a websites’ navigation works can fall under interface design since it’s a part of the website that interacts with the user. Another example can be the location of the navigation bar throughout multiple web pages. It’s good practice to have it in the same place on every page. This builds consistency and makes the website a little easier to use. Also, it’s important to note that not every aspect of interface design interacts with the user directly. Aesthetics such as fonts and colour schemes will indirectly have a psychological impact on the user.




Why is interface design important?


When visiting a website for the first time, you will begin to form an opinion of that websites' look, feel and ease of use. Unsurprisingly, if it is hard to use or not aesthetically pleasing, then you will probably be inclined not to visit that website again. The website could contain excellent information, but if the information is difficult to extract, the reader will most likely loose interest. Think about it. Would you choose to use a poorly designed website over another which was well designed? Chances are that you would use the well-designed website instead. Having a user-friendly interface can help to set you apart from your competition and is necessary for your website to become successful.




What is the most Important part of Interface Design for a Beginner to Implement?


As a beginner, an important aspect to focus on is consistency. [1] This is because consistency isn’t too hard to implement when building a website for the first time and it can have a huge impact on whether the interface design of your website is good or bad. Being consistent allows the user to become familiar with how the website works.



Outlined below are 3 tips on how to make your website more consistent:


1. The layout of the website should be simple, logical and consistent. Elements like the navigation bar should always be found in the same position on every web page. This is the same for other elements such as the logo and contact details which will be present on most, if not all, of your web pages.


2. Using font styles that are easy to read is important. Fonts should stay consistent throughout the website and should complement each other. It’s standard to use serif fonts for site headings and sans-serif fonts for standard text. Popular serif fonts include Times Roman, Palatino and Courier whilst popular sans serif fonts include Arial, Geneva and Helvetica.


3. The colour scheme needs to have been developed so that colours don’t clash. For instance, using yellow text on a white background will make the text hard to read. Your background colours should be consistent and should complement each other, whilst the fonts need to be easy to read.




What is Usability & Why is it Important?


According to Jacob Nielsen, “Usability is a quality attribute that assesses how easy user interfaces are to use.” [2]


Usability has 5 quality components:


1. Learnability - How easy is it for a user to complete basic tasks your website? A learnable website would be easy to use even if this is your first time visiting that website. [2]


2. Efficiency - How efficiently can users perform tasks or find a specific piece of information? You want to create a website that’s slick and efficient to use so that the user can be efficient too. [2]


3. Memorability - How memorable is your website to users returning after a few weeks or months? Are they easily able to re-establish proficiency? A memorable design means that users can re-establish proficiency quickly. [2]


4. Errors – How many errors can your users make when using your website? You want to keep the number of errors throughout your website to a minimum, focusing on critical errors as a priority. [2]


5. Satisfaction - How pleasant is it to use your design? A pleasant design will satisfy the user, whereas poor design will leave the user dissatisfied. [2]




Having good usability within your website will leave a positive impression on the users and will allow them to enjoy the experience. It’s important to consider because bad usability can lead to users becoming very annoyed and angry if your website is difficult to use. You may have started to establish that interface design and usability overlap and have an impact on each other. Having a simple, consistent layout will affect how easy the website is to learn and how efficient and memorable it is. When building your first website, try to consider both interface design and usability as this will improve the user's experience of your website.


For further information about interface design, look at ‘Interface Design for Advanced Users’, which contains a more in-depth view about the topic.



Author: Sonny Loveridge

Editor: Ruby Osborne



references:

[1] B. Shneiderman, “The Eight Golden Rules of Interface Design,” University of Maryland, May 2016. [Online]. Available: https://www.cs.umd.edu/users/ben/goldenrules.html. [Accessed 09 02 2019].

[2] J. Nielsen, “Usability 101: Introduction to Usability,” Nielson Norman Group, 04 January 2012. [Online]. Available: https://www.nngroup.com/articles/usability-101-introduction-to-usability/. [Accessed 12 February 2019].

[Figure 1] Free From Wix Images "Fashion Web Design". CC0. 2019.

34 views0 comments

Recent Posts

See All

Comments


Commenting has been turned off.
bottom of page