The Future of Web Design

The Future of Web Design

The year is 2011 and we have again found ourselves at dawn of a changing web. Emerging technologies like smartphones and web-enabled tablets have left us unsure of how users are browsing our websites, and new coding standards like HTML5 and CSS3 are turning web design into something more like print design. With all of this change comes massive opportunity for growth, but only for those who are prepared...

html5The big question is...

Just what is the future of web design?

The future of web design is a hot topic right now, with many designers voicing their hopes and wishful thinking; some realistic and some bizarrely out there. Let’s start with a bit of perspective by refreshing our minds to web design in past, old trends and styles.

A Blast From The Past

We all know about the disaster that was the majority of websites in the 90s, so let's get the animated gifs, iframes and trailing cursor effects behind us so we can look at some actual design

tanyas territoryTanya's Territory

Year: 1997

Remember Yahoo Geocities? if you don't you missed one of the most controversial things to ever happen to the web, Geocities defined websites in the 90's by giving average users the chance to create their own free websites using an online WYSIWYG editor.

Yahoo announced the end of Geocities in 2009 but there are still tons of websites archived for everybody's viewing pleasure.

This website in particular has everything a Geocities site needed, an eye burning colour scheme, a guestbook, 'under construction' graphics, a 'best viewed in' disclaimer advising Internet Explorer and a list of best friends and pets!

adobeAdobe.com

Year: 1996

Adobe appeared to taking magazine-like layout inspiration for their site way back in 1996, and although limited by graphics, and not quite as adventurous as some layouts today it can be argued that Adobe were way ahead of the ball.

What you see here is really not far off the web design we see today over 10 years later, and is quite impressive compared to Microsoft's effort 3 years later (as seen below).

microsoftMicrosoft.com

Year: 1999

In 1999, Microsoft's website despite being less offensive to the eyes than most at the time was the epitome of dull.

A serious lack of effort on the visual appeal of the website means it left almost no impression at all

amazonAmazon.com

Year: 1999

When Amazon.com first surfaced it showcased a layout that is almost the standard for online stores today, top level links displayed as tabs along the top of the page and categories listed down the left hand side of the page.

Amazon is by no means the best looking site out there, not now nor then but it has stuck with it’s look consistently and it does work very well for it’s purpose, probably due mostly to familiarity by now but nevertheless.

appleApple.com

Year: 2001

Apple.com in 2001 was hardly any different to today in terms of layout. The only differences you’ll find are in trends and aesthetic appeal, for example I don't know about you, but those pinstripes at the top of the page turn my stomach a little.

Today Apple has deployed a much sharper, refined and modern look, keeping well up to date and sometimes ahead of modern web design trends.


The Verdict

The good the bad and the ugly:

Historically the websites that were attractive to look at and easy to use were sparse generally owned by the big companies, the ones who had the money to employ people with design experience to make their websites for them.

There was very little community feedback from users in the past compared to today's plethora of blogs and social networking (excluding your treasured guest book entries of course). So average users seemed to focus on making websites mainly for themselves and close friends or family not mass consumption.

The trends of the nineties and early 2000s:

  • Animated GIFs
  • Things that follow your mouse
  • 'Under construction' graphics
  • 'Best viewed in Internet Explorer' badges
  • 100% Flash websites
  • Scrolling text marquees
  • Background MIDI music
  • Frames & Image Maps

Where we are now

The most recent major changes to the web.

Social Networking

social networkingSocial media is the 'in' thing at the moment, users of the web want interaction and want to voice their opinions. As of the beginning of 2011, Facebook has 500,000,000 users, that's about 1 in every 13 people on earth. Everybody has their use for social media websites, whether it’s keeping in touch with friends, promoting your business, following your favourite celebrities or an array of other uses.

Blogging & Content Management

bloggingThe static website is dying, long live Content Management Systems! Today's web designers start most of their projects by heading to wordpress.org or their CMS of choice’s website to download the latest version of the software that will be the base of their project. Using free blank themes such as: BLANK, Whiteboard and Starkers for Wordpress; designers can start with a clean slate and build their designs around the workings of the CMS.

High Quality Templates

