Great Strategies to Make Your Website Mobile/iPad Efficient?
A colleague of mine asked the following question recently...
"I have a good question... what are some of the great strategies to make your website Mobile/iPad efficient?"
Below is my answer to this question:
Great question! With the shift to more and more users browsing the web on their tablets and smart phones, the need for businesses to have their web compatible for these devices grows. Many are completely unprepared for this and are caught with websites that simply do not work or do not work well on these devices.
I run into many websites that look fantastic on the desktop or even laptop, but once you pull it up on the iPad, it looks terrible! This is a common problem that has been presented to web developers that they never really had to worry about in the past. We just developed for the different browsers and made sure we stayed inside of the common width parameters of the most widely used resolutions. But now, all of that has changed. Now we have to consider that users might be visiting the websites we build with their tablets or smart phones.
There are actually a few ways to tackle this one.
Mobile Website
The first and most obvious method to combat websites not displaying properly on smaller devices is to have a separate "mobile" website that your website visitors are forwarded to if they are using a mobile device. This is actually seen quite often. You typically have your web developer adapt your site or in some cases hire a company that specializes in mobile websites.
This mobile website is typically freestanding on a subdomain of the master website with its own content and layout. It and its content is typically managed separately from the master website. This solves most of the problems presented and even gives the ability to present different call to actions or content for the mobile user.
While this is certainly a viable method, it does present the problem that is a second website to build and to maintain and some businesses have difficulty maintaining one site, let alone two.
Responsive Design
The second and typically better option is to ensure your website has what is called a "Responsive Design". This means that your site will adapt and change shape depending on the type of device and screen size that your visitor is using. Basically what is done here is the layout and content remain basically the same, but a different stylesheet is loaded depending on your device size.
This new stylesheet can completely change the layout and visual aspects of the site to the extent of completely replacing buttons, images and content blocks with smaller versions of themselves.
This method generally better because there is no worry of forgetting to update content on both websites and is going to overall be more efficient than having to manage two separate websites. You also have no worries about duplicate content SEO issues with this method.
That does not mean that responsive design is always the better solution. There are times when having a completely different version of the site and it's call to actions, content and other features will work better for the situation. For example, if the site has lots of graphics or elements on the home page, then it is possible that even with responsive design, the load time of the site is too much for the mobile devices and a mobile version would work better.
This method is a little more involved and is typically done when the site is initially developed.
Mobile App
And finally, of course you can have an app developed for your company which can wrap up all of your website information and more... complete with geo-features, coupons, check-ins, online ordering, blog RSS, push notifications, etc. This is an expensive solution, but in some cases can be extremely powerful.
I'd recommend going the app route when you have a unique tool or function you can integrate into it, giving your on-the-go prospects and clients something that they will use and that adds value to their lives. By doing this, you become top of mind even when the user wouldn't have otherwise visited your website.
Other Considerations
Also keep in mind that Flash content will not display on iPads or iPhones and can render a website completely useless on these devices. I suggest using jQuery when in need of some animation or movement such as a banner or slider.
Your Mobile Solution
Whatever solution, or combination of solutions you choose to use for your website, keep one thing in mind. Always ensure your visitors user-experience is the primary consideration. If the user finds the site clumsy or hard to use, they will leave. And if they leave, no other goals can be achieved. The ultimate goal by optimizing for mobile is to extend the usability of your website onto mobile devices. You cannot get more sales if the "buy now" button is impossible to tap and you cannot capture more emails for your newsletter if the email field is display off the screen.
Your website has a purpose and going mobile with it should extend that purpose and allow the user to experience that purpose on their mobile devices easily.
"I have a good question... what are some of the great strategies to make your website Mobile/iPad efficient?"
Below is my answer to this question:
Great question! With the shift to more and more users browsing the web on their tablets and smart phones, the need for businesses to have their web compatible for these devices grows. Many are completely unprepared for this and are caught with websites that simply do not work or do not work well on these devices.
I run into many websites that look fantastic on the desktop or even laptop, but once you pull it up on the iPad, it looks terrible! This is a common problem that has been presented to web developers that they never really had to worry about in the past. We just developed for the different browsers and made sure we stayed inside of the common width parameters of the most widely used resolutions. But now, all of that has changed. Now we have to consider that users might be visiting the websites we build with their tablets or smart phones.
There are actually a few ways to tackle this one.
Mobile Website
The first and most obvious method to combat websites not displaying properly on smaller devices is to have a separate "mobile" website that your website visitors are forwarded to if they are using a mobile device. This is actually seen quite often. You typically have your web developer adapt your site or in some cases hire a company that specializes in mobile websites.
This mobile website is typically freestanding on a subdomain of the master website with its own content and layout. It and its content is typically managed separately from the master website. This solves most of the problems presented and even gives the ability to present different call to actions or content for the mobile user.
While this is certainly a viable method, it does present the problem that is a second website to build and to maintain and some businesses have difficulty maintaining one site, let alone two.
Responsive Design
The second and typically better option is to ensure your website has what is called a "Responsive Design". This means that your site will adapt and change shape depending on the type of device and screen size that your visitor is using. Basically what is done here is the layout and content remain basically the same, but a different stylesheet is loaded depending on your device size.
This new stylesheet can completely change the layout and visual aspects of the site to the extent of completely replacing buttons, images and content blocks with smaller versions of themselves.
This method generally better because there is no worry of forgetting to update content on both websites and is going to overall be more efficient than having to manage two separate websites. You also have no worries about duplicate content SEO issues with this method.
That does not mean that responsive design is always the better solution. There are times when having a completely different version of the site and it's call to actions, content and other features will work better for the situation. For example, if the site has lots of graphics or elements on the home page, then it is possible that even with responsive design, the load time of the site is too much for the mobile devices and a mobile version would work better.
This method is a little more involved and is typically done when the site is initially developed.
Mobile App
And finally, of course you can have an app developed for your company which can wrap up all of your website information and more... complete with geo-features, coupons, check-ins, online ordering, blog RSS, push notifications, etc. This is an expensive solution, but in some cases can be extremely powerful.
I'd recommend going the app route when you have a unique tool or function you can integrate into it, giving your on-the-go prospects and clients something that they will use and that adds value to their lives. By doing this, you become top of mind even when the user wouldn't have otherwise visited your website.
Other Considerations
Also keep in mind that Flash content will not display on iPads or iPhones and can render a website completely useless on these devices. I suggest using jQuery when in need of some animation or movement such as a banner or slider.
Your Mobile Solution
Whatever solution, or combination of solutions you choose to use for your website, keep one thing in mind. Always ensure your visitors user-experience is the primary consideration. If the user finds the site clumsy or hard to use, they will leave. And if they leave, no other goals can be achieved. The ultimate goal by optimizing for mobile is to extend the usability of your website onto mobile devices. You cannot get more sales if the "buy now" button is impossible to tap and you cannot capture more emails for your newsletter if the email field is display off the screen.
Your website has a purpose and going mobile with it should extend that purpose and allow the user to experience that purpose on their mobile devices easily.
Josh owns a web agency located in sunny Melbourne, Florida. His years in marketing before he founded Rock Paper Simple, has helped give him a unique perspective on web and business.
Categories:
Tips,
Tutorial,
Web Design
0 comments:
Post a Comment