Do most web 'programmers' (not designers) use WYSIWYG editors or hand code their HTML?

Question

When I started programming web pages, it became immediately obvious that the WYSIWYG editors sucked. The HTML output was difficult to maintain, did things in ways you may not have agreed with, completely messed up existing pages if opened, couldn't handle code in the page, and was polluted with dead or irrelevant code like <font ...></font>.

At that time, I didn't know a single programmer with more than 6 months experience who didn't hand code their HTML. Even now, most of the developers I know hand code their HTML.

But, I also realize this was a decade ago, WYSIWYG editors have improved, and I may be seriously underproductive hand coding my HTML.

Do you, as a web programmer, use WYSIWYG editors for your HTML?

PS-I'm kind of thinking we can just vote either YES or NO, and put comments below.

Answer 1

WYSIWYG-I almost always or always use a WYSIWYG editor

Answer 2

HAND CODE – I never use a WYSIWYG editor.

Answer 3

Hand code.

Frankly I look down on developers that don't.

The reason is that I've never met someone who uses a WYSIWYG editor that has a firm understanding of web semantics and how to use XHTML/CSS properly. Sure a lot of you are going to say "I use Dreamweaver but I could reproduce the same with Notepad" but the fact of the matter is that these are the types of people that just slap images and spacer.gif images into a table to create a layout and don't understand why that's not the best way to do things. These are the types of people who think doing things properly are a waste of time and as long as it looks decent on the browser they're using (which coincidentally is most likely to be MSIE) they'll move on and say I'm wasting my time making sure my tags are used correctly in the semantic sense and using browsershots.org to ensure it looks close enough to what I want on ALL browsers.

Answer 4

I'm writing an editor. :)

Incidentally, I wonder whether http://www.w3.org/Amaya/ is a good editor ... maybe it is, and doesn't have the problems you mentioned in the OP.

Answer 5

You can (if you want) whip up a layout with a WYSIWYG editor, but after that, its HAND CODING all the way.

Answer 6

Hand code is the only real method for me...

Answer 7

I hand code.

I went through a brief period of using a WYSIWYG editor... but when it comes down to it the amount of overhead that it requires for the few benefits you can get can all be replaced with a solid text editor that supports saved code snippets and syntax coloring. Don't let people lie to you and say WYSIWYG's speed up development - because if you are using the right editor, it's not a problem.

Answer 8

I hard-code all my HTML cause using a WYSIWYG writer is near about impossible for writing pretty CSS... For example take the auto-styling feature in VS 2008. If you've got a table and you drag your mouse by mistake, it will automatically create a style for you like - Style1 and add it to your browser's stylesheet.

This sort of behavior is very pesky, and that's exactly what a good programmer wants to avoid, cause it's NOT at all helpful.

So I hard-code my page, and then preview it in the designer (or the browser).

But I like using WYSIWYG editors for the quick preview (loading in the browser takes more time).

Answer 9

Yeah, hand code it here too. About the only time I use the editor in visual studio is when I can't remember a tag name... just drag it onto the pane, go back into code view and cut/paste it where I really wanted it.

Answer 10

I use C-x M-c M-butterfly.

Not really (but I would). I use hand-coded HTML (plus HtmlHelper extension methods in ASP.NET MVC). Sometimes in ASP.NET WebForms I will use the VS designer for things like data sources and setting up bound controls, but that's really about all I find useful in it.

Answer 11

Hand code, absolutely. I hate editors.

Answer 12

Hand code. It's not that I'm snobbish about it; I excitedly try every new graphical/WYSIWYG web-development tool/IDE I can get my hands on because I would love to someday find a tool that helps me be more productive. But after a few weeks of fighting against the latest and greatest editors, I always come back to hand coding with Notepad++ or jEdit.

Answer 13

NO

Programmers who value control over simplicity, programmers that do a lot of CSS, programmers that have experienced too many wastes of time debugging code that was generated FOR them... when they could have written it themselves and saved time in the long run.

I have experienced, that many novice ASP.NET programmers using the WebForms style framework are more likely to use a WYSIWYG editor... because it is handed to them, and they're used to making WinForms apps. As they develop their skills they will likely move on to the handwritten code. That is if they ever want to get any better at what they do.

I'm not certain there has ever been a scientific inquiry as to what the ratio is. Those who prefer the WYSIWYG as opposed to those who don't. Sadly I cannot answer that portion of your question.

Answer 14

Hand code with some sort of preview mechanism. I use TextMate for the most part so preview in [browser of choice] is just a hot-key away.

Answer 15

Hand code with notepad++ and preview via browsing.

I feel i have more control this way without having to worry about some IDE sneak meta data into my html. Plus i have that ease at mind knowing that i code this baby myself.

Answer 16

