Dreamweaver CS6 for HTML5?

[MFitz721]

Wow, 27 minutes hold-time to call Adobe for pre-sales support!

I'm a long-time Dreamweaver user currently using CS4. My customers are increasingly asking me to develop websites that will display properly on Androids and iPhones (less often Blackberries).

1. Would a site I create in CS6 as HTML5 automatically display properly on mobile devices? What other things (if any) do I need to do or consider? Anything I should read first?

2. Can anyone recommend a website emulator that will show me what my development sites will look like in every commonly used mobile device so I can rest-assured?

3. How different is developing a site in HTML5 using CS6 from HTML/CSS using CS4? Big learning curve or minor?

4. Can I continue to keep DW8 installed? (I have some older sites in HTML - no CSS that I need this for)

Thanks for reading this.

Matt

[Rik Ramsay]

1. No. Dreamweaver does not "help" as such with HTML5 - that knowledge comes from you. It has the tags included which helps a little but ultiimately you need to learn how HTML5 works on phones and learn about responsive design / media queries. The fluid grid layout in CS6 may help if you use design view more than code view.

2. Adobe Browser Lab

3. HTML5 is not drastically different to HTML4 but there is a learning curve. If you are very familiar with HTML and code by hand now, HTML5 should be relatively straight forward. There are plenty of resources about the coding elements.

Whether you use CS4 or CS6 makes little difference to the code - again this comes from you. However CS6 does have a fluid grid site which would help if you use design view a lot.

4. Don't see why not, but why? Older sites will open in the new Dreamweavers. Again, HTML code is HTML code. Dreamweaver is just an editor. You can build an HTML5 site in TextEdit if you want.

[Nancy OShea]

Hi Matt,

To elaborate a bit on what Rik already said, any standard compliant site you create should display reasonably well in iPhones, iPads, Androids & Blackberries.  If it doesn't, your layout/design approach may be in question.

Can you show us an example of a site you've developed that doesn't display properly in mobile devices?

That said, optimizing layouts for mobiles, tablets & desktops requires additional skill with CSS Media Queries and the ability to create different stylesheets for the various device widths you are targeting.  This is better known as "Responsive Design."  Read more about it below:

http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

Nancy O.

[MFitz721]

Thanks for the replies.

Nancy,

Should I upgrade to CS6 from CS4 given this conversation? I was thinking about only upgrading Dreamweaver, but I hadn't heard of Adobe Browser Lab. I think I'll either need that or some other online emulator. Adobe's Browser Lab might be part of the CS6 Suite, right?.

Several sites that are of concern are:

http://www.ISPG.com
http://www.UltraWizTools.com
http://www.Deltron.com (although I'm going to be building a new version of this one soon)

They all passed validation of XHTML 1.0 Transitional.

Thanks again!

Matt

[Rik Ramsay]

MFitz721 wrote:

Should I upgrade to CS6 from CS4 given this conversation? ...Adobe's Browser Lab might be part of the CS6 Suite, right?.

Browser Lab has been around since CS4 but you need to add the extension in to Dreamweaver:

http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2101022

Or you can use it online:

browserlab.adobe.com

They also have a testing application for mobile devices called Shadow that may be more use:

http://labs.adobe.com/technologies/shadow/

As I mentioned before, there is no need to upgrade your CS to update your websites. If however, you are a visual designer and know little code, CS6 will help you more. If you code everything by hand, your CS will make little difference.

[John Waller]

MFitz721 wrote:

Should I upgrade to CS6 from CS4 given this conversation? I was thinking about only upgrading Dreamweaver,

What do you currently own?

You're aware that if you own a Creative Suite that you must upgrade to another Suite? i.e You cannot upgrade individual components of a Suite e.g. Dreamweaver only.

[CaramelMacchiato]

Nancy,

This is better known as "Responsive Design."  Read more about it below:

http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsiv e-web-design/

I had bookmarked this on MacBook Pro 17, iPad, iPhone and MacPro 12-core for further reference read. I am in middle of some website updates with responsive web design perspective.

In that link you provided us, I agree with many posters' comment there, in general, I had not seen/read anything that is well-written and documented with unbiased perspective. The author on that article link has touched many topic, examples and all.

I think Adobe should put this link as a frame of reference, for all Adobe web customers to see/read/learn benefit from this.

Cheers,

Brian

[CaramelMacchiato]

MFitz721,

In my humble opinion, get the latest version of Dw CS6. You will NOT regret this.

Yes, I know there are many good advice in this forum discussion. From my perspective, since I have upgraded to EVERY Adobe Creative Suite release the latest version of CSx. In my case, I own Master Collection (upgraded from Design Premium a couple years ago). Every upgrade to new one makes a lot sense for me. Thus, this make more rapid workflow with more pleasant experience all together.

Not necessarily for every one to buy Master Collection, but just a standalone app is good too. If that works nicely for you with only one app. That works good for you, but I would think it would makes a lot sense to upgrade to CS6.

Nancy, I don't seem to find the info about Adobe plans to cut off on CS4 upgrad to CS6... when is the 'cut off' date, so MFitz721 doesn't get any surprise.

Yes, MFitz721, tell me about Adobe customer service experience - they are horrible!!!

You know where you can get some help.. RIGHT HERE! So you have come to the right place.

[MFitz721]

Thanks for the feedback everybody. You've given me a lot to research and think about. Too bad my pricing options aren't a 10 minute phone call away.

Matt

