JP2015170258A - ウェブページ提供方法、ウェブサーバ、コンピュータプログラム、およびデータ構造 - Google Patents

Abstract

【課題】ウェブページの中のオブジェクトのサイズが変化する場合であっても従来よりも見映えよくウェブページを表示させる。【解決手段】手続型言語によって内容が定められるリスト５２３ｄ４を含むウェブページ５２３を次のようにクライアントへ提供する。ウェブページ５２３を表示するためのウェブページデータとして、リスト５２３ｄ４を配置する領域５２３ｄのサイズを手続型言語によって定めかつ領域５２３ｄのサイズおよびリスト５２３ｄ４以外の全部分または一部分をマークアップ言語によって定めるデータを、クライアントへ送信する。【選択図】図６

Description

本発明は、ウェブページを提供する技術に関する。

ウェブページを描画するための言語として、従来、ＨＴＭＬ（Hypertext Markup Language）、ＸＨＴＭＬ（Extensible HTML）、またはＸＭＬ（Extensible Markup Language）などのマークアップ言語が用いられている。

マークアップ言語によって、ウェブページの構造、デザイン、およびレイアウトなどが記述される。マークアップ言語によると、基本的に、静的なウェブページしか提供するおとができない。

そこで、ＪａｖａＳｃｒｉｐｔ（登録商標）のような手続型言語を一部に用いてウェブページを記述すれば、ユーザの操作または演算結果などに応じて表示する内容を変えることができる。つまり、マークアップ言語のみを用いる場合よりも、より柔軟に動的なウェブページを提供することができる。

例えば、特許文献１に記載される方法によると、ウェブページの複数の領域それぞれの位置およびサイズをマークアップ言語によって記述し、各領域に配置するオブジェクトを手続型言語によって記述する。

ＵＳ特許８，２３９，７４９

領域に配置するオブジェクト（例えば、リスト）は、サイズが変わることがある。よって、見栄えをよくするには、オブジェクトのサイズに応じて領域のサイズを変えるのが、望ましい。

しかし、特許文献１に記載される方法によると、領域のサイズをオブジェクトのサイズに合わせることができない。

本発明は、このような問題点に鑑み、ウェブページの中のオブジェクトのサイズが変化する場合であっても従来よりも見映えよくウェブページを表示させることを目的とする。

本発明の一形態に係るウェブページ提供方法は、手続型言語によって内容が定められるオブジェクトを含むウェブページをクライアントへ提供するウェブページ提供方法であって、前記ウェブページを表示するためのウェブページデータとして、前記オブジェクトを配置する領域のサイズを前記手続型言語によって定めかつ当該サイズおよび前記オブジェクト以外の全部分または一部分をマークアップ言語によって定めるデータを前記クライアントへ送信する。

好ましくは、前記ウェブページデータとして、前記ウェブページにおける前記オブジェクトの位置を前記マークアップ言語で定めるデータを送信する。

または、前記オブジェクトはリストであって、前記ウェブページデータとして、前記リストの行数または列数に応じて前記サイズが算出されるスクリプトを含むデータを送信する。

または、前記リストは、画像形成装置におけるジョブに関する情報または記憶領域に関する情報を示すリストである。

または、前記画像形成装置から前記ウェブページデータを前記クライアントへ送信する。

本発明によると、ウェブページの中のオブジェクトのサイズが変化する場合であっても従来よりも見映えよくウェブページを表示させることができる。

ネットワークシステムの全体的な構成の例を示す図である。 画像形成装置のハードウェア構成の例を示す図である。 画像形成装置および端末装置の機能的構成の例を示す図である。 ウェブページの例を示す図である。 ウェブページの例を示す図である。 ウェブページの例を示す図である。 ウェブページの例を示す図である。 ページコードデータの例を示す図である。 ページコードデータの例を示す図である。 ページコードデータの例を示す図である。 画像形成装置の全体的な処理の流れの例を説明するフローチャートである。 端末装置の全体的な処理の流れの例を説明するフローチャートである。

図１は、ネットワークシステム４の全体的な構成の例を示す図である。図２は、画像形成装置１のハードウェア構成の例を示す図である。図３は、画像形成装置１および端末装置２の機能的構成の例を示す図である。

図１に示すように、ネットワークシステム４は、画像形成装置１、端末装置２、および通信回線３などによって構成される。画像形成装置１と端末装置２とは、通信回線３を介して通信することができる。通信回線３として、インターネット、公衆回線、またはＬＡＮ（Local Area Network）回線などが用いられる。

画像形成装置１は、一般に複合機またはＭＦＰ（Multi Function Peripherals）などと呼ばれる画像処理装置であって、コピー、ＰＣプリント、ファックス、スキャナ、およびボックスなどの機能を集約した装置である。

