Mobile Responsive Web Design
[Scroll Down] Resize your web browser. Rotate your mobile device.
Responsive Web Design in Action!
Mobile RESPONSIVE Web Design:
This website IBMMobileDemos.com is enabled for some aspects of "Responsive" web design, resulting in a dynamically different appearance on Mobile devices and desktop web browsers. If you *stretch* your web browser wider or narrower, or you physically rotate your mobile device, the web page content will dynamically adjust to fit the available 'screen real estate', flowing the content in a visually pleasing manor. The effect is more dramatic on a tablet or when resizing a desktop web browser.
Try viewing this website with your Mobile device vs. your desktop web browser. Physically rotate your phone/tablet or simply resize your desktop web browser to see the effects of responsive web design. You'll notice the menu bar, text and graphics layouts change as the screen size changes.
Three column layouts may become two or one wide, as the screen/window shrinks. The Menu bar moves from below the page title to the top of the screen, becoming an animated popup menu, as the screen narrows. Graphics or files streaming to a mobile device may automatically adjust to a lower resolution, in order to minimize bandwidth and maximize performance/responsiveness.
IBM enables responsive design in many products, including it's Mobile App Dev Platform called "Worklight" and Business Process Management Platform called "IBM BPM".
I hope the responsive design of this website helps your desktop and mobile web experience.
The demo gallery widget below also adapts as the horizontal screen real estate changes. Try rotating your mobile device and/or resizing your desktop web browser. (Goto the "Demo Galleries" page of this site to see the rest of the Demo Galleries, or to the homepage for all demos.)