1 GB of available hard-disk space for installation; additional free space required during installation (cannot install on removable flash storage devices)
With all the hype
around HTML5, CSS3, and responsive design, it’s no surprise that the hottest
new features in Dreamweaver CS6 are all aimed at making it easier for web
designers to create pages that adapt to small and large screens and use the
latest flavors of HTML and CSS.
From the
relatively minor addition of the new Web Fonts Manager, to the significant
addition of the Fluid Grid Layout system, there are many reasons to upgrade to
Dreamweaver CS6.
In this article,
I’ll review the most significant changes you’ll find in this version of
Dreamweaver, and offer a few tips and techniques to help you put them to work
right away.
Creating Responsive Designs with Grid Layouts
The most an impressive new feature in Dreamweaver CS6 — and the one that’s sure to get the
most ‘buzz’ — is the new Grid Layout system.
Although you could
create multiple versions of your website, each optimized to fit a different
screen size, that’s a complicated and highly inefficient solution to a problem
that’s only going get worse as people connect to the Internet with everything
from wristwatches to refrigerators.
Dreamweaver’s new
Fluid Grid Layout gives you a head start on a complex design strategy. Like
most responsive designs, a fluid grid layout includes three sets of style
rules:
A small design
optimized for mobile phones (and people with “fat fingers”);
A large design
that fills even the largest computer monitors and takes advantage of all that
screen real estate; and
A mid-sized design
optimized for iPads and other tablets.
When you use
Dreamweaver’s Fluid Grid Layouts, media queries are created for you, based on
the size of each device. Here’s what the media query looks like for a tablet
device
With all the hype around HTML5, CSS3, and responsive design, it’s no surprise that the hottest new features in Dreamweaver CS6 are all aimed at making it easier for web designers to create pages that adapt to small and large screens and use the latest flavors of HTML and CSS.
From the relatively minor addition of the new Web Fonts Manager to the significant addition of the Fluid Grid Layout system, there are many reasons to upgrade to Dreamweaver CS6.
In this article, I’ll review the most significant changes you’ll find in this version of Dreamweaver, and offer a few tips and techniques to help you put them to work right away.
Creating Responsive Designs with Grid Layouts
The most impressive new feature in Dreamweaver CS6 — and the one that’s sure to get the most ‘buzz’ — is the new Grid Layout system.
Although you could create multiple versions of your website, each optimized to fit different screen size, that’s a complicated and highly inefficient solution to a problem that’s only going get worse as people connect to the Internet with everything from wristwatches to refrigerators.
Dreamweaver’s new Fluid Grid Layout gives you a head start on a complex design strategy. Like most responsive designs, a fluid grid layout includes three sets of style rules:
A small design optimized for mobile phones (and people with “fat fingers”);
A large design that fills even the largest computer monitors and takes advantage of all that screen real estate; and A mid-sized design optimized for iPads and other tablets.
When you use Dreamweaver’s Fluid Grid Layouts, media queries are created for you, based on the size of each device. Here’s what the media query looks like for a tablet device