Mobile Web Facts and Best Practices


<what is the mobile web? />

  • It’s growing faster than the desktop web
  • Faster growth than desktop web during 1990’s
  • There’s been a 2000% increase in mobile websites since 2008
  • The mobile web is:

New York Times

  • The mobile web is not:

New York Times

  • The mobile web is glanceable info for people on the go
  • The desktop web is for people who aren’t going anywhere
  • The mobile web can reach half the planet
  • The desktop web reaches ~1 billion users
  • The mobile web browser is the #1 app used on most phones
  • The mobile web browser consumes 13% of user face time
  • The mobile web browser accounts for 50% of all phone data traffic
  • There are around 326,000 touchable mobile web sites
  • Most of the top mobile web sites focus on shopping, services, social and news
  • Retailers can increase consumer engagement by 85% by having mobile-specific website
  • But only 4.8% of U.S. retailers have a mobile website
  • 9 out of 10 mobile shoppers use the mobile web while in-store
  • 50% of users in-store mobile web activity is shopping related
  • 51% of in-store mobile research has led to a purchase
  • Amazon took in > $1 billion via its mobile commerce site
  • Google says mobile shopping searches are up 3,000% over last 3 years
  • Most native device attributes will reach HTML5 by 2013, enabling UX that rivals native apps
    • Geo-location 2010
    • Camera 2011
    • Motion detection 2011
    • Calendar 2012
    • Contacts 2012
    • SMS2012
    • Files 2013

<markup differences />

  • Today’s mobile web is XHTML Basic 1.1Second Edition
    • W3C recommendation in November 2010
    • Supersedes XHTML-MP 1.2 from Open Mobile Alliance (OMA)
    • Similar to HTML 4.01
    • Not WAP
  • Yes, it’s XML
    • XML parsing rules enforced
    • <?xml version = ‘1.0’ encoding = ‘UTF-8’?>
    • Every tag name and attribute must be in lowercase
    • All attributes must have a value
    • Every tag must be closed
  • You must have a document type definition (DTD)
    • <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML Basic 1.1//EN” “”>
    • Your markup must stick to the definition
  • You need an XML namespace for your document
    • <html xmlns=”” xml:lang=”en”>
  • You need a mime type
    • @Response.AddHeader(“Content-Type”, “application/xhtml+xml”);
  • There are no frames, no framesets and no iframes
  • No Java applets
  • No Flash
  • No image maps
  • Simple tables
    • Not for layout (Use CSS)
    • No table nesting (Tables within tables)
    • No thead
    • No tbody
    • No tfoot

<user experience />

  • CSS Mobile Profile
    • Subset of CSS2
    • Must specify units
  • Keep your <title></title> short, description and < 20 characters
  • Stack everything in a single column
    • No left/right horizontal scrolling
    • Minimize up/down vertical scrolling
  • Include just the top 20% most important content from the desktop web
  • Use minimal, lightweight advertisements
  • Link to the desktop website
  • Use short URLs that fit on a single line and don’t disappear off the side of your phone
  • Accommodate different device dimensions
    • Width = 100%
    • Height = Auto
  • No hovering or mouse-overs needed for touch
  • Limit the need for text entry
    • Use checkboxes
    • Use drop-down combo boxes
    • Use lists
    • Use radio buttons
    • Use pre-filled text
    • Maintain reusable session data in a cookie
  • Each page must only provide a single function or idea
  • Use larger fonts because people can’t read small screens with high resolution
  • Use large touchable UI elements
    • Fingertips are up to 80 pixels wide
    • Touchable elements must be 40+ high/wide
    • Touchable elements must be 20+ pixels apart
  • Navigation should be at the top of each page (Also use breadcrumbs for one-click access)
  • Just say no to background images
    • Makes pages harder to read
    • Increases page size
  • No pop-up windows
  • Don’t use absolute values for measurements
    • You’ll get unexpected results on different mobile browsers
    • Use ems
    • Use percentages
  • Do not use images for:
    • Icons for links or menus
    • Buttons
    • Visual separators
  • Do use small images:
    • For maps
    • For an article
    • As a product logo
    • If they are smaller than device screen
    • As long as they are lightweight thumbnails
    • Only when absolutely necessary
  • Click to call  <a href=”tel:+12065551212″>Call Rob</a>
  • Click to email  <a href=”>email rob</a>
  • Access keys for fast access to list items
    • For phones with keyboards
    • <a href=”Products.cshtml“ accesskey=”1″>Products</a>

