The Biz The CEO Blog

Responsive Design Increased Visit Duration by 17%

By

Comments (0)

Responsive Design

Traffic at Voices.com is growing at a fast clip--as is the number of different devices people use to access the service.

With about one third of the site's two million monthly page views coming from mobile devices and another 20% coming from tablets, the team and I set out to meet the mobile challenge using creative tools and services in Adobe Creative Cloud to deliver a comprehensive digital presence with the same look, feel, and functionality regardless of the device used to touch the brand.

We used a combination of tools and services in Adobe Creative Cloud--specifically Adobe Edge Reflow, Photoshop, and Dreamweaver--and adopted a responsive web design approach, which focuses on how to accurately and efficiently resize and present content from one code base to any screen, regardless of its scope or orientation.

Our goal was to cost-effectively deliver consistent user experiences on all devices (computers, laptops, netbooks and smartphones) and platforms (Mac/PC, iOS/Android/Window/Blackberry), as well as position the company to meet future demands as the adoption rate of mobile devices and tablets continues to outpace desktop Internet use.

Designing For All Devices and Platforms

Using a variety of tools and services in Creative Cloud to develop a flexible and fluid design that adapts to all devices, the Voice.com team established product specifications and built wire frames of every page using Photoshop. A single template served as the basis for three separate files--phone, desktop, and tablet. Initial layouts were designed in Photoshop, making extensive use of shared assets while creating layers for each of the three files. To help speed page loading, the team also used Photoshop to create CSS sprites for icons.

Working Smarter, Not Harder

From an efficiency perspective, use of Edge Reflow CC resulted in a faster quality assurance process. It also reduced support and overhead for a leaner, more collaborative design and development team, less outsourcing of separate native development efforts, and a reduction in code and domain maintenance costs over time.

Going Live With Responsive Design

In the summer of 2013, we went live with our completely redesigned website. Responsive design has been a win-win for both the company and for our customers.

Seeing The Results of Responsive Web Design

• Increased mobile audience 43% year over year
• Achieved two million page views a month
• Measured daily membership logins at 86%
• Increased site stickiness by 17%
• Enhanced visitor engagement
• Streamlined design / development collaboration

Adobe was gracious and wrote-up a story about the challenge, our process and our results. You can download the Adobe Creative Cloud Success Story as a PDF here. I'd encourage you to download the Responsive Design Case Study.


Comments


Leave a Comment



Recent Articles

Responsive Design Increased Visit Duration by 17%

How To Give a Google Glass Demo

3 Ways To Subscribe To a Podcast with iTunes

How To Get Google Glass

3 Steps To Responsive Design Browser Testing

Google Planning Audio Ads in Streaming Music Service

How a New Breed Of Small Businesses is Harnessing the Power of Emerging Technologies

The LAMP Technology Stack

How To Speed Up a Website

History of the Voice Over

   

Subscribe by Email

About This Blog

Learn how to run an online business and see which tools Voices.com uses to serve a global market of over 100,000 users.


Follow Us

   

Our feed & social options update you with special offers and news as it happens.

Do You Have a Project?

Request a Quote

Looking for voice talent? You've come to the right place. Post a job and you'll get sample recordings of your script and price quotes.

Tell us about your project