IBMがWebアプリケーションのUIガイドラインとHTML/CSSのソースコードを公開

2009年11月5日

業務アプリケーションがWebアプリケーションとして開発されるのは現在の大きなトレンドです。それに伴ってHTMLとCSSによって業務アプリケーションの複雑なユーザーインターフェイスを構築する必要性が生じます。

しかし機能が豊富な業務アプリケーションのユーザーインターフェイスをHTMLとCSSで構築するのはそれほど簡単ではなく、しかもそれをアプリケーション全体で統一し、優れたユーザビリティを実現するのはさらに手間のかかる作業です。

IBM Lotus User Interface Developer Documentation - Home

そうした業務用のWebアプリケーションのユーザーインターフェイスを構築するためのサンプルが豊富に含まれたガイドライン「IBM Lotus User Interface Developer Documentation」が、IBMから公開されました。

今回公開されたIBMのガイドラインは、同社のLotus製品群のユーザビリティを統一するための社内プロジェクト「One UI」の成果物だと、同社のソフトウェアエヴァンジェリスト 森谷直哉氏のブログ「One UI - 日々前進なり」で紹介されています。

同社が今後展開するWebアプリケーションもこのガイドラインに沿って開発されるはずで、それだけ吟味されたものだといえるのではないでしょうか。ただしライセンスにはIBMが著作権を保有し、Lotus製品への拡張(extending)や連係のため(interfacing)のためなら誰でもどのような形でも無償で利用(copy)、変更(modify)、再利用(redistribute)可能だとありますので、念頭に置いた方がよいでしょう。IBMもせっかく貴重な情報を公開するのですから、もっと柔軟なライセンスにしてLotus製品的なインターフェイスを広めるチャンスにした方がいいと思うんですけれどね。

とはいえ、Webベースの業務アプリケーションを開発する人たちにとっては非常に参考になる情報だと思います。内容を見ていきましょう。

「Developer Guide」は英文マニュアル

ガイドラインは大きく分けて、次の3つに分かれています。

  • Developer Guide
  • Components
  • Example Pages

Developer Guideは、英語で書かれた開発マニュアルと言っていいでしょう。Developers Guideの「Coding Guidelines」には、HTMLのh1、h2などタグの意味に沿って使うこと、Web標準に従うことなどが説明されています。

fig

また、「Build a Page」では、ページ作成の手順について説明されています。

fig

「Components」はHTMLとCSSのソースコード付き

Componentsは、Webアプリケーションのユーザーインターフェイスを構成する部品群を開設しています。「Sample」のタブで、実際にHTML/CSSで表現された部品を試すことができます。

fig

そして「Code」のタブでは、それを実現するHTMLとCSSのソースコードを見ることができます。

fig

「Components」では、実にさまざまな部品が提供されています。どんな部品群なのか、その一部を以下にまとめて紹介しておきます。こうした部品のすべてがHTML/CSSのソースコード付きで公開されています。

fig

「Example Pages」

Example Pagesでは、Componentsをどのように配置してWebアプリケーションの画面を構築するのか、そのサンプルが14種類提供されています。基本は「ナビゲーションを左に」と解説されています。2つほどサンプルを紹介しましょう。

「3 columns, summary view」のサンプル

fig

「Log In」サンプル

fig

あわせて読みたい

Web技術 オープンソース システム開発




タグクラウド

クラウド
AWS / Azure / Google Cloud
クラウドネイティブ / サーバレス
クラウドのシェア / クラウドの障害

コンテナ型仮想化

プログラミング言語
JavaScript / Java / .NET
WebAssembly / Web標準
開発ツール / テスト・品質

アジャイル開発 / スクラム / DevOps

データベース / 機械学習・AI
RDB / NoSQL

ネットワーク / セキュリティ
HTTP / QUIC

OS / Windows / Linux / 仮想化
サーバ / ストレージ / ハードウェア

ITエンジニアの給与・年収 / 働き方

殿堂入り / おもしろ / 編集後記

全てのタグを見る

Blogger in Chief

photo of jniino

Junichi Niino(jniino)
IT系の雑誌編集者、オンラインメディア発行人を経て独立。2009年にPublickeyを開始しました。
詳しいプロフィール

Publickeyの新着情報をチェックしませんか?
Twitterで : @Publickey
Facebookで : Publickeyのページ
RSSリーダーで : Feed

最新記事10本