Mobile Tech Tips

Just as a website is no longer optional for small businesses wanting to successfully market their products and services, that website increasingly must also be accessible to your customers on their many mobile devices. We have provided this page as a tutorial and checklist of actions you should consider implementing to make your small business mobile-ready.

 

Mobile Devices

Gartner Research reports that 85% of mobile phone handsets shipped in 2011 included a mobile web browser. Already, mobile devices outnumber desktop PCs by four to one. Worldwide, mobile devices outnumber both desktop PCs and televisions combined. It’s a mobile world!

Among the challenges of designing for mobile devices are small screens, limited input capabilities, limited processor power and memory and limited bandwidth. But these limitations are rapidly being overcome by device manufacturers.

What should you design for?

You can safely assume that any mobile devices visiting your website have the following minimum characteristics:

  • Support XHTML Mobile Profile 1.0
  • Support GIF and JPG images
  • Support a minimum of 256 colors
  • 120 X 120 pixel screen or larger
  • Can manage 10kb of combined text, graphics, and CSS content
  • Support basic two column tables
  • Display a picture and link on the same line

 

Testing Your Website

Did you know there are free tools for testing your website and seeing how it looks to various mobile devices?

One of the best testing tools is mobiReady. mobiReady simulates a mobile phone, retrieves your webpage, and performs a number of diagnostic tests on your content. Following the tests, mobiReady provides a comprehensive report with recommendations and instructions on how to improve the web page for viewing in mobile devices.

Another good testing tool is the W3C mobileOK Checker. This is a free service of the Worldwide Web Consortium (W3C) that helps check the level of mobile friendliness of web documents. The mobileOK Checker will provide you a printable report showing failures per severity, page size, network usage, a description of each failure and recommended best practices.

As the iPhone is one of the most popular mobile devices, you also might use the TestiPhone.com – iPhone Simulator to see what your site looks like to customers with iPhones. You don’t receive any diagnostic feedback, but you do get to experience your website just as your iPhone-enabled customers do.

 

.mobi Domain

Do you need to have a .mobi domain name? No, not really. A mobile website can be the same website used by your desktop PC customers or it could be a subdomain, like m.yourdomainname.com, with a second simplified website for mobile devices.

After testing, one of your earliest decisions should be to decide if you want to maintain one website accessible by all devices or two separate websites with one site optimized for mobile devices.

Should you decide to have two websites and to get a .mobi domain name, be aware that .mobi domain names come with mandatory rules. Sites on the .mobi domain must use valid XHTML Mobile Profile for documents. You are limited to a second level domain name. That means www, m, or mobile at the beginning of your domain name are forbidden. Finally, you may not use frames to divide the screen. The .mobi domain registrar tests websites every 90 days for compliance. Non-compliant websites have their domain names blocked until they return to compliance.

 

Adapting a Website for Mobile

If you decided to maintain just one website for all devices and browsers, then you likely will need to adapt your current website for compatibility with mobile devices. Basically, you probably need to simplify your existing website by focusing on the following features.

  • Content. Reduce page lengths. Reduce the number of topic areas to five or fewer and the site depth to just two or three levels. Capitalize on interactivity, such as email forms, live chat, and SMS alerts.
  • Images and styling. Scale large images to smaller sizes. Avoid background images due to contrast issues. Convert graphic button navigation to text navigation.
  • Javascript. Avoid Javascript or AJAX, as most of the current mobile phones do not consistently support these features. Future mobile devices likely will.
  • Unsupported tags. Do not use image maps, frames or IFrames.
  • Tables. Tables are only for data. Do not nest tables inside other tables.
  • Stylesheets. Create separate desktop and mobile device (mobile.css) stylesheets. Use device detection to initially route incoming browsers to the appropriate content, but provide the option to switch between the two versions.

 

Creating a New Mobile Website

Just as there are tools that simplify the creation of traditional websites, tools are available for creating mobile websites. One of the easiest to use is Ubik.com. Ubik.com offers a free online mobile website tool with several dozen pre-designed templates. You can easily select a template, remove and add pages and sections, and immediately begin using the mobile website after saving your work. The basic free mobile websites are hosted as a subdomain on the Ubik.net domain, for example drjonscomedyhypnosis.ubik.net/.

After creating a mobile website with tools like Ubik.com, you generally can save the created documents to your computer and copy them to your own existing website or to a new mobile subdirectory or subdomain. Once under your complete control, you can further edit the mobile pages to match your brand. The Dr Jon Comedy Hypnosis Show in Little Rock did just that!

 

Arkansas SBTDC Technical Assistance

ASBTDC consultants are available by appointment to assist you in developing mobile-ready websites. While ASBTDC does not do the technical work, our consultants can guide you through the above process, demonstrate tools, help you understand diagnostic reports and much more.

Additionally, the ASBTDC has developed and offers “Take Your Website Mobile,” a three-hour workshop that provides more in-depth instruction and demonstrations of the above tools. Contact your local ASBTDC office for availability in your area.