Today’s post comes courtesy of Frank Ashton, business consultant
In today’s world, people view media on tiny smartphone screens, large television sets and every size of screen in between. Careful SEO planning, color psychology and other factors used to create a website mean nothing if visitors cannot view it on their device. Business owners should take the time to optimize their website for use on multi-screen sizes, to ensure that every visitor feels welcome. There are several steps which can be taken to make a webpage multi-screen friendly.
Step 1: Understand How Different Devices are Used
Part of optimizing a website for multiscreen use is understanding how users approach information differently from each device. Which device a person uses depends on how long they intend to be actively engaged with the information. On average people use smartphone browsing for 17 minutes at a time, tablet browsing for 30 minutes at a time, laptop or PC monitor display for browsing 39 minutes at a time, and a TV screen for anything that takes more than 43 minutes. People also tend to begin shopping, browsing, or researching from a smartphone or tablet, but complete purchases from a desktop or laptop.
Step 2: Consider Modes of Multi-screening
Consumers can use their devices several ways, often using more than one device at the same time. They may be on a smartphone and a computer at the same time, performing related or unrelated tasks. They may also be on one device and then another, working on different portions of a task from different devices. This is why it is important for websites to have log-in areas that save user preferences, shopping cart information and more, so that users can easily switch between devices without starting over.
Step 3: Offer Options
Not all websites can be made easily flexible between all screen sizes. Many businesses opt to build two distinct versions of their website. A “Full Screen” version, which is designed to be viewed on TV screens, PC monitors and laptops, and a “Mobile version” for smartphones and tablets. The mobile version uses vertical scrolling and typically has less features so that it is easier to view on a limited device. When creating two distinct web pages, make sure to create a separate budget for each version of the site. Also, consider placing a link on the mobile site that allows users to view the full site from their mobile device or tablet in lieu of using the mobile site.
Step 4: Make Data Scalable
Perhaps most important, make your page scalable. Ensure that your website will automatically adjust to fit the screen on the device it is viewed on. Website scaling is based on resolution, and adjusts by percentages. You will also need to set the web page to adjust from the center, so that the page remains centered in the browser no matter what it is viewed on. The best design is called “liquid design”, though other scalable design options are available.
Step 5: Browsers and Compatibility
Finally, make sure that the website can be viewed from a variety of browsers. Safari, Firefox, Chrome, and IE are the most common browsers. Make sure that each of these browsers allow your website to be viewed, and make adjustments where necessary.
About the Author
Frank Ashton frequently consults businesses on their website development needs. His articles appear on various website design blogs. Visit Who is Hosting this to learn how to choose the right webhost for your business.