Best practice for browser bar

[redguitar]

Hello, apologies if I'm not using the correct terms, this is re: the mobile browser bar, where the URL address appears. I realize this space can "disappear" once interactions start happening, but it doesn't appear to be a consistent behavior that I see across all mobile sites, or all phones. Therefore, I've been designing with the assumption that this space is not available to me, and I've adjusted my scroll line accordingly. My viewport is set at 560 for Android, which looks perfect when viewed on a 360x640 Android phone (my test/prototype phone). If you could please clarify the best practice for accommodating the browser bar I'd appreciate it, thank you.

[Peter Villevoye · Accepted solution]

It's fairly impossible to accommodate your design for all possible device screens, browsing apps, and mobile systems. They all have a different sizes and approaches for handling the browser bar (its size and behavior) and other main navigational elements. So pick a size and rendition that suits a use case, design it with or without a sample browser bar (and some behavior), and expect or warn your reviewers to understand that this design is a mock-up.

Compare it with giving instructions how to reverse-park a car. You can't anticipate all possible situations, but you'll demonstrate one and hope for the best... 😉