Sunday, March 10, 2013

Mobile Website Compatibility and Legacy Page Support

We are supporting mobiles with our website.

What do we mean by that?

That when using a SmartPhone browser, the page is formatted to be readable and usable without all the pinching and zooming you have to do when accessing a normal webpage on a phone browser.  We haven't used Flash (as it is a SEO killer) so iPhone support has never been an issue.

At least we are supporting mobiles on our new and most popular pages. We cannot justify changing the whole site, when mobiles are still around 10% of accesses. We started with a php script from the net and have modified it to reflect our own testing.  This script checks the reading devices type string against a long list of devices known to be "mobile".  In our definition of mobile, an iPad is NOT mobile, as it has a large screen and handles normal webpages without a problem.  This brings up a few generic issues that we will look at here.

One problem is we don't have all the target platforms. We know the list of devices being tested against is not current, and that all we really care about is how wide the screen is. We know it works with only a few of the possible browsers that we can test it with. Worst case is, it defaults to a normal browser, and you have to do all that pinching and zooming on a mobile device.

Real testing is hard. The emulators out there aren't good enough. They don't emulate the platform to provide the serve with the information to determine what type of device it is. There isn't something like VMWARE for testing all platforms virtually. Probably needs to be.

Heavy Metal Garage - Car CARtoon Series is the first page that hasn't had to contend with legacy search engine comparability.

What do I mean by that?

Well, search engines have already indexed and stored away many of the index.html pages on our website.  You can not just delete these and change them to a index.php or you disappear from Google. This would be a bad thing and result in hugely reduced site visits.  (Not completely true, as you can handle this on the server but not going into that now....)

We are handling this in the short term, with a normal index.html and a mobile m.index.html page files.   To those directories we have added a index.php (and set up the server to get this if something else isn't specified) that then outputs the appropriate .html file.  These pages generally give the option to select mobile or normal browser if the php doesn't get to run.  We rely on our versioning tools to help with updating two different pages.  

I must also add here that we develop our pages in straight html and php in a programmers editor, so we code at the lowest level.  The way we started with the web in 1995.

For the new pages, we just have the index.php file, and that internally has multiple sections of code like:

This tests for "is it a Mobile" then outputs code for a normal browser, or a 320 wide window for iPhone sized screens.  It also selects a different css file and other things.  It is a mix of html and php, which is not elegant.

Now the PEAR php library has routines that do allow you to separate out your php and html code, so that they are much easy to read.  However we have previously been caught with a PEAR version issue, that means we don't want to be dependant on a 3rd party library we have no control over and can break out site.

We can do this as we keep with the Google approach of keeping things very simple.  Complicated can have the extra meaning of "expensive and time consuming to support".

We can be contacted at  Art & Technology.

No comments: