4 of 9Image
Fluid Grids are a powerful HTML5 tool, and can simplify building sites that work across phones, tablets and PCs. You start by using Dreamweaver CS6's grid wizard to choose the number of columns in a grid, as well as the percentage of the page used for columns. Grid elements will align to your columns, and you can choose which ones show at which screen resolution. There's no need to add code — CSS media queries handle browser resolution detection for you.
Once you've created a Fluid Grid layout you can add page elements, using DIVs to wrap and group elements. Using Dreamweaver's Live view you can choose which screen resolution you're working in, and then place DIVs appropriately. Some may be in different places and in different sizes for different views, while some may be hidden. It's best to start with the mobile layout first, before working on desktop and tablet views.
If you're building mobile web applications, Dreamweaver CS6's JQuery mobile support simplifies building pages that work across the ever-growing field of mobile devices. Mobile apps need no longer all look the same, as you can now use Fireworks to design mobile swatches that can be used to apply styles to JQuery Mobile applications. Select the element you want to style, pick a swatch and apply.