Will You Change Your Web Site For the iPhone?

An anonymous reader calls to our attention a blog post about the way the iPhone's multi-touch UI will strain the interface conventions of Web 2.0. This looming clash comes clearer as Apple releases more details of the iPhone's UI. Much has been made about the iPhone including Safari to provide a full web browsing experience. But this reader is wondering how compatible certain sites will be with the iPhone's input. From the post: "[Web 2.0-style interaction] makes somewhat heavy use of 'onmouse' events and cursor changes... along with CSS a:hover styles. The iPhone challenges those particular Web 2.0 conventions, though, because it is a device that not only adds support for another pointer, but at the same time eliminates them as interface objects... [T]he user doesn't get to express their attention with the iPhone... They only get to express their immediate action." This reader asks, "What other pitfalls lurk in the multi-touch web? Do any Slashdot readers plan to adjust their sites to ensure they work with the iPhone, and can you think of any similar issues that will crop up with such a different browsing experience?"

Comments

Conjecture about the iPhone?

[crimguy]

Sure sounded that way. Lets just release the damn thing and see what it does.

Re:Conjecture about the iPhone?

[TheRaven64]

It's not really specific to the iPhone. Hover and mouse-over events don't work with any kind of touch-screen, even if they are not multi-touch. If your UI depends on them, then you are an idiot and should never be allowed near a web site. Fortunately, most of the web sites I visit know this. The last site I remember that used most-over events for important data was Jabber.org, which used to put data about public servers in a tool-tip. This was horrendously bad, since it meant that important information was unavailable to a large number of browsers (including Opera, which always put the address in the tool-tip), irrespective of whether they used a touch screen or not.

In summary: Some web sites are badly designed, and if we try really hard we can tangentially relate this to the iPhone.

Re:Conjecture about the iPhone?

[Kyojin]

Why should something change when you hover over it if your whopping great big finger is in the way?

Re:Conjecture about the iPhone?

[Achoi77]

I wouldn't say that some websites are necessarily badly designed, it's just that there was a specific target demographic that web developers have aimed for when they were designing their websites. It just happens this largely includes websites that were mostly designed to be surfed with a keyboard and mouse, rather than some alternate input device, like a touchscreen

As we see more fancy pants ajax techniques that are driven based on keyboard input, such as that neato google suggest thing that they put out a few years back - while that would be incredibly convenient to a user with a keyboard, it wouldn't necessarily have any impact on user performance when they are using a mobile phone, especially one without some kind if keyboard input. Things like that would be.. obsolete? (hah, for whatever reason obsolete doesn't sound too correct)

IMO a complaint like the author's sure sounds like he's grasping at straws. Sure he could develop a one-size-fits-all site that will be (ideally)wonderful for using with kb/m along with a touchscreen, but all interface designers are keenly aware of the fact that optimizing for one type if interface will ultimately be sacrificing the other. A simple alternative would be to give a url that will redirect the user to an iphone(or similar device) optimized site when the user heads towards there, and another for the standard computer user. Why wouldn't companies that are trying to appeal to both demographics want to do this in the first place? Doesn't make too much sense to me - plus it would prolly be cheaper in the long run instead of trying to retrofit their site to be 'iphone friendly.'

Re:Conjecture about the iPhone?

[daeg]

He didn't say take the hover out of websites. Just make it non-essential. For instance, if you have a menu, have them respond to both hover AND click.

And "Ctrl+Touch = hoever" won't work at all. For instance, the touchscreens in my clinics don't have keyboards at all. Requiring multi-touch devices or devices that react on pressure won't work, either, as they are restrictively expensive for many purposes.

And it's not just iPhone users. No touchscreen mobile device supports hovering to my knowledge, including PDAs, smart phones, iPhone, etc. Not to mention that not all users are able to easily hover (keyboard, screen readers, search engines, people with movement disorders/shaking...).

All it requires is a few minutes of planning to ensure all hover operations have an alternative method to them and everyone can be happy.

Re:Conjecture about the iPhone?

[WNight]

How about we design interfaces with exposed controls instead of having everything pop up when we mouse near it? Instead of having to sweep the mouse over everything to see what it did, it would instead just be obvious from looking at it.

Things that need to pop-up information can have hover-text and when clicked, pop up a javascript floater just like the hover-text.

Really the problem is that almost everyone making a Web2.0 interface is an idiot, and ugly. What user ever asked to have to mouse over a heading, often all of them, to find a sub-option? What user wants non-native UI popping up when merely moved past? If you think this stuff is in demand, you must use MySpace.

Re:Conjecture about the iPhone?

[jacksonj04]

For crying out loud, it's just another device! Having a mobile device which can access the internet is nothing stunning, my PDA and phone have been doing it for years. The iPhone doesn't need a different site design to the other SEVERAL MILLION existing devices, so why should another few make any difference to how people design their site?

I write to standards

[rossz]

My stuff is writen to XHTML 1.0 Strict standards. If it doesn't work on the iPhone, it's not my problem.

