Entry

Dec01

Looking for the perfect (free) editor

Sometime in the summer, I can’t remember when exactly, I was able to convince my parrents that I needed the Macromedia MX 2004 Studio. The studio comes with a lot of software and is usually priced as such, but me still being a student I was able to snatch an educationaly copy for only $200. Up to this point, I had done most of my HTML editing in Homesite for the first 30 days of a windows installation and only after default to HTML Kit. I first got introduced to Homesite 5 years ago in high school and found it to be the best non wysiwyg html editor around and even better then what I had been using up to that point: Dreamweaver. Now that can’t be held to the same standards today as in 1999 and 2000 as Dreamweaver was mostly a wysiwyg editor that had absolutely no trouble messing up any code you wanted to add. So as you can see, I’ve gotten quite acostumed with Homesite. Being the poor college student that I was (and still am) I could never poney up the $50 for the educational version of Homesite so I was left to look for other alternatives everytime my 30 day trial was up.

on the sound waves: Get In Line by Barenaked Ladies - (3:39)

This lead me to find HTML Kit. I don’t have any major issues with HTML Kit, as if I did I probably wouldn’t have used it at all. However, having said that, I just never felt comfortable with the program. To be truthful, HTML Kit is probably more powerful in text and HTML code editing capabilities considering the many number of keyboard shortcuts the program has. It’s very easy to set up open tags and close tags, and it even lets you add blank tags for you to complete later all with just the keyboard. This is important to note because as I’ve found working with any type of code, be it C++, java or HTML, it’s always important to be able to navigage a long text file and edit it on the fly. I’ve found that the easiest and fastest way to do this is to keep your hands on the keyboard, trying to get the mouse to highlight text and then press a button somewhere really far in the screen just slows you down. Even if HTML Kit did have that powerful ability, I still had problems with it mostly because it was overly complex.

Complex programs are not always bad, OS’s are inherently complex but that doesn’t mean I don’t like linux because its so complex. But in HTML Kit this was its weak point, or actually the inability of it’s developers to properly simplify the program into a usable interface. Now this isn’t a fault found only in HTML Kit, many other HTML editors follow HTML Kit’s general GUI design: Homesite, Dreamweaver, Coffeecup HTML, Ace HTML 5, TSW Webcoder and the list goes on. The design of the modern HTML code editor includes 4 major objects:

  1. the tabbed toolbar that includes button shortcuts to adding code
  2. the left or right pane which always has tree directory of working folders but can include other useful information
  3. the bottom messages window which usually shows all different messages from validator output to ftp logs and search and replaces messages and is therefore tabbed
  4. the editor window, the view that shows the actual code you’re working on and hopefully does useful highlighting and tabbing

HTML Kit Window annotated

I find that most editors have problems implementing all four of these objects in a way that makes it effecient for the coder. You have to remember that keeping your hands on the keyboard is very important, and anything requires you to have your hand on the mouse is only making you lose your time. When any of these objects aren’t designed properly, I find myself spending too much time fiddeling with the widgets and window on screen that sometimes I forget about a little fix that I may want to implement but can’t seem to because I can’t find if the output from the validator.

Now HTML Kit, and most editors I’ve tried, fail me in the fourth object: the view. It’s rare for me to find an editor that firstly has a color shading that lets me work fast or that at least is easy to change.

