Gmail in mobile Safari: now even more like a native app

Wednesday, October 27, 2010 | 3:41 PM

Go to gmail.com from your iPhone and you’ll notice two improvements we’ve rolled out over the past few weeks. First, scrolling is snappier: the speed of scrolling reflects the speed of your swipe gesture. This is helpful for long conversations where a few quick flicks will get you to the information you need much faster than before. Second, the toolbars stay on screen while you’re scrolling rather than moving down into view after each scroll. Being able to access your toolbars from any point on the page should make it easier to triage your email and move around the app.



If you use Gmail in your mobile browser a lot, you may have noticed that we recently tried several different variations of these buttons. We‘ve iterated on the design and made improvements based on your feedback. If you have more suggestions, please post them in our forum, or if you use Twitter, mention #gmailmobile and we'll take a look. If you’re a developer and are interested in learning about the Javascript and HTML techniques we used to do this, we’ll post an article to code.google.com/mobile in the coming weeks.

You can see these improvements by visiting gmail.com from the browser of iPhone and iPod touch devices running iOS4 (English-only for now). And if you like Gmail in mobile Safari, make getting to it easier by tapping the “+” at the bottom of the screen and then “Add to Home Screen.” (Don’t see the new changes yet? Try clearing your cache and refreshing the page.)

Update, 12/8/10 9:10am PST: We promised you a code article. Here it is!

25 comments:

David Gouldin said...

I would be so great if you guys would open source your inertial scrolling javascript. Can't wait to read the post on /mobile. Thanks for your work!

Hans said...

Getting some weird behavior here after scrolling down a bit and tapping the time to scroll to the top. The address bar remains visible at all times, while it was hidden offscreen before.

Joseph R. Gruber said...

Any plans to make the web app remove the Mobile Safari toolbar when launched as a web app from the home screen? Would be nice to "look" like a native app.

matt3o said...

Just wondering why you are not also targeting Android (at least 2.1/2.2). I mean doesn't android 2.2 support position:absolute natively?

Unknown said...

And what about BlackBerry Torch 9800 which also uses Webkit ?

Orgho said...

Really Nice.. I love the mobile web app of gmail... Helps me keep my inbox more secured than the native app.

Kudos to Google and gmail team for continuously improving mobile web app

Dan Kantor said...

+1 for open sourcing the the javascript!

Noah said...

It would be nice if the mobile gmail can mimic what the native iphone mail app does with resizing. The native app an make the email fit the width of the screen but the gmail mobile site can not, also when viewing html and trying to scroll it is a bit jittery. Makes it unusable for me.

Colin Henderson said...

The improvements have been terrific, and I never use the native app anymore. Key for me to make the final switch over last few months is speed and that last switch to anchor the archive bar. I will post additional ideas in the forum.

Unknown said...

FYI, your new implementation breaks the iOS native copy paste function:

If you highlight text and scroll, the physical area on the screen stays highlighted, but it doesn't highlight the txt any more, and the copy/paste pop over no longer appears.

Bryant said...

I like the persistent toolbar, but since implemented when I tap on the top message in my inbox, if my finger stays on the screen for the least bit it deletes the message before even opening because the toolbar pops in under my finger causing me to inadvertently press the trash button.
Also, to echo comments above, reading html mail is painful. Please make it fit to width on opening, with a pinch to zoom feature.

sherif said...

I absolutely love the new static bar, but would love to have you guys hide the navigation bar on the bottom as well so I can create a shortcut on home that feels completely like a native app.

Mark Carey said...

FWIW, I preferred the floating toolbar. I find the fixed one "get in the way" as I try to check the boxes on multiple messages. The good thing about he floating toolbar is that it didn't stretch all way across the screen, it didn't block any of the checkboxes.

The new toolbar image above shows the wasted space in the middle of the toolbar. I guess the fixed toolbar would be okay if it only used the right 2/3 of screen, like the floating one did.

Anonymous said...

What about.. Just submitting you app into the App Store =]

Unknown said...

I love the static bars. I have used some code I found to remove the address bar and make it full screen so I can save it as a webapp in my home screen. However, the inability to check multiple accounts, no push notifications and the need to reload everytime I open the app simply stops me from switching completely from the native app.

How about a native Gmail app for iPhone? And while you are at it give us the Google Voice iPhone app already.

Unknown said...

It would be great if you can port it to Nokia S60 5th and 3rd edition platform as well

Unknown said...

Great work! I've been a vocal critic of the old floating toolbar for a long time now - it was so annoying when reading messages. The new interface is a *huge* improvement so thanks for listening to user feedback.

Unknown said...

I don't understand. Instead of making it "even more like a native app," why don't you actually make a native app? PLEASE?

The web app will always be clunky, I think you've done what you can and it's decent, but a native app would run so much smoother. It's what the type of people who use iPhones want - a beautiful seamless experience that allows you to attach pictures, etc.

Unknown said...

i like my phone
Luxury Island Collection offers unrivalled luxury holiday experiences to luxury seekers worldwide. Let us tempt you with spectacular holidays, ...
www.luxuryislandcollection.com

Unknown said...

For the fixed toolbar I suggest moving the upward arrow (>>) away from the (X) button.. I've hit the X button many times already :(

but nice job on the fixed toolbar!

Unknown said...

Another +1 for explaining how you did the fixed toolbar!

Unknown said...

Can you guys make this work for 3.x devices too?

Unknown said...

I've been experimenting a little and I managed to get to this: http://goo.gl/WmvN. Aparently ontouchmove + translate3d works wonders. I'm guessing that's what Gmail is using.

Rob Kohr said...

I have been using the classic desktop version on my iphone for 2 main reasons:


*The inbox all loads in one shot. The new app loads the interface and then does ajax calls to get the data for the inbox. This is really slow over edge.

*I often want to copy paste from gmail and I can't do that in the newer version

So speed it up and add copy paste, and you have a winner.

Kenneth said...

Nice, but shame we still can't see inline images in e-mails.