Super-fast Numeric Input with HTML Ranges – Part 1

During a recent project, we were tasked with improving the experience of entering a handful of decimal numbers into a mobile web app. In this part of the app, we knew users would be repeatedly entering a number, followed by a decimal point, then two more numbers. The stock ascii keyboards were cumbersome, requiring seven taps and an awkward page scroll on most devices. The numeric keyboards saved a tap or two depending on the platform, but they still suffered from the page scroll problem. With either generic keyboard, we knew we’d have to add form validation to make sure the values were in the right range. Read more on Super-fast Numeric Input with HTML Ranges – Part 1…

expect()ing the Unexpected

Our tests were crashing. They ran fine individually, but when run as a group, certain tests sometimes failed with a spectacular memory access error.

After experimenting with skipping some of the tests, I was able to narrow it down to tests that ran immediately after some database calls. (This was a mobile project for iOS, and we were using Realm.)

Read more on expect()ing the Unexpected…

Using Ember CLI with PhoneGap’s CLI Tools

For a recent project, a client wanted a mobile phone application that would work across both iOS and Android. As someone with more experience with web development than either iOS or Android, turning to Adobe’s PhoneGap seemed a fairly obvious path. I would be able to leverage more of my existing skill set, and could use awesome tools like Ember.js.

I started digging through some getting started guides for PhoneGap and quickly realized that the default platform and build management tooling (cordova-cli) had no support for any sort of asset processing. Read more on Using Ember CLI with PhoneGap’s CLI Tools…

Developing a Mobile App? Some Numbers You’ll Need to Know

Are you thinking about developing the next great mobile app? When creating your business strategy you’ll want to know:

  • How many potential app users there are?
  • What platform you should develop for?
  • What apps have the greatest reach?
  • What apps generate the most revenue?

The mobile app market is evolving quickly, so the answers to the above questions change frequently. In this blog post, I will report the most recent numbers, and also provide links to resources that you can use to stay up to date with the information you need. Read more on Developing a Mobile App? Some Numbers You’ll Need to Know…

SpeedLimit: Testing Apps on Slow Connections

Recently I had switched to an iPhone on T-Mobile’s network. T-Mobile has been slowly rolling out their high-speed 3G and 4G connection to iPhones on their network. Most of my time is spent on Wi-Fi or EDGE data connection (about 500kb/s tops). It’s those times on the EDGE data that I realize something: many apps and websites are not built with slow connections in mind.

Why does it matter?

A few months back, I wrote an article about user feedback in AJAX data transfers — the need to tell the user that the system is processing behind the scenes. In many cases, when you are building applications, you use a local machine as the server, so response times can be lightning fast. When you don’t consider slower connections (even a 6mb/s DSL connection can be considered “slow”), users are left waiting.

SEO best practices point out that slow loading pages and applications increase bounce rate and decrease your conversions. A SEO study on page loads and the effects on user experience shows that the slower the load time of the site, the more people give up and close the window.

Read more on SpeedLimit: Testing Apps on Slow Connections…

Optimizing for Mobile Devices with Varnish Cache

Recently, I wrote about using Varnish Cache to speed up websites. However, not all websites appear identically on all devices. For example, many web applications will deliver different content to mobile devices such as phones, tablets, screen-readers, etc. What happens when Varnish receives a request for a resource from one of these devices?

Without additional configuration, Varnish will return the only version of a resource that it has cached for a particular URL — regardless of its appropriateness for the device performing the request.

This can be problematic. For example, if a mobile phone performs the first request for a resource, the request may return specific mobile content, and Varnish will likely cache it. However, if a desktop browser subsequently performs a request for the same resource, it may receive the mobile content that Varnish has cached. This could cause mobile-specific content to appear in the desktop browser.

Read more on Optimizing for Mobile Devices with Varnish Cache…

Getting Started with jQuery Mobile

jQuery to the rescue again! jQuery Mobile is built on jQuery and helps ease work on mobile based web applications. The framework gives a great start to a mobile site with very little effort making a custom mobile interface. The examples below are also found on github.

jQuery Mobile Basics

The files needed to build a jQuery mobile site are: jQuery, the jQuery Mobile Javascript (and the corresponding CSS), your custom css and js (as needed) and an html file. jQuery and jQuery Mobile can be loaded from their CDN links on their home pages, but in the github example, they are local. One warning, there is certain load order to use when including your files: the jQuery Mobile css and your css, jQuery itself, your custom jQuery/Javascript, then finally jQuery Mobile js. Read more on Getting Started with jQuery Mobile…