ＰＣプリントは、端末装置２から受信した画像データに基づいて画像を用紙に印刷する機能である。

ボックス機能は、ユーザごとに「ボックス」または「パーソナルボックス」などと呼ばれる記憶領域を与えておき、各ユーザが自分の記憶領域によって画像データなどを保存し管理するための機能である。グループごとにボックスを設けておき、グループのメンバ（ユーザ）で共用することもできる。ボックスは、パーソナルコンピュータにおける「フォルダ」または「ディレクトリ」に相当する。

画像形成装置１は、図２に示すように、ＣＰＵ（Central Processing Unit）１０ａ、ＲＡＭ（Random Access Memory）１０ｂ、ＲＯＭ（Read Only Memory）１０ｃ、大容量記憶装置１０ｄ、タッチパネルディスプレイ１０ｅ、操作キーパネル１０ｆ、ＮＩＣ（Network Interface Card）１０ｇ、モデム１０ｈ、スキャンユニット１０ｉ、およびプリントユニット１０ｊなどによって構成される。

タッチパネルディスプレイ１０ｅは、ユーザに対するメッセージを示す画面、ユーザがコマンドまたは情報を入力するための画面、およびＣＰＵ１０ａなどが実行した処理の結果を示す画面などを表示する。また、タッチパネルディスプレイ１０ｅは、タッチされた位置を示す信号をＣＰＵ１０ａへ送る。

操作キーパネル１０ｆは、いわゆるハードウェアキーボードであって、テンキー、スタートキー、ストップキー、およびファンクションキーなどによって構成される。

ＮＩＣ１０ｇは、ＴＣＰ／ＩＰ（Transmission Control Protocol/Internet Protocol）およびその上位のプロトコルで他の装置との通信を行う。上位のプロトコルとして、ＨＴＴＰ（Hypertext Transfer Protocol）、ＨＴＴＰＳ（HTTP over transport layer Security）、ＸＭＰＰ（eXtensible Messaging and Presence Protocol）、またはＳＮＭＰ（Simple Network Management Protocol）などが用いられる。

モデム１０ｈは、ファクシミリ端末との間でＧ３などのプロトコルで画像データをやり取りする。

スキャンユニット１０ｉは、プラテンガラスの上にセットされたシートに記されている画像を読み取って画像データを生成する。

プリントユニット１０ｊは、スキャンユニット１０ｉによって読み取られた画像のほか、他の装置から受信した画像を用紙に印刷する。

ＲＯＭ１０ｃまたは大容量記憶装置１０ｄには、上述のコピーなどの機能を実現するためのソフトウェアが記憶されている。

さらに、ユーザが端末装置２を介して遠隔的に画像形成装置１のステータス（状況）を確認したり画像形成装置１の設定を行ったりするためのソフトウェアが記憶されている。このソフトウェアによると、図３に示すリクエスト受付部１０１、ステータス情報収集部１０２、ステータスデータ生成部１０３、ウェブページ用データ記憶部１０４、およびレスポンス処理部１０５などの機能が実現される。このソフトウェアは、既存のウェブサーバ用のソフトウェアを拡張することによって用意することができる。

これらのソフトウェアを構成するプログラムまたはモジュールは、必要に応じてＲＡＭ１０ｂにロードされ、ＣＰＵ１０ａによって実行される。大容量記憶装置１０ｄとして、ハードディスクまたはＳＳＤ（Solid State Drive）などが用いられる。

端末装置２は、画像形成装置１が提供する種々のサービスをユーザが遠隔的に受けるためのクライアントである。端末装置２には、画像形成装置１を制御するためのドライバのほか、ウェブブラウザがインストールされている。このウェブブラウザによると、図３に示すウェブページデータ取得部２０１、スクリプトエンジン２０２、およびレンダリングエンジン２０３などの機能が実現される。

端末装置２として、パーソナルコンピュータ、タブレットコンピュータ、またはスマートフォンなどが用いられる。

図４は、ウェブページ５１の例を示す図である。図５は、ウェブページ５２１の例を示す図である。図６は、ウェブページ５２３の例を示す図である。図７は、ウェブページ５３の例を示す図である。図８は、ページコードデータ６０１の例を示す図である。図９は、ページコードデータ６０２の例を示す図である。図１０は、ページコードデータ６０３の例を示す図である。

次に、図３に示す画像形成装置１および端末装置２の各部の処理およびユーザによる操作について説明する。

画像形成装置１には、ユーザが画像形成装置１のステータスを確認したり設定を行ったりするための種々のウェブページが用意されている。

