Learning Objectives:

• Gain insight into one strategy for leveraging existing web and intranet applications to deliver mobile-friendly views
  (without compromising desktop or theatre views)
• Learn about key HTML elements such as viewport and how width specifications and others can interact well in a relatively flat CSS strategy

Abstract:

Choosing a mobile oriented web framework can be challenging.  However, many mobile applications don't require advanced functions that only the proprietary language of the device can deliver, so HTML5 and CSS3 are good choices, especially if you already have something that runs on a desktop browser (zero footprint web client).

If you have existing web pages specified in HTML via PHP or another kind of server-side programming, and haven't yet addressed mobile, this session is for you because these techniques involve incremental changes. For web strategies that don’t have/use server side programming, evidence is building that you can do a lot, maybe all, of the techniques discussed in this presentation in java script on the client side.

This session will examine a technique that achieves multi-view flexibility by simply changing a few of the heading area Meta tags and various other HTML5 elements at run time (along with a small amount of CSS3 changes). What might be considered a moving target with responsive, isn’t applicable. Examples of detail page level HTML that works for the multiple views will be shown, along with net change comparisons to the original HTML. Literal examples of the heading area Meta tags in production and HTML changes that control the views will also be shown.

This session won’t get into all of the exact programming or script required to accomplish the run-time changes, but all of it will be covered at the conceptual level and quite a few specific examples will be shown.