high quality templatesPre-made website templates have always been around, but with the popularity of Content Management Systems today getting a website online is a lot more accessible for average users and this works in advantage of the designer, especially for those designers who make their living building ultra high quality premium templates.

The result of this is a veritable smorgasbord of beautiful templates for your blog, CMS or online store just waiting to be installed.

Accessibility & Usability

accessibility and usabilityUsability has been a buzz word in the web design industry for a long time now, so long in fact that even clients have cottoned on to it and are telling us which standards we need to meet, and how they should be easy to use and coded semantically; well the latter not so much but I'd definitely be a little better off if I had pound and/or dollar for the amount of times a client has told me to make it "all web two point oh" and "use The HTML 5"

Pixel Perfect Design

Yes, Designers all over the world are spending more time than ever getting their designs pixel perfect and beautiful down to every last detail; some common trends at the moment are heavy use of textures to achieve authentic looking effects, indenting text into backgrounds to create a sense of depth, more creative use of type, and big and bold web elements.

The Future of Web Design

Based on what we’ve seen so far and pure speculation, here are our top 5 predictions for the future...

1. HTML5 & CSS3

html5 & css3

We’re going to see semantic mark up really take off later this year and into next year, HTML5 and CSS3 are going to be adapted much more widely because there’s really no reason not to, and thanks to a handy little javascript include even IE6 can read HTML5, and all the modern browsers (that is Firefox, Safari, Chrome & Internet Explorer 9) are now implementing CSS3 effects such as box-shadow, border-radius and transform.

2. Resolution-Adaptive Design

adaptive web design

Designers aren’t just designing for the personal computer now. The range of devices used today that can browse the web vary from tiny mobile phone screens, to tablets and huge HD displays -- the modern web designer will need to take all of these into account and create a website that can adapt and display beautifully regardless of the display resolution.

The future solution to this problem is a single website that can adapt dynamically to the device it’s being viewed on depending on factors such as screen resolution, orientation, device size, internet connection strength and hopefully more factors.

3. Machine Personalization

personalized web design

Personalized design is a concept in which websites will adapt to suit your browsing habits or preferences. For example, if a user clicks on a specific heading multiple times it can automatically be given a higher design priority and improve the browsing experience for that user. Hints of this can already been seen in the wild on sites like iGoogle and the BBC. If you want to see how the future could really take off, have a good look at Genetify.

4. The Death of Flash

the death of flash

A very controversial topic right now is the future for Adobe Flash on the web. We're not going to say Flash will disappear any time soon (look how long it took for people to forget IE6) but it will almost certainly happen at some point in the future unless Adobe can make some pretty radical changes. Flash is like a dying technology; a relic from the 90’s era that has managed to survive the nuclear explosion (of lethal Web 2.0 gases) that killed off the animated gifs, and cursor glitter. HTML5 is now able to perform most of the same tasks as flash much more efficiently, with far less effort and some of the more advanced tasks with too (with far more effort at the moment but hey it's still early days).

Thankfully Flash intros are already an endangered species and full Flash websites are getting rarer too as people begin to truly realise the importance of search engine optimization, not to mention how Apple have taken a stance of "leaving the past behind" concerning Flash.

5. A Multi-Touch Web

multitouch

Multi-touch is a technology originally pioneered on the iPhone but now found in most modern smartphones, tablets and even computers. Multi-touch gestures work great on phones and on the track pad, the recently released “Angry Birds HD” game for the Mac is a great example as it let’s you play through the entire game using just a multi-touch track pad, gestures such as swiping 2 fingers to pan the camera and 3 finger swipes to pause the game make playing through the game a thoroughly enjoyable experience.

Hopefully in the future we will be able to see interactions like this on the web too, going beyond just swiping to go back and forth from pages and giving us the control to pinch and zoom individual elements on the page, double tap to highlight particular areas of text, and interact with photos in a gallery as if they were real photos on a table.

What are your predictions?

You’ve heard what we think the future of web design will offer, now let us know your thoughts!


Comments

Sign up to our Newsletter

Get site updates, freebies, and MediaLoot news.

Contact Us

Suggest a resource

FAQ

See all
X

You've successfully logged in!