2013 年最初の記事にと考えていたトピックでしたが、前掲の毎日新聞の記事に対するコメントを書いてしまったので、今年二番目のトピックになってしまいました。通常であれば、年末年始休暇のようなまとまった休みには、日常の業務から離れて、違う分野を対象にしたプログラミングに没頭することがささやかな愉しみになっています。この休みは、もっと JavaFX を使いこなせるようになろうと意気込んでいたのですが、業務でプログラミングのニーズが発生し、しかも現時点で部内で自分しか対応できる者がいないので、やむなく仕事を休暇中に持ち込むことにしました。
実業務の細かいことはさておき、この休暇中に解決しようとしたことは
- HTML/CSS/JavaScript を用いたタブ付きのフォームを作る目処をつけること
- 導入中のシステムで使用する HTML フォームで、実務上、タブによるレイアウトは必須なのだが、どんなタブでもそのシステムで使える、というわけではない。
- フォームを PDF に出力する際は、タブを"ばらす"必要がある(これは CSS で対応する)。
- 汎用の API やリファレンスは提供されておらず、メーカーから提供されている複雑なサンプルから機能を抽出して使う必要がある。
- 間にはいった某商社のエンジニアリングでは力量不足で予定納期に間に合わないので、自力で解決する必要がある。
- フリーで高機能な Web 開発環境を探すこと
- Linux と Windows の環境で同じように動作することが必要条件(単に自分の都合です)。
- 願わくば、自部門のスタッフに使ってもらえるようなもの。
1. のタブ付きのフォームについては、12 月末に、期待通りに当該システム上で動作するサンプルが、インターネットで公開されているものに見つかりましたので、(
MIT のライセンス条項に従って)全面的にこれを利用することにしました。
さて 2. ですが、これは難題です。
上記、某商社担当の一人、U氏は、フォームなんて
Dreamweaver を使ってちゃちゃっと作ってしまえばいいんじゃないですか、と簡単に言ってくれますが、彼は問題の本質をまるで理解していないのです。
自部門のミッションは、会社の品質に関わるシステムをグローバルで統括することにあるので、我がスタッフは、たとえ文書管理ができても、Web デザインに関する知識やセンスは残念ながら持ち合わせていないのです。
もちろん、最近は業務の様々な場面で Web の知識が求められてきているので、HTML を使えるように学習してもらってはいますが、何も開発環境が揃っていない中でいきなり JavaScript と CSS にどっぷり浸かった HTML フォームを(たとえ作成できなくとも)維持・管理しろというのは無理な話です。仮に高価な Dreamweaver を何ライセンスか購入したとしても、自由に使えるようになるにはどれだけ時間がかかることか…。以前、
Illustrator を購入した時に懲りています。今回は、1月末までにそこそこ使えるフォームを完成させたいのです。
さて、前置きが長くなりました。現状、スタッフには(UTF-8 のエンコードを必要とするため)
サクラエディタによる HTML の編集を強いて、いや、推奨していましたが、さすがにもう少しユーザーフレンドリーな開発環境がないかといくつか試した結果、
BlueGriffon と
Aptana Studio 3 が残りました。BlueGriffon の WYSIWYG,
What You See Is What You Get(見たままが得られる)タイプの編集機能は(初学者を対象とする場合には)魅力でしたが、残念なことにターゲットとしていたサンプルのタブ表示がされないことがあって使うことを諦めました。それに x86_64 向けの rpm パッケージが公開されていませんでしたので、Fedora のメイン PC(64bit) 上で使う気になれませんでした。
他のやり方で記述した JavaScript によるタブは表示できたのですが…、なかなか万能とはいきません。
というわけで、
Eclipse と同じ環境といえる Aptana Studio 3(スタンドアロン版)のバイナリをダウンロードして、この休暇中は使っていました。使用 OS は、Fedora 17 の x86 および x86_64 版です。今でこそ、Java の開発環境をオラクル社の
NetBeans IDE に変えてしまいましたが、C/C++ のプログラミングは Eclipse を使っていましたので、同じプラットフォームである Aptana Studio 3 には違和感が全然ありません。
HTML, CSS および JavaScript の初学者にやさしい環境とは決して言えませんが、構造化されたドキュメントというものを意識できるようになり、少なくともテキストエディタ上でタグを探し回るようなことはなくなると期待したいものです。マイクロソフト社の
Visual Studio あたりで開発(プログラミング)をした経験があれば良いのですが、これも無い物ねだりです。頻繁に使うことで慣れてもらうことにします。ちなみに Windows 上でのインストール方法は下記を参考にさせていただきました。
Windows XP 上にインストールした例を以下に示しました。メニューを日本語化するのはひと手間ですが、我がスタッフの場合、これだけでも親近感の大きさがずいぶん違ってくるのです。
最初に作成しようとしているフォームは、製造工程などの変更管理に使うもので(
RFC と似ています)、なんてことのない作りですので、作りかけのものを示しました(IE8 での表示例)。
以上、ブログでは好きなように書いていますが、これは結果だから言えることです。
自分のホームページでは、タブによるデザインを導入しようとは全く考えておらず知見を持っていなかったので、今回、タブについていろいろ調べました。当初は CSS だけでタブを実現したかったのですが、IE8 では期待通りに表示されなかったり、上述の、導入しようとしているシステムでタブと認識されなかったりで、JavaScript を使うアプローチに変更しました。と言っても、普段積極的には使わない JavaScript ですから、なにやらよくわかりません。年末年始の休暇に入ってから、少し大きな書店へ行ってあれこれ物色しました。下記の書籍が解りやすかったので購入しました。タブを構成する仕組みは、この本で大変よく理解できました。まさにタブに取り組むにはぴったりの本でした。残念ながら当書で紹介されていたタブの作り方は、構造的に採用できませんでしたが…。
明日は仕事始め。今年の仕事の成否はこのフォームで決まる!?