I Hate WYSIWYG Interfaces

I've voiced my discontent with them before, especially Blogger's post editor, but while editing posts recently a number of issues have come to light that I need to bitch about.

WYSIWYG interfaces never seem to leave user-written markup alone.  They have their own idea of how it should look, and enforce this every step of the way.  Unfortunately, they always result in adding stuff that shouldn't be there, and generally cause a headache multiple times per use.

For instance, in Blogger's post editor, most of the time when I press Enter the cursor doesn't move to the right place.  If I hit Backspace and then Enter again, it fixes itself.  This is somehow linked to its next behavior.

Blogger's post editor likes to put a space at the end of every line.  Whether you need it or not.  Which is stupid because you never need it.  It even puts them inside markup, such as lists.

When making lists, you can't use the toolbar buttons to further indent the selected list items to a new level, or unindent them one level.  If you want to have a list with sub-lists, you have to manually insert the tags yourself in the HTML view.

Also with sub-lists, it likes to add extraneous line break tags before and after the surrounding list tag.  Sometimes if you toggle back and forth between Edit HTML and Compose it will keep doing this and you'll end up with several line breaks before and after the list.

The jump breaks, while awesome, have a mind of their own.  They don't want to be put at the end of a line.  They insist on being at the beginning of a line, and the editor will add a line break tag and a carriage return before it in this case.  Which results in extra line breaks.

Inserting images is very cumbersome.  The Blogger in Draft post editor fixes this somewhat, but it still requires two HTML edits for every image I add to a post.  The first edit replaces the attributes it puts on the surrounding div tag with align="center".  The second one replaces the attributes it puts on the a tag with target="_blank".  If I want to give the image a title attribute, that's a third edit.  Now, a lot of users aren't going to care much about this, but it makes things for me difficult since I like to be in control of things instead of letting other things run my life.

First up: the surrounding div tag, in most cases, isn't needed.  It's only used (with a redundant clear: both; style even (block elements have clear: both; implied) to force text and other images onto a new line below the image.  That's fine, but what if I'm posting, say, a wallpaper update or a beta OS review and want multiple images per line, or want them formatted into a table with image captions?

Second up: it adds a non-standard attribute (imageanchor="1", which is doubly non-standard since attributes whose mere presence means something should be attributename="attributename") and some annoying padding around the image, which believe it or not is redundant with the theme CSS.  I have the theme CSS padding (and border) neutered, but inline style="" attributes override that.  It also sets the cursor to the regular pointer to confuse the user into thinking the image isn't a link.  Why?

Third up: no option for target="_blank" or a title attribute on the image?  Come the fuck on.  At least have the fucking option.

Like I said, most users aren't going to have a problem with the way it works, but at the very least give us a template that's editable in our blog settings with some variables for everything (full image URL, image thumbnail URL, and so forth) so advanced users can get the exact functionality we want out of it without having to painstakingly edit its own generated code on every image we insert into a post.

While you're doing that, add the ability to specify target="_blank" for any link.  You already have that little bar that pops up when the cursor is in a link, just add it to that.  Either that, or add an option to automatically make all external links have target="_blank", which is precisely what I use it for.  I can't use the base tag in my template to set the target, I've already tried, it says it's an illegal tag.  Fuck you.

Next is not a gripe but rather a couple of feature requests.

First: the new template designer is nice, but it's missing one thing.  Namely, the ability to use template variables in the custom CSS you add.  Furthermore, there should be a way to create custom template variables.  Since using Edit HTML automatically makes your template not receive updates, I can't just toss the variable (page width) I want to add in there.

Second: in my custom CSS, I have several styles that I use in posts on a regular basis.  I would very much like the ability to make a toolbar button to allow me to apply these styles to selected text within my post.  I can already kind of do this with Greasemonkey, but I shouldn't have to.

The only WYSIWYG interface I've ever liked is a freeware HTML editor by the name of 1st Page 2000.  It maintains an extremely high level of usability on all levels without fucking with the HTML you've written.

Also, the new Preview feature is *ahem* FUCKING AWESOME, but there are a couple of issues I've noticed.  The clickblocking element should be positioned with position: fixed; rather than position: absolute; and the diagonal Preview text should be beneath it instead of above it.