I Want it Now! Designing Fast Loading Mobile Websites.

by: Kathleen Martin

In the U.S. alone, there are 91.4 MILLION smartphone users. In a study done in December of 2012, it was discovered that 86 million people searched for a local business on their mobile smartphone. It’s apparent that smartphones are built into our lives. We use them for just about everything. It’s even more important for a business to have a well designed mobile presence with a thoroughly thought out user experience. This is why Google recently released some new guidelines for designing mobile websites--websites should load in under a second.

That’s right. 1000 milliseconds.

Google believes that one second is all the time the user will take to wait for the content of a page to load. If it takes longer than one second, you risk losing your viewer's attention. To help facilitate this, Google recommends you take the “above-the-fold” method of design into account when creating a mobile website.

Above the fold means that the initial content on the screen, before you scroll, is the most important. Typically the ATF content gives the user the general gist of what their looking at. If a user can’t identify with the content immediately, then they will most likely go elsewhere for the information. Many things are taken into account when designing for ATF-- such as web site content hierarchy, user navigation, brand, and the overall aesthetics of the website's interface.

Getting the ATF content on a mobile website to load in under a second can be quite difficult. Google has put out some new guidelines for designing mobile sites, which may help you in the web design process:

  • Limit the number of Redirects. Redirects cause the network to make additional round trips of sending and receiving information. This results in longer web page load times.

  • Keep your ATF content as condensed as possible, and use images that are web ready. You want to keep the graphic file sizes small, reducing the time it will take for a web browser to render the site.

  • One way to keep your above the fold web content small is to avoid using too much CSS and Javascript. Keep the ATF content simple, and use dynamic web design features below the fold.

  • Take into account server render times when developing a mobile website. Server response time is the time it takes for a server to return the initial HTML.  

Outlier is a Portland interactive agency that focuses on developing mobile friendly websites for our clients. We understand that there is an ever increasing demand for mobile websites, and we are here to help you stay up-to-date with the latest technology and trends.

Contact us if you’re interested in creating a mobile-friendly experience for your business.

Written by +Patch Leishman


Video, Web, and Design Agency