What's the point of WYSIWYG editors?

Once you know HTML

[Acekicker]

I am just getting into webmastering and am in the process of learning the basics of this incredibly complex field. I started by getting Dreamweaver but quickly scraped it when I found out my student version was useless for making commercial web sites. I did play around with it a little before giving up on it. I then got a book on html and have worked through the basics. It seems that manually coding a page is a lot easier than using dreamweaver. I only tinkered a little with dreamweaver but it seemed twice as hard to accomplish what I wanted than manual coding. So my question is what is the point of WYSIWYG editors? Am I missing something? Would it be worth my time to learn one or once I learn HTML well, is that all I need?

[vincevincevince]

Some people do not wish to learn HTML and others do not like typing. Artisic types sometimes find it difficult to translate a mental picture into HTML.

I agree with you that WYSIWYG editors are not generally appropriate for professional web-designers, but they are usefully used at an intermediate level where they enable designers to quickly generate something that looks pretty on a budget.

Personally I hand code everything to recreate designs a designer has drafted and sent me as a flat image file.

[BeeDeeDubbleU]

It seems that manually coding a page is a lot easier than using dreamweaver.

Perhaps you weren't using it correctly. I use DW for everything and I can turn professional sites out in jig time.

[vincevincevince]

turn professional sites out

Perhaps Acekicker has a different idea of what a professional site is. Dreamweaver and other WYSIWYG editors have a lot to be desired from a code basis, and I get particularly infuriated by having to remove formatting from their pages.

As an example - if you select all the links in a menu block and change their style, the WYSIWYG editor inserts formatting code into each and every link, as opposed to modifying the CSS class which defines their style.

Another example - enter a table and resize a column with the mouse. You now have width settings in every single cell of the column.

One more example - type some text and type a carriage return. Your first line has now been put into a <p> level block and you are now in a new <p> level block. <p> level blocks are for paragraphs of text, and only text in paragraphs should have them applied. <p> level blocks are certainly not appropriate for links in menus, for example.

A final example - insert an image - go and see all the extras that have been added in the HTML. You asked for an image - not width, height, alt, title, border etc. Same goes for tables, in particular.

[Marcia]

>>if you select all the links in a menu block and change their style, the WYSIWYG editor inserts formatting code into each and every link, as opposed to modifying the CSS class which defines their style.<<

When I change the style in a menu block I simply go into the View HTML in DW and change the class manually. Using DW can be a combination of the speed of using WYSIWYG and the control of using straight HTML where needed.

>>what is the point of WYSIWYG editors?

Speed. First I learned HTML from scratch and used it for quite a while before getting DW. If I had to take all the time needed to do everything with hand coding, I'd have to go back to accounting work.

[BeeDeeDubbleU]

Perhaps Acekicker has a different idea of what a professional site is.

... and I am sure we all have different ideas on this. I prefer to define it as meeting or exceeding my clients requirements as described in my quotation and they have all been happy with that so far ;)

Marcia is correct and you can very quickly switch from design to code view or indeed view both at once so any perceived HTML problems can be easily rectified.

[sonjay]

Speed, exactly. Some things are just plain faster in Dreamweaver:

Perhaps I have a run of copy consisting of paragraphs of text, some headings and sub-headings, and maybe a list or two -- which are all styled in my css via inheritance selectors. Just paste it all into the page in design view, and DW drops in all the opening and closing p tags. Select each of the headings and click DW's drop-down menu to make them h1, h2, etc. Then select the 4 contiguous paragraphs that are supposed to be an unordered list and click the ul button. Then select the 5 contiguous paragraphs that are supposed to be an ordered list, and click the ol button. And that part's done. Total time: a couple of minutes at most.

Or say I'm using a table to display tabular data -- In DW, "Insert table", fill in the number of rows and columns, and my table code is all there ready for me to drop in the data. Total time: a few seconds, and no risk that I'm forgetting one of the closing td tags or some such.

To use such a WYSIWYG efficiently and effectively, you need to have enough experience with it to know how to make it do what you want without mucking up your code, and you need to know when it'll speed things up. There are many things I do by hand in my text editor, but I have better ways to spend my time than manually inserting a bunch of p tags, hx tags, and ul,li tags.

