CSS Sculptor v.1.1 and CSS Menu Writer v.1.0

I’ve just blogged over at View from the Potting Shed about CSS Sculptor v.1.1 and CSS Menu Writer v.1.0 a couple of commercial Dreamweaver 8 and CS3 extensions (both US $99.99) from WebAssist.

Eric Meyer’s CSS Sculptor v.1.1 is an upgrade of the original version, which now allows creation of a horizontal navigation DIV when creating cross-browser compatible site layouts.

CSS Menu Writer is a new product that magically creates 100% CSS menus, both horizontal and vertical, and integrates perfectly with CSS Sculptor.

Check out the review.

Google Analytics Reporting suite on Adobe AIR

The Google Analytics Reporting suite is an Adobe AIR application that brings Google Analytics to the desktop. It uses it’s own custom API to interact with Google and nearly implements all features of Analytics.

AIR required

It obviously requires the Adobe AIR framework to be installed first, but I’ve found it to be a great tool … even if it is still in beta and has a few, erm … undocumented features.

Undocumented feature

The main thing I’ve spotted so far is that when opening the application you’re invited to “Select a profile to continue”, only none are presented until you click “Manage profiles” and then hit the “Back” button.

It’s a minor niggle, there is a workaround and I’m sure they’ll fix it in due course (now that it’s been reported).

Faster

As far as using it, I’ve found it to be significantly faster and more responsive than using Google Analytics via a browser, which has to be a good thing.

It’s certainly worth checking out.

Pixel ruler for Visio 2003 … and everything else

Visio

Oddly, Microsoft Visio 2003 doesn’t support pixel measurements, which for me is about as annoying as Microsoft Publisher not supporting colours specified in hex.

Information architect Gene Smith has developed his own simple pixel ruler for Visio.

Everything else

So, for Visio there’s Gene Smith. For everything else I recommend Cool Ruler by FabSoft.

WriteMaps site map application

Also spotted on Boagworld.com: WriteMaps Site Map Application.

From the intro blurb:

WriteMaps is a free web-based tool that allows you to create, edit, and share sitemaps online. As a WriteMaps user, you and your team will be able to build and access your sitemaps from anywhere, without having to rely on proprietary desktop apps and static files. To get started, take the tour or sign-up for an account!

I usually use mind mapping software, such as Mindjet MindManager, but I’m quite interested in checking this out.

Information architects of the world unite!

Version control and bug tracking

File Hamster

A Web 2.0 hamster and owner (photo from stock.xchng)

For the last couple of months I’ve been using a couple of free tools for personal version control and bug tracking issues.

While there may be bigger, better products out there, such as CVS or SubVersion (version control) and Trac, FogBugz or Bugzilla (bug tracking) sometimes you just want something quick, that works with as little fuss or setup as possible; something for the small projects, something that doesn’t take half a day to configure and link into a database server.

FileHamster

FileHamster is a freeware personal revision control system from MOGware (for Windows). The software provides real-time back-up of your files while you work on them.

The software allows you to monitor a particular folder (or hierarchy of folders) and you can specify whether to monitor all files or only files or a particular type. It then gets on an creates automatic, incremental backups of those files each time you save.

You can also store notes about the changes that have been made, allowing you to quickly locate a specific revision or provide a detailed account of the work you’ve done on a project.

Bug Pad

Bug Pad from Software Productions is a free (Windows) bug and issue tracker. While you can use it with an SQL server I run it from a flat file on the network. Most areas of the software are customizable including:

  • Project folders
  • Issue types (e.g. bug, missing file, comment, typo, IA, etc.)
  • Status (e.g. Open, In Progress, Waiting for, Closed , Reopened)
  • Assigned to (e.g. Developer, Web Team, etc.)
  • Severity (e.g. High, Medium, Low, 1, 2, 3, etc.)

Search folders can be created so that users can track tasks assigned to them, or all bugs of a particular type. It will also manage workflow, rules and synchronization conflicts (for those working with more users).

Eric Meyer’s CSS Sculptor

Eric Meyer’s CSS Sculptor

This is my latest favourite ‘toy’ that I’m playing with just now. Eric Meyer’s CSS Sculptor is a Dreamweaver Extension (for DW8 or DW CS3) from WebAssist developed in collaboration with the CSS guru himself. It’s not cheap, though: normal price is US $149.99, although I got it on special offer via .net magazine for US $104.99.

This extension allows you to quickly create a standards-compliant, CSS-based layout in minutes, rather than hours, in six simple steps:

  1. Choose one of the 30 built-in layouts (e.g. 1 Column, Fixed, Centered; 2 Column Elastic, Left Sidebar; 3 Column Fixed, Header and Footer, etc.)
  2. Customize widths and heights, margins and padding
  3. Set basic typography (text, h-tags and links)
  4. Style each div with background colours and/or images
  5. Define which layout components to show or hide in a print style sheet
  6. Once you’ve decided on a Doctype and whether to include the CSS in a separate file or within the document head click Finish to allow the extension build the code — it will build with or without explanatory comments, which are really useful for understanding what it’s done and why

Output code supports Internet Explorer 5.5 – 7.x, Firefox 2.x, Safari 2, Opera 9; earlier versions of Netscape and Firefox are notably absent from this list but all code that I’ve created with this extension so far have worked fine in Netscape 7.2 and Firefox 1.x.

Obviously, this isn’t a replacement for knowing CSS inside out — everyone does, right? 😉 — but it’s a great tool to add to the arsenal, and a great way to learn CSS, or simply to knock up a CSS-based design very quickly.

Develop custom web applications with PHPMaker

PHPMaker overview

This is not some random advertisement for yet another piece of softare with which to clutter your desktop, but a genuinely useful tool for those involved in developing web database applications.  No, I am not on commission!

I thought that I would share what PHPMaker is and how you might find it worthwhile as I know that until I found it I kept “reinventing the wheel”.  The number one rule in web development is “never reinvent the wheel”; someone else has usually done it before/better/bigger.  So why not use the resources that already exist?  Anyway, enough rambling.

The problem

Postgraduate course information is stored in a database and displayed dynamically on a web page using PHP.  Users can subscribe to courses.  Course organisers can manage the course information and bookings via a web interface.  The interface must allow different user permissions.  Do this by yesterday.

The solution

I could have either started crafting the code by hand using PHP to create the View/Add/Edit/Delete functionality etc.  From experience, I knew that this could take months of coding and bug fixing.  Using the rule “never reinvent the wheel” I trawled Google for software that would automatically generate the code for me.

To cut a long story short, I settled on PHPMaker.  The PHPMaker website gives a full demonstration of how the software works, including an online demo.

In summary, the steps involved are as follows:

Step 1: Setup your MySQL database and table structure.  This can be easily managed using phpMyAdmin.

Step 2: Download and install PHPMaker on your PC.

Step 3: Setup the connection to the database via PHPMaker.

Step 4: Once you are connected database you can then configure the way it will manage the fields in the tables.   Any subsequent changes to the tables structure via phpMyAdmin can be synchronised with PHPMaker.

Step 5: If you have designed your tables to control user permissions you can use PHPMaker to manage user accounts and to create a login page.

Step 6: Decide how you want to final web application interface to appear.

Step 7: Generate the PHP code and upload it to your server.

Step 8: Enjoy!

The software uses an intuitive point-and-click interface so you can experiment with changes to the settings and create the code very quickly.

PHPMaker currently costs US $99.95.  Money well spent considering the amount of time you save.

Example

The University of St Andrews GRADskills website displays courses for Postgraduate students.  The backend is managed using an interface developed by PHPMaker.

Example of the GRADskills management interface