Secondly, the view is sometimes finicky with tabs for preview or who knows what else all in easy access but the more important (in my opinion) view buttons that allow me to change document or close the document are the farthest away. I understand that preview is really important and that it’s actually quite easy to add ie preview to a program considering that HTMLView is given away in Visual C++, but I still like to preview my pages on a browser (mostly because I use absolute linking instead of relative linking and as such usually have apache running and two or three browsers pointing to http://localhost:8080) and never use the preview feature.

The third factor relating to the view is how every editor seems to think tabs are spaces or only show a tab as 2 spaces instead of 5. Considering how standard tabs are in coding programming languages, it’s the same in JCreator as it is in Visual Studio, I would have thought that this wouldn’t be a big deal in web editing, but it is. A lot of editors I have come upon take it upon themselves to mess up with your tabbing or use smart tabbing! I’m going to come out and say it: I HATE SMART TABS. They Fuck me up! Of course there’s also those programs that think a tab character should represent 2 spaces instead of 5 and then any new tab you add gets added as spaces instead of tabs! That drives me nuts because I’m left with a file that when opened in notepad, pico, nano or vi looks all wonky because the editor I was using thought it would be funny to mess with me and use spaces instead of tabs! Not to mention that using space characters instead of tabs only ends up making your file larger anyways! Seriously.

And while I know that this specific problem of tabs can be easily fixed in HTML Kit (the options dialog is very detailed) it brings up my biggest specific issue with HTML Kit. The "Options" dialog in HTML Kit, or actually "Preferences" is so filled with options that it’s very easy to get lost. At times I feel like I need the help of Virgil to get through it all. And no, the Edit button isn’t the best place to put the preferences option, in the Windows world the edit menu is by convention left for editing what’s in the View.

But what about the other three widgets? I’ve said I’m a big supporter of the keyboard only editing technique, and how I loved HTML Kits tag shortcuts for that reason. However, I’ve yet to find comparable shortcuts for other editors, mostly Homesite and Dreamweaver which is what I use at work. This is where the tabbed toolbars with all this shortcut buttons to adding tags arose from I imagine and to this extend I don’t have much beef with them, unless of course I feel like it’s trying to take over my editing experience and make it overly difficult for me to get to the specific tag I need/want. This usually only happens when there are so many tabs and each tab is filled with little over 15 symbols that getting to the right one just takes too much time! I find that I never have need of a shortcut to add no more than 15 tags and two tabs holding 8 buttons would suffice. There’s no need for the program to automatically add calendar javascript on my page, why is there a shortcut for that? When am I really going to need the <address> tag for example? Which is places next to <em> in the obscure tag section in HTML Kit. And yes, I could customize most editors exactly to what I want, but its something that would take at least half an hour if not more considering all the extras that get added in the GUI! Why can’t you put the code snippets or other more complicated things in a pane somewhere?

And panes is the only thing I usually don’t have problems with. There is one minor thing about panes that does bother me because I’ve gotten used to Visual Studio 2003 and Macromedia Studio MX 2004 is that the message/output window usually pushes up the pane instead of letting it take up the entire vertical space between the toolbars and the status bar. Thats not the only problem I find in the messages window, It’s either very hard to change the height of the window, as in HTML Kit, or it’s just way to easy as in TSW WebCoder both of which cause frustration. The only resolution there is is to close the damn thing, which will let you have a full pane, and have the validator or what not pop it into focus whenever its important. Though I do like the "pinning" of the windows in WebCoder even though it still needs some work - validation doesn’t pop the windows into focus when "unpinned".

That however, does not mean that Homesite or Dreamweaver are free of a share of problems in GUI design or lack of powerfull features, but like I said earlier up untill recently I found Homesite to be the best to balance all these issues. That is until I started working with Dreamweaver MX 2004. Dreamweaver MX 2004 addresses almost to the point all problems I’ve had with other HTML editors and it’s nice to know that it has a decent css editor too! The site management feature is actually easy to use and undersand because it’s implemented very intelligently: a couple of buttons on the local directory pane is all you need to upload or download from the remote server. Theres no need to change tabs in the pane to get to ftp tab and then upload the file. And like most of the MX Suite, it’s very easy to work with multiple documents, no need to go looking for the button or tab that has all the documents, or for that fact all the buttons that just apply to the one document, like close. I did say earlier that Dreamweaver was wysiwyg though, so what gives? Well, I think Macromedia did a good job in bringing all the good points from Homesite into Dreamweaver to make a great coders and visual friendly editor. Though I’m not exactly thrilled at the wysiwyg part of Dreamweaver as it depends heavily in tables to do anything.

The funny thing is working with Dreamweaver at work is what made this article. I just haven’t been able to use HTML Kit ever since and a couple of days ago I spent several hours looking for another free editor to use. But as I’ve said most editors - paid or free - I have issues with. In the end I’ve compromised with WebCoder, it doesn’t offer the great shortcuts of HTML Kit, but it’s GUI is a little simplistic and easier to use. And I do understand that every development studio has different budgets and can only do so much to ensure a great user experience, even the one person studio is capable of getting user feedback. It’s understandable that I could be the only strange person that has this weird problems with modern GUI design. But there have been many more important people then me claim that there is a problem with GUI design among many different developers. If I’m not mistaken, in Software Engineering they teach you that first step before even typing a single line of code is to listen to the end user and see what they need!

In the mean time I’ll just keep using WebCoder until I can for up another $100 for the educational version of Dreamweaver MX

December 1, 2004 10:00 AM HTML and CSS

Comments

Leave a comment of your own

If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.

Use of HTML for comments is not available.

In an effort to combat spam, you will be able to post your comment after you preview.





Powered by Movable Type 3.2 Creative Commons License: Some Rights Reserved © 2000-2005

Site feeds. Hofully valid XHTML and CSS. No kitties were harmed in the making of this website.