ユーザは、画像形成装置１のステータスを確認したり画像形成装置１の設定を行ったりする必要が生じたら、端末装置２のウェブブラウザを起動し、これらのウェブページのうちの目的に応じたウェブページのＵＲＬ（Uniform Resource Locator）を入力する。

すると、端末装置２において、ウェブページデータ取得部２０１は、入力されたＵＲＬに基づいて画像形成装置１へアクセスしウェブページを要求し、このウェブページを表示するためのデータ（後述するウェブページデータ）を取得する。例えば、「http://mfp.example.com/system.xml」というＵＲＬが入力された場合は、「system.xml」というウェブページ５１を要求し、ウェブページ５１のウェブページデータを取得する。

画像形成装置１において、リクエスト受付部１０１は、端末装置２からのリクエストを受け付ける。

ステータス情報収集部１０２は、リクエストがリクエスト受付部１０１によって受け付けられると、リクエストされたウェブページを表示するのに必要な、画像形成装置１のステータスなどに関する情報を収集する。

例えば、図４に示すようなウェブページ５１が要求された場合は、ステータス情報収集部１０２は、画像形成装置１の全般的な情報のほか、スキャンユニット１０ｉのステータスの情報、プリントユニット１０ｊのステータスの情報、および管理者に関する情報を収集する。

画像形成装置１の全般的な情報は、画像形成装置１の装置名、設置場所、プリントユニット１０ｊのシリアル番号、および主な機能などの情報である。

スキャンユニット１０ｉのステータスの情報は、主に、スキャンを現在実行しているか否かの情報である。そのほか、不足している機能がある場合は、その機能の情報を収集する。

プリントユニット１０ｊのステータスの情報は、印刷を現在実行しているか否かの情報のほか、各色（イエロー、マゼンタ、シアン、ブラック）のトナーの残量、各給紙トレイに格納される用紙のサイズ、種類、および残量、ならびに排紙トレイの名称などの情報である。

管理者に関する情報は、画像形成装置１の管理者のアカウント名および電子メールアドレスなどである。

または、図５に示すような、「job.xml」というウェブページ５２１が要求された場合は、ステータス情報収集部１０２は、画像形成装置１の全般的な情報のほか、画像形成装置１において未完了であるジョブに関する情報を収集する。

このジョブに関する情報は、ジョブの番号、登録元（指令元）、使用する文書の文書名、状態（実行中または実行待ち）、および登録時刻などの情報である。

または、図６に示すような、「communication.xml」というウェブページ５２３が要求された場合は、ステータス情報収集部１０２は、画像形成装置１の全般的な情報のほか、画像形成装置１における通信（ファックス送信、ファックス受信、スキャン送信など）のジョブに関する情報を収集する。

このジョブに関する情報は、ジョブの番号、通信相手、開始時刻、通信時間、原稿の枚数、および結果（成功または失敗）などの情報である。

または、「box.xml」というウェブページ５３が要求され、ウェブページ５３が図７に示すように構成されている場合は、ステータス情報収集部１０２は、画像形成装置１の全般的な情報のほか、各ボックスのボックス番号、ボックス名、および作成日時などの情報を収集する。

これらの情報は、画像形成装置１のオペレーティングシステムに問い合わせることによって、取得することができる。または、設定の内容を示す所定のファイルをチェックすることによって、取得することができる。

ステータスデータ生成部１０３は、ステータス情報収集部１０２によって収集された情報を示すステータスデータ６３を生成する。

ウェブページ用データ記憶部１０４には、ウェブページごとのページコードデータ６０および画像データ６１などが記憶されている。

ところで、ウェブページは、一般に、内容（コンテンツ）が変わらない部分と変わる部分とに大別される。

例えば、図６に示したウェブページ５２３には、通信のジョブのリスト５２３ｄ４が配置されている。リスト５２３ｄ４の内容は、通信のジョブが新たに生成されたり実行されたりするごとに更新される。また、プルダウンメニュー５２３ｄ１によって通信のジョブの種類が選択し直され、またはプルダウンメニュー５２３ｄ２によってページが変更されるごとに更新される。内容の更新は、一般に、ＨＴＭＬ（Hypertext Markup Language）、ＸＨＴＭＬ（Extensible HTML）、またはＸＭＬ（Extensible Markup Language）などのようなマークアップ言語では実現することができないが、ＪａｖａＳｃｒｉｐｔのような手続型言語によって実現することができる場合がある。本実施形態におけるウェブページも、更新を伴う部分（動的部分）は、手続型言語によって記述される。

一方、更新を伴わない部分（静的部分）は、マークアップ言語によって記述することができるが、手続型言語で記述してもよい。

