Live Today: Dreamweaver CCM Update #2

We’re happy to announce an update to Adobe Dreamweaver CC. This update focuses on stability enhancements and bug fixes. In addition, it includes improvements to code-view performance and some user experience enhancements. Download Dreamweaver CC here.

We encourage you to download the latest release of Dreamweaver CC and provide your feedback and comments. We’ve also just launched a customer feedback survey. The survey should take no more than a few minutes to complete. Click here to take the survey to provide your comments. Follow us on Twitter (@dreamweaver) and Like us on (https://www.facebook.com/AdobeDreamweaver) to stay up-to-date on forthcoming releases and new features.

Responsive Web Design With Heart

MIGHTYminnow’s pro-bono client Rocket Dog Rescue is in a better position than ever to connect pet lovers with animals needing homes. After first designing the non-profit’s website in 2006, MIGHTYminnow founder Kristin Long and her associate Mickey Kay used Adobe Creative Cloud, including Adobe Dreamweaver CC to turn the organization’s existing WordPress site into a dynamic, fully responsive website.   Many features in Dreamweaver CC, including Code View and Live View, the visual editing capabilities of CSS Designer, and the Viewport selector to work collaboratively, save time, and make the overall process of responsive development more efficient and adaptable. To test how the new site performed on different devices, Long used Adobe Edge Inspect CC to navigate the site design in Chrome on her desktop and see the work appear on a range of connected phones and tablets in the studio’s device lab as the devices follow along loading every page she loads in Chrome.

Adobe Dreamweaver Survey 2013

The Dreamweaver team is conducting a customer feedback survey. The objective of this survey is to connect with you, our users, and figure out from as many of you as possible what’s working in Dreamweaver and what isn’t. 

Your feedback is important to us. Participation in this survey is voluntary and your responses are completely anonymous. 

Dreamweaver In Action: Ten Fathoms Redesigns Yorkshire Crab Website Using Dreamweaver CC

We love discovering our customer’s use of Dreamweaver to create innovative sites and mobile apps in our Dreamweaver In Action series.

One of our favorite things to do is highlight the great work Adobe customers produce with our tools. Today, we get to show off a website redesign completed by Ten Fathoms for Yorkshire Crab, a sustainable seafood company. The client wanted a site that would appeal to higher end clients, reinforce the company’s sustainability messaging, and use high-end imagery to show off products. Paul Middleditch, founder of Ten Fathoms, used Dreamweaver CC to construct the main framework for the content-managed site and even created an image banner for the site using Adobe Edge Animate CC.

Dreamweaver In Action: Ten Fathoms redesigns Yorkshire Crab website using Dreamweaver CC

Dreamweaver In Action: Ten Fathoms redesigns Yorkshire Crab website using Dreamweaver CC

Like many web professionals, Paul describes himself as being midway between graphic designer and web developer. For that reason, he loves Live View and Code View because he can keep an eye on how a site looks, even as he’s coding. He was also able to eliminate the tedious toggling back and forth to a browser to test changes by entering values in CSS Designer and seeing the immediate effects within Dreamweaver CC.
In addition to working with his favorite web design and development tool, Creative Cloud also lets Paul experiment with other tools, including Adobe Muse CC, Edge Reflow CC, Lightroom, and even Adobe Premiere Pro CC! He says, “Having access to all of the Adobe creative tools through Adobe Creative Cloud opens up more avenues to create.”

Read more about the Yorkshire Crab project here http://adobe.ly/1hSqf6U

Do you have a great story to tell? Tell it to millions of Adobe customers. Send us your website or work you’ve created with Dreamweaver CC and be part of the story. You can share your story by sending us a message on Facebook (https://www.facebook.com/AdobeDreamweaver) or tweet it with the (#DreamweaverInAction) hash tag.

Dreamweaver In Action – Be Part of The Story!

We’re thrilled to announce the #DreamweaverInAction series. Many of our customers have shared their great work and stories, so we decided to pass it along to the community.

The primary aim of this series is to show off our customers’ exciting work, inspire further creativity by sharing ideas and cultivate a discussion about the modern Dreamweaver. It will also help our featured customers get exposure through Adobe’s social channels and website.

We kicked off the series by showing off the creative work of AltaSartoria web design agency. Claudio Caciagli, lead designer and developer, has just launched this stunning responsive website http://altasartoria.com

AltaSartoria web design agency

AltaSartoria web design agency

 

We followed that up with an inspiring example by designer Jordan Flower, who used Dreamweaver and WordPress to create a business at Keys Apparel that supports victims of human trafficking.

Keys Apparel

Dreamweaver & WordPress site.

 

Do you have a great story to tell? Tell it to millions of Adobe customers. Send us your website or work you’ve created with Dreamweaver CC and be part of the story. You can share your story by sending us a message on Facebook (https://www.facebook.com/AdobeDreamweaver) or tweet it with the (#DreamweaverInAction) hash tag.

 

Visualize Relationships Between HTML Elements in Live View & Applied CSS Selectors

A few months ago, we announced a new Dreamweaver CC update with several exciting new features.

One of these, the Live Highlight feature, lets you visualize the relationships between HTML elements in Live View and applied CSS selectors.

Let’s review how Live Highlight works. In the screenshot below, a user intends to make changes to the ‘Cart’ navigation link. To make changes to HTML elements, the user usually starts by selecting the CSS selector “.SiteNavLink a” and editing the associated properties. These changes could however inadvertently change other HTML elements that the user might have no intention of changing at all.

 

Live Highlight in Dreamweaver

Live Highlight in Dreamweaver

 

Using Live Highlight, users can now simply click the CSS selector in the CSS Designer panel to see the affected page elements. These elements are highlighted in blue in Live View mode. Users decide if they want to create a separate Selector that applies to ‘Cart‘ alone, thus leaving the styles for other links undisturbed.

Enjoy the video below that shows how to use the new Live Highlight feature. Also, check out this article for more info http://ref.sx/LiveHighlightDreamweaver

 

Download and get your hands on the modernized Dreamweaver CC with exciting features that make mobile and web content creation a more streamlined and productive experience.

7 Useful Adobe Dreamweaver Webinars

Dreamweaver-ers! Earlier this year we launched a webinar series to provide an overview of the core Dreamweaver CC features, as well as featuring key extensions and our ongoing modernization efforts.

We have found these webinars to be a good communication channel between the team and the community to communicate feature enhancements, issues, future plans, etc. Please review the table below and check out anything that strikes your interest!

 

Webinar Title Recording Link
What’s New In Dreamweaver CC http://bit.ly/10Wo08P
CSS Designer in Dreamweaver CC http://bit.ly/1aqCgty
Faster Theming of Dynamic, CMS based Sites in Dreamweaver CC http://bit.ly/1aqCpwY
Building Mobile Apps Using Dreamweaver CC http://bit.ly/19kPZUw
Building Responsive Design in Dreamweaver CC http://bit.ly/15k53PQ
Dreamweaver Extensions: Fluid Grid Layout & Bootstrap Extension http://bit.ly/18UDLNc
Dreamweaver CC Update http://bit.ly/1eEaHj1

 

We hope you enjoy these sessions and find them useful. Sign up for a Creative Cloud membership and gain access to rich learning content and tutorials for all Adobe products – including Dreamweaver CC.

 

Best,
Tareq Aljaber
Product Marketing Manager

 

 

Dreamweaver CC Gets New Live Highlight, Modernized Live View, Enhanced CSS Designer, and More.

A few months ago we announced the release of Dreamweaver CC, with several exciting new features (CSS Designer, Creative Cloud Sync, and more). Today, we are happy to announce the release of our first CC update, with some new features, user experience improvements, and bug fixes.

Note from the editor: You may have noticed the small gap in time between the main Creative Cloud release and this update. A shorter development cycle is one of the benefits you receive when you become part of creative cloud. 

Do you find yourself leaving Dreamweaver CC to test your content in the browser to make sure it’s accurate and looks good? With the new Modernized Live View in Dreamweaver CC we have integrated a brand new rendering engine, which displays web content with the same performance and HTML5 technology support available in Google Chrome™. Now you can spend more time in Dreamweaver CC and less time switching in and out of the browser to test your content.

Rendering Engine

Brand new rendering engine, which displays web content with the same performance and HTML5 technology support available in Google Chrome™.

The new Live Highlight feature enables you to visualize the relationships between the HTML elements in Live View and applied CSS selectors. Inspect and highlight elements in Live View in real time while you interact with the CSS Designer. Simply hover and click Selectors in the CSS Designer to see Live Highlight in action.

Live Highlight

Inspect and highlight elements in Live View in real time while you interact with the CSS Designer.

After carefully customizing workspaces, keyboard shortcuts, site settings, and preferences on one workstation, it can be tedious to do the same from scratch on a second workstation. With Creative Cloud and Sync Settings in Dreamweaver CC, you can now sync your workspaces, keyboard shortcuts, etc. in seconds with the click of a button.

 

Sync Settings

Customize your workflow once, and take it with you wherever you go – all through the Creative Cloud.

The new CSS Designer in Dreamweaver CC was released early June and we are continuing to listen to your feedback and improve the feature based on that. We’ve introduced a number of usability enhancements and a new color picker to improve productivity by speeding up visual CSS editing workflows.

In addition, we have improved our Code View by adding line number highlighting and highlighting of matching tags, as well as CSS selector code hints including Preferences support for color customization. We’ve also added support for PHP 5.4 to enable you to develop dynamic pages with ease and confidence, and updated our jQuery Mobile library to version 1.8.3.

We hope that you are as excited about these new features in Dreamweaver as we are, and look forward to your feedback on this release and suggestions for future enhancements. Visit creative.adobe.com to download the new version of Dreamweaver CC.

Best,
Tareq Aljaber
Product Marketing Manager

A Look at the Modernized Dreamweaver CC

When the first version of Dreamweaver launched, the web had only begun to emerge as a viable platform, and its capabilities were a fraction of what they are today. Since then, the web platform has changed dramatically, and continues to evolve at a rapid pace.

Designing for an evolving platform means that the tools one uses must also evolve. To best serve our customers, we are modernizing Dreamweaver to provide an all-in-one visual tooling environment for creating websites and mobile content. To do so we are streamlining the user interface, introducing new ways to tackle key areas of the web design process, and removing support for technologies that are not widely used by our customers.

Our first task has been to streamline the User Interface, which we have begun by consolidating several workflows (such as font management) and simplifying parts of the application (such as the Document Tool Bar and the Insert Panel). In addition, we have begun to identify and remove parts of the application that are redundant. We have already removed 10 panels, 14 dialog boxes, and 62 menu items. A simpler UI means fewer steps to accomplish your tasks, and fewer interruptions to your workflow.

The modernization efforts also include the introduction of the new CSS Designer panel in Dreamweaver CC. In future updates to Dreamweaver we intend to improve the HTML & CSS preview/inspect/edit workflow, streamline file and site management, enhance our support for responsive web design, as well as continue to focus on improving performance and responding to customer feedback. Dreamweaver will also continue to receive regular updates that expose the evolving capabilities of the web and further integrate tools and services that improve productivity.

As we remove older features from Dreamweaver, we recognize that some customers may still depend on existing workflows/technologies. Therefore, in addition to making Dreamweaver CS6 available through Creative Cloud, we are also providing some alternatives. The table below covers some of the features we have removed, and the list of the extensions or workarounds that will enable affected customers to continue using Dreamweaver CC as part of their existing workflows.

Removed feature / functionality

Extension/Workaround

Additional information

Server Behavior, Bindings and Components Panels and Database feature There is a single extension to restore these features. To install, please follow these steps: 1. Launch Dreamweaver CC
2. Update both Dreamweaver CC and Extension Manager (if the update is available) to the latest versions
3. Go to Windows > Extensions > Adobe Exchange
4. Search for Server Behavior extension
5. Install by clicking Free button
6. Follow the onscreen instruction

 

ASP, ASPNET, JSP Support There is a single extension to restore these features. Extension is available at:* Vista/Windows 7: C:\Program Files (x86)\Adobe\Adobe Dreamweaver CC\Configuration\DisabledFeatures* Mac OS X: /Applications/Adobe Dreamweaver CC/Configuration/DisabledFeatures These extensions are in MXP format. To convert them to the correct format, please follow the instructions in this video: http://youtu.be/8bzlrjHGsQcTo install, follow instructions in the video

http://www.youtube.com/watch?v=cB2vmNfcq7A

 

 

Spry There is an extension to replace Spry datasets with jQuery datasets. It is available for free on Adobe Exchange. More info here:HTML5 Data BindingsBootstrap Extension  Replacement provided via deep integration with JQuery UI & JQuery effects. You can still download Spry from Adobe GitHub.
ColdFusion Support ColdFusion has a dedicated IDE (ColdFusion Builder) that serves the development needs of the ColdFusion developers & community. Download ColdFusion Builder 2. Note: You can also open ColdFusion documents from within the files panel in Dreamweaver. Please click here for step-by-step instructions.

 

While Adobe has tested the extensions listed above with Dreamweaver CC, we do not provide support for functionality provided through extensions.

In addition to the extensions we’ve provided, we are particularly excited about two new extensions for Dreamweaver developed by DMXzone. They provide modernized replacements for two Spry workflows featured in previous versions of Dreamweaver. More information is available at:

HTML5 Data Bindings
Bootstrap Extension

We have just begun the modernization process and invite you to voice your opinion. We are committed to taking action on customer feedback and remaining as transparent as possible about our future plans.

Best Regards,

Tareq Aljaber

Product Marketing Manager