pixel nine design
  • Home
  • Weblog
  • About Us
  • Our Work
  • Contact Us
  • Archive for October, 2006

    TopStyle Pro, the Winnebago of CSS editors

    CSS is the new black.

    Actually, it is the new #000. Unless you have been under a web design boulder for the last few years, you should have noticed that slicing and dicing images and cramming everything into a table is quickly emerging as the predominant skill set among underemployed web designers.

    Tables are becoming a thing of the past. CSS is quickly becoming the standard for both typographical and layout control in websites. As browsers support more and more CSS properties, designers are more and more inclined to use CSS to its fullest intent. Why are they making the switch to CSS? Sites designed with CSS are generally more accessible, more flexible, and more usable than their table-based counterparts.

    But this isn’t about the virtues of Cascading Style Sheets. It is about making the switch with as little headache as possible. Obtaining a ticket for the CSS bandwagon comes at a price. Designing a website without tables, or even using CSS for text effects or typographical control can often be a daunting task. First there is actually learning the syntax for CSS. Then, there is predicting how your CSS will behave in various browsers. Not to mention breaking all of the bad habits developed while using tables for layout and design.

    Enter TopStyle

    TopStyle is to CSS what Dreamweaver is to html. TopStyle is a fully-featured CSS editor developed by Nick Bradbury. Sound familiar? He should. He developed a very famous HTML editor known as HomeSite. There are two versions of TopStyle, a free ‘lite’ version and a pro version with many perks for advanced CSS design.

    TopStyle Lite is a free download with no equal. It has all of the standard features found in the CSS editors built into other programs–code hints, color-coding, style inspectors, etc. In addition to these features, TopStyle Lite adds a live preview of the entire style sheet, tight integration with Dreamweaver, and alphabetized class lists. One great feature is the ability to choose harmonious and complimentary colors from TopStyle’s ingenious Color Picker dialog box. As you choose colors for properties in your CSS, TopStyle auto-magically suggests harmonious and complimentary colors that would work with your current color selection. All of this, and much more, for the low price of nothing.

    TopStyle Pro

    TopStyle Pro, available for $79.95, is the Winnebago of CSS editors. It seems to have every conceivable option ever needed in a CSS editor. It even has a deep-freezer. In addition to all of the features found in the grossly under-priced TopStyle Lite, TopStyle Pro includes built in W3C validators, a Bobby checker, and a browser checker that displays browser support for any given CSS property. TopStyle Pro also includes a handy Selector Wizard that is extremely helpful for complex CSS. (I.e. contextual, child, sibling, and other advanced selectors). As if that wasn’t enough, one can find CSS tutorials and a powerful CSS Color Palette editor.

    In fact, with all of the features included with TopStyle Pro, one can easily get lost. Fortunately, all of the panels and toolbars are customizable to fit the needs of any particular designer. So whether you are new to CSS and trying to get a grip on all of it’s intricacies, or a CSS veteran looking for an easier way to push those intricacies to the limit, TopStyle Lite and TopStyle Pro are definitely a must have in your designers toolbox.

    TopStyle is available at http://www.bradsoft.com/topstyle/

    Icon see you, too.

    Designing for websites nearly always involves the use of icons in the user interface. They can be used for bullets, navigation, buttons, online tests, status indicators, feedback prompts, the list goes on. Rather than including my own feelings about icons (do I actually have feelings about icons?) I am providing a few links to what others are saying about them.

    You can also take a look at my bookmarks for icons. What about you? Do you have any icon links to share?