The internet has now been around for 26 years (Bailur, 2015) and in that time it has developed significantly. We’ve gone through Web 1.0, also known as static websites. You were able to receive information from these pages, but interaction was unheard of. Web 2.0 allowed you to post content through blogs – like this one – and social networks. Now we have Web 3.0 which takes user generated content and displays it as recommendations to other users. For example, product recommendations on Amazon are based on linking your previously purchases to what other people who also made that purchase also bought. The same principle works for Last.fm but with music instead of products.

With each generation comes a new look and feel. Originally websites were heavily text based but as time goes on images and adaptability have become more prominent. Users are no longer happy to consume pages of static text. Preferences have changed to content that lends itself to readability –  something that guides the eye lodically around the page, is intuitive and changes it’s layout for a smartphone, tablet or monitor etc.

Here are 7 things a modern website requires to look and feel great for a consumer.

 

Colour 

First are foremost is to find a colour pallet that works well with your brand. Psychologists have found many links between different colours and how they effect your mood and behaviour(Bonnardel, Piolat and Le Bigot, 2011). For example blue is often thought of as the colour of communication which is why it is found in most social network logos (Facebook, Twitter, Linkedin & MySpace). Stay away from dark negative colours such as brown or black for the main body of your website. Instead go for bright, fresh colours or white.

 

 

Dynamic

The user no longer browses a website from just a desktop monitor. There are tablets, phones, laptops, and desktops – all varying in size. In 2013 Jason Sperling found that websites were viewed from an average of 232 screen sizes and 15 different resolutions (more than double what it was 4 years before) A good website is able to adapt to all of these, effortlessly and unnoticeably. This is called responsive design. The website does not necessarily have to be specifically built for a 5″ smart phone screen but it is able to shrink itself down whilst maintaining a good looking user interface. Click on the image below to see a short animation below recorded whilst visiting cartoonsmart.com. Here you can see the website completely change when you adjust the size of the browser.

 

 

Another example of dynamic websites can be seen in navigation. More and more websites are doing this and it improves the user experience vastly. Take a look at the .gif below to see what I’m talking about. This time using mint.com as an example.

 

As you can see, no matter where you are on the web page the horizontal navigation along the top of the page follows you. This makes it really easy for a viewer to find their way around.

 

Easy navigation

While discussing navigation, there is one rule to always follow when designing sitemaps. It’s called the three click rule (Porter, 2015) and suggests that every important web page should be no further than three clicks from your home page. This rule is something that most web designers have taken as gospel since almost as long as the internet, because following a maze of URLs does not create good user experience.

 

Multimedia – images and video

Including photos and videos on your websites is essential . As the old saying goes “A picture speaks a thousand words”, and when a user wants to get information as quickly as possible, more understanding comes from a picture than a block of text. For example, it’s easier to find the stuffed crust on the Pizza Hut website by looking for it’s picture rather than reading a long list of all the different options.

Other multimedia can also be engaging for the user, a Youtube video on your homepage explaining what you do or recent updates has worked well for headspace.com. It’s homage video works  like a elevator pitch to keep your attention. This is perfect in a time where attention spans are shorter and people don’t have time to read a elaborate ‘about us’ page.

Although pictures and videos are very important,  they shouldn’t clutter your page. And don’t autoplay music or videos (Punkchip, 2009) as these can quickly send users away, ‘playable’ content should be by choice.

 

Keep it simple

The number one rule for all media content is ‘keep it simple’ and as briefly discussed above – try to avoid clutter. If it doesn’t add value keep it out – remove the unnecessary noise. More and more ‘one page websites’ are emerging. All the information is included on the home page and displayed cleanly. There are no links or navigation just a scroll bar that takes you through all the content. A good example of a ‘one page’ site is google keep.

 

There are  many more things that can contribute to an aesthetic pleasing website but the above are musts. And above all – content is still king. Without interesting, relevant content users will not use a website regardless of  great design. Follow the steps outlined above and partner them with interesting content to create great user experience.

 

 

 

References 

Sperling ,J. (2013). The Big Argument for Responsive Design | Viget. [online] Available at: http://viget.com/advance/the-big-argument-for-responsive-design [Accessed 14 Apr. 2015].

Bailur, S. (2015). History of the Web. [online] World Wide Web Foundation. Available at: http://webfoundation.org/about/vision/history-of-the-web/ [Accessed 14 Apr. 2015].

Porter, J. (2015). Testing the Three-Click Rule . [online] Available at: http://www.uie.com/articles/three_click_rule/ [Accessed 14 Apr. 2015].

Punkchip. (2010)  Autoplay is bad for all users | Punkchip. [online] Available at: http://www.punkchip.com/autoplay-is-bad-for-all-users/ [Accessed 14 Apr. 2015].