Back to UI Basics

I want to take a moment to rant about something I really hate. I hope that this gets a lot of attention because I would really love to see this standard changed. Maybe (hopefully) you feel the same way…

Has this ever happened to you?

The built-in mobile browser...You’re reading through your Twitter timeline on your iPhone and you tap a link to some article. That article links you to another article, then another, and then one which links you to a couple of photos. After looking at one photo you decide to go back to the article, so you reach up and tap the back button.

Only, the back button isn’t “up”, it’s at the bottom of the screen.

Now, instead of going back to the article you were only half-finished reading, you’re all the way back to your Twitter timeline, with only a faint recollection of how you got to the article you were reading in the first place.

Great.

Now you’re left with two options: click back through the tweet and articles to hopefully find where you were and continue reading, or, abandon the article forever and convince yourself it really wasn’t all that interesting.

Don’t tell me it’s the “Standard UI”

After years of surfing the internet we’ve been conditioned to look to the top-left corner for a back button. Of course, there are shortcuts and other methods available as well, but the top-left corner back button has been a staple of browser UI for as long as I can remember.

That, of course, is not the case with the iPhone. Because of its limited screen real estate, the designers opted to place the back button at the bottom of the screen along with some other navigational controls. It’s different, but not unusable. And when using mobile Safari, it’s not even uncomfortable.

This all changes, however, when an app incorporates Safari and it’s controls within the app. Using the standard Safari controls is not the best option, I think, so let me take a moment to explain why.

The reason this sucks

Not only have we been conditioned to seek the top-left corner when browsing back using a desktop web browser, but we’ve been conditioned this way by mobile apps as well to browse back through their many in-app pages. This is especially true within Twitter clients because there are innumerable means to reach any content. After you’re deep within the app, it makes perfect sense to hit the back button in the top-left corner until you’re back to the beginning.

My Proposed Solution (listen up App Devs)

An alternative to the built-in mobile browser UIMove the back/forward buttons to the top bar, replacing the “back to timeline” button.

If someone only browses through to the original link, the back button remains as the “back to timeline” button. But, as soon as they go beyond the first page the button becomes a standard browser back button.

This way, it continues to function exactly as the user would expect. No confusion, no problems. The end.

If you’re concerned that this method will make it too difficult (or take too long) for the user to get back to their timeline, incorporate a touch action where the user can swipe across the back button from left-to-right and be returned to the original tweet/timeline. I’m fairly certain one of the apps incorporated this method for browsing back within the app, because I remember using it.

If you really hate that option…

I would settle for a contextual menu that appeared when the user taps the first link within the linked page they’re viewing. Instead of dutifully opening the link like normal this contextual menu would ask the user whether they want to continue using the in-app browser or open the link separately in mobile safari. It’s not as graceful as my requested option, but it certainly provides a pattern interrupt that would remind me “if you continue browsing in-app, don’t use that top back button”.

So, what do you think?

I can’t possibly be the only one who feels this way. If this bugs you too, take action! Show your solidarity by sounding off in the comments, alerting the makers of your favorite Twitter app and generally helping spread the word. Together we can defeat troubling UI!