Services: Mobile Adaptive & Responsive Design
wh00t! this one is actually relevant!As happens every six months or so, technology has changed the rules. To civilians, it’s maddening. Tech geeks, on the other hand, tend to put it under three headings: Shiny new toy, something cool to take apart and job security.
Our latest addition to the pantheon is the mobile platform and the debate between adaptive and responsive design. These days, those kooky kids with their Dan Folgeberg and their Zima are stepping out from in front of the monitor and using mobile devices –– smartphones and tablets –– as their information platform of choice.
Although mobile phones have been capable of accessing the web for years, only recently has the mobile browsing share exploded. Unfortunately, there are good odds that something else exploded – your web site.
Mobile browsers aren’t built and don’t behave exactly like desktop browsers, for some good, solid reasons. And that means your site may not be behaving the way you think it is.
Mobile browsers use some tricks to make big things fit into a small space. Specifically, they scale things down. Way down. This means all your text and imagery – including your navigation buttons – just got tiny, hard to read, and difficult to find.
It may also mean that your site design broke a bit. Scaling isn’t an exact science; the browsers themselves determine what to render at what size, and it isn’t what you might always expect.
Mobile devices [with the notable exception of certain BlackBerry models] are touch devices. They don’t use a mouse and cursor that can be depended on to be in a certain location – instead, they use big fat fingers that bounce around on them.
This causes two problems. First, what are known as “onMouseOver” events in JavaScript don’t work on mobile browsers – and that means that your image rollovers and, quite possibly, your dropdown menus don’t work. Second, we’re back to the small button problem. Big fat fingers don’t end up hitting your scaled down buttons. Instead, they hit wrong buttons, multiple buttons or selected a section of text instead. Rumor has it this is done specifically so companies can sell more mobile devices after their owners throw them against a wall in frustration.
Adobe tried to port Flash to the mobile world, but it just didn’t take; they’ve ended support. Apple’s iOS platform also doesn’t deal with Java.
The upshot of this is that your Flash-based navigation system or animation probably isn’t working in mobile browsers. And if you’ve got a 100% Flash site, well... you get the picture.
Responsive design is the new black.
Developers have learned a new trick – a set of technologies and techniques that fall under the term “responsive design”. Responsive means exactly what it sounds like; the site has a single framework that delivers the information differently depending on what size device is accessing it.
This has some real upsides – like having just one place to update things – and it’s so cool that we used it on this site; try making your browser window narrower and see what happens. Well, and because of what we do, we kinda had to show we can do it.
Responsive also has some singular downsides. It tends to be a bit fragile, and you need to go ahead and get ready for some real testing hours. You also need to accept that there are some limitations put into how a site’s overall look and feel come together in order to make it all work.
More importantly, it isn’t necessary – or even desirable – for every project. If you’re a plumber, people on a mobile device standing in the middle of a septic backup don’t care about how many trucks you have; they want a big fat button that says 'Press Me to Call' and some ancillary information about your services.
Long to short, we can help you make the decision on whether you want a fully responsive design or not. And we can do cool things to the menu system. Go on, try it.
Adaptive design is responsive’s less sexy but really sturdy cousin.
With this set of tech, we figure out how you’re coming in and deliver accordingly. This means we might deliver a completely different template and a whole different information architecture. The old term for this was a mobile ‘subsite’.
If your project is deeply complex or your customer base on mobiles has different needs and bandwidth issues – and they often do – adaptive may be better route for browser joy.
We can help.
If you decide to move your site mobile browser friendly, Liquid Anvil can help. We can replace and rebuild navigation, route smartphone users accordingly to different pages, help streamline the design into river or columned interface layouts, and more.
Your changes need not be heavy handed, necessarily; small tweaks to an existing design can make huge differences to a mobile user.
It can be fairly said that Apple fundamentally changed both the smartphone & tablet PC markets with the advent of the iPhone & iPad. And that change has sparked a tide of innovation on other platforms, including Android, RIM, Symbian and, Elvis forbid, Windows.
Let us help introduce you to the internet’s fastest growing market segment.
Just as we can help you with creating an optimized mobile friendly site, we can also help you go native.
We understand and have even developed coursework in some of the technologies underlying web development for the iPhone, including patterned JavaScript libraries, WebKit, Dashcode and Canvas. We’re also working now on developing WebApps through Appcelerator Titanium, so we can touch both iPhone and Android. And we’re busy cooking away on Objective C, the iPhone & iPad native language, in our spare three minutes a day. Expect a Liquid Anvil built application in the iTunes store soon.
And if it is beyond us, we’re not shy about mentioning it. We have access to a number of high-end, professional iPhone developers we can liason with so you don’t have to learn to speak technicalese. Your application will get built - and built right.
There’s actually no real reason for this, but thank you for looking.
