<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d8211560\x26blogName\x3dTech+Tips,+Tricks+%26+Trivia\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dBLUE\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttp://mvark.blogspot.com/search\x26blogLocale\x3den\x26v\x3d2\x26homepageUrl\x3dhttp://mvark.blogspot.com/\x26vt\x3d-5147029996388199615', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Tech Tips, Tricks & Trivia

by 'Anil' Radhakrishna
An architect's notes, experiments, discoveries and annotated bookmarks.

Search from over a hundred HOW TO articles, Tips and Tricks


HOW TO make your website mobile-friendly

Gartner research predicts that by 2013, mobile phones will overtake PCs as the most common Web access device worldwide. Bruce Lawson offers 3 strategies in a Dev Opera article to "mobilise" a web site to work across all devices i.e. not just mobiles but also alternative browsing devices like games consoles (Nintendo Wii, DSi), web-enabled TVs, in-car browsers etc -


Strategy #1: Code well and do nothing special for mobile - The current crop of advanced mobile browsers are very good at rearranging content without being told how to by a developer...Making a good semi-liquid layout that has a min-width and max-width set in your CSS and em-based typography will work very well across a range of different devices and screen sizes.

Strategy #2: Make a separate mobile site - .. (although) it results in having two sites to user-test, maintain, etc

Strategy #3: Build mobile-aware adaptive sites - hardest to pull-off methodology... (but) future-proof as it tests features rather than sniffing browsers.

There are also numerous mobile web optimization tips in that article -
  • Combine files and reduce requests across the network
  • Put script elements as far down as possible in the source
  • State the dimensions of images in the HTML
  • Opera users can sign up for seven free hours of testing on Perfecto Mobile service that lets you test on real handsets via the Internet

.. and interesting facts -

Smartphones can run full Web browsers such as Opera Mobile or Safari/iPhone, while in the developing world we see much lower-end handsets that don’t have an operating system but, if they can run Java they can use Opera Mini (a thin client for a proxy-based system that compresses pages down to about 10% of their original size before being sent to the handset for rendering — see our comparison of Opera Mobile and Opera Mini)

Also see:
Jason Grigsby’s DOs and DON’Ts of Mobile Strategy
Visual tags: Microsoft Tag vs QR Code

Labels: , ,

Tweet this | Google+ it | Share on FB

« Home | Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »

»

Post a Comment