Mobile Vs Responsive Web Design

mobile-rwd1

I recently had an interview with a mobile website development agency. When first hearing about the company I was drawn to their humor and their rock-star status lead developer. When I first saw their software that they use to make desktop websites to mobile websites I was intimidated by the fact that this software could be a quick and cheap solution that could take away business from my web development company. My intrigue leads me to the philosophy of: “if you can’t beat them, join them”. Maybe perhaps, desktop to mobile website software is the way to go.

Responsive Web Design, or what web nerds like to call RWD is craft within itself. I like to think of how to make things better for the end user, with clear branding and content that is right to the point. Responsive design uses one set of CSS stylesheets and UI components. One of the things I found peculiarly amusing about the interview was pointing out the pros and cons of RWD VS mobile site. I pointed out the flawlessness of good responsive design, while the person interviewing me pointed out the flaws with having a mobile site. He pointed out how one of their clients website has six different versions and each has a different set of CSS stylesheets with its own set of UI components. He then mentioned the consistency to keep the branding has been a struggle.

With a marketing campaign, it is important to have clear consistency across all mediums. Much as the same way you’d have a TV ad match a billboard ad, you’d also want your website to look the same on a desktop as it would on a mobile phone. The method used when making a mobile site is to intercept your website when it detects a mobile phone, when it detects a mobile device, it shoots it over to where the mobile website is hosted. It is then reconstructed and presented to the mobile phone. Some of the benefits to doing this are the fact that you can have more control of the visual hierarchy, like having an ad display below the navigation menu. Mobile websites also utilize custom UI components only available to that mobile app. This is good and bad. On one hand you’re able to easily create navigation menu tabs to navigate and display content. On the other hand, you are straying away from the original design concepts and general feng shui of the website. Perhaps one of the biggest benefits of mobile app software is that it is hosted on virtual servers that are optimized to handle mobile websites. The biggest naysayers of RWD is that’s its carrying the baggage of the whole website when only the mobile styles are needed. Having just the media queries style sheet for mobile sites of course easily solves this. One other claim of mobile website software is that its supposed to be easy enough for one web developer to get done in one fun-filled afternoon. A funny video about Responsive Design VS Mobile

Some of the drawbacks of the mobile website approach are that you are re-constructing your website and could potentially lose the branding essence of the original design concept. Also having a mobile website just solves one problem for one device. There are potentially limitless scenarios of different devices all with different dimensions. Another huge drawback, in my opinion is that your mobile website is now hosted on 3rd party proprietary software. Using mobile web software locks you in to being at the mercy of another company’s prices and services. In the world of open source software, this is a big no-no.

Following the evolving industry standards of modern web design lets you design and develop for all scenarios including layouts breaking and browser inconsistencies. It takes a human with fine attention to detail with a through understanding of HTML and CSS along with up to date knowledge to perfect. Something that software cannot keep up with. What if the viewer is on a small netbook or perhaps even a jumbo screen? Using RWD solves the problem of different devices and screen sizes in one full swoop. Its more time consuming and requires higher skill. But having a consistent web presences across all devices and screen sizes is worth it in the long run, especially if you are serious about making a clearly branded impression.

RWD is at the cutting edge of web design, but its still at its infancy. Emerging technologies such as the flex box model aim to solve the loose ends by allowing positioning of elements based on x-y coordinates. This solves one of the main qualms with RWD and the main advantage of a mobile website: the ability to absolutely position elements based on visual hierarchal importance. The Web is always evolving and RWD is something that will be part of the web designer’s toolbox for years to come.

Back to the job interview, it was both insightful and reinvigorating at the same time. I was able to square off directly with my competition in a face-to-face showdown. Their million dollar team VS my street brawn, open source technology and my partner, Vivian Yan’s awesome design skills. I was able to show them that website craftsmanship eliminates the need for their product and its a more practical long-term solution. Leaving the interview, I left with a new philosophy: “If you can’t beat me, why would I join you?”