Hey guys,
I’ve built a web application that is responsive on all mobile devices but am now looking at options for a separate desktop version. It was originally built for mobile use but am planning for a desktop option in case users use desktop.
What would my options look like? I can play with the responsive features but it was designed for mobile so it wouldn’t look the best stretching it out to desktop. I’m also not opposed to just having a splash page that opens when a user uses a desktop that says “desktop not available, click here on your phone.” Is that possible?
Best,
Josh
You can do the splash page concept pretty easily by having a popup appear on page load if the browser’s width is wider than a certain value. If you make the popup unable to be closed by pressing escape (one of the checkbox options), users won’t be able to close the popup by clicking outside it’s area.
The other thing you can do is to put your current design for each of the pages in a group called “mobile,” and only show it when the page width is less than a certain value. Then, design a look for your desktop viewers that only shows when page width is wider than that value.
You could also create a totally separate desktop page, and just reference the existing page as the Mobile-friendly page in the context panel, but this means you’re duplicating work everywhere. I don’t recommend this approach.
For the future, I’d consider designing with the responsive mindset from the get go, it’ll save you some headaches (like this one!) down the road.
1 Like
As Andrew says, don’t take that road unless… Duplicate coding is very difficult to maintain. You will probably hate yourself in a few months 
I’ve decided to go with the splash page. Is there a way to have this without it being a pop up? The entire responsive application is one “index page” and a bunch of groups.
Yep, you’d just create another group and have it show or hide based on the page width.
