I’ve just been debugging display issues in the CSS in Knowlege Constructs FAQ-Tastic tonight. Firefox and Safari on Mac were a breeze to get right: just pull all the margins and padding off of ol.faq with a .nonumbers ol class that I’d already been using. It was especially easy to figure it out with the Web Developer’s Toolbar on Firefox.
Unfortunately a quick excursion over to the Darkside and Internet Explorer (the blinkers through which 92% of the visitors to our clients still see the web – among Folivision vistors Internet Explorer users are a minority), showed that the CSS code just wasn’t working. Indentation had gone totally astray.
In the absence of Web Developer’s Toolbar for Internet Explorer, there is no way to get instant Internet Explorer preview. The closest thing is to open up the file directly from the server and save it back to the server. Usually, I am set up with two monitors on my desk, a 20″ Samsung 205B for the Windows box and an HP LP3065 for the Mac work station. It’s just a matter of editing in CSSEdit or BBedit on the Mac, saving onto the server and pressing F5 on the PC keyboard.
We’ve installed a Linux machine now – the first of many – and I had to give up my 20″ Samsung 205B and plug the Windows box back into the HP LP3065. (Both monitors are highly recommended, btw.)
Pushing input and switching keyboards was not efficient (3 movements instead of one, along with a screenflash each time).
So I decided to take the plunge and go looking for a Windows XHTML/CSS editor which would allow me to open up files from the server. It was either that or move a monitor.
html kit screenshot
I’d had a quick run-in with HTML-Kit a couple of nights ago which I found via somed SEO research I was doing (htmlkit are doing some serious link selling) but had not been happy at all with the tool. It was ugly and clumsy. Nothing like being at home on BBedit (which while arguably drab, is not clumsy). The website was particularly stressful with it’s ugly and unreadable four column layout. Would you want to trust your html and CSS editor to people who can’t build a readable web page? Me neither. While version 292 is free, all future versions and advanced functionality are relatively expensive, with just part of the pro package costing $65. I don’t know if the guys at htmlkit have a drug habit they are supporting with their newfound commercial activities and advertising but something is seriously amiss.
So I decided to look more seriously this time. After reading quite a few reviews, I managed to find what is the finest development environment on Windows fairly easily – Aptana Studio. Our programmers here at Foliovision work in a cousin of Aptana called Eclipse and they love it. The website itself is gorgeous. I was sure I’d found my own Windows web development tool.
But when I downloaded Aptana Studio I was shocked to see 90MB come down the pipes. There is no way that I want a 90MB text editor. Not for my HTML and CSS editing. I still believe in lightweight software (speaking of which Open Office, it’s time to go on a diet – you’re looking too much like Microsoft’s own products).
UltraEdit had come recommended by a friend who is really into ugly but efficient Windows apps. UltraEdit may be efficient but I won’t be finding out as the program is so hideous that there was no way I wanted to even trial it. Weighing in at 10MB, UltraEdit did pass the efficiency scale. What particularly turned me off was the aggressive marketing selling tools which should be included in the editor itself (UltraCompare for file comparison) or of no particular use to someone looking for a text editor (UltraSentry, a Windows web history eraser). Why do I want to spend $139 to get a text editor?
ultraedit screenshot
EditPlus is even uglier than UltraEdit and nearly as expensive. In 2008, it should be a crime to write applications so hideous and charge money for them.
On the same website, where I had found my UltraEdit review, I found another freeware text editor reviewed: HateML. Apart from the silly name (comes from German pronunciation of HTML – ha -T-M-L), the feature list looked good.
- syntax highlighting for xhtml, css, php and javascript as well as some other languages I don’t care about: it’s much quicker to read coloured code
- automatic syntax checker: nothing like the coloured code for showing you typos before you even upload the file to the server – preemptive debugging
- code hinting, just like with CSSEdit. I actually don’t like code hinting much as I know the tags for the languages I use and find that it gets in the way most of the time
- built-in FTP client with server side editing (not upload and download)
There are some other nice features which mean nothing to me but would be very useful in the right hands, like PHP debugging, site management, website templates, MySQL managers. You won’t outgrow Hateml too quickly.
hateml screenshot – nice and simple
A quick visit to the website showed that Hateml’s programmer Michal Gajek cares about aesthetics and cares about code which validates. A good start.
michal gasek web standards
The application itself is a delight. I was able to use the big monitor to good advantage editing the CSS in one colourful window and with a quick click and press of F5 see a preview directly in Internet Explorer. The ftp upload is even faster than on my Mac. Strangely enough Hateml is written in Delphi. This is the first usable Delphi program that I remember using. I much prefer the Delphi look and feel at this point to a Java UI.
It might be that if I spent a lot more time on the Windows side, I’d want a full fledged environment like Aptana but for now, I’m delighted with Hateml and thoroughly recommend it as one of the unsung heroes of the web coding world.
It really appears that the main thing many commercial applications – UltraEdit I’m looking your way – have going for them is hype. If I’m Hateml is still doing service for me in three months, I will donate. I recommend to everyone to donate to their favorite freeware authors, after a three to six month trial. There are a few freeware programs which I have donated to three times over the course of years. Those donations leave us choices.
In case you still remember about the FAQ styling, here are your Toronto home buyer‘s questions.
Alec Kinnear
Alec has been helping businesses succeed online since 2000. Alec is an SEM expert with a background in advertising, as a former Head of Television for Grey Moscow and Senior Television Producer for Bates, Saatchi and Saatchi Russia.
Wow, I was looking for an editor – But I want something that I cane edit and then refresh the screen, like the Mozilla tools do. Further, because of the variety of issues (Like the Box Model Hack) I want to be able to edit the HTML as well…
To be able to edit and refresh the screen to see your changes, you can either do it on the live server(built in FTP tool) or on a local file.
In both cases, you have to keep the page that you are editing open in your web browser (Firefox, Explorer, Opera or whatever). When you’ve made changes to your code and pressed save, just press F5 and your web browser will reload the page.
For editing HTML, I actually prefer PSPad which is what I am using now instead of HateML despite the more lyrical name of the second.
PSPad is also Polish but is in more active development than HateML, with a huge user forum and many different language versions. A very nice tool.
Strangely after your comment was posted, I’ve been beset by porn spam. It looks like some backlinks will have to go.
I was interested to read your recommendation of HateML, and tried it with great excitement. But I was frustrated by several irritating limitations, like the FTP client only lets you select one file at a time for uploading, the tag creation dialogs are pretty basic, and I couldn’t find a preview button conveniently on the toolbar. So for now it’s back to PSPad, which if it doesn’t already do what you want, is pretty highly customizable.
I’m seriously considering switching to Linux, where Quanta Plus looks like a really good web development platform. I just need to break my dependency on various Windows tools and utilities I’ve either acquired or written.
Hello Julian,
In the end, I chose PSpad as my default Windows editor and am pretty happy with it.
I’d like to move away from Mac OS X to Linux, but like you I have a 12 year investment in software and know-how with Apple.
I’m currently experimenting with Portable Apps. so that I can have my whole workspace on a USB key. But I’d like my USB key to be cross platform, able to run on Windows, Linux and Mac OS X at the same time.
We’ll eventually move to Linux but it will take time. Perhaps I won’t be able to switch away from Mac OS X as I’m a legacy user, but my younger employees will be able to make the switch.
One solution we are also working on in terms of the appliations we write ourselves is writing all our own applications as web applications. We are also currently working on creating offline web applications (runs in a browser, but locally).
You criticized UltraEdit’s UI design pretty strongly in your post but are currently using PSPad to edit your documents. Looking at the screenshots, I don’t see how PSPad is all that more aesthetically beautiful than UltraEdit?
Hello Richard,
You’ve got a good point. All of these Windows programs are pretty tough to look at. Linux allows more customisation of the Windowing environment but the Linux crew isn’t really strong on aesthetics within applications.
Once you’ve gone Mac, it’s tough to go back.
In fairness, PSPad is about as minimalist as it gets in Windows. And PSPad doesn’t get in your way either.
Cordial regards, Alec
PS. If you have some better suggestions for llightweight attractive Windows web coding programs, I would be keen to hear them.
Sorry to plug our own product here (couldn’t resist) but you’ll probably want to take a peek at Stylizer:
website: skybound.ca/stylizer
It has all the things mentioned here (live preview in both IE & FF, Firebug-like diagnostics, etc)…and…it’s one of the prettiest Windows apps out there!
Hello Paul,
Thanks for stopping by. Always nice to see other Canadians doing cool things.
The program looks interesting but I really don’t like your double-dipping price model: stiff initial $50 fee plus $30 for a 1 year update cycle.
Even Microsoft and Adobe don’t pull stunts like that (you’ll get a year at least of updates for free from either of them). Even Apple has 1.5 years between OS X paid upgrades.
Not cool.
Microsoft & Adobe don’t put new features in their software every 2 weeks like we do…they generally just fix bugs.
Yes, but if I’ve paid once, I expect you to maintain and improve the product for the next year at least. I don’t expect a software developer to take my money and live in the Caribbean and let his/her application go obsolete.
Absolutely reprehensible. Some of the crooks in SEO software get away with this kind of software pricing model, but in web development applications you’re the first I’ve seen and I hope the last.
Honestly, Paul your pricing model is such a turn-off that I don’t even want to try your product.
I’m sure I’m not the only one who reacts this way.
Personally I won’t buy software which doesn’t come with at least a two year update policy unless it’s in a heavily discounted bundle. At that point, I’ll take my lumps after six months. But three months. Be serious.
You are not an Adopt-an-Ecuadorian-Orphan project which we should be subsidising every month. Sorry.
FYI, Internet Explorer has got a developer toolbar.
Also, you can get a mini version of Firebug for it too.
I would recommend Firefox for web development and keeping IE clean for just testing (i.e. as a client), but good to know.
I use free HTML/CSS/PHP Editor – Codelobster PHP Edition http://www.codelobster.com I would suggest it for everyone.
[Stas codes Code Lobster and this is a promotional post: does anyone have an impartial opinion on Code Lobster?]
I’ve recently started using NetBeans 7.x as my main IDE for web design and development. It is nothing short of awesome. Tooltips to reference your own functions, variables and classes, support for generating PHPDoc comments, refactoring your code, and SVN/Git integration have really cut my development time down. The FTP engine is blazing fast (if you’re used to Dreamweaver you’ll know the pain I am talking about), and it has a database manager built in. I spend way less time jumping around between apps and more time coding.
P.S. Did I mention it’s free? ;)