Handcode. The primary reason is at the end of the day, with a wysiwyg, I find myself ending up with many more more undesired effect.

Answer 17

I don't see why any web programmer would use a wysiwyg editor, especially if there's going to be code embedded in the HTML. It just seems more efficient to me to code while HTMLing.

Notepad++ and (W|L)AMP for me.

Answer 18

Hand code, but whenever possible, not from scratch. I try to find something that is similar, then "transform" it into what I want.

Answer 19

If you're just doing plain HTML pages, it might make sense to use a WYSIWYG editor. But when I tried them back in the 90s' just just became frustrating because it wouldn't do "what I wanted". They might be better these days, but since it's so easy for me to write HTML by hand quickly, I don't feel like I really even need to be more productive.

And of course if you're going to write code to generate HTML, or modify the DOM using javascript it would be pretty difficult to use a WYSIWYG editor for that.

Answer 20

I always hand code HTML/XHTML .. its really not a slow process once you get used to doing it. I don't use WYSIWYG because:

• Many toss in extra markup or clobber my indentation
• It takes me longer (in many cases) to figure out how to get the editor to do what I want it to do vs just writing it myself.
• I almost never use tables, or other tags which editors simplify

Even when writing programs, I use a VERY minimal editor that has agreeable syntax highlighting and a snippet library, that's all I enable. I really don't care for code completion / suggestion , etc .. especially on trees where I have 300 + open files in tabs.

Answer 21

• Web designers sometimes use WYSIWYG to get to high fidelity mock-ups quicker.
• WYSIWYG is also used by SMEs and functionality people to quickly communicate an idea visually.
• Good developers would never use, and will never use, WYSIWYG because all that a WYSIWYG can capture is a visual drawing of a web page. A web site needs to be well structured, from a mark-up perspective, in order to reduce the amount of work required to implement the near endless stream of visual changes called for in a successful web site. That good structure is not based on visual layout du jour. Rather, it is based on the structure of the data itself. Try to use CSS as much as possible to do the proper layout. That way, changes down the road will be easier because all you have to do is change the one CSS file instead of making similar changes to every web page. You'll never be able to accomplish that with WYSIWYG. See CSS Zen Garden for information on this.

Answer 22

I hand-code most of the time

See, the thing is, in web development, no single file ever holds the entire page, I use a template system and organize files so that there's a root template (holds stuff common to all pages), and other files extending by injecting various stuff in various blocks. So, a wysiwyg doesn't even make sense really.

I have to admit though, sometimes I use a wysiwyg as a reference, say, if I want to create a certain look and I'm not sure how to make it by myself, I create a draft in the wysiwyg (usually ExpressionWeb) and look at the generated code to take some ideas.

Answer 23

Hand coded. I sometimes use the output of a WYSIWYG editor that someone else (a graphic designer) has used. But I always clean up the result and make it as clean and compliant as possible (while still maintaining the formatting.)

Answer 24

Hand code, hands down ;)

Answer 25

If you are creating any web application or page that spans more then a couple HTML files, you will be way more productive by using a templating system (which one - is typically dependent on the programming language you use, or, if you are not really doing dynamic pages - whatever is available on the server).

The reason is that in order to achieve consistent look for your pages, you will have lots of repeating blocks of HTML (interspersed with code in dynamic pages). Partially this is solved by CSS, however, in any kind of dynamic pages you will need to include mixed HTML/code snippets in other pages. A templating system allows you to extract the repeating blocks in seperate files and insert them where needed, thus reducing need to re-edit tons of files, if you have to change something globally.

A typical example in PHP, which does not actually use any templating system, just the built-in PHP possibilities, is:

<html>
<? include('../templates/header.php'); ?>
<body>
my html and php mix goes here
</body>
<? include('../templates/footer.php'); ?>
</html>

The advantage is, obviously, that if you need to change something in the web page header in all your pages, you change that in just the header file.

I do not know any WYSIWYG editor that supports any templating system (not to speak of arbitrary templating systems) well enough to render the result accurately, especially if you wish to add programming language code.

Answer 26

Hand Code 110%.

Answer 27

Hand-code.

An WYSIWYG editor might come in handy though, when all I want to do is to create table layouts to be used in an environment where CSS support is unreliable, for example, email contents.

Answer 28

Hand Code.

Answer 29

Why not designers too? Designers don't just work in Photoshop and they're not code-illiterate. Your questions should be directed at designers as well, as I'm sure there are plenty of designers who will surf here given the overlap between design and development in web development.

Every good designer and developer that I have ever met hand codes all HTML, CSS, and usually JS as well barring use of libraries such as jQuery and MooTools. Still, even then they write all their own jQuery by hand as well.

