Adobe Dreamweaver Cs6

12.1 Update, September 24, 2012:

A bonus 2-hour set of Adobe Dreamweaver CS6: Learn by Video tutorials are included, from video2brain and Adobe Press. Learn by Video is one of the most critically acclaimed training products on Adobe software and is the only Adobe-approved video courseware for the Adobe Certified Associate Level certification. Learn by Video bonus tutorials. Adobe Dreamweaver CS6 software lets you design, develope, and maintain standards-based websites and applications. Adobe Dreamweaver CS6 - Full Version. Use the fluid grid layout system and HTML editor to design projects for smartphones, tablets, and desktop screens.

For the What's New content for this release, see What's New | Creative Cloud.

Adobe Dreamweaver Cs6 2

12.2 Update, Feb 14, 2013:

For the What's New content for this release, see What's New | Creative Cloud | Feb 2013

The video tutorials for new features in Dreamweaver CS6 are now available on Adobe TV (http://www.adobe.com/go/learn_dwcs6_adobetv_en).

The Manage Sites dialog box (Sites > Manage Sites) has a new look and feel, although much of the functionality remains the same. Additional functionality includes the ability to create or import Business Catalyst sites.

Use the robust new fluid grid layouts in Dreamweaver (New > New Fluid Grid Layout) to create adaptive CSS layouts that respond to varying screen sizes. When you build a web page using a fluid grid, the layout and its contents automatically adjust to the user's viewing device, whether desktop computer, tablet, or smart phone.

  • WebDesign Tuts: Getting Started with Dreamweaver CS6 Fluid Grids.

Use the new CSS Transitions panel to apply smooth property changes to CSS-based page elements that respond to trigger events such as hovering, clicking, and focusing. (A common example is a menu bar item that gradually fades from one color to another when you hover over it.) You can now create CSS transitions using both code-level support, and the new CSS Transitions panel (Window > CSS Transitions).

  • Adobe TV: Using CSS3 transitions in Dreamweaver CS6

You can now apply multiple CSS classes to a single element. Select the element, open the Multiclass Selection dialog box, and choose your classes. After you apply multiple classes, Dreamweaver creates a new multiclass from your selections. The new multiclass then becomes available from other places where you make CSS selections.

You can open the Multiclass Selection dialog box from several access points:

  • The HTML property inspector (Choose Apply Multiple Classes from the menu.)
  • The Targeted Rule pop-up menu of the CSS property inspector
  • The context menu of the tag selector at the bottom of the Document window (right-click a tag and choose Set Class > Apply Multiple Classes.)

Through direct integration with the exciting new PhoneGap Build service, Dreamweaver CS6 customers can build native applications for mobile devices using their existing HTML, CSS and JavaScript skills. After you log into PhoneGap Build via the PhoneGap Build panel (Site > PhoneGap Build), you can build your web application directly on the PhoneGap Build service, and download the resulting native mobile applications to either your local desktop or mobile device. The PhoneGap Build service manages your project and allows you to build native applications for the most popular mobile platforms, including Android, iOS, Blackberry, Symbian and webOS.

jQuery Mobile 1.0

Dreamweaver CS6 ships with jQuery 1.6.4, as well as jQuery Mobile 1.0 files. Starter jQuery Mobile pages are available from the New Document dialog box (File > New > Page From Sample > Mobile Starters). You can also now choose between two kinds of CSS files when creating your jQuery mobile pages: full CSS files, or CSS files that are split into structural and theme components.

Cs6Cs6

jQuery Mobile swatches

Preview all the swatches (themes) in a jQuery mobile CSS file by using the new jQuery Mobile Swatches panel (Window > jQuery Mobile Swatches). Then use the panel to apply swatches to or remove them from various elements in your jQuery mobile web page. Use this feature to individually apply swatches to headers, lists, buttons and other elements.

  • Using jQuery mobile themes in Dreamweaver CS6 (tutorial)
  • Adobe TV: Enhanced jQuery Mobile support in Dreamweaver CS6

New Business Catalyst sites

You can now create a new Business Catalyst trial site directly from Dreamweaver, and explore the broad capabilities that Business Catalyst can provide to your clients and projects.

Adobe Dreamweaver Cs6 Free

Business Catalyst panel

Adobe Dreamweaver Cs6 System Requirements

After you log in to your Business Catalyst Site, you can insert and customize Business Catalyst modules directly from the Business Catalyst panel (Window > Business Catalyst) in Dreamweaver.You'll have access to rich functionality such as product catalogs, blogs and social media integration, shopping carts and more. The integration provides a way for you to eamlessly work between your local files in Dreamweaver and your site's database content on the Business Catalyst site.

You can now use creative web-supported fonts (such as Google or Adobe Fonts) in Dreamweaver. First, use the Web Font Manager (Modify > Web Fonts) to import a web font into your Dreamweaver site. The web font then becomes available for use in your web pages.

The Dreamweaver CS5 Image Preview dialog box is now called the Image Optimization dialog box. To open the dialog box, select an image in the Document window and click the Edit Image Settings button in the Property inspector. Some of the options found in the previous CS5 Image Preview dialog box now appear in the Properties Inspector.

An instant preview of the image is displayed in Design view as you change settings in the Image Optimization dialog box.

Dreamweaver uses multi-channel transfer to simultaneously transfer selected files using multiple channels. Dreamweaver also allows you to simultaneously use the Get and Put operations to transfer files.

If there is sufficient bandwidth available, FTP multi-channel asynchronous transfer considerably speeds up the transfer process.

For more information, see http://blogs.adobe.com/dreamweaver/2012/06/ftp-improvement-in-dreamweaver-cs6.html.

Adobe Dreamweaver has dominated the Web-editing field for longer than most people can remember, but in the past few years it has seemed willing to coast on its reputation, offering worthy but uncompelling upgrades with each recent version. Dreamweaver CS6 version is different. It’s an essential upgrade for anyone who wants to build Web pages or apps that automatically adapt when viewed in a Web browser on a phone or tablet or a browser on a laptop or desktop. For the past few years, I’ve been doing most of my Web design in Microsoft’s clean, efficient, and underpublicized Expression Web, but Dreamweaver CS6 is the first Web editor built for the multiplatform era, with full support for HTML5 and CSS3. Like the rest of the CS6 suite, Dreamweaver is targeted to professionals who are willing to climb its steep learning curve, but even occasional coders can use it to build impressive-looking sites.

The big new features in Dreamweaver are these. First is “fluid grid layouts” that let you specify exactly how page elements will be arranged when your site is displayed on a small-screen phone, a midsize tablet, or a full-screen desktop. (Keep reading for more detail on this.) Next is built-in support for PhoneGap Build, an open-source platform that makes it easy to create a single Web-based app that runs on multiple phone platforms. Dreamweaver also improved its integration with Query Mobile, a JavaScript-based platform for building browser-based phone and tablet apps. CSS Transitions—the Web-based counterpart of transitions in traditional presentation apps—are now supported through a reasonably intuitive interface.

Adobe has improved the fidelity and flexibility of Dreamweaver’s “Live” preview, and improved its “multiscreen” preview panel that shows what your page will look like at phone, tablet, and desktop screen sizes. Adobe’s online “browser lab” makes it possible to test your pages on older browser platforms, though Microsoft’s comparable SuperPreview feature offers an even wider choice of old and new browsers to test in.

Adobe

Another Dreamweaver feature that I’ve wanted for years, and which Adobe scarcely mentions in its PR, is built-in Web font support through a simple dialog that lets you install fonts to your Web server so you can use them on your pages; this was always possible through laborious hand-coding but Dreamweaver makes it easy. Other improvements that I’m glad to see include a completely revamped—and speedy—FTP module with full support for secure protocols. Built-in support for the W3C Consortium’s page-validation tool guarantees full compliance with current Web standards.

The most spectacular new feature in Dreamweaver is its support for “fluid grid layouts,” which means that it creates pages organized according to an invisible underlying grid that changes according to the size of the screen. Text and graphic elements on the page automatically readjust their position when the page is viewed on a phone, tablet, or desktop. I had to watch a demo video (accessible from Dreamweaver’s opening menu) to figure out to use it, but after that it was easy.

AdobeAdobe Dreamweaver Cs6

Adobe Dreamweaver Cs6 Free Download

You create a fluid grid layout by targeting three screen sizes: phone, tablet, and desktop. First you arrange the page elements as you want them to look at one screen size, with each element aligned to the invisible background grid. Then you click an icon to switch to a different screen size, and arrange the elements in a different way on the grid. So, for example, a phone will display your whole page in a single column with a dropdown navigation menu at the top, while a tablet will display parts of the page in three columns, with a wide navigation bar at the top. The underlying CSS automatically switches between layouts according to the screen size of the device displaying the page. The multiscreen preview panel lets you change any or all of the three built-in screen sizes, so you can test the way the fluid grid will work on any size you want.

Dreamweaver, predictably, is tightly integrated with Adobe’s Flash format. But if you’re developing for iOS, you can’t use Flash in your apps or Web pages, unless you buy Adobe’s $4,500 Flash Media Server to stream Flash in a way that iOS permits. Dreamweaver let me drop Flash video into my Web pages without an hiccup and with plenty of layout options, but when I tried to add HTML5 video to my page, I had to figure out for myself that I needed to download and install an HTML5 Video “widget” and then modify the widget’s code by hand.

Like the rest of the Adobe’s Creative Suite Dreamweaver’s interface is a forest of panels and “tab groups” and toolbars that takes time to get used to. Unlike the rest of the suite, which uses a graphic interface to edit graphic objects like animations, photos, illustrations, and printed pages, Dreamweaver’s graphic interface is a set of tools for editing raw HTML, CSS, JavaScript, and other text-based code. Most of the time, you can use one of Dreamweaver’s GUI-based buttons and menus for modifying the underlying code, but sometimes you can’t and that means getting your hands dirty while editing the code directly. This is good if you know how to edit raw code, frustrating if you don’t. Sometimes, especially while working with the new fluid layout grid feature, I gave up trying to find a menu or toolbar for modifying a layout detail, and had to dig through the raw code to make the change. The fluid layout grid feature is obviously a work in progress, and future versions will make this kind of thing easier, but you should be prepared for some minor first-version frustrations in the meantime.

Adobe Dreamweaver Cs6 Google Drive

For basic HTML and CSS editing, I still tend to prefer Microsoft Expression Web 4, but Expression Web works only on Windows, while Adobe’s apps work more or less identically on Windows and Mac machines. Also, Dreamweaver CS6 is unquestionably the first and only Web-building tool that works smoothly and capably in the new multi-platform world. It’s got its rough edges, but Adobe Dreamweaver CS6 also has more power and flexibility than anything else in its category, and it deserves our Editor’s Choice.