Web Design Assumptions – Learning From The Past

  • By: Renato D.
  • May 13, 2013
  • 0
Share

In this two part article, we will investigate the conventions or ‘norms’ which web designers have relied upon for many years, when starting their projects. While in the past these may have been entirely correct and shouldn’t be frowned upon, now more than ever we need to revisit these ‘defaults’ and see if they still apply. In order to design appropriately for the future, it is worth taking a step back and looking at how far we have come in little more than a decade, and re-evaluate the conventions we as a web community have made when we start designing new projects.

A closer look at what has changed

Screen Sizes

Remember back to the days of the dancing baby video? This 3D-rendered viral video became globally popular somewhere around 1996, and was probably the first widely spread “meme” on the Internet. If you remember this, you probably remember being faced with every site being designed for around 640 pixels wide. Not much real estate at all.

In the early 2000s, the standard grew to 800 pixels. Web designers discovered that they can use frames on websites to scroll individual sections independently of other sections, and many used this technique without abandon. Having a separate frame (with its own scrollbar) for the header, left hand navigation, right hand content box, and bottom footer became a (retrospectively) ugly standard.

A few years after this, we collectively decided that 1024 pixels would become the standard, more than partly due to 17″ LCD monitors with 1024×768 set as the native resolution becoming the de facto standard. Screen sizes continue to grow, and widths of 1366px (common laptop size) and 1920px (a 24-inch desktop monitor) are not at all uncommon.

Around 5 years ago, with the invention of smart phones, and odd thing happened – screen size went backwards, and suddenly a web site which was perfectly appropriate for modern user consumption on a desktop PC was broken and did not work anymore. Enter tablets shortly after this, and suddenly we are forced with a decision to make – optimise for a handful of different resolutions (commonly through individual cascading style sheets for each device) or take a responsive approach to different viewports. Keep in mind these devices can be held in portrait OR landscape mode, and suddenly the visible screen estate results in the height being larger than the width.

web-design-screen-sizes
Screen Sizes

Keep in mind that these were all in reality, assumptions about what device the particular user visiting the site would be using – the numbers were always somewhat arbitrary and there were always people who could not see the entire website or utilize all of its functionality due to older browser versions. These people were ignored, and largely still are, because they are the minority of the visitors.

Input Type

We have always assumed that everybody uses a mouse, and most designs we see of any complexity continue to ignore alternative ways of interacting. People who had to use a keyboard for any reason had a very hard time interacting with a lot of our sites. With the advent of tablets and phones there is really no excuse for not thinking about accessibility to your website for users without a mouse. In particular, mouse over interactions are completely dysfunctional on most touch devices.

Internet Speed

People tend to make assumptions regarding Internet speed – that it is at least as fast as their own, and is improving all the time. Although this is mostly true, more and more people are connecting to our sites using less than optimal (to put it lightly) 3G connections, or shoddy “free public Wi-Fi” connections at their local library or in hotels when travelling. Everyone is familiar with the mythical beast that is free public Wi-Fi, where in order to get your websites to load you have to stand with your back against the door and if you’re lucky you get one bar of reception! These users deserve consideration, which will result in not only a change in our thinking, but investment in code refactoring and page weight minimisation techniques by developers.

Computer Speed

If you are familiar with Moore’s law, you would have heard the idea that over the history of computing hardware, the number of transistors on integrated circuits doubles approximately every two years.

web-design-computer-speed
Computer Speed

If you waited a year before buying a computer, you could potentially get one which was twice fast, for the same price. This is still indeed relevant in 2013, as the above photo proves – although this is more relevant to desktops than mobile devices as mobile devices have priorities other than processor speed alone. Consideration is given to battery life, price, size and other factors – which a lot of consumers care more about than raw speed. How would you feel if you had the fastest phone on the planet, yet had to charge it every 20 minutes? It’s not so mobile when considering that.

Calibration of Monitors

All web designers worth their salt were always aware of the problems with the monitors that the standard web user was faced with. Most monitors which are not used by web professionals don’t display colours accurately, and a lot are just plain bad quality.

Mobile phones generally have some very reasonable screens, until you start using them outside in the sunshine. If you’re lucky you will be able to read content, but there’s no way you will be able to grasp any subtleties such as gradients in low-contrast designs. More and more people are seeing a subpar colour palette due to the device dispersion which is happening in the market, as we speak!

Correcting Assumptions and Designing for the Future

From the above assumptions (and trust us, there are more) we can see clearly that our assumptions we make about users (which were previously correct) need to change; and our design strategy needs to change to match this. There are new devices, new browsers and many new features we’ll witness with the maturity of HTML5 and new JavaScript libraries which seem to popup every week.
Apart from everyone’s favourite catch phrase “responsive design”, there are other challenges we face with new devices being released every month. New patterns of interaction are required, and these interfaces need to work on any device. Maybe it’s time to reconsider the massive JQuery UI based carousel on the home page which we all love so much? Maybe the full screen gallery which looks great on your 24-inch desktop monitor (which the customer also loves) so much is not so great on your phone’s 960 × 640 resolution?

In part 2 of this blog post we’ll be looking at what we consider the new “defaults” for web design in 2013-2014.


Related Web Design Resources

http://www.leadingedgeweb.com.au/interface-design.php

User Experience Design Prototyping
Our highly professional website design principles are based on informed research and best user experience practices. Prototyping the user journey through the wire framing process allows us to factor in the most efficient way of connecting your customers to your products or services into the designs.
Web design infused withenergy, delivering engagingcustomer experiencesn
Global Screen Size Diversity Infographic


 

Comments

Your email address will not be published.