HTML5 has garnered plenty of attention in the last two years, and for good reasons. The internet as we know it is changing, and HTML5 is at the forefront of those changes. If you are eager to jump into the HTML5 mix, you will be interested in the tools we have found for creating websites and web apps using HTML5.
At the moment, there are two flavors of HTML5 editors to be found: standalone applications and browser-based editors. There are advantages and disadvantages for each. Standalone apps are OS-dependent, that is, some are created for Windows, others for Mac, only one is for both. Browser-based apps, on the other hand, work on any OS, with almost any current browser, as well as other devices such as the iPad. Standalone apps work with or without an internet connection. Browser-based apps are typically only available if you are online (more on that later). Whether one is better than the other depends on the specifics of a given developer, their needs, requirements, OS, etc.
With that, let's move on to the HTML5 tools.
Aloha Editorhttp://www.aloha-editor.org/ The Aloha Editor is a browser-based rich text editor framework that was created in JavaScript. Unlike most other HTML editors, Aloha can actually be embedding within a CMS, blog or other standard web development frameworks.
Functioning in a similar fashion as that of a textarea, pretty much any DOM (document object model) element can be edited--a developer just has to embed the code within their online document. When you highlight any text, a floating menu appears next to the area you are editing, allowing you to change the font size, face, insert tables and more according to the content being edited.
The one thing that Aloha is short on is basic tutorials or documentation. An API reference is provided, as is a forum and several different types of samples, but no "how to add Aloha to your blog" tutorials are present (if they are present, they aren't obvious to this developer).
Dreamweaver CS5http://www.adobe.com/products/dreamweaver.html Adobe Dreamweaver CS5 is well known in the industry, and its initial reputation as a code mangler has improved drastically over the last few years. The most recent release, Dreamweaver CS5, came along with announcement from Adobe that Dreamweaver CS5 now supports HTML5. We've covered the Creative Suite of products for many years on HTMLGoodies, most recently in an overview article that discusses the various CS5 product suites and subscription plans, a review of Dreamweaver itself, and a tutorial on how to create CSS Menus using CSS Tab Designer along with Dreamweaver.
Dreamweaver is a full-featured editor, providing WYSIWYG functionality, a multiscreen preview panel, integration with jQuery Mobile and Adobe BrowserLab, along with support for native Android and iOS apps (when using PhoneGap), CSS3 and of course HTML5. Dreamweaver is not a cheap product, but if you are a professional web developer, it can be a useful and versatile tool in your toolbox--well worth the purchase price.
Maqettahttp://maqetta.org/ Maqetta is another browser-based HTML5 editor--but don't fall for the false perception that "browser-based" means inadequate. Maqetta, as well as other browser-based tools, are becoming more capable, more useful and easier-to-use on multiple devices and browsers. Most such tools are also free (and open source, since they are largely written in HTML and JavaScript), so you're getting much more than you're paying for.
Maqetta is a full-featured WYSIWYG editor. Developers can create a web page, initially drawing it out, dragging-and-dropping elements onto the page, editing the page using a design mode or source code view. A wireframing feature enables designers of user interfaces to "draw" a UI before they even get to coding it. A theme editor allows the customization of the style of many different types of widgets, and it includes full support for CSS styling. If you haven't tried Maqetta, it's worth spending some time playing around with it to see its potential.
MacFluxhttp://www.macwareinc.com/products/MacFlux/overview.html MacFlux is a commercial software product for the Mac, obviously, that retails for $99. It includes free website templates, and supports HTML5 (and HTML4), PHP, Ruby, JSP and other text-based languages.
The company that sells MacFlux, MacWare Inc, considers it to be a "creative design environment rather than a template based solution" and from the screen shots on their site, it looks like it has a simple interface that pretty much anyone could use to create a website. Since they don't offer a trial download, I will have to take them at their word. Any Mac users who have used the software, please feel free to comment below.
BlueGriffonhttp://www.bluegriffon.org/ BlueGriffon is a strange editor, in that yes, it's another browser-based editor, but no, you don't have to be online to access and use it. Based on the Firefox browser's Gecko rendering engine, you can actually download and install BlueGriffon on your computer. There are binaries available for Mac, Windows XP/7, Ubuntu and Fedora, and its available in 9 languages.
Like some of the others we have discussed, BlueGriffon is a WYSIWYG editor with support for HTML4 and HTML5, as well as XHTML. For users who want to experiment with features of HTML5, it enables developers to directly embed HTML5 audio and video elements into a web page.
It has some additional functionality that other editors don't have, such as the ability to extract a frame from a video file so it can be used as the "poster" for the video when you embed the video on a web page. That feature takes one click to accomplish. HTML5 forms are fully supported, with dialogs for every form element defined in the HTML5 specification.
All of the HTML5 elements--including header, footer, aside, etc.--are also included in an easy-to-use dropdown menu, allowing a developer to insert them in a document with a click of the mouse. BlueGriffon is a top notch editor--it's got my vote as my favorite of those mentioned in this article
0 comments, (560 reads) All Articles by, GentleGiant
