Adobe’s Tooling for jQuery and the Mobile Web

Loose notes from SXSW 2011: Adobe’s Tooling for jQuery and the Mobile Web

Dreamweaver used to be criticized for “black box” code management. Adobe made great strides in improving the situation and keeping code hand-editable. But as the web becomes more complex and we need to deal with more technologies and target more screen sizes, the need for a system to manage a complex code base becomes greater. Dreamweaver has evolved to meet the challenge. I only stayed for the first half of the session.

Ryan Stewart
Developer Evangelist
Adobe

Scott Fegette
Prod Mgr Dreamweaver
Adobe Systems Incorporated

It’s not your grandfather’s Dreamweaver anymore.

Two biggest challenges over the past year:
1) Multi-screen (getting your stuff onto both small and large devices)
2) HTML5, CSS3, etc.

CSS3 lets us do a lot of things we used to need an image editor for. Opacity, rounded corners, gradient backgrounds, rotations and transforms, all built into Dreamweaver now.

New Viewports panel lets you establish all of your target screen resolutions/dimensions.

Media Queries
http://www.alistapart.com/articles/responsive-web-design/
are part of “Responsive Web Design” – making divs or objects “drop out of view” when viewing on smaller screens. Built in to Dreamweaver now. You can have a site-wide Media Queries file that gets applied everywhere. DW lets you see all screen resolutions and their different media queries simultaneously.

JQuery has become the defacto Javascript library for developers, and the JQuery Mobile project responds to the mobile market. The next version of Dreamweaver will have JQuery Mobile built in. Adobe actually contributes to the JQuery Mobile project.

Mobile starter sites are built into DW’s template library.

“Managed code” – Dreamweaver took a lot of heat for its “black box” approach early on. That situation has gotten much better. Now that web technologies have gotten so much more complex, the idea of “managed code” is becoming popular/acceptable again. Hand-coders are warming to DW again.

Reminder: Browserlab lets you test your site as seen in multiple browsers.

Browserlab is integrated with Dreamweaver – you can quickly send any file/page you’re working on to Browserlab for cross-browser testing.

Adobe is rethinking how Flash professionals perceive Flash as a tool. CS5 included the iPhone Packager, which generated iPhone apps from Flash authoring. Apple killed it, then re-allowed it. From within Flash Pro, you can start a new project as an iOS project. You can build for multiple screen resolutions from within Flash Pro. A single symbol can percolate across the multiple targets automatically. Can also generate Air output from within the same project.

Leave a Reply

Your email address will not be published. Required fields are marked *