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’s Bespin is a code editor built using web technologies. It’s still in its infancy, but shows promise. A new release, Bespin Embedded, lets you use the basic editor functionality on your own websites, using just a couple of lines of Javascript. If you don’t want to download it yourself, I’ve got a working demo. The editor doesn’t really do much at the moment, so this is really only a proof of concept.
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.
Following on from my previous post, I thought I’d explore in a little more detail how I like to optimise my Textpattern installation when starting a new site. While TXP has a pretty good setup out of the box, there are a few more steps I like to take to really make it zing.
Bear in mind that I’ve only really noticed the power of TXP in the last year or so, and there may be a heap of other plugins that I’m unaware of; listed below are just my favourites that I’ve discovered so far.
Textpattern have announced the release of version 4.07. In case you don’t know Textpattern, it’s a lightweight and easy to use CMS with a nice XML-like template tagging system. The major new feature is a new tag parser, allowing for a lot more flexibility in site development. However, the admin interface still uses the fiddly design from previous versions, so I strongly recommend you install the restyled interface mod as soon as possible.
The ongoing documentation of Mark Boulton Design’s redesign of the Drupal website is providing some great insight into the process; Leisa Reichelt’s latest post, on the community wireframing project, is a prime example. Now — whether by happy serendipity or a desire to compete — WordPress have begun to do likewise.
For no particular reason other than idle curiosity, I made a demo of a broken neon sign, using CSS Animations (you’ll need Firefox 5, Safari or Chrome to see it). It doesn’t degrade well at the moment, the root cause of which is down to what I think is a bug in Firefox’s implementation — I’ll need to confirm that.
One quick learning from making this: it would be really useful to have CSS Mixins when using a lot of repetitive keyframes, as I do in this animation. The W3C seem to be quite against them, however.
[#] 3 Comments