Blogger mobile templates with (buggy) swipe navigation

As many bloggers, I like to monitor when my articles get shared on social networks and what do people think about them – actually only on Twitter with a saved search in TweetDeck. A couple of days ago, someone complained on Twitter that a post was unreadable on mobile. I use one of Blogger’s default templates and I hadn’t noticed anything wrong with it previously. After asking for some clarifications, it turns out that mobile templates support a limited set of gestures: you can swipe right or left to navigate to the previous or next post. The problem is this interferes with another native iOS gesture, pinch-to-zoom: if you pinch the page, instead of zooming, Blogger jumps to another article! This issue seems limited to mobile Safari, because in Chrome pinching doesn’t cause the browser to navigate away. At first I thought it’s a bug introduced in iOS 6, but the feature is more than one year old and some complained about similar issues six months ago, so I guess nobody took the time to test the mobile templates on an iPhone…

@exde601e The page content isn’t scaled to the viewport so it’s too large. But you can’t pinch to zoom out as this loads another/next post.

— Jamie Reynolds (@jamusreynolds) October 11, 2012

There is no easy solution it you want your readers to have a good mobile experience: the desktop templates are often too bloated with widgets to fit into a portrait-oriented small screen, the mobile dynamic templates are much slower to load and the sharing buttons ‘leak’ out of the page – again an indication that the team designing the templates is not really focused on mobile. And designing a unique responsive template for both desktop and mobile is unfortunately not something an average blogger can do…

Update: A reader found a solution from the Blogger help forums and shared it in the comments: How can I disable the arrow-slider on mobile?.