There's a huge difference between relying on a WYSIWYG to create your site for you, and using it as one tool in your arsenal when it can help you be more productive.

[tbear]

A final example - insert an image - go and see all the extras that have been added in the HTML. You asked for an image - not width, height, alt, title, border etc. Same goes for tables, in particular.

I hand write my pages, and I include all the above.
Why?
width - height: I hate the text jumping around while the pages load
alt (- title): good practice if you want to validate
border: alright, I've been too lazy to add this to my css, so far.....

But otherwise I tend to agree with you...

[piskie]

If you use DW in full idiots mode most of the above are true.
If however you take the trouble to learn how to use it, most of these problems don't exist.

For example Enter = New Paragraph <p></p>
Shift + Enter = <br>

Etc etc.

[rfontaine]

Don't bother learning with a wysiwyg editor. It is not rocket science, and once you learn how to code by hand it is like riding a man's bicycle compared to using a little kids bike with training wheels.

Of course, people who cannot code by hand will disagree.

[alce]

Acekicker,

It is totally worth learning how to use Dreamweaver efficiently...but in code view.
I hand code all my sites using mostly DW and every now and then I fire up bbEdit.

If you are serious about becoming a webmaster or professional web designer forget about WYSIWYG editors and master HTML and CSS.

My advice: continue using DW in code view only. You can still take advantage of the many features it offers without ever touching design view. Some of the features I find really helpfull:

Code hinting
Ftp
Code coloring
Auto closing tags
Reference window
File window (The ability to switch back and forth between all sites you might be working at any given time.)
Assets window (you can have all your external media organized such as swf files, images, video and color palettes)

DW 8 introduced a tabbed editing window with a very handy menu.

Aditionally, once you get more advanced you might want to start learning Javascript, XML or some scripting language such as PHP. Dreamweaver offers support for these languages too.

[BeeDeeDubbleU]

I built my first site, using Dreamweaver, for my own business (not web design) almost five years ago. Although it was a mess code wise it looked OK. I was soon asked if I could build another site for someone else, which I did. From this came another then another. I started to learn a bit more about Web Design and created another Web Site offering Web Design as a service. Throughout this period I used DW and only paid lip service to HTML.

I found that I was quite successful at SEO so I started attracting a lot of work to the extent that I now have to sub contract much of this. All bar one of my clients have given me testimonials. They are very pleased with what they get, which is increased business in almost all cases. That is professional web design. It has nothing to do with HTML or DW. It is about giving your clients what you promised them so just use what you think is the easiest.

[SonjaD]

I do generally code by hand, but every so often a small site needs to be build in 2 hours time for bosses aunt, mother, butcher and those are very straightforward and simple.

In those cases I'm definately better off using DW then writing all those tags myself. But the more complicated the design becomes, the more time it takes in DW compared to hand coding.

[vincevincevince]

One thing to remember is that as soon as you start writing database-driven and dynamic sites the effectiveness of WYSIWYG editors becomes greatly diminished.

i.e. A simple function to show today's date:

<?php
print date("d-m-Y");
?>

No WYSIWYG editor would show you today's date on screen and let you adjust the style and placement, still having it retain the underlying PHP code. I guess my point is - not every HTML page is made of an HTML page - many are made of lots of little bits of HTML stuck together automatically.

[sonjay]

Actually, Dreamweaver will do exactly that, if you configure a testing server in your site definition.

I almost always code in a good coding editor rather than in Dreamweaver, but when I fire up Dreamweaver and view my page in design view, I can see the display just as if it were on the live server.

[youfoundjake]

I learned to code before using visual page and then moving up to dreamweaver. I like the wysiwyg editors because it allows me to do a bunch of tasks alot faster then typing it in. Imagine a simple table of 5 rows and coloumns with data in it.
I do however stress that learning the language is beneficial and between the both, some really great sites are made. Not everything can be done with a wysiwgy editor, but if anything is to get done in a timely matter, using one helps.
It would almost seem as if anyone that loves the pure coding, would probably prefer assembly language as oppossed to some OOP language like c++.
but ehh, to each their own.