Not that long ago the term ‘mobile site’ came into existence, which basically meant a company would run two websites side-by-side; one full size website and one mini website that was optimised with smaller pictures and bigger menu buttons that people could easily navigate on their mobile phone. This has worked pretty well up until recently when two things have happened.
The first and most major of the two is this: according to reports from Google (even as far back as 2012), more people have a mobile internet-capable device than a PC or laptop in the five key markets it tested (US, UK, Germany, France and Japan)—and I wouldn’t be surprised if Australia was in a similar situation. Even here on the Evocative website, of all the visitors to the site since 1 January 2014 to when this article was published, 37% were on a mobile or tablet device! Now when they say ‘mobile internet-capable device’, they are not saying ‘mobile phone with a 320 by 480 pixel resolution screen’, this generic term can refer to basically anything that isn’t a netbook, notebook, laptop or desktop computer.
So what does this mean? Ever tried to visit a website on an iPad or tablet only to be forced into viewing the ‘mobile’ site. Normally oversized and ugly, it just doesn’t work. And even smart phones and tablets these days are not consistent in screen size or resolution. An iPhone 3GS is 480×320 pixels, an iPhone 5S is 1136×640, an iPad2 is 1024×768 pixels, an Asus Transformer is 1280×800 pixels, and even the Samsung Galaxy Note (despite being a ‘mobile phone’) has an astounding 1280×800 pixel 5.3” screen.
The second big issue is Google. Your websites rating in Google can just about make or break your business these days, and making two or more completely separate websites for each type of device dilutes the strength of your Google rating according to Google themselves. So what do they and we recommend?
The best way to explain this concept is to actually grab the corner of your Internet browser window (if you’ve still got an actual computer that is …) and simple drag the window size across left and right, and you’ll see this website dynamically scale and change format to suit the size of the window—all in real time. There is no duplicate sites (which is good for Google and makes it much easier to maintain your content) and there is no limit to the amount of different devices it can appear on correctly. Every element either rescales, moves or disappears depending on the size of the window it’s in.
Responsive website design is crucial on today’s wide ranging variety of computers, notebooks, tablets, phablets, phones and even devices like smart TVs!