StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<h1>Basic Idea</h1> <p>Lets start from the beginning, for everyone to understand, definition of <strong>mobile first</strong> is:</p> <blockquote> <p>Mobile First is the idea that web sites should first be designed for mobile devices, including only those tasks/items that website visitors use most. Then as screen real estate increases, add in tasks/features as needed based on user priority.</p> </blockquote> <p>Quotation taken from <a href="http://mobilegovwiki.howto.gov/Mobile+First" rel="nofollow noreferrer"><strong>here</strong></a>.</p> <h1>Advantages and disadvantages of jQuery Mobile</h1> <p>From my experience there isn't any existing framework that can be fully categorized under <strong>mobile first</strong>. jQuery Mobile is closed but not enough.</p> <p>First, I can agree with your statement that jQuery Mobile can't be used with other frameworks. jQM is a heavily customizable framework and it can be, to full extent, customizable to almost very other available framework. </p> <p>If you want to use backbone or knockout that it can be customized to their MVP or MVC architecture. If you want to use it with similar framework they use only jQM <a href="http://jquerymobile.com/download-builder/" rel="nofollow noreferrer"><strong>functionality</strong></a> you want. You only need to Google it.</p> <p>But, and I will repeat it constantly, currently jQM is not a good "out of box" platform for desktop development. This is simply the fact. While it do provide widgets adapted to desktop browsers they still look like over sized mobile widgets. </p> <p>Second big disadvantages is their official documentation. While heavily detailed in some segments it has a ton of errors, non existing examples, lacking API descriptions. IT looks like someone explained you what car is but forgot to mention how to drive it correctly. </p> <h1>Good Example</h1> <p>This can be fixed, unfortunately only with a heavy customization. And by the definition this is not a <strong>mobile first</strong> framework. But to make my point more precise here's a good example of jQM usage in mobile/desktop environment: <a href="http://www.songmeanings.net/m" rel="nofollow noreferrer"><strong>Mobile Songmeanings</strong></a>. Respect to that developers, they did a beautiful job of merging mobile with desktop. Unfortunately this is but a beautiful drop in a ocean of mediocrity.</p> <h1>Common Solution</h1> <p>Most common fix to this problem is usage of jQM for mobile devices and jQ UI for desktop environment. We should also add a <a href="http://modernizr.com/" rel="nofollow noreferrer">Modernizer</a> into this mix cause we need it to:</p> <ul> <li>separate mobile environment from desktop one</li> <li>create a dynamic content loader (js and css) depending on a detected environment </li> </ul> <h1>Final Thought</h1> <p>If you want easy <em>out of box</em> solution then I don't advise <strong>jQuery Mobile</strong> usage. It takes few months of hit and miss learning, development and testing, good and bad sides, how to use it with other frameworks and such to fully understand it.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload