Home/ Questions/Q 8698727
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T01:47:22+00:00

I made two different webpages for the same site: one for phone devices and

  • 0

I made two different webpages for the same site: one for phone devices and one for desktop devices. The primary reason is because the webpage has a lot of buttons and if you are using a phone the buttons are dificult to touch because they looks very small on phone screens. So I made a javscript who redirects the user to the respective page based on the resolution of the screen.

if ( (screen.width < 800) && (screen.height < 600) ) { 
    window.location = 'mobilesite';
} else {
    window.location = 'desktopsite';
}

But i am worried about the new retina displays. I think this approach is not going to work. (I have not a retina display device to test it)

I decide not to use a differentiation based on the operating system because my problem is with the size, not with the OS, for example, in Android/IOS/Kindle/etc. tablets I prefer the users to use the desktop version because it looks better in big screens.

So I have two questions:
1.- The resolution of the retina display affects the resolution of the browser? (Or maybe only the native aplications)

2.- Is there any different way to diferentiate between a phone and a tablet using javascript or jquery clientside?

Also, I think is important not to limit the script to detect this diference in IOS devices only, very soon it will be more high resolution displays in phones of other brands.

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    An Apple Retina Screen will report itself as if it has half the amount of pixels it actually has, because the browser does magic itself. If you want to detect a high-res screen, multiply by the pixeldensity.

    Don’t do a useragent check, because you’ll be adding more devices every 2 weeks. And its breaking the web. Do feature checks or specific checks.

    Oh, and you’ll want to read into CSS3 Media Queries, in case you just want to show bigger buttons for mobile devices.

    • 0