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?

[Haeleth]

T-mobile offers unlimited data on their Sidekick plans for only $20 a month (this includes internet, email, aim, and text).

Is this "unlimited" as in "unlimited", or the more usual "unlimited" as in "the limit is secret, and if you exceed it we'll tell the press you were stealing movies"?

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?

Re:Conjecture about the iPhone?

[Divebus]

I'll second [million] that. About one-third of the people in my company have already asked if they'll be able to access our CRM system from the iPhone. My choice is to make sure it works or face an angry mob with torches and pitchforks.

Won't be a big deal

[daveschroeder]

Sites that don't support the fancy things will simply probably zoom in (and out) some preset amount on a double click, and a user will still be able to zoom an arbitrary amount with multi-touch (e.g., pinch and unpinch).

Simple.

For those who don't know, iPhone uses some tricks to detect "zones" or "areas" on web pages that will automatically zoom to fit when double clicked, like a photo with caption, or a story column on a newspaper web page.

This person is overcomplicating things, and overreacting ("pitfalls"? "adjust [...] sites to ensure they work with iPhone"?) No sites need to be changed to work well with the browser (or, at least as well as, and, from all of the demos and appearances, probably quite a bit better than, any other mobile browser). The user wants to zoom in, they zoom in. So what if it's not perfect. Sure, some sites can offer a better "experience" specifically for iPhone if they choose, but they don't need to.

That's why this thing having a real, full browser, able to be viewed in portrait or landscape, is great. It will be nice to have a full browser on a phone that doesn't suck, even if I can't double-click and perfectly zoom to fit on a photo and instead have to zoom on an area of interest manually. Some might say "but it's not consistent!" Well, what do you think it does when you double click? If a special "zone" isn't present, it will probably just zoom as close to where you clicked as it can. If it's not perfect, you can even drag the display around with your finger, or pinch/unpinch to zoom more/less as appropriate.

Disclaimer: yeah, we don't "know" any of this yet, but just look at the demos and how the phone works. And anyone can try it out next Friday. It will probably be a much better browsing experience than on nearly any, if not all, other mobile browsers.

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.

Re:Won't be a big deal

[Joebert]

Who submits their forms when an arbitrary item loses mouse focus?

Porn sites.
Everything on thoose sites seems to submit a form, they're worse than the DMV.

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

[kestasjk]

This isn't about HTML standards, it's about changes to the way people will interact with websites.

By the way it's a bit nieve to say that as long as you stick to the standards you're fine. The standards all leave room for ambiguity, such as different browsers interpreting elements as defaulting to inline or block, and there are many standards that aren't fully implemented. It's pretty hard to make a Web 2.0 site that looks good, it easy and intuitive to use, complies to appropriate standards, and works on all browsers (even all the big browsers).

As someone said "The great thing about standards is that there are so many to choose from."

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.

Yeah, right

[rueger]

Most people here won't go out of their way to make a site work with Internet Explorer, and IE has 70% of the market... and you want to know of they'll accommodate the quirks of a cel phone?

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.

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.

Segway

[Anonymous Coward]

I'm sure I remember a quote from Dean Kamen claiming cities will be rebuild to accomodate the Segway. Yeah, they're almost done I think.

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

Re:Hype, hype, hype

[Quiet_Desperation]

Can someone please tell me how Apple pulls this off?

Magic runes, chutzpah and Steve Jobs' third testicle.

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.

My personal website will be redesigned...

[Travoltus]

[html]
[!-- some CGI crap: if browser == iphone then [size=6]HANG THAT MOTHER FSCKER THE FSCK UP AND DRIVE!!!!![/size] -->
[/html]