Webオーサリングツールを使ってみよう：特別編

業務で使える！ 無料Webサイト作成ツール集

セカンドファクトリー　新谷剛史
2007/7/6

今回紹介する“8つ”の無料Webサイト作成ツール Eclipseプラグインタイプも用意されている ― Aptana ｜日本発のVectorベストオンラインソフト ― ez-HTML ｜Firefoxプラグインでリアルタイム編集 ― Firebug ｜CSSの確認もできるFirefoxプラグイン ― View formatted source｜IEプラグイン ― Internet Explorer Developer Toolbar｜Web上でかんたんサイト構築 ― Google Page Creator｜シンプルでベーシック ― StyleNote｜Windows環境でCSSコーディング ― CSSVista

上記ツールの詳細や、ほかのさまざまな無料Webサイト作成ツールについて知りたい読者は本稿に併せて、連載「どこまでできる？ 無料ツールでWebサイト作成」もぜひご参照ください。

　Webサイト開発はテキストエディタだけで行えるのか？

■ 今後もWebサイト開発にHTMLコーディングは必要なのか？

　

　Web標準にのっとった制作、CSSによるレイアウト、Ajaxなど、HTMLとCSS、JavaScriptなどで実現可能なことは意外と多いものだ。その中でも、特にAjaxはこれまでシステム開発をしてきたプログラマが得意とする部分だろうし、世の中のデザイナーには、デザインだけではなくこれからはHTML制作に進もうと考えている人もいることだろう。

　こういったことから、たとえ世の中がリッチなコンテンツ、Web 2.0、CMSという方向に進んでいったとしても、HTMLベースのWebサイト構築というものは、尽きることがない興味であり続けるだろうと筆者は考えている。

　また、HTML＋CSSやJavaScriptなどはWebブラウザとテキストエディタさえあれば、開発をスタートさせることも不可能ではなく、Web制作の初歩として取り組むのにも最適だといえる。

■ Webブラウザ＋テキストエディタだけでは現実的ではない

　多少なりともシステム開発やHTMLなどの制作を業務レベルで行った人であれば、Webブラウザ＋テキストエディタという構成での構築があまり現実的ではないことが理解できるだろう。業務レベルでの開発には、正確さと速さが求められ、その部分をサポートするツールが必要となるからだ。そのためのツールがWebオーサリングツール（Webサイト作成ツール）と呼ばれる開発環境である。

■ しかし、有償のWebオーサリングツールを購入するには抵抗がある

　一般的にWebオーサリングツールといえば、例えば、AdobeのDreamweaverやGoLive、MicrosoftのExpression Webなどの有償のものを指すことが多い。もちろん、これらの製品はコーディングという業務を素早くできるなど、そのメリットは計り知れないものであるが、金額の多少はあれども製品を購入することにより、そのメリットを享受している。そのため、「まずはHTMLやCSSに触れてみよう」という段階のうちは、製品の購入には少なからず抵抗感があるのではないか。

画面1　Dreamweaver CS3の使用例（画像をクリックすると拡大します）

　そこで本稿で紹介するのが、「無償の」Webオーサリングツールである。有償のものと比較すると、見劣りする部分も少なからずある。しかし、テキストエディタで開発を行うのとでは、開発速度に格段の差が出ることは間違いない。本稿では、そんな無償のWebオーサリングツールにスポットを当ててみることにしよう。

　Eclipseプラグインタイプも用意されている ― Aptana

　AptanaはEclipseベースのオーサリングツールだ。そのため、単体インストール版とEclipseへのプラグイン版の2タイプが存在する。インストールの際にJava環境の同時インストールが必要なので、環境構築という点では若干手間が掛かるが、デベロッパーのユーザーが多いEclipseベースのため、開発環境としての完成度が高いことが特徴だ。

画面2　Aptanaの使用例（画像をクリックすると拡大します）

■ HTML初心者にも優しい

　基本的なコード編集機能やプレビュー機能が用意されるほか、初心者への分かりやすさが配慮されており、キー操作がまとめられたキーアシストメニューが用意されるなど、初めてHTMLに取り組む方にも優しいところは非常に好感が持てる。

　Java環境下でアプリケーションを動かすため、マシンスペックに余裕のある状況が望ましい点が惜しまれるが、すでにEclipseでのコーディングを経験しているプログラマなどにとっては、なじみやすいオーサリング環境といえるだろう。

■ iPhoneやAdobe AIRの開発もサポート

　また、このAptanaには、iPhoneやAdobe AIRの開発をサポートするプラグインも存在する。

画面3　MacOSX版Aptanaの使用例（中央の初期画面にはiPhoneやAdobe AIRのプラグインの説明が見える）（画像をクリックすると拡大します）

　Adobe AIRについて知らない読者のために説明すると、Adobe発の新しいリッチクライアントソリューションで、以前はコードネームのApolloで知られていて現在注目を浴びている。これはなぜかというと、Adobe AIRはこれまでに多くあったようなWebブラウザのプラグインではないため、Webブラウザ制約を超えるソリューションとして注目を浴びているのだ。また、Adobe AIRはFlex Builder、Dreamweaver、Flashなどでも開発できるなど、開発環境も充実しているのが、特徴的だ。

　 日本発のVectorベストオンラインソフト ― ez-HTML

　筆者は日本発のフリーHTMLエディタとしてもっとも有名なのは、このez-HTMLではないかと考えている。過去にVectorでベストオンラインソフトに選ばれるなど、ユーザーの評価も高い。

画面4　ez-HTMLの仕様例（画像をクリックすると拡大します）

■ HTML Lintやヘルプ的なサイトとの連携が特徴的

　一番の特徴は、「各種フリーウェア／サイト」との連携であろう。例えば、最近発売されたDreamweaver CS3などでも、関連製品との連携が強化された部分として挙げられているほど、開発の効率化に重要なのが、さまざまな機能との連携である。

　ez-HTMLでは、機能的な面もさることながら、ヘルプ的なサイトとの連携、HTML Lintによる文法チェックなど、サイト構築の際に必要となる部分が広くサポートされていることが、特徴的だ。

■ DreamweaverやExpression Webより優れている点も

　DreamweaverやExpression Webなどの製品と比較しても優れている部分として、システム開発をサポートする「Perl／CGI編集機能」がある。「ActivePerl」や「AnHTTPd」などとの連携により、ローカル上でCGIの確認が可能なのだ。

　Expression Webには、ASP.NETの確認が可能な開発サーバが含まれていたり、AdobeもColdFusion開発サーバを用意するなど、各社ともシステム開発のサポートは重要なファクターの1つとなっているが、Webという視点で見た場合に、開発者の多いCGIがサポートされている点は積極的に選択するポイントの1つになるだろう。

1/3

INDEX
Webオーサリングツールを使ってみよう：特別編 業務で使える！ 無料Webサイト作成ツール集
	Page1 Webサイト開発はテキストエディタだけで行えるのか？ Eclipseプラグインタイプも用意されている ― Aptana 日本発のVectorベストオンラインソフト ― ez-HTML
	Page2 Firefoxプラグインでリアルタイム編集 ― Firebug CSSの確認もできるFirefoxプラグイン ― View formatted source IEプラグイン ― Internet Explorer Developer Toolbar
	Page3 Web上でかんたんサイト構築 ― Google Page Creator シンプルでベーシック ― StyleNote Windows環境でCSSコーディング ― CSSVista ほかにも無料Webサイト作成ツールはいっぱい

リッチクライアント＆帳票 全記事一覧へ

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）