The time is now for multi-screen

We live in an exciting time, where the number and variety of connected devices are growing at a rapid pace. People are coming online for the first time, and they’re accessing the Web through a mobile device.

Having a solid multi-screen strategy will help you prepare for the next wave of mobile web users. By following the simple steps below, we can help set you up for success on mobile web and answer questions like: How will my users react?, how do I keep my brand identity?, and what will happen to my earnings?

1. Test your site
Start by understanding how your site currently runs on mobile devices. Use Google PageSpeed Insights to see how your site is performing on mobile and identify your site’s most crucial needs and what to take care of first.

2. Pick your strategy
Next, it’s time to make a choice on which multi-screen strategy to move forward with. The most common solutions are:

The choice is yours and all strategies have both pros and cons. When making the decision, you should consider the following:

Do I want to serve the same content to all platforms? If so, a responsive design should do the trick.

What’s more important; speed or flexibility? A separate mobile site or dynamic serving allows for better optimization.

Do I have the resources to maintain more than one site? Responsive design can help you save valuable time and resources.

What kind of technical capabilities do I have? Pick a strategy that best suits your skill set.

3. Follow best practices
We’ve finally made it to the fun part – building the site. No matter what solution you choose, every multi-screen developer should follow these general rules of thumb.

Focus on the main action that you want the user to take: While you had plenty of space on desktop, you’ll have to be resourceful on mobile.

Make your navigation easy to understand: Users want quick access to key actions, so make things easy to find.

Use existing design paradigms: Do you already have a brand identity on your desktop site? Reuse the same design elements when possible. Try adapting to the user’s device, for example using Material Design for Android: users like familiarity.

Make sure videos work: Design your look and feel and page animations using modern web technologies. Read more about Look and Feel for video in our Web Fundamentals guide.

Limit image-based text: Make use of web fonts when possible. Mobile means lower bandwidth.

Simplify payment processes: Auto-populate shipping addresses and contact details. Use existing payment solutions such as Google Wallet.

4. Avoid common mistakes
Learn from other developers by checking out some of the most common mistakes on mobile sites. This can save you time as you plan and launch your multi-screen strategy.

We hope these guidelines are useful when thinking about your multi-screen strategy. Let us know if you have any other tips that have worked well for you in the comments below.