I have a pages app that works well when I use it on a narrow window but gets confusing to use in a wide mode. First this is my Appearance setup
When I run it in a narrow window in my Safari browser it looks like this
This looks and operates just like my phone, as long as we use the white back arrow.
In a wide browser it looks like this
Notice the Title is now gone at the top as well as the white arrow (go back) at the top.
So when my users run this on a computer browser they now start to use the browser back button to go back which pretty much screws things up. Is there an easy way to fix this? Maybe I can put some parameters on the app link that makes the window get narrow? I have tried different settings in the appearance settings, did not help. Anything else I can try.
You can add a breadcrumb component at the top. I think that’s the general consensus for it to work both on large and small screens. Breadcrumbs won’t show on small screens.
I’ve been dealing with this challenge myself this week… The workaround that I’m currently using is that I created some extra buttons specially for navigation. I chose the “minimal” appearance option so that it doesn’t change the look of the detail sheet too much.
I actually like it better than the breadcrumbs because it’s more visible so I think the user should feel less confused when navigating from page to page now.
And if I want these buttons to only show up on a wider screen, I can use the device info column and set visibility conditions according to screen width. At first this was the plan but I ended up liking the buttons on the narrow screens too. 
I’m actually using both the breadcrumbs and these navigation buttons on the app but i hardly touch the breadcrumbs because they aren’t very noticeable.
2 Likes