また、ウェブページは、一般に、複数の領域によって構成することができる。さらに、領域ごとにサイズおよびウェブページにおける位置を決めることができる。領域の左上の座標を領域の位置として指定するのが一般的である。ＣＳＳ（Cascading Style Sheets）またはＸＳＬ（Extensible Stylesheet Language）などのマークアップ言語によると、サイズおよび位置をより厳密に指定することができる。

さて、本実施形態において、ページコードデータ６０は、次のように記述される。各領域の内容は、手続型言語で記述される。各領域の位置は、マークアップ言語で記述される。しかし、内容の更新（変化）に伴ってサイズを変更する必要が生じ得る領域については、手続型言語によって定められ、そうでない領域については、マークアップ言語によって定められる。

ここで、ウェブページ５１、５２１、５２３、および５３それぞれのページコードデータ６０の記述について、図８〜図１０を参照して説明する。

ウェブページ５１は、図４に示したように、７つの領域５１ａ〜５１ｇによって構成される。

領域５１ａは、次のように内容が変化し得る。スキャンユニット１０ｉがアイドリングの状態であればスキャンユニット１０ｉのアイコン５１ａ１の右側のステータス情報５１ａ２が「スキャン準備完了」であるが、スキャンを開始するとステータス情報５１ａ２が「スキャン中」に変わる。アイコン５１ａ１が他のアイコンに置き換わることも、ある。しかし、領域５１ａは、内容がこのように変化しても、サイズを変更することなく内容を納めることができる。

したがって、図８に示すように、ウェブページ５１のページコードデータ６０（以下、「ページコードデータ６０１」と記載する。）は、マークアップ言語によって領域５１ａのサイズを定めている。

領域５１ｄは、次のように内容が変化し得る。領域５１ｄには、リスト５１ｄ１が配置されており、プリントユニット１０ｊの４色それぞれのトナーの残量に応じてインジケータの長さ（ブロックの画像の個数）および残量の値が変化する。しかし、領域５１ｄは、リスト５１ｄ１の内容が変化してもサイズを変更することなく内容を納めることができるの。よって、ページコードデータ６０１は、領域５１ｄのサイズも領域５１ａと同様、マークアップ言語によって定めている。

領域５１ｅは、次のように内容が変化し得る。領域５１ｅには、リスト５１ｅ１が配置されている。リスト５１ｅ１は、スキャンユニット１０ｉの給紙トレイ（給紙口）ごとのステータス（格納されている用紙のサイズ、種類、残量など）を示すが、これらのステータスは変化し得るので、リスト５１ｅ１の内容も変化する。しかし、領域５１ｅは、領域５１ｄと同様、リスト５１ｅ１の内容が変化してもサイズを変更することなく内容を納めることができる。よって、ページコードデータ６０１は、領域５１ｅのサイズも、マークアップ言語によって定めている。

領域５１ｂ、５１ｃ、５１ｆ、５１ｇも内容が変化してもサイズを変更する必要がないので、マークアップ言語によってサイズが定められている。

領域５１ａ、５１ｄ、５１ｅ、５１ｆ、および５１ｇの内容は、画像形成装置１のステータスの変化またはユーザの指定した条件に応じて変更する必要があり、かつ、手続型言語でなければ変更することができない。よって、ページコードデータ６０１は、これらの領域の内容を手続型言語によって定めている。なお、固定的な部分のほか、デザインが単に変化するだけの部分など、マークアップ言語で記述することができる部分は、そのようにしてもよい。ウェブページ５２１、５２３、５３においても、同様である。

領域５１ｂには、タブまたはメニューが配置されており、いずれかがクリックされると、それに対応する他のウェブページへジャンプする。フォーカスの対象であるタブまたはメニューが変わるとデザインが変化することがあるが、これは、マークアップ言語によって実現できる。よって、ページコードデータ６０１は、領域５１ｂの内容をマークアップ言語のみで定めている。なお、手続型言語を用いてもよい。領域５１ｃについても、同様である。

ウェブページ５２１は、図５に示した通り、４つの領域５２１ａ〜５２１ｄによって構成される。領域５２１ａ〜５２１ｃの内容は、ウェブページ５１の領域５１ａ〜５１ｃの内容と同様である。したがって、ウェブページ５２１のページコードデータ６０（以下、「ページコードデータ６０２」と記載する。）は、図９に示すように、領域５２１ａ〜５２１ｃのサイズをマークアップ言語によって定めている。

