tools - Broken Links Archive

As part of .Net magazine’s Responsive Week, I’ve updated an article by Denise Jacobs to now bring you 50 fantastic tools for responsive web design.

Today Adobe released a preview of their new WYSIWYG website creator, Muse. Shortly after, I had a good old moan about it on Twitter. Not, as you may think, because I feel threatened by website creation being made easy — it’s been easy for ages, but ‘easy’ doesn’t always mean ‘good’ — but because it gets a few fundamental things badly wrong.

My code purist side rejected it because the markup it outputs is horrendous; if you don’t believe me, take a look at the code for one of their example sites, ‘Lucid Synergy’. My educator side rejected it because it teaches you nothing about how a web page is made; I learned to code by using Microsoft FrontPage many (many) years ago, and understood HTML by editing the source of the document and tweaking it until I got it the way I wanted — but Muse has no code view, so this is made very difficult.

But the real problem with Adobe Muse is deeper than that: it’s that all semantic sense is completely removed from the page. There are no headings, no lists, all text is in p elements, inline styles are applied with span rather than em/i/b, etc; this gives no structure, no meaning, no aboutness to your page, which at the very least means penalties for SEO.

And worse still is that there’s no document flow; all the elements you add to the page are positioned relatively to their parent and follow no particular order, which is pretty bad for search engine spiders (and hence your SEO), but absolutely terrible for visitors using assistive technology.

It’s the product of a company that cares only about appearance, and nothing for content. As @paulrobertlloyd said on Twitter:

It’s not that the code Adobe Muse generates is ugly, it’s that it’s meaningless.

The issue with the lack of semantic elements is not insurmountable, it just needs some work by Adobe before the final release. The lack of document flow and content order is more serious, however, and will need a complete rethink; I hope that this happens.

Mozilla recently launched a very early version of Bespin, their online IDE (Sitepoint have a nice overview). It’s hard to make too much of it at this early stage, although it is impressively fast and responsive; time will tell if that continues to be the case as new features are added.

This responsiveness seems to come from the front end being created using JavaScript (only 62kb compressed, apparently) and the HTML5 canvas element (update: more on that implementation). Seeing other examples of what its capable of, I really need to start learning more about canvas.

One of the hardest things about Microformats is explaining their benefits to people. You can say “It’s a standardised format of marking-up content, which is both human and machine readable!” until you’re blue in the face, but until you can show people a practical benefit they usually remain unmoved.

Luckily there are a few tools out there which will help you show off the benefits of using Microformats, and involve little work from you.

Read the full article