Your core mobile-implementation strategy sets strong restrictions as to what you can do and what not. So before we start tackling each issue (like responsive tables), we must decide what strategy to pursue.
Fortunately, this is very easy: Responsive strategies beat Adaptive strategies in about 99% of all cases. If you’ve been influenced by Microsoft these last 10 years, you may still believe in Adaptive strategies, but even Microsoft seems to find their way, judging by the new presentations of Universal Apps.
Many words like Adaptive & Responsive have been used by various people – and often incorrectly. So I will first explain what most experienced web designers call Adaptive and Responsive.
What is an Adaptive Strategy?
Adaptive Strategy: Sending each device the correct HTML, CSS, etc. Basically it’s when you’re doing server-side adjustment to the viewing device. Some examples:
- Amazon.com sends PCs a huge, cluttered, messy web page, while mobile devices receive a very simple, reduced web page
- One of the core „features“ of ASP.net MVC is that you can „give each device a different view“ – there are special mechanisms built in to group devices, detect them and give each group another view
What is a Responsive Strategy?
Responsive Strategy: When the HTML, CSS etc. responds to the environment it’s in (the browser, window-size etc.) and modifies it’s behavior. Basically it’s doing client-side adjustments. Some examples:
- Most wordpress blogs
- The sales-training portal of Ricardo (something like ebay)
- The website of the IOR (AKA Vatican Bank)
- …just about every new website or online store with a reasonable budget – just do a quick search, you’ll find thousands of great, inspiring samples
Why is Responsive so much better?
There are actually many reasons, but instead of going philosophical – which just causes many arguments to be exchanged – let’s look at the 2 decisive factors today:
- Everybody who actually tries doing adaptive will quickly discover (for reasons mentioned later) that it’s not possible to do adaptive, without responsive. So if you start with adaptive, you end up doing both. But it’s easy to do responsive without adaptive, so you might as well just simplify.
- Responsive has already won the show – research it in Google and similar, it’s a clear cut case. Even if you liked adaptive, must must admit it’s over. Here’s a Google trends-chart from today
So those were the dry facts. You might wonder why Adaptive failed. There are many reasons, here just a few:
- Adaptive only works with client databases (Nokia xyz detected, it supports touch…). This causes many problems which can be solved, but cost time and money.
- The device detection cannot know if the device is rotated, if JS is enabled etc. Responsive can work with this, adaptive cannot.
- If you create multiple HTMLs for each device – you end up with a lot of „views“. This is highly ineffective and causes much redundant code, because of the many possible combinations of screen sizes, touch-capabilities, and more.
- Responsive can handle each feature separately. This means, it can handle all screen sizes ideally, and then it can handle all input-capabilities (touch, keyboard, screen, mouse, disabled-reader…), and then it can be semantic, and retina-optimized and more. It’s just so much simpler.
Is Adaptive completely dead?
It’s only 99% dead. There is an approximate 1% of scenarios where it might be useful to help the responsive web. But I couldn’t name a really sensible scenario. SharePoint 2013 is still adaptive, Amazon is still adaptive, but all the examples I can think of feel more like leftovers of a previous era. I would like to note that Microsoft has also discovered this and will move on with their new strategy of „Universal Apps“. So I believe one of the last proponents of Adaptive has just given up.
Since we now know for sure that Responsive is the only way to go, we will continue with planning Breaking Points – a very important concept in responsive web sites.