I’ve had a fair amount of feedback since my initial post which contained the news that MenuMachine is to become a Mac-only application. Windows users are unhappy with our decision which is perfectly understandable, whereas Mac users have been overwhelmingly positive with their reactions, which is great.
I thought I’d explain a little more about what the new version of MenuMachine will do and what technologies we’ll be implementing, since that’s what many of you have asked about. In this article I’ll call the new version MenuMachine 3, but as yet we haven’t decided on the final name.
When we first designed MenuMachine 2, one of the primary design goals was to make it as easy as possible for users to manage updates to the menus across the entire site. In order to do this, we implemented MenuMachine 2 to use a single menu definition, stored once for the whole site. This menu definition was then interpreted by the browser when a page containing a menu was loaded and the relative links were calculated to be correct for the current page. For the most part this works well — if the browser has JavaScript enabled. We looked at several ways to incorporate accessible content into the page as well as the JavaScript-generated links and eventually settled on a simple link to a menu map page, with the option to customise the code.
Many users really loved the simplicity of updating a web site’s menus that this technique provided, but it obviously was not ideal from an accessibility or SEO standpoint. Several things have changed in the web landscape in the last few years, and overwhelmingly the recommended way of creating navigation these days is to use a simple unordered list incorporating <ul> and <li> tags to form the menu structure, with the menu’s appearance created using CSS. This results in a very fast loading menu as the menu code does not have to be created on-the fly using JavaScript as the page loads.
MenuMachine 3 will use HTML list syntax styled with CSS for all the menu types it creates. If JavaScript is enabled, the menus will be enhanced but they will work even if JavaScript is disabled. This is the best outcome for accessibility and search engine optimisation. Obviously, it makes it a bit more tricky as far as site-wide updating goes as the code is hard-wired into each page that contains a menu, however if you use Dreamweaver this will be handled automatically thanks to some magic in our Dreamweaver plugin. For those who would still like the MenuMachine 2 site-wide updating behaviour, we will support this by using AJAX techniques to allow the menu to be injected into the page on the fly.
The other big advance in the last few years is with JavaScript frameworks. Basically, these are blocks of JavaScript code that are used as building blocks to make creating cross-platform JavaScript code faster and much more robust. There are several of these libraries available as open source and they are used by many, many developers. I spent a huge amount of time with MenuMachine 2 tracking down obscure bugs in various browsers to create a cross-browser JavaScript library to support the menus. A large proportion of our support issues, especially in the early days of MenuMachine 2, were all related to problems in the browser support code, largely due to its complexity and the vast array of browser differences and bugs. These days, MenuMachine 2 code is very stable in a wide range of browsers (thanks to a lot of hard slog) but now that people are using some of the more complex JavaScript frameworks in their sites we are having a few compatibility issues that we could not have anticipated.
What we’ve decided with MenuMachine 3 is to use one of these standard open-source frameworks ourselves. This means that you can be assured that the foundation code for your menus will have been battle tested by thousands of developers and will work in a wide variety of browsers. The library we are basing the MenuMachine 3 browser code on is a modified version of jQuery. We are using a customised, stripped-back version of this library that allows us to reduce the footprint for MenuMachine 3 so that it is significantly smaller than the MenuMachine 2 support library while also being faster and more stable. One of the great advantages of jQuery is that it does not conflict with other JavaScript code in the page, including other complex frameworks like prototype, dojo or mootools. Those of you that have had problems using MenuMachine with Lightbox and similar effects will greatly benefit from this.
Most importantly, switching to a robust open-source base for our browser code will free up the time that we would otherwise be spending debugging obscure cross-browser issues so that we can spend more time adding exciting functionality to MenuMachine. We have already been able to expand the number of menu types that can be created with MenuMachine 3 by using this framework and thanks to the plug-in nature of MenuMachine 3, we can easily add new menu types in future.
From the user’s point of view, all of this will be essentially invisible. MenuMachine will handle all the code creation and link management behind the scenes so you can just get on with creating beautiful, functional navigation systems for your web sites, secure in the knowledge that the code will be fast and compatible with a wide variety of browsers.
Update: Check out this link which discusses JavaScript frameworks and basically reinforces our decision to use one.