A Decade of Decadence- Apple iPhone and My Mobile Web Memoir

Ten years ago, I was the company’s sole mobile web developer at Yahoo!, and extremely busy working for the mobile web pages, which were connected from the Yahoo! Finance and Weather apps that were bundled with the upcoming Jesus Phone, a.k.a. Apple iPhone, the first generation, debuted on June 29, 2007.

Image for post
Image for post
Yahoo! oneSearch circa 2007

Working for the unseen device was pretty tough, as Apple kept it extremely secret. They gave me the redacted specs for Safari browser- the screenshot were all removed from my view. Moreover, they only allowed a few designated engineers to visit Cupertino to test on an actual device, so I had to create a long checklist for Albert, my lucky boss! Meanwhile in Sunnyvale, I was developing and testing on Nokia N95, which we thought was the closest cousin to iPhone because it had a most advanced WebKit browser.

On the release day, there was a delivery package from Apple to my office- it was the happiest moments in my career thus far.

Now, detangling my memories of past decade and even before, I tried creating this timeline to recall what happened to Mobile Web- indicating mobile markups (pink), devices/platforms (green), major browsers (orange), JS frameworks (purple), and miscellaneous tools and technologies (blue). The timeline is not very accurate, so if you find I missed something significant, please let me know. I also intentionally did not list all mobile devices and platforms because there are just too many:

Mobile Web, Pre-iPhone Era

In the US, a “cell phone” was just a device to call people (and to play games and buy some crappy ringtones), while the rest of the developed countries was enjoying the mobile experiences already- people were checking news on web with Nokia S60 browser or Opera Mobile, viewing photos on Flickr, and posting short messages on Jaiku (which came to the market way too early and missed to be Twitter). In Japan, people were sending the emoji-filled messages, and even paying fare at train stations.

Image for post
Image for post
Yahoo! Japan had their own branded mobile phones by SoftBank

At the time, the most popular mobile phones here were Blackberry for business people, and Motorola Razr was for the rest, so nobody ever browsed the Internet on mobile phones. People were most likely did not even know there was a web browser included on their flip phones.

I actually started my career in mobile in 2005 at Nokia N-Gage team (if you were a die-hard mobile fanatic, you must remember the taco phone, and the Totally sidetalkin’ memes by Cabel Sasser), before joining Yahoo! in 2007. I was developing web UI for the little browsers for Nokia Symbian S60 phones, then, at Yahoo!, I worked on virtually all browsers including WebKit, NetFront, Palm Blazer, proxy browsers like Opera Mini and SkyFire, etc. etc.

There were literally thousands of browsers, and none acted the same. I worked with a few dozens of QA engineers, who did insane amount of manual testings against the collection of devices, and on DeviceEverywhere, the mobile device test suit that we could virtually test on real devices remotely. It was such an essential tool for everybody who involved in mobile software industry. I remember that we all shared the available devices with other users, therefore I sometimes spotted somebody forgot to log off. Notably, somebody at Google was notorious for leaving their test site open, so I occasionally viewed Google’s unreleased mobile websites, which wasn’t so impressive (yet) anyway.

Image for post
Image for post
Google used to use the transcoder to display HTML pages on mobile from SeRP. In 2007, instead of web, Google had us to call 800-GOOG-411 for local search results! They were seriously late-adopter of mobile back in the time.

To support the chaotic amount of browsers, everybody in the mobile software industry relied on was a service called WURFL. You can think it like a database of all existing mobile phone info, and we literally could not ship anything without the service. (Interestingly, one of the WURFL developer, Andrea Trasatti, who lived in Italy at that time and now in San Francisco Bay Area, and I have been good friends ever since!)

I mostly used HTML-MP (Mobile Profile) and CSS-MP to serve WAP webpages up on tiny screens, but at Yahoo!, the team actually have build our own mobile platform that transcode the front-end code to serve up as many mobile browsers as possible, so I did not have to actually write WML or some obscure HTML variants like cHTML. Nigel Choi, an engineer, who lead the platform, was mostly my source of knowledge. We later shipped Yahoo! Blueprint, which the 3rd party developers could benefit the platform.

There was no books I could learn about mobile web, and the only technical book I relied on was Cameron Moll’s Mobile Web Design. It was like a bible of mobile web for me at that time.

Post-iPhone — Mobile Web with UI Frameworks

After the first iPhone debut, it has changed the way people here interact with mobile phone, and with the better Safari browser, it excited all web developers out there!

In 2007, Dom Sagolla organized the first iPhone Dev Camp, where web developers shared all the excitement and exchanged ideas. The superhero who we admired most there was probably Joe Hewitt, a creator of iUI, the first ever modern mobile web UI framework.

A bit before, John Resig wrote jQuery (By the way, I met him for the first time at the iPhone DevCamp!). jQuery wasn’t meant be for mobile web, until David Kaneda created the plugin called JQ Touch (now JQT) in 2009. It had the most beautiful UI framework ever created for mobile. The official JQuery Mobile wasn’t born until later.

At that time, HTML5 had arrived the scene, and became the hottest technology for web since AJAX and Web 2.0 (remember Ajaxian?), and mobile web was slowly catching up with the trend. A light-weight JavaScript framework called, Jo by Dave Balmer (who happened to work with me at two companies!) was released around the time too.