領域５２１ｄには、プルダウンメニュー５２１ｄ１〜５２１ｄ３、ボタン５２１ｄ４、５２１ｄ５、およびリスト５２１ｄ６が配置されている。リスト５２１ｄ６には、未完了であるジョブごとの情報が示されるが、ジョブが新たに生成され、ジョブの実行が開始し、またはジョブの実行が完了すると、その内容が変化する。特に、ジョブが新たに生成された場合およびジョブの実行が完了した場合は、行数が増減する。また、プルダウンメニュー５２１ｄ１〜５２１ｄ３、またはボタン５２１ｄ４、５２１ｄ５が操作された場合は、それに応じたジョブのみの情報が選出される。よって、この場合も、行数が増減し得る。行数が増減すると、リスト５２１ｄ６が見映えよく納まるように領域５２１ｄのサイズを変更しなければならない。したがって、ページコードデータ６０２は、領域５２１ｄのサイズ（縦および横それぞれの長さ）を手続型言語によって定めている。

例えば、縦の長さＬｙとして、
Ｌｙ＝Ｌａ＋Ｌｂ×行数
がページコードデータ６０２に定められている。なお、長さＬａは、領域５２１ｄの、リスト５２１ｄ６以外のオブジェクトを配置するために必要な、縦の長さである。長さＬｂは、リスト５２１ｄ６の、１行当たりの長さである。

横の長さＬｘも同様に、列数に応じて
Ｌｘ＝Ｌｃ＋Ｌｄ×列数
がページコードデータ６０２に定められている。または、１行の最大の文字数に応じて横の長さＬｘを定めてもよい。

ウェブページ５２３は、図６に示した通り、４つの領域５２３ａ〜５２３ｄによって構成される。内容が変わってもサイズを変更する必要がないので、領域５２３ａ〜５２３ｃのサイズも、領域５１ａ〜５１ｃ、５２１ａ〜５２１ｃと同様、マークアップ言語によって定められている。

リスト５２３ｄ４には、前に説明した通り、通信のジョブの情報が配置されるが、その対象が変化し得る。よって、行数も増減し得る。したがって、領域５２３ｄのサイズも、領域５２１ｄの場合と同様、行数などに応じて決まるように、手続型言語によって定められている。

ウェブページ５３は、図７に示したように、５つの領域５３ａ〜５３ｅによって構成される。ウェブページ５３のページコードデータ６０（以下、「ページコードデータ６０３」と記載する。）は、図１０に示すように、領域５３ａ〜５３ｃのサイズを、領域５１ａ〜５１ｃ、５２１ａ〜５２１ｃ、５２３ａ〜５２３ｃと同様に上述の理由により、マークアップ言語によって定めている。領域５３ｄは内容が変化しないので、マークアップ言語によってサイズが定めている。

領域５３ｅには、プルダウンメニュー５３ｅ１、５３ｅ２、およびリスト５３ｅ３が配置されている。リスト５３ｅ３には、ボックスごとの情報が示されるが、プルダウンメニュー５３ｅ１、５３ｅ２が操作されると、それに応じたボックスのみの情報が選出される。よって、リスト５３ｅ３は、行数が増減し得る。したがって、ページコードデータ６０３は、ウェブページ５２１、５２３の場合と同様、領域５３ｅのサイズが行数などに応じて決まるように、手続型言語によって定めている。

図３に戻って、レスポンス処理部１０５は、端末装置２から要求されたウェブページを表示するためのデータ（以下、「ウェブページデータ」と記載する。）を端末装置２へ送信する。つまり、要求に対するレスポンスの処理を行う。

ウェブページデータとして、そのウェブページのページコードデータ６０および画像データ６１のほか、ステータスデータ生成部１０３によって生成されたステータスデータ６３が送信される。

ここで、図７に示したウェブページ５３のウェブページデータを用意する場合を例に、レスポンス処理部１０５の処理を説明する。

ウェブページ５３が要求された場合は、スキャンユニット１０ｉおよびプリントユニット１０ｊそれぞれの現在の動作の状態および各ボックスの状態の情報が、ステータス情報収集部１０２によって収集される。そして、これらの情報に基づいてステータスデータ生成部１０３によってステータスデータ６３が生成される。

レスポンス処理部１０５は、ウェブページ用データ記憶部１０４から、ウェブページ５３のページコードデータ６０（つまり、ページコードデータ６０３）および画像データ６１を読み出す。そして、端末装置２へ送信する。さらに、ステータスデータ６３を端末装置２へ送信する。なお、ステータスデータ６３の内容をページコードデータ６０３に書き込んで送信してもよい。

このようにして、端末装置２が要求したウェブページのウェブページデータが画像形成装置１から端末装置２へ提供される。

端末装置２において、ウェブページデータ取得部２０１がウェブページデータ（ページコードデータ６０、画像データ６１、およびステータスデータ６３）を受信すると、スクリプトエンジン２０２およびレンダリングエンジン２０３は、次のように処理を実行する。

