Lignin, the stuff that prevents all trees from adopting the weeping habit, is a polymer made up of units that are closely related to vanillin. When made into paper and stored for years, it breaks down and smells good. Which is how divine providence has arranged for secondhand bookstores to smell like good quality vanilla absolute, subliminally stoking a hunger for knowledge in all of us.
Perfumes: The Guide (via)
I recently discovered that iOS’s Safari browser and OS X’s Safari browser render scroll bars on web pages differently. That is to say, the former doesn’t bother rendering them at all. On a touch interface, this makes sense for most pages, but some pages have scrollable areas within scrollable areas because we get our design ideas from watching Inception and Pimp My Ride. Specifically, CSS’s overflow properties can make a block element stay within its max-length and/or max-width and ask the browser to make it scrollable. IOS Safari lacks any visual cue to let the user know there’s more content waiting to be discovered, so it stays uncovered and the designer that made the page is labeled a hipster forever. As it turns out, you can use two fingers to scroll a scrollable area within a scrollable area.
Theoretically, this crucial information is noted inside the manual of my first generation iPod touch. This manual is either still in the box with John Lennon on it or was lost to the Great Paper Shredding of 2008. In any case, no one reads manuals. I never noticed a scrollbar in iOS before, which solved half the mystery. I solved the other half with a DuckDuckGo search, by accident when I was trying to figure why overflow-y was being ignored. Some users would be curious enough to just start diddling their screen in every combination of the iOS finger-sutra they can think of and unlock the hidden knowledge of the elite, achieving a grand accomplishment that would make them feel like a level 9001 Mason. Some people won’t bother and assume your site sucks.
This problem is solved in other interfaces with an initial tutorial that explains how to do stuff, others have visual cues for at least the first few times you are expected to perform some kind of action (this is used a lot in game design). Apple’s response would be to rebuild your site to suit their particular approach to touch interaction, where scrollbars really aren’t an ideal interface. That’s a proper approach for building a site you want a lot of iPhone users to visit and interact with often, but something akin to a personal page doesn’t deserve that amount of effort, in my opinion.
My first approach to this problem is the addition of a visual cue to the scrollable area (pictured), letting users know what Steve Jobs didn’t tell them. The current problem with this approach is that the code as of today displays this cue on every page load until the user taps it, adding a layer of annoyingness that could possibly escalate into all-out iPhone-chucking RAGE. Using Safari’s HTML5 local storage support may help this problem.
tl;dr: No one reads manuals. If you want to let iPhone users know they can scroll your scrollable areas with two fingers, you can add overflow-touch to your web pages until Apple adds some kind of visual cue or game-style tutorial to indicate a scrollable area.