Going Mobile With Drupal and Jquery Mobile

One of the fastest growing trends in the online space has been the use of mobile devices for viewing online content.

Since the introduction of the iPhone in 2007, the number of devices and users viewing content on the web has increased exponentially and drastically. With such an increase, the demand for sites that are mobile friendly has increased at the same rate. Even to match the demand for the devices themselves!

To meet this demand, developers have been working overtime on new designs and technologies to catch up with many sites having to create separate applications to serve their content in a mobile friendly space (not to mention having to support a multitude of devices).

At the beginning of 2011 the developers at the helm of the jQuery library put together a new library that came as an answer to many developers prayers; That was jQuery Mobile.

jQuery Mobile is a library meant to take advantage of the new CSS3 and HTML5 web standards and allow developers to create mobile versions of their sites that come very close to resembling native applications.

How does using jQuery Mobile differ from building a separate mobile specific site?

jQuery Mobile uses HTML5 data-role attributes within existing tags to tell it what to convert and the included jQM css does the rest. Which is awesome in that you can use these tags within your existing templates to create the mobile version of a site without having to develop a completely separate build just for mobile.

One of the best part of using jQM is that the library does more that just convert content. It converts all of the existing forms to a format manageable by the mobile browser in use. Which means that in using jQM for your mobile site you don't have to cut corners and sacrifice the user experience and interaction elements such as authentication and commenting.

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <c>, <cpp>, <drupal5>, <drupal6>, <java>, <javascript>, <php>, <python>, <ruby>. PHP source code can also be enclosed in <?php ... ?> or <% ... %>.

More information about formatting options

CAPTCHA
If you are if fact human, you may post comments.
Image CAPTCHA
Enter the characters shown in the image.
The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <c>, <cpp>, <drupal5>, <drupal6>, <java>, <javascript>, <php>, <python>, <ruby>. PHP source code can also be enclosed in <?php ... ?> or <% ... %>.

More information about formatting options

CAPTCHA
If you are if fact human, you may post comments.
Image CAPTCHA
Enter the characters shown in the image.
I'm attending DrupalCon Chicago, March 7-10, 2011

User login

Login Using Faceback
Sign in using Facebook
Drupalcamp Atlanta Individual Sponsor

Navigation