That's the whole damn point of standards. Write to them you don't have to worry if something will work. Use quirks and tricks, and you're going to be dealing with a tone of headaches every time something new comes out.

BTW, "Hey, Microsoft! Fuck you and your shitty standards-ignoring browser!"

Re:I write to standards

[General Wesc]

If I use the web without a mouse, I can't initiate a mouseover event (assuming I'm not controlling a mouse cursor with the keyboard or something.) What standard am I violating?

There are two golden rules in web design: code to the standards and degrade gracefully. Both are important.

Not for iPhone specifcally

[imemyself]

Not specifically for the iPhone. Maybe a simple low graphics version for PDA's and phones in general, but I'm not going to do anything special for the iPhone. If the mobile version of pages is simple/lite and standards compliant, then it should work with pretty much all mobile devices. If it doesn't, then it's probably the device maker's fault for using a shitty browser/rendering engine.

Realistically, the normal non-mobile versions of websites are not going to work well on mobile devices, period, because of the small size of their screens and limit forms of input. And the iPhones certainly not going to change that, especially given its lack of true 3G which will make the full versions of most sites horribly slow as well.

Mobile browsing is nothing new - Most major sites that people would frequently access from a mobile device (ie webmail, news/homepages, search engines, etc) already have mobile versions of their sites that work reasonably well. With its pretty high price tag, lack of 3G, and very few third party apps (compared with BB, Windows Mobile, and Palm), I highly doubt that it will spark a "revolution" in web browsing. It may look very slick, but technologically speaking it probably won't be earth-shattering.

Re:Won't be a big deal

[MikeBabcock]

Actually the poster is correct -- there are issues, and it has nothing to do with Safari, it has to do with the UI assumptions made by Javascript programmers.

For example, if you have a FORM that submits when the mouse "leaves" the drop down box, please explain how that event will be triggered since there /is no cursor/. Sure, Safari can fake it for the sake of making automatic form submission work, but its still an issue.

This has nothing to do with rendering, it has to do with interaction.

content

[pytheron]

every time I read stuff like this, I think about what makes me visit webpages. Content. You can have it in bold clashing flashing colors if it pleases you, but if I _want_ to read it, I'll put up with it, or at least bypass your presentation. If my device won't co-operate, I still want your information, so I'll use another device.
This image of webmasters throwing their hands up in the air and running around "We've lost another random passer-by.. noooo!" makes me chuckle. It all comes back to content. If your site has something worthwhile, people will make the effort.

Hype, hype, hype

[Dan East]

Can someone please tell me how Apple pulls this off? I mean the frigging phone isn't even on the market yet, and we have Slashdot stories talking about redesigning the web to work on this thing. Give me a break. It appears "multitouch" is the next buzzword. The issues the article discuses, like mouse over events and hovering, isn't even specific to a multitouch panel in the first place. These are issues that have surfaced decades ago, and are typically addressed by a tap-hold style action.

Sorry, but this is just getting to me. It's like there is a certain percentage of the population (and press), that is willing to give Apple a wink and a nod, and pretend that every last freaking thing the iPhone encompasses was just invented by Apple. Wee! It can browse the web (never mind that its display has 1/2 the pixels of a VGA Pocket PC). Wow! It can play MP3s (boy the music sounds extra special somehow on an iPhone). Neat! It has a soft input panel (lets ignore that there is no tactile feedback, thus typing requires visual stimuli to make sure you're pressing the right areas). Yeehaw! What battery life (even though you can't swap batteries, preventing the user from purchasing as many extra batteries as necessary to meet their usage needs).

For every true innovation there's three caveats. Maybe once this thing actually hits the market we can get at least a small dose of reality.

Dan East

Apple thinks I shouldn't, so why should I?

[MBoffin]

One of the big marketing points they've been pushing in their ads for the iPhone is that you don't have to browse a "watered down Internet" on the iPhone. Go watch the ad called Watered Down.

If Apple thinks their browser is good/robust enough to browse the "real" web, then making my site look fine in Safari (which any web developer should be doing anyway) is all I should have to do.

Care to argue otherwise?

"Web 2.0" "Web 1.0"

[QuoteMstr]

Almost every "Web 2.0" site I visit actually works less well than equivalent sites did years ago. Now, photo galleries use ajax and javascript to switch pages, making it impossible to, say, open each page in a new tab and switch between them. Obscenely huge tables are loaded and sorted using javascript instead of letting me sort on the server side. Forum software prevents me from replying in a new window, or heck, even gracefully switching between threads. Keyboard support is often non-existent, since everyone thinks it's cool to reimplement the button element with sixteen DIVs and a Javascript widget framework.

You know what the worst is, though? The most useless example of sheep-like trend following?

Go to eBay.com's front page, and mouseover one of the menus at the top. The damn server PERFORMS AN AJAX QUERY to eBay to get the four items in the menu. They should know better.

Please, just wake me up when the "web 2.0" fad is over.