Posts

Showing posts with the label mobile web

Mobilize.js versus responsive web design (RWD)

Image
Mobilize.js versus responsive web design (RWD) Both mobilize.js and responsive web design offer solutions to having a mobile and desktop site from the same codebase.  This is a comparison and evaluation of the 2 approches mobilize.js rendering I previously blogged about mobilize.js and how it can be used to transform a website dynamically between a desktop and mobile-enabled site.  As a brief background, mobilize.js is a javascript library that detects if a mobile browser is being used and, using client-side javascript, and re-renders the page using predefined mobile-optimised css.  However mobilize.js is no longer being developed - the developers now recommend using responsive web design instead.  In one of the comments to my original post I said I would check out the relative merits and report back - this is me reporting back Responsive web design works by detecting the size of the display and rendering differently using css (css3) media queries. ...

Launch a website as a mobile app using PhoneGap/Apache Cordova

How to launch a website as a mobile app using PhoneGap/Apache Cordova I spent some time recently trying to find out how to launch my website as a mobile app.  The information was available around the internet but since it took me a while, I thought I'd collate it here in one simple post for anyone who wants to do the same I decided to use Apache Cordova since it gave me the framework for developing an HTML5 site as a mobile app already, meaning all I really needed to do was plug my website into it.  Their getting started guide has good information on how to create a Cordova project - I used Android but you can use whatever means you wish A basic Cordova app gives you a way to launch the app with an HTML page that you use to display your app contents.  The trick then is make the page load your website which you can do in one of 3 ways: 1. Package your site inside the app. This means it loads fast and without an internet connection.  The downside i...

Installing and using mobilize.js to transform a desktop site to a mobile site

Image
Installing and using mobilize.js to transform a desktop site to a mobile site mobilize.js offers a neat and simple method of creating a mobile optimised website with very little change to the main desktop site. With a few lines of javascript and some css you can create a mobile optimised site without having to maintain 2 different sets of content. However the instructions on the official site aren't the best. So with some digging I managed to transform - From this (Firefox on my laptop): To this (Android browser on my Samsung Galaxy Nexus): with no html changes other than adding some <script> tags to the <head> element.  Plus automatic browser detection to display either site depending on the browser used - mobile, or desktop Here are some step-by-step instructions on getting it working. Why would you want to? So going back to the beginning, these were my requirements:  I wanted to create a mobile optimised site but, as I already ...