5

I build a website either by simple HTML/CSS, or I build one using Drupal or Wordpress, for modern PC browsers. Now, I want a mobile-friendly version of the site. What is considered some of the best ways to do this?

My thoughts:

  1. Detect the mobile browser from a list and redirect to a subdomain/dir that has been designed for mobiles

  2. Build the site to be simulatenously viewable by all browsers, mobile or not (using fluid layouts)?

  3. Using a CMS, install a module that does the work for you.

I'd really like to know how some of the big, popular sites implement it and what you all consider to be the proper way. I understand that NY Times has its own app for this, but I consider that to be overboard for obvious reasons.

4 Answers 4

5

A big site I worked on before tried a few different ways of user-agent sniffing with redirects that proved to be a bit slow when dealing with millions of users. We also ended up needing to provide a link to the mobile site anyway, for those users where user-agent sniffing failed. They ended up just using a prominent link to the mobile site, and encouraging mobile users to bookmark the mobile version. The BBC take a similar approach.

Device-based CSS and fluid layouts ignore the fact that browsing on a mobile device, especially a touchscreen one, is a totally different experience to using a keyboard, mouse and 19" monitor. In terms of design you need to think more about page weight, massive buttons (for fat fingers), pinch and zoom, etc.

You also need to think about why your users are browsing on a mobile device, rather than a desktop or laptop. They are likely to have different goals and needs. One big example is white goods sites that provide mobile-optimised sites, with exactly the same content. I wonder how many people order a fridge after seeing a thumbnail on their iPhone? Mobile users are more likely to be looking for store locations, phone numbers, prices for a product they are looking at in another store, etc.

Hence, the most effective mobile sites are those that are thought of as providing a mobile experience, rather than just a mobile design.

1
3

A really big popular site like facebook currently has a mobile version of their site, which has to be seperate to their full web property. The paradigms are just so different.

Here is an article about the tech they used to serve all the different levels of mobile devices with one code base: Facebook Engineering - One Mobile Site to Serve Thousands of Phones

1
  1. Means you have to do two sites.
  2. Is not simple, but I think it's worth it. This question from someone who only wanted to do the work once may help you: What are the most efficient/effective ways I can build a website for Mobile and Computer?
  3. That's easier than 1 or 2, but the results may not be as good.

If you can give an example of a big popular site we can try and work out how they did it.

0

i have enabled mobile view on my blogger site when I looked at the source code it seemed to base things around the viewport a device could support with a custom CCS style sheet setting for mobiles.

As @paulmorris

  1. Means 2 sites and you will up to keep updating the detection side of things as mobile technology progresses. Also consider if this will cause duplicate content issues (i currently favour using a rel canonical tag to the main site).

  2. Would be my vote as well.

  3. Easier. Wordpress seem to have a good mobile version.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.