How do I make such a page that opens different link in web (PC) and different in mobile (phones)?

Question

I am building a website that looks beautiful in Web but worst in mobiles. I want to build the same site but different designing for mobile. Whenever user opens site.com then it auto redirect to m.site.com OR site.com/mob only if on mobile.

Answer 1

There are 3 ways to implement a mobile website:

1. Responsive Web Design: Serves the same HTML code on the same URL regardless of the users’ device (desktop, tablet, mobile, non-visual browser), but can render the display differently (i.e., “respond”) based on the screen size. Responsive design is Google’s recommended design pattern.
2. Dynamic serving: Uses the same URL regardless of device, but generates a different version of HTML for different device types based on what the server knows about the user’s browser.
3. Separate URLs: Serves different code to each device, and on separate URLs. This configuration tries to detect the users’ device, then redirects to the appropriate page using HTTP redirects] along with the Vary HTTP header.

You can choose any method suitable to your requirements and project. There are both pros and cons of each, so I will recommend spending time on the decision.

Answer 2

Read more about HTTP. You probably should take into account the User-Agent: header.

It would be different on mobiles and on desktops (and would vary from one browser to the next).

A clever user would probably be able to fake it, but few people do that.