読者です 読者をやめる 読者になる 読者になる

ぼちぼち書くブログ

日記とかうまいもんとかパソコンのことをマイペースで記します。高知市に住んでいるので地元の情報も投稿します。

Microsoft Expression Webが使える~HPB(ホームページビルダー)なんかより断然いいね

ツール PC-ソフトウェア PC-Windows PC

今更だけどWeb公開スペース(サーバー)の都合でCMSを設置出来なくて、50MB程度の領域でコーポレートサイトを公開する要件をつきつけられている。既に存在するWebページはHome Page Builder 6.5で作られている。コンテンツもかなり絞られているけれど、明らかに不要と思えるものを置いていたりしているので削除するなり、他のクラウドストレージに置いて容量を節約する。

Markdown記法等も検討したが、自分一人で運用管理していける訳では無いので、汎用的なHTML+CSSで静的ページの構造しか無いだろうと判断した。しかしそこで短絡的に現在のサイトを作ったエディタHPBの最新版を使うというのはNOだと考えた。なぜならソースの可読性が非常に悪いので完全にエディタに頼る事が想像出来る。つまりゴミタグがどんどん肥大して現在の状態に戻ってしまうことが容易に想像出来る。

そこで、シンプルなHTML+CSSコーディングが可能なHTMLエディタは無いものかと検証した。幾つか試した中で最も感触が良かったのがMicrosoft Expression Webである。以前はパッケージソフトであったが現在は開発が終了してしまい無償で配布されている。つまり無料で利用できる。

  1. HTML+CSSエディタとして、IntelliSenseによるタグ補完が便利すぎる
  2. アドイン追加でHTML5、CSS3に対応させられる
  3. ダイナミックWebテンプレート機能がある
  4. サイトコンテンツ管理やFTP転送機能も組み込まれている
  5. 要するにDreamWeaverの様な使い方が理想に近い

Microsoft Expression WebにHTML5対応用のアドオンを追加したものを使用する事にした。

HTML5 Schema Configuration Add-In for Expression Web - Virtuoso - Shotaro Suzuki's Blog - Site Home - MSDN Blogs

もちろん不満もあって、例えばレイアウトモードからTABLEをエディットすると不要なコードが沢山記述されてしまう。もしかしたらオプション設定でシンプルなコードを生成する様に変更出来るかも知れないが、今のところそういう方法は見つけられていない。まだまだ付き合いが浅いから仕方ない。

それでも、静的なHTMLページを手打ちで入力して行くには非常に快適だと感じる。やはりMicrosoft Visual Studioで養われたIntelliSenseの技術が組み込まれている点は評価が高い。ソースコードを直接打ち込んでいくタイプのマークアップエンジニアにはたまらん配慮だと思う。

Expressionには前述の通りダイナミックWebテンプレートが備わっている。出来上がったページはダイナミックテンプレート化しておけば、編集(変更)出来る部分を制限出来るので、サイト維持に不慣れな人が編集する際にも体裁が崩れるというリスクを最小限に防ぐことが出来ると考えている。

私はWordPress等のCMSを使って動的にページを生成する仕組みにテンプレートやカスタムフィールドを使って体裁が崩れない仕組みが好きだ。しかし今回はサーバーの条件からCMSを動かす事が無理だと言う前提条件がある。そこで他の人でも編集する事を考慮してHTMLエディタに頼ることを選んだ。最初にExpressionを評価した理由のほとんどはダイナミックWebテンプレートの存在なのだ。

しかし、いざ手打ちで作っているとIntelliSenseのお陰でマークアップ作業が結構快適な事に気づいた訳だ。もちろんエディターであるからして強力な置換機能なども実装されている。この辺りは申し分無い。使わない機能は使わなければいいという割り切りが出来るマークアップエンジニアにはオススメである。使わない機能の存在が許せないって人はテキストエディタでシンプルにやるのがよろしいだろう。

また、HTMLソースやCSSを直接編集する事に慣れてきたとか、今学習中だという人には、是非このHTML統合エディタを試してみて欲しいと思う。IntelliSenseを使わないのはもったいない。実際に試そうという人には私の文章では物足りないと思うので参考になるサイトを一つご紹介しておく。

Expression WebでWebサイトを作ってみよう (2) (1/5):CodeZine