Design of a Mobile Web site and the best Mobile detection Solution

Last week, I decided to create a mobile version of one of my Web sites. I thought it would be a relatively easy task, but I quickly realized there is more that meet the eye.

Without going into all the details (for example questions from the media, etc.), this is the strategy I ended up with...

First step:

I used this script to detect a mobile device...

< script type = "text/javascript" >

If (screen.width < = 400) {}

document.location = ' http://mobile.MYURL.com';

}

< /script >

I know that I could use the media queries or any number of other methods, but this one appeared to require the minimum of effort. For example, the media seems so complicated because I make sure I have the list of possible devices that can check out my Web site. The script above simply says, if the screen is small, view the mobile Web site. The downside is the person with the mobile device needs to have Javascript enabled, but very few people turn it off.

Second step:

I designed a special website for the mobile device.

I could have created special CSS for each page to my Web site, but people don't want to read all the content I have on my Web site in any case, at least not on a mobile device. It was much easier to create a little site for mobile devices instead of make a huge CSS file to convert all my pages.

----------------------------------------------------------

Because there are so many options when you create a mobile Web site, I just wanted to see if everyone here thinks I did it the right way or would you recommend an alternative?

Also, I saw that he sent several times that I should include a link to the 'full version' of my site at the bottom of my mobile Web site. How I do that without creating an infinite loop that continues to send the visitor to the mobile version? In other words, when they click on 'full version' it will send them to the page that contains the script above, and this script will send their right to the mobile version.

Thanks in advance for any suggestions or advice.

All the best,

Bill

Separate sites for the version complete mobile vs is the best method. Just synchronize the data dynamically from database. Depending on the complexity of your site, the setting is completely different for a mobile version. Much, much more than just a style some conditional css rules. Device for side detection Server allows to redirect mobile users to the mobile version, which is usually a completely different directory or same site... ie. m.example.com mobile and example.com for the version complete.

Similarly, you would use the reciprocal method of detecting device for side supported server to redirect anone who is NOT on a device to the full version if they visited the complete mobile URL from a web browser. You can use a cookie with detection on the server to allow the user to "switch" to the version side full and vice versa. Where if the cookie is not set and the device is mobile, then directly on the mobile device and display the button to switch to a comprehensive site that sets the cookie. Much of/and/of/ifelse/instructions if else going on there, but it can be done easily. I hope you get the point.

best,

Shocker

Tags: Dreamweaver

Similar Questions

Maybe you are looking for