スクリプトエンジン２０２は、ページコードデータ６０に記述される手続型言語のスクリプトを実行する。この際に、ステータスデータ６３が参照される。これにより、演算処理が行われ、演算結果が得られる。

レンダリングエンジン２０３は、ページコードデータ６０に記述されるマークアップ言語のソースコード、画像データ６１、およびスクリプトエンジン２０２によって得られた演算結果に基づいてウェブページをレンダリングする。そして、このウェブページが端末装置２のディスプレイに表示される。なお、ウェブブラウザの画面にウェブページが納まりきらない場合は、ウェブページの一部分が表示され、操作に応じてスクロールしながら残りの部分が順次、表示される。

上述の通り、端末装置２は、ウェブページデータとして、ページコードデータ６０、画像データ６１、およびステータスデータ６３をダウンロードするが、これらを一度に纏めてダウンロードするのではなく、異なるタイミングでダウンロードする場合がある。例えば、端末装置２は、最初にページコードデータ６０およびステータスデータ６３をダウンロードし、ページコードデータ６０に基づいて必要な画像データ６１を判別し、これを画像形成装置１からダウンロードする場合がある。または、最初にページコードデータ６０をダウンロードし、ページコードデータ６０に基づいて必要な画像データ６１およびステータスデータ６３を判別し、それぞれのデータを画像形成装置１からダウンロードする場合がある。

ここで、ウェブページ５１、５２１、５２３、および５３それぞれを表示する場合を例に、スクリプトエンジン２０２およびレンダリングエンジン２０３をさらに具体的に説明する。

ウェブページ５１（図４参照）を表示する場合は、図８に示したページコードデータ６０１が取得される。

ウェブページ５１のすべての領域５１ａ〜５１ｇは、マークアップ言語によってサイズが定められている。したがって、領域５１ａ〜５１ｇの外枠のサイズ（縦、横それぞれの長さ）および位置は、スクリプトエンジン２０２によらず、ページコードデータ６０１に示されるマークアップ言語のソースコードに基づいてレンダリングエンジン２０３によって求められる。

一方、内容は、基本的に、ページコードデータ６０１に示されるスクリプトがスクリプトエンジン２０２が実行され、その演算結果およびマークアップ言語のソースコードに基づいてレンダリングエンジン２０３によって求められる。

そして、レンダリングエンジン２０３は、これらの結果に基づいてウェブページ５１を描画しタッチパネルディスプレイ１０ｅに表示させる。

ウェブページ５２１（図５参照）を表示する場合は、図１０に示したページコードデータ６０が取得される。

ウェブページ５２１の中の領域５２１ａ〜５２１ｃ、５２１ｅ〜５２１ｇは、マークアップ言語によってサイズが定められている。したがって、領域５２１ａ〜５２１ｃ、５２１ｅ〜５２１ｇの外枠のサイズおよび位置は、スクリプトエンジン２０２によらず、ページコードデータ６０２に示されるマークアップ言語のソースコードに基づいてレンダリングエンジン２０３によって求められる。内容は、基本的に、ページコードデータ６０２に示されるスクリプトに基づいてスクリプトエンジン２０２によって求められる。

しかし、領域５２１ｄは、手続型言語によってサイズが定められている。したがって、領域５２１ｄの外枠のサイズは、スクリプトエンジン２０２によって求められる。内容の一部または全部も、スクリプトエンジン２０２によって求められる。ここで、これらの求め方の一例を説明する。

スクリプトエンジン２０２は、ステータスデータ６３およびデフォルトの条件などに基づいて、情報を提示すべきジョブを抽出し、これらのジョブの個数を計数する。そして、この個数に基づいて、リスト５２１ｄ６に設ける行数を演算し、領域５２１ｄのサイズを演算する。さらに、抽出したジョブの情報を、領域５２１ｄに配置すべき情報に決定する。

そして、これらの結果およびマークアップ言語のソースコードに基づいてレンダリングエンジン２０３によってウェブページ５２１が描画されタッチパネルディスプレイ１０ｅに表示される。

ウェブページ５２３、５３も、ウェブページ５２１の場合と同様の処理によって表示される。

特に、ウェブページ５２３の領域５２３ｄについて、スクリプトエンジン２０２は、情報を提示すべき通信ジョブを抽出し、これらの通信ジョブの個数を計数する。そして、この個数に基づいて、リスト５２３ｄ４に設ける行数を演算し、領域５２３ｄのサイズを演算する。さらに、抽出した通信ジョブの情報を、領域５２１ｄに配置すべき情報に決定する。

