Posted 16th January 2015 | By ExtraMile

Design and development trends on the web come and go. While some stick around for the long haul, others don’t quite take off in the same way and are perhaps better off left to die out. Then there’s the utterly outdated that are in major need of a face-lift.

In this blog, I’ll be taking a look at some of my favourite techniques out there, as well as some not so great examples.

Design and development trends on the web come and go. While some stick around for the long haul, others don’t quite take off in the same way and are perhaps better off left to die out. Then there’s the utterly outdated that are in major need of a face-lift.

In this blog, I’ll be taking a look at some of my favourite techniques out there, as well as some not so great examples.

Let’s start with the good.

 

Flat design

All the rage nowadays. Apple have moved away from the use of gradients and shadows for the 3D-like effect since the introduction of iOS7. It’s a modern approach to web design that you’ll see is favoured by tech companies/start-ups and design agencies, but many more industries too.

Screen-Shot-2015-01-16-at-12.42

Responsive Design

This has been preached about in many of our previous blogs and the technology has been around for a while now, but it’s not going anywhere. Recent stats will tell you that the adoption of RWD on the web is constantly on the rise, as well as mobile/tablet website traffic.

My love for Nando’s knows no bounds, but I’m also quite fond of their responsive website. Peep the layouts below:

Screen-Shot-2015-01-16-at-12.55

Screen Shot 2015-01-16 at 12.56.04

Storytelling and journeys with endless scrolling

 

The popularity of websites with an infinite scroll have soared recently. They’re usually used to focus on a particular product, service or theme and allow the user to follow the journey using their mouse or trackpad to scroll through the website and trigger content to switch, as well as introduce effects and animations into the mix.

I’m a big fan of this concept for demonstrating innovative and creative visuals and development techniques, however find the user experience aspect to be somewhat of a let down. Often we as users want to be able to reach the content relevant to us quickly and easily and this technique can sometimes prevent that. 

Here’s one of my favourite implementations, as not only is it slick but it’s not too lengthy and allows you to jump to other areas of the site using the navigation. I also love the little plane that guides your movement through the site!

http://www.fluger.com/

Screen-Shot-2015-01-16-at-14.28

 

Video backgrounds

 

Although screen sizes are getting smaller with the expanding mobile market, we now have an ever growing range of HD and Retina displays and a raft of HTML5 video technology, perfect for executing full screen videos and taking beautiful background imagery to the next level.

This technique can range from subtly moving animations to full blown videos or CGI creations with overlays that the user can interact with. 

Check out a unique take on this below in Reebok’s latest CrossFit campaign

http://lookbook.reebok.com/fw/womens-training/look1

Screen-Shot-2015-01-16-at-14.43

And now for the bad.

Left-aligned and fixed width

 

Don’t get me wrong, there are some great examples of left aligned websites out there...but it’s probably not the best approach to build your website within a fixed width container (usually to a pretty small screen size - think 1000px) and align it to the left. With modern screen sizes, you’re left with a heap of redundant space on the right that just looks plain weird.

I thought we left this technique back in the year 2000, but I came across this website for Adobe’s Pressroom recently. Sigh.

An even greater example of this was TSB bank’s website back in 2013. Astonishingly, they’d spent £30m on rebranding and managed to end up with a website designed for an 800x600 screen resolution. What went wrong? Thankfully they’ve revisited the design since and have a much better website in place.

tsb-blog-full

Flash websites, intros, anything Flash

Shockingly, there are still a lot of websites out there that have been fully built using Flash and not using more up-to-date technologies. Just ask James from Sales, he comes across his fair share. If not the entire website, you’re bound to come across a splash screen, banner, advertisement or interactive element of a website with no HTML5 equivalent/fallback for devices like Apple products which simply don’t support Flash. In addition to this, it’s bad for SEO/crawlability and should just be avoided.

Take a look at the images below to see how the site is viewed on a desktop and on my iPhone. Nice.

Screen-Shot-2015-01-16-at-15.36

IMG 4689

Annoying overlays and popups

 

Inspired by Brad Frost’s great little blog post on bull**** overlays, I too dislike these with a passion and I’m sure many of you out there would agree with me. Sign-up boxes, feedback requests, switching country…..no. Just no.

55265596

The ugly?

Let’s take a look at what our some of our favourite websites looked like when they were first launched, just for laughs.

apple 1473503a

google 1473879a

twitter 1473517a

Written by Anita Mander, Studio Manager and Web Developer at ExtraMile Communications.

At ExtraMile we try to take an hour out each week to look around us at what others do and to gain inspiration and to admire people's creativity. Each post in this series is one staff member's take on the world of web, design and things online. We hope you enjoy it.

extramile

About ExtraMile

A digital marketing agency with international capabilities