How to make your web app mobile
This is a crowd contributed document with guidelines on how a mobile web app should be in our opinion.
Enable Microsoft, Google and iCloud login
When using your web app, users need some room to save theyr files to.
By enabling them to save on theyr Microsoft and/or iCloud, and/or Google drive, you're saving space on your server and, at the same time, allowing them to save data in some place they will be comfortable with.
Also make sure a single account could be associated with more than one single Google, Microsoft and iCloud account.
Rely on username, not email address
As device get more popular, people make multiple accounts (in example, I have 2 Google accounts, 1 Microsoft account and 1 iCloud account).
If you rely on email addresses to manage login information, you're preserving users to link theyr accounts to a single user on your web app.
Instead, create a username and let the users add theyr cloud accounts to it to store data.
Make your web app responsive
Ideally, nowadays, web apps interfaces are split in 2 or 3 main sections: a left toolbar, the main content, and a right toolbar.
Some apps also have a top menu and, eventually, a footer or status bar.
If you just put a small button overlay on the left and right sides of the app, the user should see the main app content on the screen, launching the toolbars, menus and status only when necessary, by tapping such buttons.
This way, you'll only have to bother with the main content and your only "problem" will be distinguishing between a tap and a swipe, taking according actions.
When a user finally taps on a button, he or she will make the bar popping out, then tapping on what he or she needs, then the bar "returns" hidden.
If you do so, your web app will work with smartphones and tablets, other than just PCs.
Also, don't use preventdefault if content is overflowing (try not to make it overflowing anyway).
But create a mobile CSS and interface, don't just pretend "it will work anyway".
Don't create dedicated apps
Personally, I'm not excited with web apps which enforces me in downloading a dedicated Android or iOS app to see them on my device.
I guess the same goes for everyone, it's just not elegant.
Some web apps are already responsive, but they have some overflowing elements which allow the browser to scroll the page orizontally.
Also, don't use fixed sized elements, HTML documents could be dynamic if used correctly.
Don't rely on plugins
Mobile browsers don't use Flash, Java, Silverlight or any other custom plugins to work.
Keep this in mind when developing your web app.
Just use them and get rid of everything else.
Most contents are not created by a single, but rather by a team.
Allow your app to be used by a team working on a single document, even better if at the same time.
In this purpose, you could allow team creation as a side login (most usermanes connected with the same resources, which are shared).
Avoid pop-ups and dialog windows in general
Some web apps are designed to use Pop-Ups and/or confirmation windows which, on some devices, just don't display right.
Try avoiding such behaviour by either making them responsive or deleting them at all.