また、ウェブページ５３の領域５３ｅについて、スクリプトエンジン２０２は、ページコードデータ６０に基づいて、情報を提示すべきボックスを抽出し、これらのボックスの個数を計数する。そして、この個数に基づいて、リスト５３ｅ３に設ける行数を演算し、領域５３ｅのサイズを演算する。さらに、抽出したボックスの情報を、領域５３ｅに配置すべき情報に決定する。

ウェブページが表示された後、画像形成装置１の各部および端末装置２の各部は、適宜、次のように処理を実行する。

ページコードデータ６０に示される所定の時間が経過するごとに、ウェブページデータ取得部２０１は、最新のステータスデータ６３を画像形成装置１に対して要求し、取得する。そして、スクリプトエンジン２０２は最新のステータスデータ６３に基づいて演算し直し、レンダリングエンジン２０３は、その演算結果に応じてウェブページを描画しタッチパネルディスプレイ１０ｅに表示し直す。

例えば、ウェブページ５３を表示した後、所定の時間が経過するごとに、ウェブページ５３のための最新のステータスデータ６３を要求する。すると、リクエスト受付部１０１は、この要求を受け付け、ステータス情報収集部１０２は、スキャンユニット１０ｉ、プリントユニット１０ｊ、およびボックスそれぞれに関するステータスの情報を収集する。そして、ステータスデータ生成部１０３は、収集された情報に基づいてステータスデータ６３を生成し、レスポンス処理部１０５は、これを端末装置２へ送信する。最新のステータスデータ６３が取得されると、スクリプトエンジン２０２は、リスト５３ｅ３に設ける行数および領域５３ｅのサイズなどを演算し直す。そして、レンダリングエンジン２０３は、新たな演算結果に基づいてウェブページ５３を描画し表示し直す。

画像形成装置１はステータスデータ６３を、上述の通り、いわゆるプル配信してもよいが、いわゆるプッシュ配信してもよい。

または、プルダウンメニュー５３ｅ１によって新たな条件が指定されると、スクリプトエンジン２０２は、ページコードデータ６０および最新のステータスデータ６３に基づいて、その条件に合うボックスを抽出（検索）するとともに、抽出したボックスの個数に基づいてリスト５３ｅ３に設ける行数を演算し、領域５３ｅのサイズを演算する。そして、レンダリングエンジン２０３は、スクリプトエンジン２０２による新たな演算結果に基づいてウェブページ５３を描画し表示し直す。

または、ハイパーリンクが選択されると、ウェブページデータ取得部２０１は、そのハイパーリンクに対応するウェブページを画像形成装置１に対して要求する。

すると、画像形成装置１の各部は、上述の方法でこのウェブページのレスポンスデータを用意し端末装置２へ送信する。そして、スクリプトエンジン２０２およびレンダリングエンジン２０３は、上述の方法で演算を行いウェブページを描画して表示させる。

図１１は、画像形成装置１の全体的な処理の流れの例を説明するフローチャートである。図１２は、端末装置２の全体的な処理の流れの例を説明するフローチャートである。

次に、画像形成装置１および端末装置２の全体的な処理の流れを、図１１および図１２のフローチャートを参照しながら説明する。

画像形成装置１は、端末装置２からウェブページを要求されると（図１１の＃１０でＹｅｓ）、そのウェブページで提示すべきステータスの情報を収集し（＃１１）、ステータスデータ６３を生成する（＃１２）。そして、このウェブページのページコードデータ６０および画像データ６１と、生成したステータスデータ６３とを、端末装置２へ送信する（＃１３〜＃１５）。

または、端末装置２からステータスの問合せを受けると（＃１６でＹｅｓ）、画像形成装置１は、ステータスの情報を収集し（＃１７）、ステータスデータ６３を生成し端末装置２へ送信する（＃１８、＃１９）。なお、このウェブページが端末装置２において開いている間、問合せの有無に関わらず、ステータスが変わるごとに、ステータスデータ６３を生成し端末装置２へ配信してもよい。

一方、端末装置２においては、基本的に、従来のウェブブラウザによる処理が行われる。すなわち、端末装置２は、ＵＲＬが指定されると（図１２の＃２１でＹｅｓ）、そのＵＲＬに基づいてウェブページを画像形成装置１に対して要求し（＃２２）、ウェブページデータ（ページコードデータ６０、画像データ６１、ステータスデータ６３）をダウンロードする（＃２３）。そして、ウェブページデータに基づいて演算処理を行い、ウェブページを描画し表示する（＃２４、＃２５）。

その後、ページコードデータ６０に基づいて、所定のタイミングになったら（＃２６でＹｅｓ）、最新のステータスデータ６３を画像形成装置１からダウンロードする（＃２７）。そして、これに基づいて演算処理を行い、ウェブページを描画し表示し直す（＃２８、＃２９）。なお、ステータスデータ６３が画像形成装置１からプッシュ配信される場合も同様に、これに基づいて演算処理を行い、ウェブページを描画し表示し直す。

