Inspiring

Question

Why is Dreamweaver's design view so messed up?

Forum|Forum|14 years ago
February 23, 2012
6 replies
30606 views

Hi

I am sure this has been asked and answered loads of times but here goes again.

Dreamweaver gets a lot of bad press because of it's design view but why does Dreamweavers Design view render web pages so badly? Even pages that validate and are well structured often render very poorly. Why is this?

It's not as if DW doesn't have a decent rendering engine built in - live view works perfectly well. And Contribute seems to be able to present an editable page rendered correctly.

The design view obviously has some sort of rendering engine to do it's job but is it a bespoke, poorly written one that it's not up to the job? Why keep it if doesn't work? Is there just no will to fix it?

This topic has been closed for replies.

C

cdeatherage

Inspiring

Back when I started using Dreamweaver (version 2.0 for the Mac), I relied on Design View because at that point in ancient history we (and by "we" I mean all computer users of either OS platform) had been brainwashed into an WYSIWYG mindset. Dreamweaver is NOT (and in my experience never has been) a WYSIWYG software program.

Once I figured out how unreliable Design View is, I started working 97%-99% in Code View only and checking the page in each of the browsers installed on my working computer. I will sometimes use Split View to quickly check out a change, or Design View to help me parse how DIVs are (or aren't) playing well together. And I think I've switched to Live View maybe three times since it became available.

Code View + real-world browser works best for me. That's my habit, and I'm sticking to it. Until some muckamuck does something that forces me, kicking and screaming, into the 22nd Century.

Chris

BenPleysier

Community Expert

Sorry, I fail to see what all the fuss is about.

I normally do not use design view except if I want to find a particular piece of code. Nor do I use live view except to see what happens to third party plugins that dynamically change or add class attributes. the latter enables me to change relevant properties to suit.

Never will I use design view or live view for the design of my project.

I have a second monitor that shows 3 browsers, namely IE9 (in which I can test IE7&8), FF and Safari. When I want to test my design, I go to these browsers. After all, that is the end goal, to make sure that the user gets the correct experience.

Gramps

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Daryl Barnes

Participating Frequently

Well the point of Live View and Design View is to be able to see your changes without having to refresh a browser. Even if you have the browsers on a second monitor, the workflow is still slower and you still work more "detached" than if you used the built in Webkit Browser Live View integrated into the development environment.

T

Trina$

Participant

My attempt to answer the discussion question:

No one has the answer, except for the people that created it. (Sorry, thats all I got. The rest of this post will be me explaining my frustration with design view.)

My ideas on this topic:

I have been thinking about this topic for a couple years now. My conclusion is that the problem has to do with my (and your) expectations. My hopes for design view were high (too high) when I first started using it. I had expectations on the level of a kid on Christmas morning. But, when I started trying to design in design view, I felt as crushed as the same kid finding out on Christmas morning that Santa doesn't exist, because daddy ran off with a hooker and mommy was to drunk to remember to buy Christmas presents.

The design view, upon first glance, seemed, to me, to be a visual html layout editor. I didn’t know that much about html or css or any code and I was hoping that design view would allow me to create web pages without having to obtain an in depth knowledge of these things. Unfortunately, that is not true. The only positive thing I can say about design view is that it forced me to learn more about html and css so that I do not have to rely on it.

Since I have learned more about HTML and CSS I have been using dreamweaver as a notepad because I like some of the code editor features. I still get pissed off though every time I look down at the design view and see that my content all messed up. I do like that they have a live view option available now.

My plea to Adobe is that they fix the design view so it displays like a browser.

To sum it all up:

I think design view was poorly designed and is simply not good at performing the task that I expect of it, much like my father that ran off with a hooker and my alcoholic mother.

mhollis55

Inspiring

Erik, I'm sorry your life turned out so badly.

(Oh, this wasn't autobiographical?!)

I fully understand where you are coming from. One expects Dreamweaver to show something akin to "reality™" I'm using both CS3 and CS5.5 and the latter does offer "live view" that does offer the Browser peek. Live view will run JavaScript and generally act normal, though one cannot click on a link and have it activate. So it does serve for what you are looking for, but you cannot place a curser in a spot then add a photo or insert a div from that view.

Frankly, I'd like to see something that is, actually, editable and is a little more sophisticated. I am not expecting it to run JavaScript and I am not expecting links to be live. And, perhaps, that is because I am used to the way Dreamweaver has always worked.

I still check everything in a browser (actually several browsers).

Daryl Barnes

Participating Frequently

mhollis55 wrote:
I fully understand where you are coming from. One expects Dreamweaver to show something akin to "reality™" I'm using both CS3 and CS5.5 and the latter does offer "live view" that does offer the Browser peek. Live view will run JavaScript and generally act normal, though one cannot click on a link and have it activate.

Actually Dreamweaver's Live View does in fact allow you to click on links and move throughout a site or even external sites. You just have to hold down Command (Control on a PC) while clicking. Alternatively you can turn on "Follow Links" and the very next link you click will happen without having to turn on Cmd/Ctrl. Or turn on "Follow Links Continuously" and the behavior remains on until you turn it off. The reason it is not on by default is so that you can just click on a link and have it select that particular link element to style it rather than taking you to another page.

In Live View, you can even enter information into forms and submit them. That's because Live View is actually a real browser using the Webkit rendering engine. That also means it renders pretty much exactly as other Webkit browsers like Safari or Chrome. In fact, you can actually just browse the web in Dreamweaver's Live View if you want. Search at google, login to websites, shop at amazon, etc.

Right now, Design View best works as an HTML content creation and editing tool rather than a layout tool. I mostly use it for directly inserting, writing, and editing content like Heading text, paragraph text, and sometimes images. Almost everything else should be coded in Code/Split View. But Design View also works well for selecting objects you want to edit in code.

M

MTKoan

Participant

Yes, simple items sometimes display badly (was trying to make an example but was not able to get it to not work ).

Luckily, it's a simple matter to test online. It seems a pretty easy thing to incorporate Firefox into the Design View, however. That seems like a great partnership. Or go with Opera and fund that corporation.

A

Anonymous

ufff finnaly.... it took me so much time to create an account to post this... anyway...

I use dreamweaver just for intellisense (autocomplete) feature, for the design view I use Firebug extension under Firefox, you can adjust and play with CSS style and HTML, and see your page and DIVs moving in real time!, it's really a powerful tool and there are many extensions for it, the nice thing is that there is a version for all major browsers- IE, Safari,Chrome (I prefer Firefox bcz it's opensource and it's not biased like other browsers, does not advertise for any company(Microsoft,Apple,Google) )

ps:while changing a css style with Firebug, use up and down arrow keys to increase and decrease or change diferent values and see the page updating in real time, and guess what it is open source

conclusion :

Dreamweaver is good for general structure---->Firebug for details (use both, I also use alot Notepad++)

Let me know what you think

-------

http://www.freecomputerrepairing.com

A

Anonymous

Design view likes to pick and choose how it renders markup and styles. Applying the following style to an anchor, for example, will result in Design saying "no, I don't think so:"

a {

display:inline-block;

padding:40px 80px 40px 0;

background:transparent url('http://www.nia.biz/images/home_icon.png') center right no-repeat;}

This isn't an issue of conforming to web standards or having semantic markup. Remember, markup can validate and not be semantic or conform to standards (or both).

Interestingly enough, if you enable Live Code, the above style is rendered properly, and it continues to render properly even after disabling Live Code... until after you restart the application. That, folks, is called a bug.

I use Dreamweaver at the office because (a) it's what our office uses and (b) I appreciate some of its code-completion features and how it loads all linked dependencies. I rarely use an IDE's design view in place of an actual browser. Despite this, some people use design view for whatever reasons, and so it should work properly. Further, if it's a feature of a public release, it should work properly.

And not to go completely off topic, but the whole "deisgn has to look the same in ALL browsers" mindset is what holds progress back. Sites can look the best in a modern browser, but elegantly degrade in older browsers and still accomplish the same ends. Also, vendor prefixes are your friends.

mhollis55

Inspiring

I don't like vendor prefexes. Perhaps I'm old-fashioned, but I like less code.

An example:

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 100%;

color: #000000;

background-color: #fff;

margin: 0;

padding: 0;

background: #402a67; /* Old browsers */

background: -moz-linear-gradient(top, #402a67 0%, #ffffff 70%) fixed no-repeat; /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#402a67), color-stop(70%,#ffffff)) fixed; /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* Opera11.10+ */

background: -ms-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* IE10+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#402a67', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

background: linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* W3C */

}

Now, if everyone would agree on a standard, the graduated background would be described thusly:

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 100%;

color: #000000;

background-color: #fff;

margin: 0;

padding: 0;

background: #402a67; /* Old browsers if needed at all */

background: linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* W3C */

}

That's 8 lines of code instead of 13.

One might ask how much longer it takes a browser to load that much extra code that is specific to other browsers and not the one one is actually using.

Dreamweaver does display the background correctly here, but only in Live View. And, with some of the colors, I find it nearly impossible to see some of the type.

ALsp

Legend

I'm astounded that regular posters on this forum either do not

understand the limitations in Dreamweaver Design View or, worse, do not

have a good understanding of CSS.

Deign View, by the way, has absolutely nothing to do with Live View.

Design View was programmed by Macromedia engineers who did an admirable

job last century. But it has not been significantly upgraded in 10

years. If I had to compare Design View to a browser, it comes between

IE6 and IE7.

Back when I was a Dreamweaver adviser, I used to ask them annually to

support display: inline-block. I have not been an adviser in over 3

years and they still don't support that property

We have even resorted, in recent products, to generating Design Time

style sheets to work around at least some of the more egregious

shortcomings of Design View rendering.

--

Al Sparber - PVII

http://www.projectseven.com

The Finest Dreamweaver Menus | Galleries | Widgets

Since 1998

John Waller

Community Expert

The only way to respond to this question meaningfully is by way of example.

What specifically renders poorly for you? Which version of DW?

Point us to a webpage which is messed up for you in Design View and allow others to replicate it.

B

bikeman01Author

Inspiring

Come on John if you've been using DW for any time you surely must know what I am referring to.

But to satisfy your curiosity, please test with the followng temaplte http://tinyurl.com/7fkvfkg

I use CS4 but design vierw has been rubbish in all DW version.

O

osgood_

Legend

I agree with Bikeman that design view doesn't always render well for me, even for pages that are well built and that are only HTML, but it doesn't bother me. Sometimes design view is useful for locating a tag or some content in a complex page. Design view shows you the various blocks of Div containers and tables on the page, so it isn't intended to be a browser.

Obviously you can keep a browser window open and refresh it as needed, so why does it even matter how design view renders?

Rob Hecker2 wrote:
I agree with Bikeman that design view doesn't always render well for me, even for pages that are well built and that are only HTML, but it doesn't bother me. Sometimes design view is useful for locating a tag or some content in a complex page. Design view shows you the various blocks of Div containers and tables on the page, so it isn't intended to be a browser.
Obviously you can keep a browser window open and refresh it as needed, so why does it even matter how design view renders?

I've never had that much trouble with Dreamweaver rendering html/css going back quite a few versions BUT I know quite a few people post about having trouble. Dreamweaver just doesnt manage ALL variations of css. And quite frankly some of the css I've seen, although perfectly valid, is overkill and I guess that's where Dreamweaver fails or is it the other way around.......I dunno.

A lot of pros only use notepad or some other software which doesn't visually render anything. I guess thats where the convoluted css evolves from because they don't require a visual editor prefering to use the browser, which probably isnt a bad idea because so many who use DW never check anything until its too late.

Guess you got to work out which is the best workflow for yourself.

I could certainly make the OPs design work in Dreamweaver with about an 8th of the css.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded