When I tell somebody, who knows a little bit more about computers, that I am in the web industry, the next thing they will ask me is if I know the program Dreamweaver and if I use it. So here’s the answer:
Yes, I know the program and No, I don’t use it.

Web professionals don’t use Dreamweaver or any other WYSIWYG editors.
The reason for this is that all these editors don’t work right yet.
They can’t read CSS properly, even the one which they have created and they usually create the same rules twice, redefining the first one, so that this makes the website not function properly.
Also, they create quirks mode websites.  Search google for “website quirk mode”  to see what that means.

Scenario:
I created a W3C valid, good mark-up/CSS static website for a friend of mine. My friend doesn’t know XHTML or CSS, so I told them, not to change anything and to tell me if they need changes.
Yes, but a friend of my friend, told them that there was a very good program called dreamweaver, which would let them change the website themself.
So my friend opened a page of the website in this probram, selected the links, and clicked the `Unumbered list` dots button.

After this, they phone me and told me `I noticed that the spaces between the lines of links look different in IE7, Firefox, Chrome and IE8`. The first thing I said was `No way! That is impossible`, because I was confident with my work. I told them that the website was tested and that there was no such thing. And they told me their secret about Dreamweaver. So I had to fix the mess.

Have a look at these pictures:

So let’s have a look at the code… (click on read more)

So let’s have a look at the code, which was the unnumbered list (as my friend said `the dots before the links`). The first thing to notice is all the non-breaking spacing before the title. This non-breaking space has different paddings/margins in all the different browsers, so the text will go on a different place. This was done by my friend, probably, so it’s now Dreamweaver’s fault (but only this one, wait till you see the rest!). Next ones are strong, and underline. This could be done with CSS, but it’s not a big deal (we don’t recommend usage of <u> and <b> tags but that doesn’t cause quirks so its ok). And in the end is a line breaker, created by Dreamweaver, as you notice it is <br> in XHTML, where is has to be self-closed – <br  /> and that’s the first error the validation cached.
On the next line Dreamweaver is starting the unordered list, without putting the actual <ul> tag, just going into the list items <li>s straight away.. Why do we need to tell the browse what kind of list is this? Firefox might assume it is an ordered (numbered) list and might put numbers (1, 2, 3, 4) instead of the dots, that my friend wanted. In XHTML you can’t just put <li>s whatever you like, it has to be in a list tag, but Dreamweaver doesn’t care.. So each of this <li>s caused an validation error. But look what’s inside the LIs, look at the links you have <a href=”URL” _blank> I’ve never seen something like this before, and I am not sure if this would even open the links in a new window in any browser. But Dreamweaver thinks that’s enough. Although this is an error which causes the website not to function correctly, the validation didn’t detect it. After the link we have strong. I don’t know why Dreamweaver has inserted this tag, when I had a font-weight CSS rule for all links in the document to be bold. After this we close the link, and we have another empty bold (strong) tag. I have no idea why? This doesn’t do absolutely anything (except adding more code and increasing the bandwich)..
After this the <li> is closed, that’s allright. But, after the li is my breaker <br />, I had made this, before my friend opened it Dreamweaver, so it was there before, Dreamweaver kept it, which caused the website to look bad in IE8, Chrome and Fireox, but it looked OK in IE7. Some browsers ignore the breaker in this place, others don’t. The right thing for the browser to do is not to ignore it, because, this is a breaker into the body (there’s no list or anything). The right thing for the web developer to do is to remove the breakers and add the list (<ul>) tags. The breakers were not detected as errors by the validation, but they are causing quirks.

And all this was caused just by one click on the ‘Unordered list’ button. Nothing else. Can you imagine that there are people that do websites, only with Dreamweaver? What I don’t like is people, calling them selfse web professionals,  who have no idea about xhtml/CSS and know only the * GREAT * program Dreamweaver, publishing crappy code on the web and charging money for that.
If you use Dreamweaver, you are not a web professional to me.

 

This entry was posted on Sunday, June 7th, 2009 at 20:18 and is filed under Uncategorized.