[John Waller]

CaramelMacchiato wrote:

Nancy, I don't seem to find the info about Adobe plans to cut off on CS4 upgrad to CS6... when is the 'cut off' date, so MFitz721 doesn't get any surprise.

Dec 31, 2012.

After that date, CS3 and CS4 customers can no longer upgrade to CS6 at upgrade prices. They must pay full price as if they had never owned any Adobe software before.

http://www.adobe.com/au/products/creativesuite/faq/upgrade-policy.html

"Take advantage of our special introductory upgrade pricing on Creative Suite 6 for customers who own CS3 and CS4 individual products and suite editions. This temporary upgrade offer is valid through December 31, 2012. After that date, only customers who own CS5 or CS5.5 products will qualify for upgrade pricing to CS6."

[Nancy OShea]

As John said, time is running out on upgrade pricing.  Your other option is to subscribe to the Creative Cloud for $50 USD/month which gives you access to 17 products including Dreamweaver CS6.

http://www.adobe.com/products/creativecloud.html

Nancy O.

[CaramelMacchiato]

Hello John.

In a word, thanks!

Brian

[MFitz721]

Rick,

I checked out both Adobe Browser Lab and Shadow. Browser Lab appears to display only PC and Mac browser screenshots and Shadow syncs devices. But that means you have to own all of the devices!

Isn't there a browser screenshot service that shows on a PC what things look like on the most important mobile devices without having to spend thousands of dollars purchasing these devices?

Thanks.

Matt

[Rik Ramsay]

I haven't used any online services for this to recommend but I am sure some of them will cost a small fee to give you an accurate view - you can try googling "website testing mobile devices" and see what solutions are around. For a very accurate view, you may need to download the individual emulators for Android, Windows and iOS (you can normally get these straight from the software site by signing up as a developer).

Alternatively, Adobe has Device Central in CS4 and up. It may help as well but may not have all the devices required - especially as Adobe discontinued support in April this year. They have PhoneGap in CS6 and also have the multi-screen preview.

If you are going to be doing a lot of mobile developing, then getting back to your initial question, an upgrade may help you in this department - but essentially the learning of HTML5 needs to be done by you.

[MFitz721]

Hi Rick.

Thanks for the reply.

Am I thinking about this wrong? Surely I can't be the only person in the world who would want to see development sites on various mobile platforms before launching. How does everyone else do this? As I mentioned, Browser Lab shows only PC/Mac browser screenshots and Shadow requires you physically have all of the devices.

Thanks.

Matt

[Nancy OShea]

In truth, on-line simulators are not 100% reliable because touch screens and mobile browsers have their own quirks which you won't see using a PC browser.  If you plan to develop for certain mobile devices, you need to borrow or invest in those devices to test on.

Visit your local Apple Store and check your sites on iTouch/iPhone/iPads.

iPhone simulator - (on-line)

http://www.testiphone.com/

Opera Mini Mobile Simulator (on-line)

http://www.opera.com/mini/demo/

Google Android Emulator (download)

http://developer.android.com/guide/developing/tools/emulator.html

Palm OS Emulator (download)

http://www.tucows.com/preview/261443

Blackberry Smartphone Simulators (download)

http://na.blackberry.com/eng/developers/resources/simulators.jsp

Nancy O.

[MFitz721]

Thanks Nancy. Great links.

Is that what you do? I mean have you bought several mobile devices, or do you test on your one using more conservative methods and assume the site will work the same way on other devices?

What about the rest of you? Do you buy several phones, tablets, etc., for testing? (In my case, I have a backend programmer who creates searchable content, shopping carts, product calculators, etc. in about 25% of my sites, so I'll sometimes have more than just a visual site to contend with.)

Thanks again.

Matt

[MFitz721]

Hi again.

Is there any reason you guys can think of why I should spend $950 upgrading from CS4 Design Premium to CS6 Design Premium when I don't use InDesign, Illustrator, Bridge, don't need the latest PShop, and rarely use Flash? I'm considering buying only Dreamweaver CS6 so I have the added benefit of some help generating HTML5 code for mobile sites.

Is there anything in the CS6 suite I will need to create mobile sites that I am missing?

Should I consider buying and customizing an off-the-shelf nav menu to simplify things? (If so, which do you suggest?)

Thanks

Matt

[Nancy OShea]

You can only upgrade from what you have now.  IOW, if you currently own a suite of products, you must upgrade to a suite of products; not a single product.

The full scale version of DW CS6 costs $399 USD.

http://www.adobe.com/products/dreamweaver/buying-guide.html

I can't tell you if it's worth it or not.  That's a judgement call only you can make.

You can join Creative Cloud free for 30 days to try it out. 

Or just download DW6 and test it for 30 days.    Then decide.

http://www.adobe.com/cfusion/tdrc/index.cfm?product=dreamweaver&loc=en_us

Nancy O.

[MFitz721]

Thanks Nancy. I guess what's holding me up is whether or not I'll be missing something important to create mobile sites by buying only the full version of DW CS6 rather than upgrading the whole suite. Adobe products are so expensive for a company with such terrible customer service.

Thanks again.

Matt

[ALsp]

If you want to create a site that will work seamlessly on all devices

you might want to look at Adaptations:

http://www.projectseven.com/products/templates/pagepacks/adaptations/examples/layout-01.htm

While it's not free, it is quite a bit less expensive than a Dreamweaver

upgrade and does come with actual support

--

Al Sparber - PVII