iPhone + Webkit + Digg = Mobile Digging Done Right

Webkit browsers, which the iphone uses will now be able to digg while mobile.

Delta Tang Bravo has more details on their blog:

“”

We just launched a special version of Digg today intended to be browsed on an iPhone. It’s available at digg.com/iphone but you’ve got to either be on an iPhone, in Webkit, or possibly on a Webkit-enabled device like some of the fancy Nokia phones.

It’s really fun to be developing for the iPhone. First off, it’s a welcome change to be developing for a single rendering engine… and a decent one at that. Plus, you’ve got the run of all of Webkit’s features, including advanced pseudo-selectors, text-overflow ellipsis, and simple rounded corners in CSS. While I do enjoy making bulletproof designs in my normal web design, there’s also some freedom in not having to consider text-resizing, extreme page resizing (you need to support 2 dimensions), and other hurdles when you’re developing for the iPhone. Of course, we’re still following standards pretty strictly, but not having to cope with the lowest common denominator (or even any rendering discrepancy) certainly makes things interesting — and fun!

Even more fun is developing specifically for the user input quirks of the iPhone. When your primary input device is a honkin’ fat finger, it changes the way you think about links and buttons. Everything’s got to be bigger… way bigger. The yellow digg box and Digg It button are about twice as large on the iPhone as on the normal website. I also made the clickable area of the Digg It button even larger than the button itself so if you click on the edge of it, you’ll still get a press. You also have to make sure buttons aren’t too close together so that you don’t mash one when you intend to hit the other.

Joe (the Digg dev who coded the project) and I started from Joe Hewitt’s excellent proof of concept and then adapted the javascript and the rest of the code. We’re using jQuery (thanks to the jQuery team for their assistance) to render the sliding effects to mimic a ‘real’ iPhone application’s functionality.

Joe and I threw this together over the weekend with Kevin’s help storyboarding it. Good times were had. I’m really looking forward to messing around more with developing specifically for the iPhone. Fun fun fun. Can you tell I think it’s fun?

UPDATE: One thing I forgot to mention is that page loading takes a long time on an iPhone. Actually sending and receiving a request over At&T’s slow network (when you’re not on wifi) is especially slow. So, we’re actually doing one larger load to bring in both the story list and the contents of the stories. Then you’ve only got one request (and we made sure it wasn’t huge) and you can browse the 10 stories on the page without loading again.

Update 2: Also see Joe’s write-up on some of the technical aspects of the Digg iPhone version
“”