However, as Apple announced the iOS SDK for native apps in 2008, mobile web instantly become the second-class citizen. With the help of amazing PhoneGap, developed by Brian Leroux et al. at Nitobi (later acquired by Adobe), we could develop hybrid apps, which bumped the mobile web status up to the 1.5th-class citizen.

Mobile Web as an OS

Around that time, a bunch of iPhone engineers left Apple to join Palm to build a new mobile platform. In 2009, Palm released webOS, the web-based platform which all apps were built in JavaScript. As a web developer, I was instantly in love with it, and joined their Human Interface team under Matias Duarte (who later became the mastermind of Google’s Material Design).

Image for post
Image for post
Palm Prē and webOS. I miss you so much!

The hardware wasn’t very performing, and JavaScirpt on the version of WebKit was painfully slow. The “jank triage” meeting was always a blame game. Also, the idea of running then-new Node.js on mobile devices was super rad, but we failed. The actual failure was more business than technical though, because “Leo Apocalypsehappened. (Damn, I remember when our all-hands meeting was totally a funeral, and somehow the entire conversation was leaked and Engadget live-blogged everything. We noticed during the meeting and it was awesome.)

After our failure, Mozilla’s FireFox OS and Samsung Tizen tried the space but the web-bases OS was never commercially successful.

HTML5 and Web Standard

Mobile browsers got better, and gradually started supporting more and more HTML5 features. The browsers even came with device APIs, such as geolocation, which can utilizes hardware GPS, camera access, accelerometer, etc.

Not to miss all the excitement with HTML5, I (re)-joined Nokia to advocate HTML5 for mobile browsers (especially with Nokia Lumia for Mobile IE on Windows Phone, OMG!). I became a part of W3C, and joined the Core Mobile Web Platform Community Group (CoreMob), along with Tobie Langel and Matt Kelly who developed Ringmark, a mobile browser test suite at Facebook. I worked on a mobile web app that mimicked Instagram to demonstrate how well mobile browsers had adopted HTML5. This was a great opportunity for me to urge browser vendors, especially Microsoft, RIM, Samsung, and others to improve their browsers.

Besides Ringmark, to check the availability of HTML5 features, there were numerous other test suits and compatibility tables were created- notably, Can I Use by Alexis Deveria, Mobile HTML5 Test by by Max Firtman, and lots of tests including touch events done by Peter-Paul Koch, a.k.a. PPK.

We used to rely on the idea of Adaptive Design and Progressive Enhancement / Graceful Degradation, however as mobile browsers became almost as good as desktop browsers, CSS3 Media Queries was adopted in browsers, and the idea of Responsive Web Design, coined by Ethan Marcotte, was born. We used to separate mobile site from its desktop version with sub-domains like mobile.mysite.com (or touch.mysite.com, or even older trends, m.mysite.com, mysite.mobi), but with RWD, we no longer! The idea of Mobile-First had gained popularity by Luke Wroblewski around that time too.

Meanwhile, iPhone got some more upgrades, and Retina happened. Thanks the hard works by Marcos Caceres and Yoav Weiss et al, now we can have responsive images too.

Since the Cameron’s book, there have been so many more mobile web books out there- I was honored to be chosen as a technical editor for O’Reilly Media’s Programming the Mobile Web by Max Firtman, and Mobile HTML5 by Estelle Weyl!

Sadly, HTML5 wasn’t all glorious, at least to the tech so-called “thought leaders”. Remember when Zuckerberg said HTML5 was dead? — It almost costed me my job. Clueless upper-management tired to get rid of me after this incident, and my direct boss transferred me to R&D team to save me, however, I left the company soon after, to shift my career outside of the mobile web in 2014.

More JavaScript / No JavaScript

Now we’ve got web with richer experiences, with more shiny new JS frameworks that works beautifully with mobile, and the frameworks that allows us to develop cross-platform natives apps with JavaScript. We had the Appcelerator Titanium before, and now we have React Native.

Simultaneously, Google has been really pushing AMP, Accelerated Mobile Pages, which suggests using less or no JavaScript for better performance (and higher Google search ranking). To be honest, this makes me feel like we are somehow going backwards with a mobile web, which is minimalistic and static, with a separate URL (google.com/amp/mysite). However, AMP can certainly gives better user experiences for sites like news web pages, when all we need is just information, not the whole experiences from web.

There have been so much happened in mobile web world, and still going on. I have no idea what the future mobile web is like- perhaps, with AI and deep learning, no human developer would be needed for coding? Who knows.

Anyway, this was my memoir of mobile web, and I’d like to conclude it by saying, happy birthday iPhone! You disrupted the mobile web. I love you, although I am a dedicated Android user for past years.

Image for post
Image for post

Lastly, I want to excuse for not covering everybody in the industry, who have helped to build better web. I have met (or not yet) so many great people throughout my career.

Written by

👩‍💻 Open Web & Tech Advocate. 🍩 Creative Technologist. 🦄 All things JavaScript. 🐱-as-a-Service. 🥑 Developer Advocate at Slack.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store