One of the key aspects of a good cross-platform framework these days is Responsiveness -- the ability for an application to easily and cleanly adjust itself depending on the size of the display window. This turns out to be really important: a desktop-oriented page often looks terrible on a smartphone, and something designed solely for a smartphone sometimes looks downright goofy when rendered in a laptop browser.

Some of the "responsiveness" can probably be relegated as purely UI-side -- for example, the decision about whether to show label/input pairs side-by-side (on a big screen) or top-bottom (on a small one) is mostly a CSS-level decision.

But some responsive considerations push up towards the semantics of the page. For example, this Querki page starts out with an Introduction section if you view it in a large screen, but that Introduction collapses to a link on a small one. (If you are viewing it on a desktop/laptop, narrow the browser window and it will eventually collapse.) That sort of pattern is very useful for building a page that has a natural workflow in multiple environments.

I don't have a simple answer to this, but I'm opening this Issue so that we don't lose track of it, and can discuss the problem and possible solutions. I think the real question here is how a Suzaku App expresses the difference between what to display on smartphone / tablet / laptop / desktop screens. I suspect it isn't rocket science, but we should know how it will work.