So, I published my website today to give it a live trial. It looks great on desktop Chrome, but on desktop Safari it’s showing the smartphone layout. Any idea why it’s doing that, or how to fix it? Thanks.
There could be a couple of reasons for this. One, you may have developer mode switched on in Safari and maybe set it up to show a particular device variant. The other thing to check is that the browser window is sufficiently large to display the desktop site. Apart from those two things, I can’t think of any reason why Chrome displays the site correctly, but Safari doesn’t. Did you try any other browser?
I might add to Franks’s solutions… make sure your Safari browser is set to view correctly, buy going Safari / View / Actual Size.
Thank you both for your replies.
francbrowne, I took your suggestion and tried other browsers. I tried it on Chrome, Microsoft Edge, and Safari, on two different machines. It always displayed desktop mode on Chrome, but smartphone mode on Safari and Edge.
FlaminFig, I checked, and Safari was set to view actual size. However, when I clicked “zoom out” once, it went to desktop mode. Same on Edge (except I had to click “zoom out” twice).
This shouldn’t be. It should display desktop mode when viewed on a desktop, no matter the magnification. Is there a way to make it do that? If not, I might just get rid of smartphone mode altogether, though I would hate to do that.
If the Safari Window is narrower than the width specified here and other devices in between are not active, the Smartphone at the bottom will be shown to you. You can try by making the Safari window a little larger.
That turns out to be exactly the problem. I can make Safari toggle back and forth between desktop and smartphone by dragging the edge of the window left and right.
Unfortunately, I don’t think users will know to do that. They’ll think the smartphone layout IS the desktop layout, and they’ll think it’s a poor design.
I’d like it display desktop mode on a desktop even if the right edge of the page gets truncated. In that case, users will know they have to enlarge the window if they want to see the whole page. I’ve seen webpages that do that.
If there’s no way to make a Sparkle-generated page do that, I’ll have to get rid of the smartphone layout. That would make my life a lot easier, but it wouldn’t be optimal for the user.
@Gary, you’ll need to educate yourself on this further…
Users will for the most part not readjust their browser width when opening a website. If the browser is not wider then the assigned 1200px desktop then the PC 960px will be presented - if it is there.
As Selcuk pointed out you have the one website that you have created most likely in the 1200 desktop. If you want to make your Sparkle website responsive you have to introduce the Devices and it sounds you have done so with the 320px. If in your case you just have the 1200 and 320 Devices present then you will run into trouble!
Have you tried to introduce the 960 and 768 as Automatically Scaled?
I have not tried that. It’s a great suggestion, thanks. I’ll try it.
That worked great, thank you!
The browser has to be pretty narrow now to go to the smartphone layout.