Unless by some miracle the companies proliferating WYSIWYG editors decide to acknowledge what standard markup is and why it is important, stay away from such atrocities. Not only that, but they would need to spend the money to have their editors output standard abiding code in a way that is at least somewhat reliable.

Until that mystical, miracle day - WYSIWYG: Die in a fire.

Answer 30

I do both: WYSIWYG & hand coding for different reasons.

I often use a WYSIWYG for adding a lot of text to a website (so it adds p tags and deals with weird Word characters) or if I have an absolute positioned div for which I want to drag to position that div (and then I hand code the exact position).

Otherwise, I will usually hand code the actual HTML "template" of the site or any other tweaks needed.

But, I do use a WYSIWYG for the autocomplete--it makes writing the HTML faster and I don't have to search the internet all the time for the exact property. Depending on the WYSIWYG, it can also help find something in the mass of HTML that results: click on the image and it's highlighted in the HTML.

Answer 31

I would argue that creating static HTML files (the only thing that most WYSIWYG tools even claim to do) is "design" work, not "programming" work.

For actual "web programming" (i.e., writing software which receives input and uses it to produce HTML pages as output), templating systems are the only way to go. I create my templates by hand and would do so even if there were WYSIWYG tools out there which worked directly with the templating systems I use. On the rare occasion that I need to create a static page, I also do that by hand.

Answer 32

Keyboard coded... my screen gets all ugly when I try to code with my hands.

Answer 33

I am fond of Microsoft Expression Web.

Answer 34

Hand coding is the best option, because WYSWIG editors can too easily create extra unnecessary markup and cause failures in validation.

On the other hand some of the junior developers at my work use Dreamweaver's server behaviors to write PHP and ASP for them.

Answer 35

Hand code HTML & CSS, but inevitably use Firefox Web Developer toolbar to edit CSS with a real-time display.

Answer 36

Handcoding. Always superior - especially when you deal with CSS and Javascript.

Answer 37

For every task there is a tool... even if it isn't cool

Among freelancers (no corporate experience, here, alas), most nearly all markup and styling is done (surprise!) in text editors, but I know not a single freelancer who doesn't sport a copy of Dreamweaver or somesuch as well, and not just for working with existing sites.

Especially when it comes to creating large or complex tables (or dealing with sites coded in table layouts), counting tags to find that one cell is mind-numbing and slow. Occasionally it is also faster to drag-and-drop or copy-and-paste data from documents or pre-existing sites into a WYSIWYHYG to fiddle with, or build a table structure from scratch where you can see it as you go, and then snip the resulting HTML back into TextMate or vim or whatever.

Of course you'll do your CSS by hand, because cross-browser CSS is something people can barely do, much less teach computers to do, but sometimes the "WYSIWYG"s are just the right tool.

Answer 38

Hand-code, unless I only have a Notepad-like text editor available, but Dreamweaver is installed - which unfortunately is the case in a lot of schools :(.

Answer 39

Both serve a purpose, and I think it silly to commit one way or the other. You have to look at the task at hand and choose the best tool for the job. I do hand-code more than using a WYSIWYG ... but for putting together a prototype of mock-up ... you can't beat a WYSIWYG when you are pinched for time.

Answer 40

I tend to use a mixture of both. With ASP.NET I'll hand code much of the underlying structure of the page (Divs and such) and after that I'll fill in controls using the WYSIWYG and then go back into the source view and hand code over it to make sure it is exactly how I want it before finalizing.

Answer 41

I handcode. I use textmate. Its snippets help me to be very productive.

Answer 42

Handcode with Dreamweaver. Don't use the wysiwyg side of it.. Has a good auto-suggest that works as it should.. If I ever need to see it in design mode I can have a look.

Answer 43

A combination. I always structure the page by hand, but I use Visual Studio to move those absolutely positioned divs until the page looks good. You have to be very careful about what you do in a WYSIWYG editor, though, one false move and your page is a mess. Fortunately, VS is quite good at not modifying parts of the page that you didn't touch.

Answer 44

Well I'll admit it, I use Dreamweaver. To write the HTML I don't want to write. I don't use it for CSS though. Or any scripting language (DW's PHP is ancient). But page layouts, prototyping - mostly whatI use DW for. And until everyone stops using IE6, I still use tables too. So there. ;)

I've also written and sold extensions for DW. And they've sold VERY well. I suspect many use a WYSIWYG editor and don't want to admit it.

Answer 45

Can't speak for "most," but I and the other web devs in our shop hand code our logic (PHP, Django, etc.) As far as UI is concerned, we take a Photoshop mock-up and build up our CSS and HTML layout to match as close as possible.

So, NO.

Answer 46

Hand coding is the way to go. You'll learn a lot more by making mistakes and finding solutions than you will by pointing and clicking in a WSYWIG.

