-1

I am working on a project. I am making clone of a website Make My Trip

https://www.makemytrip.com/

this website looks different in laptop and mobile, I mean totally different. So how can we achieve such functionality.

This is the view in Laptop

Same website in Mobile

  • 3
    The search term you're looking for is "responsive design". The same page would have different styling based on viewport size (and potentially other factors). – David Sep 16 '22 at 18:55

1 Answers1

0

The comprehensive answer depends on many things not yet disclosed. Such as whether you using a server-side language such as PHP and whether all/most of the pages are different ?

It's not straightforward to detect if the site is running on a mobile.

One solution is to

  1. Have a common index page that uses javascript to grab the screen dimensions and uses ajax to load the real page mobile - or desktop

  2. Have a button/link on you page to allow the user to switch over from one to the other and save the choice in the cookie/session.

Another option

I have seen some sites do this. Always serve the mobile version by default and allow the user to switch to the desktop mode. The assumption here is that more people are using the mobile, so the default is correct for most people and a smaller page on a desktop is not as bad as a large page on a mobile.

Rohit Gupta
  • 4,022
  • 20
  • 31
  • 41