UBB.Developers Forums Announcements Announcements U-Zine Reviews December 2001: Software Reviews: EditPlus, TopStyle Pro

Today, I’ll be reviewing two must-have web design tools that should be at the top of any developer’s Christmas list. These two apps will help you streamline development, work faster, and produce valid code. And best of all, they aren’t very expensive, which is always a plus to people on a budget. Without any further ado, here are my reviews of EditPlus and TopStyle Pro. But first, I’ll go over my review criterion by which the programs will be judged.

The programs will be scored out of five basic review categories, which are, in no particular order: ease of use, features, usefulness, value, and customization ability. A number ranging from one to ten will be given in each category, and then the numbers will be averaged to produce an overall score. So, let’s get on with the review of EditPlus!

EditPlus is marketed as and intended to be only an advanced plain-text editor. It is not a visual HTML editor, nor is it said to be. This is why I was happy to see that the program stays within its realm and doesn’t go beyond text editing. What it does, it does well. My favorite feature of this program is the way it handles multiple files open at the same time. There’s a little bar at the bottom of the screen that has a tab for every open file. If the file has been edited, the icon on the tab is red. If the file hasn’t been edited, the icon is blue. This way, you can see at a glance whether you have edited an open file or not.

The tabbed file list is especially helpful for hacking up your UBB files. You can keep the instructions for the hack at the beginning of the list, and then open all the files you’ll need to edit for that particular hack. After you edit each file, the icon changes to red, so you can easily see how many and which files are left to edit. Very snazzy.

EditPlus also has many standard features that you’d come to expect from a top-notch text editor. You can customize the font and font size of the editor window, change the syntax for editing files, turn on syntax highlighting, change the line break formatting, record keystroke macros, and use an extensive find-replace feature. The find-replace is really great for applying hacks to UBB files because you can input some text to search for, then input what it should be replaced with. You can also choose to keep the operation case sensitive, search for whole words only, search for regexes only, search one or all open files, and more.

For the avid webmaster, EditPlus also includes a built-in FTP function. Now mind you, it’s no WS_FTP or anything, but this barebones client gets the job done and it’s free with the program, so you can’t really complain. This program is so good, in fact, that I can’t even think of a single thing to complain about. It’s everything you’ll ever need in a text editor, with features that’ll keep you coming back for more.

Pros: great text editing for any kind of plain-text file
Cons: it’s not free

Ease of use: 9
Features: 10
Usefulness: 10
Value: 7
Customization ability: 8

The next program I’ll be reviewing is TopStyle Pro. If you’re into current web technology, you’ve certainly heard of Cascading Style Sheets by now. CSS is a method for defining the appearance of the pages while keeping it separate from the markup. The only problem with CSS is that it uses a totally new syntax and totally new commands, which are both different from HTML. Be confused by CSS no more; TopStyle Pro is here to the rescue!

On the surface, TopStyle looks like just another text editor, but it’s really not. You’ll first notice the editor window, which is right in the middle of the screen in the default layout. Note how I said the default layout. You can switch on-the-fly between the default layout, the beginner layout, the compact layout, and the minimal layout. Moreover, you can save custom layouts that you make, and switch to those at any time. A nifty feature, that’s for sure.

To the right of the screen is what TopStyle calls the “style inspector”. You can choose a style definition (CSS Level 1, 2, Internet Explorer 4, 5, 6, Netscape 4, 6, Opera, etc.) from the pulldown menu, and then insert attributes into the editor based on that definition. For instance, if I pick CSS Level 2, I can see all the attributes for that definition. Then I can click on “background-color” and enter a value of “#ffffff”, which gets sent to the class that I’m currently working on. With this feature, you don’t have to memorize any CSS commands, because the program lays them all out in front of you.

To the far left of the screen, there are two different tabs, the “selectors” tab and the “palette editor” tab. The selectors tab contains a list of all the Elements, Classes, and IDs currently in use in the active file. You can click on one of the class names to be brought straight to that class in the editor. This tab also serves as a sort of outline for the whole sheet. The other tab is the palette editor, which displays all the colors being used in the current sheet. You can see at a glance which colors are being used, and for what element, class or ID they’re being used on. You can also lighten or darken all colors, convert them to browser-safe colors, or even convert them to grayscale colors.

At the very bottom of the screen, and spanning 100% of the window is the preview/style checker/search area. The preview window gives you a live, real-time preview of the current sheet, and can be applied to a blank HTML document, or one that you specify. The next option in this area is the style checker button, which will display results of the validation when it’s done. When you run the built-in style checker, you can find errors in your sheet, and they will appear here. The last button in this area is the search button, which displays results of the last search that you ran, along with line numbers for where the item was found.

For this reasons and more, I use TopStyle as my one and only style sheet editor. It contains a built-in code checker, an integrated preview window, all the CSS attributes available, customizable layouts, syntax highlighting, a code formatter (pretty-looking code), and a full-featured color mixer. However, I don’t like the trendy Microsoft Office styled menus or the fact that there’s no offline W3C validator. The numerous excellent features far outweigh these nuisances, though, which is why this program has earned a spot on my hard drive.

Pros: all CSS attributes listed, built-in preview, good code validation
Cons: trendy menus, no offline W3C validator

Ease of use: 8
Features: 8
Usefulness: 9
Value: 7
Customization ability: 10

Screenshots!
Click on the small thumbnail images to see a larger version.

EditPlus









TopStyle Pro