本実施形態によると、領域の中のリストなどの画像のサイズが変化する場合に、領域のサイズを調整する。例えば、リストの行数または列数に合わせて領域のサイズを調整する。よって、従来よりも見映えよくウェブページを表示させることができる。

本実施形態では、サーバとして画像形成装置１が用いられる場合を例に説明したが、他の装置が用いられる場合にも、本発明を適用することができる。例えば、印刷専用機、ファクシミリ専用機、スキャナ専用機、ルータ、またはＮＡＳ（Network Attached Storage）などがウェブサーバとして用いられる場合にも、本発明を適用することができる。

本実施形態では、サイズが変化し得るオブジェクトの例として、図５〜図７に示すようなリストを挙げたが、他のオブジェクトの場合にも、本発明を適用することができる。例えば、いわゆる印刷プレビューの画像をオブジェクトとして表示し、ユーザの操作に応じてこれを拡大しまたは縮小して表示する場合にも、本発明を適用することができる。

本実施形態では、各領域の位置を、そのウェブページにおける絶対座標によって定めたが、他の定め方を用いてもよい。例えば、各領域同士の相対的な位置関係を定めてもよい。この場合は、ある領域のサイズの変化に伴って、他の領域の位置を調整することができる。

本実施形態では、ページコードデータ６０に、領域ごとに位置およびサイズを定めた。つまり、１つの領域を１つの画像として、位置およびサイズを定めた。しかし、個々のオブジェクト（例えば、リストまたはプレビュー画像）を１つの画像として、位置およびサイズを定めてもよい。

その他、ネットワークシステム４、画像形成装置１の全体または各部の構成、処理内容、処理順序、データの構成、ウェブページの構成などは、本発明の趣旨に沿って適宜変更することができる。

１ 画像形成装置（ウェブサーバ）
１０５ レスポンス処理部（送信手段）
６０ ページコードデータ（ウェブページデータ）

Claims (8)

1. 手続型言語によって内容が定められるオブジェクトを含むウェブページをクライアントへ提供するウェブページ提供方法であって、
   前記ウェブページを表示するためのウェブページデータとして、前記オブジェクトを配置する領域のサイズを前記手続型言語によって定めかつ当該サイズおよび前記オブジェクト以外の全部分または一部分をマークアップ言語によって定めるデータを前記クライアントへ送信する、
   ことを特徴とするウェブページ提供方法。
2. 前記ウェブページデータとして、前記ウェブページにおける前記オブジェクトの位置を前記マークアップ言語で定めるデータを送信する、
   請求項１に記載のウェブページ提供方法。
3. 前記オブジェクトはリストであって、
   前記ウェブページデータとして、前記リストの行数または列数に応じて前記サイズが算出されるスクリプトを含むデータを送信する、
   請求項１または請求項２に記載のウェブページ提供方法。
4. 前記リストは、画像形成装置におけるジョブに関する情報または記憶領域に関する情報を示すリストである、
   請求項３に記載のウェブページ提供方法。
5. 前記画像形成装置から前記ウェブページデータを前記クライアントへ送信する、
   請求項４に記載のウェブページ提供方法。
6. 手続型言語によって内容が定められるオブジェクトを含むウェブページをクライアントへ提供するウェブサーバであって、
   前記ウェブページを表示するためのウェブページデータとして、前記オブジェクトを配置する領域のサイズを前記手続型言語によって定めかつ当該サイズおよび前記オブジェクト以外の全部分または一部分をマークアップ言語によって定めるデータを前記クライアントへ送信する送信手段、
   を有することを特徴とするウェブサーバ。
7. 手続型言語によって内容が定められるオブジェクトを含むウェブページをクライアントへ提供するウェブサーバに用いられるコンピュータプログラムであって、
   前記ウェブサーバに、前記ウェブページを表示するためのウェブページデータとして、前記オブジェクトを配置する領域のサイズを前記手続型言語によって定めかつ当該サイズおよび前記オブジェクト以外の全部分または一部分をマークアップ言語によって定めるデータを前記クライアントへ送信する処理を実行させる、
   ことを特徴とするコンピュータプログラム。
8. ウェブページを再現するためのウェブページデータのデータ構造であって、
   前記ウェブページの内容を示すオブジェクトを手続型言語によって定める第一のデータと、
   前記オブジェクトを配置する領域のサイズを前記手続型言語によって定める第二のデータと、
   前記オブジェクトおよび前記サイズ以外の全部分または一部分をマークアップ言語によって定める第三のデータと、
   によって構成されることを特徴とするデータ構造。

Images