Answer 47

Almost all professionally-done HTML I've come across was clearly not done in a WYSIWYG. That's not to say that I am against WYSIWYGs. I guess you can make a nice page about your wife and your dog and your children with iWeb or so. And that is not evil.

I think the reason is that HTML encourages the separation of content and layout a lot. If you separate wisely, you are rewarded with small download sizes, beautiful HTML code, easy maintainability, ease of changing the layout, or mending it, and so forth. (Side note: This separation of content and layout works so much better in HTML than in LaTeX, for me.)

cheers,

niko

Answer 48

By hand.

WYSIWYG cannot show you what it looks like across a range of browsers, displays, hand-helds, etc. So don't give yourself a false sense of confidence by using a WYSIWYG tool.

Write HTML that validates, test it with as many browsers and devices you can get your hands on, use screenshots.org to supplement.

The proof is in the pudding and the only "WYS" that means anything at all is in the browser.

Answer 49

I do hand code, for me it is faster and clearer that WYSIWYG.

Answer 50

I can't use WYSIWYG. I get so excited when i'm coding, so i can't take that pleasure away.

Answer 51

Hand code, but I'm amazed that someone hasn't addressed this problem and made a tool that helps instead of hinders. Some smart person out there will do it someday.

Answer 52

A combination.

It´s impossible to use a WYSIWYG editor to design / develop a modern web-site, hand coding is the only way to go.

However, a program like dreamweaver is very useful to rapidly paste and format content, especially if that content has lots of accented characters or other kinds of characters that need to be translated to have a web-site that validates.

Not all web-sites are in plain English. I have even added pages in Japanese and that definitely would have taken me a very long time using just a text editor.

Every tool has its use, as long as you know how to use it well.

Answer 53

I use the VS 2008 split view feature so that I can visually see my horrible design ability come to life. I'll be honest, I may cheat and drop some items in from the toolbar to save some time, but manually editing gives you total control.

Answer 54

I hand code my HTML/CSS and so does every web developer/designer I know of.

Answer 55

Both. I hand code, and use the WYSIWYG for previews. Also use Firebug for other layout and weird CSS things. Using VS2008. It has its ups and downs, is slow, but at times can be powerful with all the built-in MS ASP.NET crap that goes with it, but... also limited with that built-in stuff too.

Answer 56

Hand Code.

Answer 57

I think you will find that both designers who are any good and all real developers hand code. Still, because dreamweaver has really good handle of html, it is one of the best editors for html. I don't think I switched to design view in years and mostly because it is not useful at all as it don't display details that are different between firefox and ie, and increasingly new browser like chrome and safari.

Answer 58

Hand code.

Answer 59

Hand-code for the most part, though the UI (Visual Studio) is handy for adding events to server controls; a double-click saves writing out the method signature and wiring it up..

Answer 60

I'd rather user a text editor and a browser anyday, rather than a WYSIWYG editor. Because you have more control, less pointless/depreciated mark-up and I like valid HTML/CSS! :D

Answer 61

I like auto-complete. My head is free to focus on the solution instead of dancing with syntax.

Answer 62

Hand code.

I learned HTML back in 1994 and have been hand coding all my coding since. I can't stand WYSIWYG editors. I've tried dreamweaver, but found that aside from the general layout of the page, if I want anything to display correctly, I would have to go over the automated codes myself and edit them to make sure the website displays the way I want them to look.

Answer 63

I think hand-coding is probably the most common answer. I don't really think using a WYSIWYG editor is helpful unless you're developing a Dreamweaver template for a client or trying to test something in a specific environment.

That being said, I still prefer to speed up my tasks by using at least some level of IDE, if not just a modified text editor. When I worked at a marketing firm, everyone used Panic! Coda, since everyone was on a mac laptop. Now doing internal web dev for a bigger firm, I spend about 90% of my time in VIM, and 10% in notepad++.

For freelance work I use Dreamweaver CS4, but I spend 99.9% of my time in code view, switching to design view to check on things as I go, but then doing all of my actual browser testing in-browser for every platform.

Answer 64

I don't feel any necessity of heavy and sometimes slow software to produce 'dirty' code. For that reason I do hand code.

Answer 65

Handcoding. If you looking for errors in your and you code it with an WYSIWYG editor ... then good luck

Answer 66

Hand-code in Zend, Dreamweaver, or Eclipse. Using Notepad is basically inefficient. It's so much more efficient to use an editor that color-codes for you. I like my CSS pink, my IF statements blue, and my globals green. Sue me :)

Answer 67

FireFox + FireBug. That's all I need. I get interactive CSS/HTML visualizations in a browser that I love to use.

Answer 68

Hand Code Forever. These days more so since I've started using Zen-Coding available in most of the recommended editors.