<adaptability />

  • Server-side device capability databases
    • Wireless universal resource file (WURFL)
    • Device Atlas
    • 51 Degrees (points to WURFL)
  • Client-side device capability detectionbrowser name == navigator.appNamevar screenSize = screen.width + ” x ” + screen.height;cookies == navigator.cookieEnabled

    browser version == navigator.appVersion

    user agent header == navigator.userAgent

  • Detect modern DOM

function hasModernDOM()


// Check for support of DOM Level 1 functions

if (document.getElementById && document.getElementsByTagName)

return true;

return false;


  • Don’t assume…test for object existence

if (object)


// object available


  • Determine device orientation

if (window.orientation)


if (window.orientation == 90 || window.orientation == -90)

return “landscape”;

else return “portrait”;


  • Detect AJAX capabilities

if (window.XMLHttpRequest)


return new XMLHttpRequest();

} else try {

return new ActiveXObject(‘Msxml2.XMLHTTP’);

}catch(e) {

try {

return new ActiveXObject(“Microsoft.XMLHTTP”);

} catch (e) {

return null;



  • Viewport
    • Prevent mobile browsers from displaying desktop-optimized markup
    • <meta name=”viewport” content=”width=device-width, initial-scale=1.0, user-scalable=no” />
  • Internet Explorer Mobile adaptation  <meta name=”MobileOptimized” content=”width” />
  • Blackberry adaptation  <meta name=”HandheldFriendly” content=”true” />


<optimizations />

  • Minify XHTML, CSS and JavaScript
    • Remove non-useful tags
    • Remove comments
    • Remove spaces
    • Use YUI compressor to compress HTML
    • Use jsmin to compress JavaScript
  • Use Yahoo YSlow to analyze website performance
  • Validate your site with W3C mobileOK Checker at
  • Some DOM thoughts
    • Avoid large DOM frameworks like JQuery
    • Most DOM frameworks lock you into Webkit
    • DOM frameworks use extra system memory and JavaScript libraries and CSS take longer to download
    • Keep small and uncomplex DOM for fast manipulation
  • Enable Web server compression (GZip/Deflate)
  • Cache for performance

//Timed caching for freshness since last request:

Response.AddHeader(“Cache-Control”, “max-age=3600″);


//Request always goes to origin server for validation:

Response.AddHeader(“Cache-Control”, “no-cache”);

//Instructs caches not to store sensitive data:

Response.AddHeader(“Cache-Control”, “no-store”);

  • Conserve battery life
    • No auto-refreshing
    • Be smart about JavaScript usage
  • The scourge of Transcoders
    • They are proxies that reformat desktop web pages
    • They might add mobile operator navigation bar to each page
    • They might inject advertising from unknown sources
    • They might replace original graphics with smaller/low res images
    • Maintain your page integrity:

Response.AddHeader(“Cache-Control”, “no-transform”)

  • Reduce number of linked resources
    • Use only one JavaScript file
    • Use only one CSS file
    • Use only one Cookie
    • Check for and eliminate duplicate scripts
  • No client-side redirecting
  • Empty strings can cause unnecessary HTTP requests to the server
    • <script src=” ”>
    • <link href=” ”>
    • <img src=” ”>
  • Link to JavaScript at bottom of page so page loads before download/loading JavaScript file
  • Above all, keep pages < 20 k  (Yeah, I said 20 k)


<what do I like best about the mobile web />

  • It allows me to bypass App Stores and Marketplaces to reach consumers and the enterprise directly
  • I can reach more users, at a lower cost, with just a single web app
  • It taps into the HTML, CSS, JavaScript and ASP.NET skills that more people have
  • It’s a real W3C Recommendation unlike HTML5 which means it’s supported by more smartphones and feature phones
  • It allows me to reach the billions of people in the developing world that can’t afford an iPhone
  • It brings simple mobile commerce to everyone
  • It allows me to push educational content to any child with a mobile phone (there’s a landfill of feature phones for the kids who don’t already have one)
  • Oh, and this lightweight, simple, and fast content is great for XO Laptops (OLPC) and underpowered Netbooks (that same landfill has old laptops too)

<we’re done />


Sharing my knowledge and helping others never stops, so connect with me on my blog at , follow me on Twitter at and on LinkedIn at

Sign Up for my Newsletter and get a FREE Chapter of “Mobile Strategies for Business!”

[mc4wp_form id=”5975″]

Ray Ozzie sees the Dawn of a New Day for Microsoft

Ray Ozzie

Five years after Ray Ozzie penned The Internet Services Disruption, he reflects on Microsoft’s move to the cloud.

While he’s most proud of Windows Azure and SQL Azure, he also gives our competitors their due by mentioning that they have out-executed us when it comes to mobile experiences.  He harps on the subject of how complexity kills and then challenges us to close our eyes and form a realistic picture of what a post-PC world might actually look like.


Ray goes on to state that those who can envision a plausible future that’s brighter than today will earn the opportunity to lead.  His ultimate dream is to move us toward a world of :

  • Cloud-based continuous services that connect us all and do our bidding.  These are websites and cloud-based agents that we can rely on for more and more of what we do.  On the back end, they possess attributes enabled by our newfound world of cloud computing: They’re always-available and are capable of unbounded scale.
  • Appliance-like connected devices enabling us to interact with those cloud-based services.  This goes beyond the PC and will increasingly come in a breathtaking number of shapes and sizes, tuned for a broad variety of communications, creation & consumption tasks.  Each individual will interact with a fairly good number of these connected devices on a daily basis – their phone / internet companion; their car; a shared public display in the conference room, living room, or hallway wall.

As a Mobility Architect at Microsoft, I’m excited that my commitments align with this vision in connecting the Peanut Butter of the Cloud with the Chocolate of devices.  Wireless data networks, bandwidth, latency and signal coverage are the wildcards when it comes to making this vision a reality.  That’s why you’ll always see my concern for this Wireless wildcard reveal itself in all the Cloud-connected mobile architectures I design.

Check out the rest of Ray’s new memo at


Sharing my knowledge and helping others never stops, so connect with me on my blog at , follow me on Twitter at and on LinkedIn at

Sign Up for my Newsletter and get a FREE Chapter of “Mobile Strategies for Business!”

[mc4wp_form id=”5975″]

comScore Reports May 2010 U.S. Mobile Subscriber Market Share

Cellular Tower

ComScore, Inc. released data from the comScore MobiLens service, reporting key trends in the U.S. mobile phone industry during the three month average period ending May 2010 compared to the preceding three-month average.

The report ranked the leading mobile original equipment manufacturers (OEMs) and smartphone operating system (OS) platforms in the U.S. according to their share of current mobile subscribers age 13 and older, and reviewed the most popular activities and content accessed via the subscriber’s primary mobile phone. The May report found Samsung to be the top handset manufacturer overall with 22.4 percent market share, while RIM led among smartphone platforms with 41.7 percent market share.

OEM Market Share

For the 3 month average period ending in May, 234 million Americans age 13 and older used mobile devices. Device manufacturer Samsung ranked as the top OEM with 22.4 percent of U.S. mobile subscribers, up one percentage point from the preceding three month period. LG ranked second with 21.5 percent share, followed by Motorola (21.2 percent share), RIM (8.7 percent share, up 0.5 percentage point) and Nokia (8.1 percent share).

Top Mobile OEMs
3 Month Avg. Ending May 2010 vs. 3 Month Avg. Ending Feb. 2010
Total U.S. Age 13+
Source: comScore MobiLens
Share (%) of Mobile Subscribers
Feb-10May-10Point Change
Total Mobile Subscribers100.0%100.0%N/A

Smartphone Platform Market Share

49.1 million people in the U.S. owned smartphones during the three months ending in May, up 8.1 percent from the corresponding February period. RIM was the leading mobile smartphone platform in the U.S. with 41.7 percent share of U.S. smartphone subscribers, followed by Apple with 24.4 percent share and Microsoft with 13.2 percent. Google saw significant growth during the period, up 4.0 percentage points to capture 13.0 percent of smartphone subscribers, while Palm rounded out the top five with 4.8 percent. Despite losing share to Google Android, most smartphone platforms continue to gain subscribers as the smartphone market overall continues to grow.

Top Smartphone Platforms
3 Month Avg. Ending May 2010 vs. 3 Month Avg. Ending Feb. 2010
Total U.S. Age 13+
Source: comScore MobiLens
Share (%) of Smartphone Subscribers
Feb-10May-10Point Change
Total Smartphone Subscribers100.0%100.0%N/A

*May data does not include the impact of Apple’s launch of iPhone 4, which
became available in June.

Mobile Content Usage

65.2 percent of U.S. mobile subscribers used text messaging on their mobile device in May, up 1.4 percentage points versus the prior three month period, while browsers were used by 31.9 percent of U.S. mobile subscribers (up 2.3 percentage points). Subscribers who used downloaded applications comprised 30.0 percent of the mobile audience, representing an increase of 2.1 percentage points from the previous period. Accessing of social networking sites or blogs also saw significant growth, increasing 2.6 percentage points to 20.8 percent of mobile subscribers.

Mobile Content Usage
3 Month Avg. Ending May 2010 vs. 3 Month Avg. Ending Feb. 2010
Total U.S. Age 13+
Source: comScore MobiLens
Share (%) of Mobile Subscribers
Feb-10May-10Point Change
Total Mobile Subscribers 100.0%100.0%N/A
Sent text message to another phone63.8%65.2%1.4
Used browser29.6%31.9%2.3
Used downloaded apps27.9%30.0%2.1
Played games21.8%22.5%0.7
Accessed social networking site or blog18.2%20.8%2.6
Listened to music on mobile phone13.1%14.3%1.2

– Rob

Sharing my knowledge and helping others never stops, so connect with me on my blog at , follow me on Twitter at and on LinkedIn at

Sign Up for my Newsletter and get a FREE Chapter of “Mobile Strategies for Business!”

[mc4wp_form id=”5975″]

Walking to Omaha Beach

Big Red One

I caught a train from Paris to Bayeux at Gare Saint-Lazare with only four minutes to spare.  Two hours later I was in the heart of Normandie and ready to crash at my hotel.  Luckily, it was only a half a mile walk from the train station to my hotel so I skipped the taxi.  Just in case you didn’t know, Bayeux was a hang-out for William the Conqueror about a thousand years ago.  Luckily, beautiful Bayeux wasn’t bombed during Operation Overlord back in 1944.

After breakfast on Saturday morning, I walked over to the Scauto Renault dealer that rents cars.  Renting a car was part of the plan since I only had one day in Normandie and wanted to visit all the D-Day beaches.  To my surprise, it was closed when I arrived.  Maybe I was too early.  I decided to walk into the center of Bayeux and would check back with Scauto later when it opened.

Upon visiting the Bayeux Tourist Office on Rue Saint-Jean, the woman there informed me that almost everything would be closed since today was May Day.  Depending on where you live in the world, this is International Workers Day or Labour Day which means everyone is taking the day off.  She said some taxi services might be open but they would be very expensive.  She then suggested that I walk up Rue de Docteur Michel to check on one last possible rental car business that might be open.

On the way to try my luck with another car rental shop, I walked through a wonderful outdoor marketplace where everything from food and wine to dresses and shoes were being sold.  It was so full of life and I think the whole town was there.

When I got to the car rental store in the Northwest part of town, the guy there told me they weren’t renting cars and to come back on Sunday.  He said all that in French.  Obviously, that didn’t do me any good.  I walked outside on to Boulevard d’ Eindoven and noticed a small sign that read “Omaha Beach” with an arrow pointing down the D6 country road.  Hmmm.

Out of curiosity, I decided to follow the sidewalk down this road for a bit just to where it might take me.  I eventually came upon a sign that said Port-en-Bessin was 9 km away.  Hey, people run 5 and 10k’s all the time.  I checked my watch and it was only 10:30 AM.  This was no big deal and I had the time, so I just kept walking on the D6 road between Bayeux and Port-en-Bessin.  Needless to say, the sidewalk disappeared pretty quickly and I was alternating between walking on the road and on the grass when I needed to get out of the way of cars.  I saw lots of tour buses full of white and silver-haired people pass by as I hiked down the road.

About half way there, I stepped on a broken bottle that went through my shoe and into my foot.  I literally had to yank it out of my shoe.  I promise I’m not making this up to make a better story.  Needless to say, this wasn’t what I was hoping for with the long walk to come.

As I walked through the beautiful countryside, I imagined what it must have been like to be a young GI back in 1944.  For a moment, I was carrying a gun and wearing the helmet and uniform of an American infantryman who was seeing the French countryside for the first time.  Large green pastures and lots of yellow flowers.  I’m sure many of those boys had never left the small town they had grown up in back in America prior to joining the Army.

When I arrived in Port-en-Bessin, I sat down on a park bench to survey the broken Coke bottle damage.  Not great, but not the end of the world either.  After all this walking, you’d think I’d be there by now but it turns out I was only a little more than half way there.  I hung a left on Avenue de Marechal de Tourville (D514) and headed west, which was parallel to the English Channel.

I walked past the Omaha Beach golf course and through Sainte-Honorine-des-Pertes where a large gathering of people looked like they were having a French Bar-B-Que.  Of course, their BBQ had red wine instead of cold beer.  I soon came upon a large billboard that read, “Thanks to our Liberators.”

After hours of walking, I arrived in Colleville-sur-Mer and was thrilled to see an open cafe.  I had lunch in an old stone house where they were serving the “Michelle Obama Burger” and had a big poster of Presidents Obama and Sarkozy on the wall.  This place looked ancient and an old man added wood to a small fireplace from time to time while I was there.  Not sure why since it was fairly warm outside.  I had the hot dog and fries which ended up being 2 hot dogs lined-up end-to-end inside a baguette with melted brie on top.  Not bad.  I quickly downed 2 Coke’s since I had broken one of the rules of hiking and didn’t bring a water bottle.  After eating, the owner let me use his bathroom (toilettes) where I took off my shoe and tended to my battle wound with soap and water.

After lunch, I continued down the road past a church and visited the Big Red One Assault Museum.  This is the nickname of the 1st Infantry Division of the United States Army due to the design of their shoulder patch.  Great artifacts and memorabilia but I couldn’t shake the image of Lee Marvin from the movie back in 1980.  You probably didn’t know that Mark Hamill (Luke Skywalker) played a Private in that movie.

I got back on D514 which was now called Route d’Omaha Beach and walked westward.  Once I got to the roundabout that I saw on my map, I knew it was time to veer to the right and make my way to the American cemetery.  Big surprise that this road was named Route du Cimetiere Americain.  Upon entering the cemetery complex, I had to cross through a large parking lot full of all those large Coach tour buses that had passed me by while I was walking from Bayeux.

I walked into the Visitors Center and got in line to walk through the metal detector and have my backpack screened.  Inside I saw famous quotations on the walls, biographies of soldiers and lots of videos of Eisenhower and others who made D-Day possible.  This is where you start getting “misty-eyed.”  The Visitor Center is truly amazing and delivers more information about what happened there in 1944 than two semesters of history classes.  I signed the guestbook on behalf of Grandad and Paw Paw.

“Soldiers, Sailors and Airmen of the Allied Expeditionary Force!

You are about to embark upon the Great Crusade, toward which we have striven these many months. The eyes of the world are upon you. The hopes and prayers of liberty loving people everywhere march with you. In company with our brave Allies and brothers-in-arms on other Fronts, you will bring about the destruction of the German war machine, the elimination of Nazi tyranny over the oppressed peoples of Europe, and security for ourselves in a free world.

Your task will not be an easy one. Your enemy is well trained, well equipped and battle-hardened. He will fight savagely.

But this is the year 1944! Much has happened since the Nazi triumphs of 1940-41. The United Nations have inflicted upon the Germans great defeats, in open battle, man-to-man. Our air offensive has seriously reduced
their strength in the air and their capacity to wage overwhelming superiority in weapons and munitions of
war, and placed at our disposal great reserves of trained fighting men. The tide has turned! The free men of
the world are marching together to Victory!

I have full confidence in your courage, devotion to duty and skill in battle. We will accept nothing less
than full Victory!

Good Luck!  And let us beseech the blessing of Almighty God upon this great and noble undertaking.”

– General Eisenhower

Once you leave the visitor center, you walk out to the cemetery and face 9,387 Christian Crosses and Stars of David that mark the burial sites of the Americans that gave their lives so that Europe might be free during the greatest amphibious invasion of all time.  This is where you start crying for the duration of your time at the cemetery.  This reminded me of the hours I’d spent walking through the gravesites at Arlington National Cemetery.

One of the monuments read, “Mine eyes have seen the glory of the coming of the Lord.”  You could almost hear flutes and drums playing the Battle Hymn of the Republic as brave Americans marched into battle.

The cemetery rests on top of cliff overlooking Omaha Beach and the English Channel.  After walking amongst thousands of grave sites, I followed a pathway down the cliff to the beach below.

This is where it all began.  Neither of my grandfathers or other relatives of that Greatest Generation could tell me what it was like since they all fought in the Pacific.  Most people today have “Saving Private Ryan” and “Band of Brothers” to give them a sense of that day.  It was a beautiful sandy beach with a line of rocks separating the sand from the rest of the land.  After walking westward along the beach for a bit, I gathered together some rocks and wrote something really big in the sand.


As I walked down the beach and farther away from where my journey began, I found myself calculating what time I would arrive at my hotel that night if I had to walk all the way back.  I had already walked 12 miles so far and could only imagine what completing the 24 mile round-trip journey in the dark would be like.  I could see lots of flags and another monument on the beach in the distance so I kept walking towards Saint-Laurent-sur-Mer and farther away from Bayeux.

I finally arrived at a large steel piece of artwork jutting out of the beach called “The Braves” monument.  It actually looked like a bunch of giant swords pointing upward to the sky.  Behind it were the flags of all the allies flapping in the ocean wind.  As I walked off the beach and through the flags I came upon the Liberation monument dedicated to the 1st Infantry Division and the 116th Infantry Regimental Combat Team of the 29th Infantry Division.  That was a mouthful.

Now that I was at Saint-Laurent-sur-Mer, I decided my day was done since it was getting dark.  I walked over to a freestanding Tourist Office that looked like one of those old camera film developing huts you used to see in strip center parking lots back in the ‘70s.

“Parlez-vous anglais?” I asked the girl inside.  She helped me find some taxi services that might save me from another 12 mile walk.  The first taxi phone number I dialed responded with a voice message in French that basically told me they were closed for the day.  Luckily, the second number I dialed got me a guy who could understand English.  He was in Bayeux and I told him I was in Saint-Laurent-sur-Mer near the D’ Day House Hotel next to the flags and big monuments.  He said it was a long drive and could I wait 25-30 minutes for a driver to get there.


I quickly went to check out the nearby Musee Memorial d’Omaha Beach that had lots of great vehicles, guns, uniforms and photographs from the landings on Omaha Beach and Pointe du Hoc.  After that, I grabbed a Pepsi at the D’ Day House restaurant and waited for the cab to arrive.  During the long drive back to my hotel in Bayeux I thanked my lucky stars that I didn’t have to make the hike back.  When I got out of the taxi at the hotel, I could hardly walk back to my room.  I guess sitting still in the car caused me to stiffen-up.  I soaked in a hot bath for about an hour and then crashed without eating dinner.

When I woke up, it was time to go catch the train back to Paris.

I had spent a day walking through a small part of France.  Back in 1944-45, the millions of young men who didn’t die on the beaches of Normandie spent almost a year walking all the way across France.  I bet an ice-cold Coke and a hot dog in a baguette would’ve hit the spot for them too.

Vive la Liberte

Interview with Rob Tiffany at Tech Ed Europe

Microsoft TechEd

Check out the interview I did with David Goon at Tech Ed Europe 2009 in Berlin.

I discuss Microsoft’s Mobile Enterprise Application Platform and talk about how it aligns with Gartner’s MEAP critical capabilities and how it can save money for companies.

With the tidal wave of mobile and wireless technologies sweeping across both the consumer and enterprise landscapes, I believe MEAP offerings give us a glimpse of a new standard for designing all future infrastructures.

Sharing my knowledge and helping others never stops, so connect with me on my blog at , follow me on Twitter at and on LinkedIn at

Sign Up for my Newsletter and get a FREE Chapter of “Mobile Strategies for Business!”

[mc4wp_form id=”5975″]