- Building a Custom jQuery Mobile Page from Scratch
- Design Constraints for Mobile Devices
- How jQuery Mobile Works
- Other Tools
- Step-by-Step Collapsible Panels
- Additional Options
- From Here
Design Constraints for Mobile Devices
By nature, web design for mobile devices is pretty basic. When you're designing for a very small space like that, one artistic constraint is the need for simplicity. The current stage of mobile technology offers essentially only two ways to present portals to content in a cell phone's viewport: the two dimensions X and Y, vertical and horizontal.
One way to navigate to content on a mobile page is to have the page expand "sideways"; that is, the page appears to scroll to the right or left as a visitor taps on a link or drags on the page with his or her finger(s). The page doesn't really scroll sideways; instead, some content disappears, other content appears, and animated effects make this process appear to take the form of moving the page sideways. (The same principle applies to "scrolling" up and down.)
That scrolling approach is used in the Dreamweaver CS5.5 mobile starter sample page (the three versions are identical in design). Again, in my previous article, "Building Mobile Pages with Dreamweaver CS5.5," I walked you through how to create these pages for mobile devices, and how to customize their look and content.