Yellowball.

Can You Spot the Difference?

By Lizzie Ayton
Web Design 21.10.2015

Clearly for followers of English 2003 was a year of triumph at the Rugby World Cup but 2015 held only the disappointment of failing to make it out of the group stages. The images should show a difference between Tom Wood’s palpable disappointment and Martin Johnson’s elation, but unfortunately Martin Johnson’s brutish face is not capable of displaying such joyous emotions. Either way, the rugby result is not the only difference. The design of the BBC website in 2003 is in stark contrast to its present iteration in 2015. There are a whole host of differences, but our design team have analysed the top 10 differences. A key factor to remember is that the amount of content, menu options and related content is relatively similar between the two pages which shows just how much influence design can have on perception of content:

Space to breath

We have become very comfortable with the present version of the BBC site but it is not until you compare it with the 2003 website’s design that you notice how much everything has spread out. Compare the current design with that of 2003 and the older version looks cramped and cluttered. Clean and minimal design has grown in popularity of the past decade and these two web pages are perfect examples of how designers (and users) in 2015 are not scared of contentless space. This use of space is central to the change in design between the two pages and is the largest single factor in the change of design. You only need to look at the triangular bullet points underneath the main image in 2003, at first they look like circular bullet points that have been cut off but alas they were specifically designed to sit flush to the side of that container. You don’t really see that nowadays..

Images tell the story

You may also have noticed that nowadays on many screens you cannot actually read any of the article without scrolling down. The title and main image/video take centre stage and are there to deliver the most succinct summary of the article possible. As you continue to scroll down the page imagery takes a much more prominent role in 2015 with images displaying wider than the text column to further attract the eye. The text is there for those information hungry readers but the images and video are there to evidence the real story and provide a more visual experience.

More refined colour scheme

Spacing is not the only reason why the 2015 website looks cleaner than the 2003 version. The colour scheme has also been reworked and refined over the past 12 years, with some notable changes:

There is considerably less black on the page. Previously the majority of the header was black, whereas now it only the third tier options are black.
– The yellow has been lightened, moving away from the mustard style of previous years. The yellow also appears lighter because it is not dominated by the surrounding black as it is in the 2003 designs.

– The maroon boxes and maroon text has been vanquished altogether providing a simpler colour palette which aids separation of content.

Left aligned and Centre aligned

Both designs have fixed elements, but the 2003 version is left aligned whereas the 2015 version is centre aligned. This is driven by the left aligned (and vertical menu structure) but the 2015 website’s centre alignment allows more space for content, resulting in a less cluttered design. In addition to this, the average desktop screen resolution in 2015 is much larger than in 2003 (800×600 vs. 1366×768). As such, when the 2003 design is viewed on a higher resolution screen it leaves a chasm like white space on the right hand side which makes the entire page look lopsided. Centre aligning the page means that even if it does not span the entire screen the design does not look uneven on a screen.

BBC design change

Combined Menu Structure

As above, the 2003 page’s menu was on the left hand side with additional options displayed for the selected sport, whereas the 2015 version has a much more comprehensive header menu displaying alternative sports, main category options for the entire BBC website and also more sport specific options, all of which were only included in the footer in 2003. The modern menu design highlights which options the user has selected, therefore not only showing the route that the user has taken but also additional subject specific options which improve behavioural flow through better UI. In 2003 the user would have had to either take one step backwards or scroll to the bottom of the page for alternative sports options.

Flatter design

No longer are designers looking to complicate imagery by attempting to make everything look 3D. One could attribute this change to the quality of other media which we consume. We have HD videos on our phones, 3D televisions, super high res computer screens and amazingly accurate 3D animation. The visual media that we view is of such high quality that there is no need for web design to appear three dimensional, after all if we wanted something to look real we would most likely use a picture! This change in design attitude has resulted in the BBC site having a much flatter design compared with 2003. There is very little attempt to give any of the elements depth, they simply present the text, image or video. No frills.

Social Sharing

Facebook may not have been created in 2003 but social media was alive and kicking in 2003, the likes of MSN Messenger, MySpace and Bebo were the social giants of the era. However, in 2003 there was not social sharing tools on the BBC website for a couple of reasons:

– Social media was still something used by the minority whether they be teenagers or bands trying to get their break.

– It was still very much focussed on peer to peer communication (think MSN Messenger). Content sharing to your entire network had not yet filtered through to social media

Video Content is now prominent

Video content is rapidly becoming the most popular method of consuming digital content. Facebook video views are increasing exponentially, Youtube is the second largest search engine in the world and most importantly internet connections are now fast enough to instantly stream video content. It is no wonder then that when videos are available they have replaced the main image on the BBC webpage. In 2003 the video and audio links are hidden in plain site with 3D designed buttons that offer very little persuasion. After all, watching a video over dial up connection in 2003 was nigh on impossible anyway so why bother.

Related Articles

The amount of related articles has not necessarily changed, but the way in which these related articles is portrayed definitely has. Not only are these related articles more spread out and often have accompanying images to entice the user (no images in 2003), there is also more emphasis on the date of these articles. In our modern world of real time information, the date of other news stories is given a prominent position next to the title so that users know that they are viewing up to date news.

Author Profile

The journalist for the 2015 article has prime position at the top of the page with a headshot and clickable link to read more of his/her writing. You can now dig deeper into the style and views of BBC journalists. In 2003 there is no mentioned of the journalist and therefore no additional work from said individual. Interestingly though, even in the current version there is no social following tools on the profile page for the journalist, something that we would have expected to be present.

Is it responsive?

The BBC website is strange. It does not respond dynamically to changes in screen size on a desktop or laptop, but does display as if designed responsively on smartphones and tablets. As in our previous article about mobile and social’s effect on website design, the slightly ‘blocky’ nature of the BBC site actually helps to create a more cohesive design when the site is displaying across multiple screen sizes. The fact that we are more inclined to scroll or swipe down a page has certainly meant that they are able to dedicate more space to navigation (moving everything into the header) and create longer pages. The 2015 page is nearly twice as long as its 2003 counterpart.

p.s its not really design related but you will also notice that the URL structure is somewhat cleaner nowadays.

Overall I’m sure you would agree that the 2015 version of the BBC website is much easier on the eye, identifying the prominent information is quicker and the call to actions for related articles that much more enticing. Are there any differences that you think we have missed out?

Let’s work together

WE DON’T BITE
Please enter your name
Please enter a valid email address
Please enter a telephone number
Please confirm that you agree to our Terms & Conditions