JP5255576B2 - コンテンツ表示方法、コンテンツ表示プログラム、およびコンテンツ表示装置 - Google Patents

Description

本発明は、画面サイズよりも広い表示領域を想定して作成されたコンテンツの一部の領域を画面上に表示するコンテンツ表示方法、コンテンツ表示プログラム、およびコンテンツ表示装置に関する。

ネットワーク上の情報を閲覧するための情報閲覧ソフトウェア（以下、「ブラウザ」という。）が一般に知られ実用に供されている。ブラウザには、ネットワーク上の情報（例えばＨＴＭＬ（Hyper Text Markup Language）やＸＨＴＭＬ（Extensible Hyper Text Markup Language）等のマークアップ言語で記述された文書であるＷｅｂコンテンツ）を解析し、その解析結果に基づいて画面表示用データの生成（以下、「レンダリング」という。）を行う機能が実装されている。ユーザは、閲覧したいＷｅｂコンテンツのＵＲＩ（Uniform Resource Identifier）を指定することにより、ブラウザ上で所望のＷｅｂコンテンツを閲覧することができる。このようなブラウザはＰＣ（Personal Computer）のみならず、例えば携帯電話やＰＤＡ（Personal Digital Assistants）、情報家電等の様々な機器に搭載されている。

携帯電話は、ＰＣと比較して性能・機能が限定されているため、従来はモバイル機器向けのマークアップ言語（コンパクトＨＴＭＬ（Compact-HTML）やＨＤＭＬ（Handheld Device Markup Language）、ＭＭＬ（Mobile Markup Language）等）で記述されたＷｅｂコンテンツしか表示することができなかった。しかし近年、技術の発展に伴い携帯電話の性能・機能が著しく向上した結果、例えばＸＧＡ（eXtended Graphics Array）等の標準的なサイズの画面をもつ仮想的なＰＣによる閲覧を想定して作成されたＷｅｂコンテンツ（以下、「ＰＣ向けコンテンツ」という。）を表示することができるフルブラウザが搭載された携帯電話が実用化され、普及している。

ところで、携帯電話は携帯性が要求されるため、携帯電話に搭載可能なディスプレイの大きさには制約がある。このため携帯電話のディスプレイは、例えばＱＶＧＡ（Quarter Video Graphics Array）等の、ＰＣ用ディスプレイよりも小さな画面サイズをもつ。従って、ＰＣ向けコンテンツを携帯電話のブラウザによってＰＣのブラウザで表示する場合と同じ倍率で表示すると、携帯電話のブラウザではＰＣのブラウザと比べて限られた範囲の情報しか表示されない。このように、画面上に表示される情報量が少ない場合、ユーザがＰＣ向けコンテンツの全体像を掴み難いといった点が指摘される。

この点について、限られた画面サイズで広い領域のコンテンツを表示する際のユーザの利便性を向上させる技術が種々提案されている。このような技術の一例として、文字入力が可能な入力領域（拡大画像）と、文書全体（または１ページ等の単位）のレイアウトが表示されるレイアウト領域（縮小画像）とを一画面中に表示する文書作成装置が特開昭６１−２４１８６６号公報（以下「特許文献１」という。）に開示されている。特許文献１の文書作成装置を使用すれば、ユーザは、文書の一部が拡大表示された拡大画像に文字を入力して文書を編集しつつ、文書全体（または１ページ等の単位）が縮小表示された縮小画像を視認することで編集中の文書の全体像を掴むことができる。

また欧州特許出願公開公報第１２５５１８６号（以下「特許文献２」という。）には、Ｗｅｂコンテンツの全体と一部とを切り替えて表示することができる携帯端末用ブラウザが開示されている。特許文献２に記載のブラウザは、Ｗｅｂコンテンツ全体を縮小して一画面中に表示し、かつ、可読性が確保される程度にＷｅｂコンテンツを拡大した際に携帯端末のディスプレイで表示することができるＷｅｂコンテンツ上の領域を反転表示する。このような画面が表示されているときにユーザが所定のキー操作を行うと、Ｗｅｂコンテンツ上の反転表示された領域が携帯端末の画面の略全体に拡大表示される。特許文献２に記載の携帯端末用ブラウザを使用すれば、ユーザは、Ｗｅｂコンテンツ全体に対する実際の閲覧領域の位置を、画面の表示を適宜切り替えることにより把握することができる。

特許文献１に記載の文書作成装置は、内部バッファに格納されている文書全体の文書データを処理して描画データを作成しレイアウト・メモリ・バッファに書き込むといった前段処理を行った後、レイアウト・メモリ・バッファ上の描画データを文書全体の縮小画像として画面に表示する。このとき実行される前段処理には文書データのサイズに比例した処理時間がかかる。このため表示対象がＰＣ用ディスプレイ表示時にもスクロール操作を要し得るデータ量の多いＷｅｂコンテンツの場合には前段処理に時間がかかり、文書全体の縮小画像が迅速に表示されない問題がある。また携帯電話のようなリソースが限定的な機器では、データ量の多いＷｅｂコンテンツに対する前段処理は負荷が重すぎるため不向きである。さらに、Ｗｅｂコンテンツの大きさ（高さおよび幅）が大きいほどＷｅｂコンテンツを縮小する必要があるが、縮小率が高いほどＷｅｂコンテンツ内の画像やテキストが潰れてしまう。場合によっては縮小後の画像の視認性が著しく低く、ユーザがＷｅｂコンテンツのイメージを容易に掴めないことも想定される。また、１ページ等の単位の文書を処理する場合には、文書全体における、縮小画像に対応する文書の位置をユーザが把握しにくいといった別の問題がある。

また特許文献２に記載の携帯端末用ブラウザでは、ユーザはＷｅｂコンテンツの全体表示と一部の拡大表示とを同時に閲覧することができない。このためユーザは、Ｗｅｂコンテンツの一部を拡大表示で閲覧しているときに該Ｗｅｂコンテンツの全体像を把握したい場合は表示を切り替えなければならず、煩雑な操作を要する。また表示が切り替わることにより、拡大表示されていた領域とＷｅｂコンテンツ全体との位置関係をユーザが把握しにくくなることが想定される。さらに、特許文献１と同様に、Ｗｅｂコンテンツのデータ量に比例して該Ｗｅｂコンテンツの全体を表示する際の処理時間および処理負担が増大する、縮小後の画像の視認性が著しく低下する等の問題が懸念される。

本発明は上記の事情に鑑みてなされたものであり、その目的とするところは、リソースの少ない端末装置上でのＷｅｂブラウジングでＷｅｂコンテンツの全体像をユーザに容易に把握させるのに好適なコンテンツ表示方法、コンテンツ表示プログラム、およびコンテンツ表示装置を提供することにある。

本発明の実施形態により、画面サイズよりも広い表示領域を想定して作成されるコンテンツを解析し、該解析結果に基づいて該コンテンツの一部の領域を画面上に示すコンテンツ表示方法が提供される。この方法は、該解析結果に基づいて、画面に表示中または表示が予定されるコンテンツ内の一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成ステップと、コンテンツの高さおよび幅を計算するステップと、該計算結果および第一の画像の表示サイズに基づいてコンテンツの高さおよび幅を示す第二の画像を生成する第二画像生成ステップと、該コンテンツ内における表示領域の位置に基づいて、第二の画像上に第一の画像が配置されるとともに、該第一の画像上に表示領域を示す第三の画像が配置されたガイド画像を生成するガイド画像生成ステップと、該生成されたガイド画像を画面に表示するガイド画像表示ステップとを含む。

このようなコンテンツ表示方法を実行することにより、コンテンツ全体に対する現在の閲覧領域の位置、およびコンテンツの全体像をユーザに容易に把握させることができる。また縮小画像の対象範囲がコンテンツ全体でなく一定の範囲に限られるため、縮小画像の生成にかかる時間や必要とされるリソースがコンテンツのデータ量に依存しない。さらに、第一の画像の縮小率がコンテンツの大きさ（高さおよび幅）に依存しないため、縮小画像である第一の画像の視認性が著しく低下するといった不都合も生じない。

ここで上記コンテンツ表示方法は、ユーザによる入力操作にしたがってコンテンツに対する画面スクロールを行う画面スクロールステップと、画面スクロールの操作量に応じて、第三の画像を第一の画像内で移動させる、または、第三の画像を第一の画像内で移動させつつ該第一の画像自体を第二の画像内で移動させる画像移動ステップとをさらに含み、画像移動ステップにおいて第一の画像を移動させる場合には、該第一の画像をコンテンツのスクロール先の表示領域の画像を含む画像に更新する方法としてもよい。

また、上記コンテンツ表示方法においては、画面スクロールが行われる間に限り画面にガイド画像を表示することが望ましい。

また、上記第二画像生成ステップにおいて、好ましくは、計算結果および第一の画像の表示サイズに基づいて第二の画像の高さおよび幅を算出し、該算出された高さまたは幅が所定の高さまたは所定の幅を超える場合には、該算出された高さまたは幅を該所定の高さまたは幅に縮小する。

また、本発明の実施形態により、上記コンテンツ表示方法をコンピュータに実行させるコンテンツ表示プログラムが提供される。

このようなコンテンツ表示プログラムを使用すれば、ユーザは、コンテンツ全体に対する現在の閲覧領域の位置、およびコンテンツの全体像を容易に把握することができる。また縮小画像の対象範囲がコンテンツ全体でなく一定の範囲に限られるため、縮小画像の生成にかかる時間や必要とされるリソースがコンテンツのデータ量に依存しない。さらに、第一の画像の縮小率がコンテンツの大きさに依存しないため、縮小画像である第一の画像の視認性が著しく低下するといった不都合も生じない。

また、本発明の実施形態により、画面サイズよりも広い表示領域を想定して作成されるコンテンツの一部の領域を画面上に表示可能なコンテンツ表示装置が提供される。この装置は、コンテンツを解析するコンテンツ解析手段と、該解析結果に基づいて画面に表示中または表示が予定されるコンテンツの一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成手段と、該解析結果に基づいてコンテンツの高さおよび幅を計算する計算手段と、該計算結果および第一の画像の表示サイズに基づいてコンテンツの高さおよび幅を示す第二の画像を生成する第二画像生成手段と、該コンテンツの一部の領域の位置に基づいて、第二の画像上に第一の画像が配置されるとともに、該第一の画像上に該一部の領域を示す第三の画像が配置されたガイド画像を生成するガイド画像生成手段とを備えており、生成されたガイド画像を画面に表示するものである。

このように構成されたコンテンツ表示装置によれば、コンテンツ全体に対する現在の閲覧領域の位置、およびコンテンツの全体像をユーザに容易に把握させることができる。また縮小画像の対象範囲がコンテンツ全体でなく一定の範囲に限られるため、縮小画像の生成にかかる時間や必要とされるリソースがコンテンツのデータ量に依存しない。さらに、第一の画像の縮小率がコンテンツの大きさに依存しないため、縮小画像である第一の画像の視認性が著しく低下するといった不都合も生じない。

上記コンテンツ表示装置は、ユーザによる入力操作にしたがってコンテンツに対する画面スクロールを行う画面スクロール手段と、画面スクロールの操作量に応じて、第三の画像を第一の画像内で移動させる、または、第三の画像を第一の画像内で移動させつつ該第一の画像自体を第二の画像内で移動させる画像移動手段とをさらに備えたものとしてもよく、画像移動手段により第一の画像が移動される場合には、該第一の画像をコンテンツのスクロール先の領域の表示画像を含む画像に更新することができる。

また上記コンテンツ表示装置は、画面スクロールが行われる間に限り画面にガイド画像を表示するよう構成されてもよい。

また上記第二画像生成手段は、好ましくは、計算結果および第一の画像の表示サイズに基づいて第二の画像の高さおよび幅を算出し、該算出された高さまたは幅が所定の高さまたは所定の幅を超える場合には、該算出された高さまたは幅を該所定の高さまたは幅に縮小する機能を有する。

また本発明の実施形態により、画面サイズよりも広い表示領域を想定して作成されるコンテンツを解析し、該解析結果に基づいて該コンテンツの一部の領域を画面上に表示するコンテンツ表示プログラムが提供される。このコンテンツ表示プログラムは、コンピュータを、解析結果に基づいて画面に表示中または表示が予定されるコンテンツの一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成手段、該解析結果および第一の画像の表示サイズに基づいてコンテンツの全域を示す第二画像生成手段、該コンテンツの一部の領域の位置に基づいて、第二の画像上に第一の画像が配置されるとともに、該第一の画像上に表示領域を示す第三の画像が配置されたガイド画像を生成するガイド画像生成手段、及び、該生成されたガイド画像を画面上の、コンテンツの閲覧を妨げない位置に表示するガイド画像表示手段として機能させるプログラムである。

上記の通り、以下に詳細を説明する本発明の実施形態により、リソースの少ない端末装置上でのＷｅｂブラウジングでＷｅｂコンテンツの全体像、および実際に表示されている領域がＷｅｂコンテンツ全体の中のどの辺りであるかをユーザに容易に把握させるのに好適なコンテンツ表示方法、コンテンツ表示プログラム、およびコンテンツ表示装置が提供される。

図１は、本発明の実施形態に係る端末装置の外観を示した概略図である。 図２は、本発明の実施形態に係る端末装置の概略構成を示したブロック図である。 図３は、本発明の実施形態に係るブラウザに含まれるブラウザエンジンの概略機能ブロック図である。 図４は、本発明の実施形態に係るブラウザ上で表示されるＰＣ向けコンテンツの表示例である。 図５は、本発明の実施形態に係るブラウザ上で表示されるＰＣ向けコンテンツの表示例である。 図６は、本発明の実施形態に係るブラウザが実行するバー生成処理のフローチャートである。 図７は、本発明の実施形態に係るブラウザが実行するバースクロール処理のフローチャートである。

発明を実施するための形態

先ず、本明細書において用いられる用語について定義する。
・ネットワーク
移動体通信事業者の移動体通信網、イントラネット、インターネット等を含む各種通信網
・コンテンツ
ネットワーク経由で伝送される、又は端末に格納されている、ユーザが閲覧する映像や画像、音声、文書、ワークシート等の情報、或いはそれらの組み合わせから構成される一纏まりの情報
・Ｗｅｂコンテンツ
コンテンツの一形態であり、ネットワーク経由で伝送される一纏まりの情報
・Ｗｅｂページ
Ｗｅｂコンテンツの一形態であり、ユーザがあるＵＲＩを指定したときに表示されるべき内容全体。すなわち、ディスプレイ上の画像をスクロールすることにより表示され得る内容全体。なお、Ｗｅｂページにはオンラインで閲覧されるものに限らず、オフラインで閲覧されるものも含まれる。オフラインで閲覧されるＷｅｂページには、例えばインターネット経由で伝送されてブラウザによりキャッシングされたページや、端末装置のローカルフォルダ等にｍｈｔ形式で保存されたページ等が含まれる。Ｗｅｂページは、例えばＨＴＭＬやＸＨＴＭＬ文書、イメージファイル、音声データ等の種々のデータ（Ｗｅｂページデータ）から構成される。

上記定義によれば、コンテンツはＷｅｂコンテンツを包含し、ＷｅｂコンテンツはＷｅｂページを包含する。

以下、図面を参照しながら、本発明の実施形態について説明する。

図１に、本発明の実施形態に係る端末装置１０の外観図を示す。また、図２に、端末装置１０の構成をブロック図で示す。なお、本実施形態に係る端末装置１０は携帯電話であるが、本発明の端末装置は携帯電話に限定されない。本発明の別の実施形態においては、端末装置は、例えばＰＤＡや、ＰＨＳ（Personal Handy phone System）、携帯ゲーム機、家電等の、ブラウザを搭載した各種の端末装置であってもよい。本発明は、特にＰＣ用ディスプレイよりもピクセル数の少ないディスプレイを有する各種の端末装置に対して効果的に適用され得る。

図２に示されるように、端末装置１０は、装置全体を統括的に制御するＣＰＵ（Central Processing Unit）１０３を備えている。ＣＰＵ１０３にはバス１１９を介して端末装置１０の各構成要素が接続されている。ＣＰＵ１０３は、バス１１９を介して他の各構成要素と通信を行うことにより各種機能を実現する。これらの構成要素には、フラッシュメモリ１０５、ＲＡＭ(Random Access Memory)１０７、ネットワークインタフェース１０９、ディスプレイ１１１、ユーザ入力デバイス１１３、およびＶＲＡＭ（Video Random Access Memory）１１５等がある。なお、バス１１９は、データラインの他に電源ラインも備えている。ＣＰＵ１０３を始めとする端末装置１０の各構成要素には、図示しないバッテリから電源ラインを介して電力が供給される。

フラッシュメモリ１０５には、端末装置１０全体を管理するＯＳ（Operating System）１０５０、およびＯＳ１０５０上で動作するブラウザ１０５１を始めとする各種アプリケーションが格納されている。ブラウザ１０５１は、所定のマークアップ言語で記述されたオンラインまたはオフラインのコンテンツを閲覧するための情報閲覧ソフトウェアである。ブラウザ１０５１は、コンパクトＨＴＭＬ等で記述されたモバイル機器向けのＷｅｂコンテンツだけでなく、ＰＣ向けコンテンツにも対応している。

ＲＡＭ１０７は、端末装置１０の主記憶メモリであり、ＣＰＵ１０３が使用する各種データやプログラムの展開先である。例えば、ユーザ入力デバイス１１３によりブラウザ１０５１を起動させる操作が行われると、ブラウザ１０５１はフラッシュメモリ１０５から読み出されてＲＡＭ１０７のワークエリアに展開される。ユーザによるＷｅｂコンテンツへのアクセス操作等に応じてブラウザ１０５１とＣＰＵ１０３等のハードウェアとが協働して処理を行い、その結果、ユーザは、ディスプレイ１１１を通じてＷｅｂブラウジング、すなわちＷｅｂコンテンツを閲覧することができる。

端末装置１０には、ユーザ入力デバイス１１３として、５ウェイキー１１３ａ（上下左右の４つの方向キーと決定キーとから構成される複合キー）、テンキー１１３ｂ等が設けられている。ユーザによるユーザ入力デバイス１１３のキー操作が行われると、該操作に応じた信号がＣＰＵ１０３に入力される。そして、ＣＰＵ１０３が入力信号に応じた処理を実行することにより、Ｗｅｂブラウジングを始めとする様々な機能が端末装置１０で達成される。ユーザは、Ｗｅｂブラウジング中に、５ウェイキー１１３ａやテンキー１１３ｂを操作して、閲覧中のＷｅｂコンテンツを画面上にスクロールさせることができる。

なお、ユーザ入力デバイス１１３は、本実施形態の５ウェイキー１１３ａやテンキー１１３ｂ等のメカニカルキーである必要がなく、メンブレンキーやタッチパネル等の別種のキー入力デバイスにより構成されてもよい。

ユーザ入力デバイス１１３が例えばタッチパネルで構成される場合、操作キーに相当する操作画面は、ディスプレイ１１１と一体または別個の表示画面により構成される。前者の場合、ディスプレイ１１１そのものがタッチパネルで構成されることとなる。また後者の場合、端末装置１０はディスプレイ１１１と操作用タッチパネルとの２画面構成となる。後者の場合、さらにディスプレイ１１１もタッチパネルで構成するか否かは、設計仕様に応じて適宜選択される。

このようにユーザ入力デバイス１１３がタッチパネルで構成される場合、画面上に表示された操作キーに対するペンタッチやフィンガータッチにより画面スクロール等の操作がなされるＧＵＩ（Graphical User Interface）環境が提供される。また、例えば、Ｗｅｂコンテンツ上を直接タッチすることにより各種操作がなされるＧＵＩ環境を提供することも可能である。このようなＧＵＩ環境下では、例えばＷｅｂコンテンツ上の任意の位置をフィンガータッチした状態でタッチパネル面を上下左右になぞると、それに応じた画面スクロールが行われる（例えばタッチパネル面を下から上に指でなぞると、Ｗｅｂコンテンツが下方向にスクロールする）。すなわち、この場合には、スタイラスや指等の動きに応じた画面スクロールがなされるため、より直感的な操作性がユーザに提供される。

また、ユーザ入力デバイス１１３はメカニカルキー、メンブレンキー、タッチパネル等の各種のキーを適宜組み合わせた構成としてもよい。また、ユーザ入力デバイス１１３は、端末装置１０本体と独立した操作端末（例えば、リモートコントローラ）であってもよい。

さらには、メカニカルキーやメンブレンキー、タッチパネル等以外の構成要素をユーザ入力デバイス１１３に組み込むことも可能である。このような構成要素の一例として、ジャイロセンサ、加速度センサ、ジャークセンサ等が挙げられる。この場合、例えばＣＰＵ１０３がこれらのセンサの出力を監視して端末装置１０本体の傾斜角度、角速度、加速度、躍度（加速度の時間変化率）等を測定し、その測定値に応じた画面スクロールがＣＰＵ１０３とブラウザ１０５１との連係動作によって実現される。例えばユーザが端末装置１０本体を上下左右に移動や傾斜をさせると、その移動方向や速度、傾斜角度等に応じた画面スクロールが行われる。このため、ユーザはＷｅｂコンテンツの表示領域をより直感的にスクロールさせることができる。

また、本実施形態の端末装置１０は、通常使用時（すなわち、図１の上下方向が天地となるように端末装置１０を向けた状態）において、画面のアスペクト比が例えば３：４（つまり、縦長のポートレート表示）となるように設計されている。そしてこの状態から端末装置１０の姿勢が変えられると、ＣＰＵ１０３はジャイロセンサ等の出力に基づいて端末装置１０の姿勢の変化を検知する。ブラウザ１０５１は、ＣＰＵ１０３による検知結果に基づいて、ディスプレイ１１１に表示中のＷｅｂコンテンツに対する、端末装置１０の姿勢に応じたレンダリングを行う。例えば、端末装置１０が、図１に示される姿勢から当該紙面内で９０度回転されると、画面のアスペクト比が４：３（つまり、横長のランドスケープ表示）となる。このときブラウザ１０５１は、ディスプレイ１１１に表示中のＷｅｂコンテンツを横長の画面に合わせて再レンダリングする。このように画面の向きが変えられると、例えばレンダリング時におけるテキストの折返し位置等に差が生じ、Ｗｅｂコンテンツの見栄えが変わる。

また、本実施形態の端末装置１０は、図１に示されるように、一体形成されたボディでディスプレイ１１１とユーザ入力デバイス１１３を保持するいわゆるストレート型の携帯電話であるが、別のボディ構成であってもよい。別の実施形態においては、例えば折り畳み型、回転２軸ヒンジ型、サイクロイド型、スイング型等の他の構造が採用されてもよい。例えば、サイクロイド型やスイング型の携帯電話は、ディスプレイ１１１を保持するディスプレイ側ボディを、ユーザ入力デバイス１１３を保持する本体側ボディに対してディスプレイ１１１と平行な面内で回転させられるように構成されている。このような携帯電話では、ディスプレイ側ボディの回転角度に応じて画面の向きが変わる。そしてブラウザ１０５１は画面の向きの変化に連動するように、ディスプレイ１１１に表示中のＷｅｂコンテンツを該向きに応じて再レンダリングする。

次にブラウザ１０５１の機能、特に、ブラウザ１０５１の基本的な構成要素であるブラウザエンジン３０について詳しく説明する。図３は、ブラウザエンジン３０の機能ブロック図である。図３に示されるように、ブラウザエンジン３０は、パーサ３１、ページメーカ３２、およびページエディタ３３の各機能ブロックから構成される。

Ｗｅｂコンテンツへのアクセス操作、例えばユーザ入力デバイス１１３によりＵＲＩの入力がなされると（またはＷｅｂコンテンツ上のアンカー要素が選択されたことによりＵＲＩが指定される、あるいは、端末装置１０内部にブックマークや履歴として保持されたＵＲＩが選択されると）、ブラウザ１０５１は、ＨＴＴＰ（Hypertext Transfer Protocol）に準拠した、Ｗｅｂコンテンツ等のリソースを要求するリクエスト・メッセージを生成してネットワーク上の指定ＵＲＩに送信する。

次いで、指定ＵＲＩに対応するサーバは、受け取ったリクエスト・メッセージに応じたレスポンス・メッセージを作成して返信する。返信されたレスポンス・メッセージは、ネットワークを経由してブラウザ１０５１に届き、パーサ３１に渡される。レスポンス・メッセージのメッセージ・ボディには、指定ＵＲＩに対応する、ＨＴＭＬやＸＨＴＭＬ等で記述されているマークアップ文書２１が埋め込まれている。なお、マークアップ文書２１は、ＰＣ用ディスプレイの画面サイズ（携帯端末１０のディスプレイ１１１の画面サイズよりも大きい）を想定して作成されたＰＣ向けコンテンツを記述したものである。

パーサ３１は、マークアップ文書２１を解析し、その解析結果からマークアップ文書２１の論理構造（すなわち、マークアップ文書２１を構成する要素とその相互関係）をツリー構造で表現したドキュメントツリー２３（例えば、ＤＯＭ（Document Object model）ツリー）を生成してＲＡＭ１０７に展開する。なお、ドキュメントツリー２３は、マークアップ文書２１の各要素をノードにもつ、マークアップ文書２１のアウトラインを表すデータである。ドキュメントツリー２３はマークアップ文書２１の論理構造を提供するのみであり、ドキュメントの表現様式に関する情報までは含んでいない。

ページメーカ３２は、ドキュメントツリー２３を基に、各タグで決められた表示スタイル（block, inline, table, list, item等）の情報を含むエレメントツリー２５を生成し、マークアップ文書２１内で指定されている画像のリクエストやイベント処理の登録等を行い、ＲＡＭ１０７に格納する。エレメントツリー２５は、block, inline, table, list, item等がどのような順番に存在しているかを表現しているが、これらの要素が画面のどこにどのような幅と高さで表示されるか、テキストがどこで折り返されるか、等のレイアウトに関する情報までは含んでいない。

ところで、ブラウザ１０５１は、種々の表示倍率や表示モードでＷｅｂコンテンツをレンダリングする機能を有している。ここでは、標準的な画面サイズのＰＣ用ディスプレイで閲覧した場合と同じレイアウト（以下、「標準レイアウト」という）でＰＣ向けコンテンツを閲覧できるようにレンダリングするモードにブラウザ１０５１が設定されている場合を想定して説明する。なお、説明の便宜上、ここでは標準的な画面サイズをもつ仮想的なＰＣ用ディスプレイの表示領域を「仮想表示領域」という。

従ってページエディタ３３は、仮想表示領域等の表示に関する情報を用いて、エレメントツリー２５の各ノード（要素）のレイアウト（つまり各要素のテキストの折り返しや、画面上の位置、幅、高さ等）や色等を一つずつ決定し、各要素のレイアウトを表現するレイアウトツリー２７を生成する。またページエディタ３３は、各要素のレイアウトが決定される毎に、その時点でレイアウトが決定された要素が収まる最小限の広さの領域を、ＰＣ向けコンテンツ全体の大きさ（ＰＣ向けコンテンツの縦方向の長さ（高さ）と横方向の長さ（幅））として計算し、その計算結果を保持する。このためページエディタ３３は、ＰＣ向けコンテンツ全体の真の大きさを、全ての要素のレイアウトが決定した時点、つまり事後的に把握することとなる。

レイアウトが決定された要素は、ページエディタ３３により逐次レンダリングされ、ＲＡＭ１０７上のイメージバッファ１０７１に記録される。イメージバッファ１０７１はＲＡＭ１０７の所定領域に作成されたイメージバッファであり、そのイメージ領域は仮想表示領域、すなわち標準的なＰＣ用ディスプレイの画面サイズに対応している。

イメージバッファ１０７１（すなわち仮想表示領域）には、ディスプレイ１１１への表示が予定されるＰＣ向けコンテンツの領域およびその周辺領域に含まれる要素がレンダリングされる。しかしイメージバッファ１０７１の全領域のレンダリング結果（描画オブジェクト）がディスプレイ１１１に表示されるわけではない。ディスプレイ１１１には、ブラウザ１０５１が指定するイメージバッファ１０７１上の、ディスプレイ１１１の画面サイズに対応する領域（以下、当該領域を「指定領域」という。）のレンダリング結果が表示される。

ＶＲＡＭ１１５は、ディスプレイ１１１に直接表示される内容を保持するメモリであり、ディスプレイ１１１の画面サイズに対応するイメージ領域を有する。ＶＲＡＭ１１５には、イメージバッファ１０７１の指定領域にレンダリングされた内容が書き込まれる。このためレイアウトが決定された要素がイメージバッファ１０７１に逐次レンダリングされると、そのレンダリング結果がＶＲＡＭ１１５に逐次書き込まれていく。これにより、ＰＣ向けコンテンツの各要素がディスプレイ１１１に次々と表示される。ブラウザ１０５１による以上の処理を経て、標準レイアウトでレンダリングされたＰＣ向けコンテンツがディスプレイ１１１に表示される。

なおブラウザ１０５１は、ＰＣ向けコンテンツ全体における仮想表示領域の位置、および該仮想表示領域上の指定領域の位置を管理している。ブラウザ１０５１は、ユーザ入力デバイス１１３による画面スクロール操作に応じて、指定領域をイメージバッファ１０７１内で移動させる。該指定領域の移動に伴ってＶＲＡＭ１１５に書き込まれる内容が更新されることにより、画面スクロール操作に応じたＰＣ向けコンテンツの領域がディスプレイ１１１に表示される。

また画面スクロールの操作量が一定の操作量を超えたとき、ブラウザ１０５１は、画面スクロール操作に応じて移動したＰＣ向けコンテンツの表示領域（仮想表示領域）に含まれる要素をレンダリングしてイメージバッファ１０７１に記録する。つまりイメージバッファ１０７１の内容は、画面スクロール操作に応じてＰＣ向けコンテンツ内を移動した仮想表示領域に含まれる要素をレンダリングしたものに更新される。

またブラウザ１０５１は、表示画面の所定位置に操作ボタン等の画像が配置されるようにＶＲＡＭ１１５に画像データを書き込む。このためディスプレイ１１１には、標準レイアウトでレンダリングされたＰＣ向けコンテンツに操作ボタン等が重畳された画像が表示される。

図４および図５は、標準レイアウトでレンダリングされたＰＣ向けコンテンツの表示例を示す図である。本実施形態では、ＰＣ向けコンテンツ表示中に画面スクロール操作が行われると、該画面スクロール操作中（スクロール操作直後の一定時間を含む）に限り、図４や図５に示されるように表示画面右端にバー２００（ガイド画像）が表示される。なお、図４および図５では、ＰＣ向けコンテンツの各要素が一点鎖線で示されている。

バー２００は全体バー２０１、仮想表示領域画像２０３、および網掛け部２０５で構成される。全体バー２０１は半透明に表示される矩形のバーであり、ＰＣ向けコンテンツ全体の大きさ（ＰＣ向けコンテンツ全体の高さと幅）を示すものである。仮想表示領域画像２０３は全体バー２０１上に配置されている。仮想表示領域画像２０３は、ディスプレイ１１１に現在表示されているＰＣ向けコンテンツの領域およびその領域周辺を含む範囲であって、仮想表示領域、すなわち標準的な画面サイズのＰＣ用ディスプレイに表示される範囲の画像を縮小した画像である。網掛け部２０５は仮想表示領域画像２０３上に配置された半透明に表示される矩形の画像であり、ディスプレイ１１１に現在表示されているＰＣ向けコンテンツの領域を示している。

図４の状態で画面左および下方向へのスクロール操作が行われると仮想表示領域画像２０３および網掛け部２０５が移動して、バー２００は例えば図５のように変化する。図５においては、仮想表示領域画像２０３は該スクロール操作に応じた量だけ全体バー２０１に対して下方向に移動し、かつ、網掛け部２０５は該スクロール操作に応じた量だけ仮想表示領域画像２０３に対して左方向に移動している。すなわち仮想表示領域画像２０３と網掛け部２０５は、スクロール操作に連動して全体バー２０１内を移動する。

このためユーザは、バー２００を視認（具体的には、全体バー２０１に対する仮想表示領域画像２０３または網掛け部２０５の位置やサイズ等を確認）することにより、ＰＣ向けコンテンツ全体に対する現在の閲覧領域の位置を容易に掴むことができる。また仮想表示領域画像２０３と網掛け部２０５を視認することにより、現在閲覧している領域周辺にどのようなコンテンツが配置されているかを感覚的に掴むことができる。この結果、ユーザは、ＰＣ向けコンテンツの全体像をイメージしやすくなり、例えばＰＣ向けコンテンツ内の閲覧したい箇所に速やかに画面をスクロールさせることができる。

ブラウザ１０５１は画面スクロール操作を受け付けると、バー２００を生成するバー生成処理を実行する。以下、図６に示されるフローチャートを参照しながら、バー生成処理を説明する。なお、以下の説明及び添付のフローチャートにおいて、ステップを「Ｓ」と略記する。

先ず、ブラウザエンジン３０による上述した一連の処理、すなわちＰＣ向けコンテンツの解析処理からイメージバッファ１０７１へのレンダリング処理までの一連の処理が完了している状態を前提にバー生成処理を説明する。図６に示されるように、ブラウザ１０５１は、イメージバッファ１０７１の全領域（すなわち仮想表示領域）の画像を取得して（Ｓ１）、該取得した画像を所定の表示サイズに縮小して仮想表示領域画像２０３を生成する（Ｓ２）。仮想表示領域画像２０３の表示サイズは予め定められているが、ユーザの利便性を鑑みて自由に設定することができる。

ブラウザ１０５１は、仮想表示領域画像２０３の表示サイズの情報と、この表示サイズの情報を使ってページエディタ３３により計算されたＰＣ向けコンテンツ全体の大きさの情報とを基に、全体バー２０１の表示サイズ（高さおよび幅）を計算する（Ｓ３）。例えばＰＣ向けコンテンツがＰＣ用ディスプレイの４画面分の高さを有する場合、計算結果として得られる全体バー２０１の高さは仮想表示領域画像２０３の高さの４倍の値となる。

ここで、全体バー２０１の表示サイズが大きすぎるとＰＣ向けコンテンツが全体バー２０１に隠れてしまい、ＰＣ向けコンテンツ自体の閲覧性が低下することが懸念される。このため本実施形態では、全体バー２０１の最大表示高さと最大表示幅が予め定められている。

ブラウザ１０５１はＳ３の計算処理で得られた全体バー２０１の表示サイズと、全体バー２０１の最大表示高さおよび最大表示幅とを比較して、ディスプレイ１１１に表示される全体バー２０１のサイズを決定する（Ｓ４）。例えばＳ３の処理で計算された全体バー２０１の高さ（または幅）が最大表示高さ（または最大表示幅）を超える場合、ブラウザ１０５１は、全体バー２０１の高さ（または幅）を最大表示高さ（または最大表示幅）に修正し、修正後のサイズを全体バー２０１の表示サイズとする。なお全体バー２０１の最大表示高さと最大表示幅も仮想表示領域画像２０３の表示サイズと同様に、自由に設定することができる。

ブラウザ１０５１は、Ｓ４の処理で決定された全体バー２０１の表示サイズに基づいて全体バー２０１の画像を生成する（Ｓ５）。また所定のメモリ領域（例えばフラッシュメモリ１０５上の領域）に格納された網掛け部２０５の画像を呼び出す（Ｓ６）。そして、Ｓ５の処理で生成された全体バー２０１の画像、Ｓ２の処理で生成された仮想表示領域画像２０３、およびＳ６の処理で呼び出された網掛け部２０５の画像を組み合わせてバー２００（ガイド画像）を生成する（Ｓ７）。Ｓ７の処理では、ブラウザ１０５１は、ＰＣ向けコンテンツ全体における仮想表示領域（または指定領域）の位置を考慮して全体バー２０１上に仮想表示領域画像２０３を配置し、さらに、仮想表示領域上の指定領域の位置を考慮して仮想表示領域画像２０３上に網掛け部２０５を配置する。このようにして作成された画像がＶＲＡＭ１１５に書き込まれると、例えば図４や図５に示されるように表示画面右端にバー２００が表示される。

ユーザは、このようなバー生成処理で生成されたバー２００を視認することにより、ＰＣ向けコンテンツ全体に対する現在の閲覧領域の位置を容易に掴むことができる。また現在閲覧している領域周辺にどのようなコンテンツが配置されているかを視認できるため、ＰＣ向けコンテンツの全体像を容易にイメージすることができる。またレンダリングされる画像がＰＣ向けコンテンツ全体でなく一定の範囲（仮想表示領域）に限られるため、バー２００の生成処理にかかる時間や必要とされるリソースがＰＣ向けコンテンツのデータ量に依存しないといった有利な点がある。つまりＰＣ向けコンテンツのデータ量が多い場合でも、特許文献１や２で懸念される処理時間や処理負担等の問題が発生しない。さらに、仮想表示領域画像２０３の縮小率がＰＣ向けコンテンツの大きさ（高さおよび幅）に依存せず一定であるため、縮小後の画像の視認性が著しく低下するといった不都合も生じない。

またバー２００は一般的なブラウザが有するスクロールバーの役割を兼ね備えるため、ブラウザ１０５１ではスクロールバーは表示されない。このためＰＣ向けコンテンツの表示範囲が従来スクロールバーが表示されていた箇所（例えば画面の右辺や下辺等の画面周辺沿い）にも広がり、ＰＣ向けコンテンツの閲覧性が向上する。また画面スクロール操作が中断されるとバー２００はディスプレイ１１１から消去される。この点もＰＣ向けコンテンツの閲覧性を向上させる要因となる。

またＰＣ向けコンテンツの各要素は、原則左から右、上から下にレイアウトされる。このため各要素は左寄りにレイアウトされやすく、画面右端まで要素がレイアウトされないこともある。このため本実施形態のように表示画面右端にバー２００が表示されてもＰＣ向けコンテンツの閲覧は比較的妨げられない。

図７は、図６のバー生成処理が実行された後に画面スクロールの操作量に応じて実行されるバースクロール処理のフローチャートを示す図である。画面スクロール操作が行われたとき、ブラウザ１０５１は、上述したように、その操作量に応じて指定領域をイメージバッファ１０７１内で移動させる。そしてこれに伴い、ディスプレイ１１１に表示されるＰＣ向けコンテンツの領域も移動される。このときブラウザ１０５１は、該指定領域の移動に連動するように仮想表示領域画像２０３上の網掛け部２０５の位置を移動させる（Ｓ１１）。

そして上記画面スクロールの操作量が一定の操作量を超えた場合（Ｓ１２：ＹＥＳ）、ブラウザ１０５１は、上述したように、その操作量に応じてＰＣ向けコンテンツ内を移動した仮想表示領域に含まれるＰＣ向けコンテンツの各要素をイメージバッファ１０７１にレンダリングする。次いで、イメージバッファ１０７１にレンダリングされた新たな画像を縮小して仮想表示領域画像２０３を生成し全体バー２０１上に配置するとともに、該配置された仮想表示領域画像２０３を全体バー２０１内で画面スクロール操作に応じて移動させる（Ｓ１３）。このようなバースクロール処理が実行されることにより、バー２００は例えば図４から図５の表示に変わる。

次に、バー２００がブラウザ１０５１の動作する間常に表示される実施形態を説明する。当該実施形態においても図６と同様のバー生成処理が実行される。ところが、サーバからレスポンス・メッセージを受け取った直後はパーサ３１の解析処理等が実行されていないため、イメージバッファ１０７１には何のデータも書き込まれていない。またこの段階では、ＰＣ向けコンテンツの大きさ（高さおよび幅）はブラウザ１０５１にとって未知である。このため初期的には、図４や図５に示される仮想表示領域画像２０３と同一の形状および大きさを有する白い仮想表示領域画像２０３が生成される。また、形状および大きさを仮想表示領域画像２０３と便宜上一致させた全体バー２０１が生成される。この結果ディスプレイ１１１には、全体バー２０１上に白い仮想表示領域画像２０３が配置されたバー２００が表示される。

そしてブラウザエンジン３０による解析処理等が進みイメージバッファ１０７１上に各要素がレンダリングされるにしたがって、仮想表示領域画像２０３にもレンダリング結果が次々と反映されていく。また全体バー２０１は、ページエディタ３３がＰＣ向けコンテンツの大きさを計算する毎に、その計算結果に基づいて決定されたものに更新される（つまりディスプレイ１１１に表示される全体バー２０１はブラウザエンジン３０による処理の進行とともに高さおよび幅方向に広がっていく）。

本発明は、これらの実施形態に限定されるものではなく、本発明の技術的思想の範囲において様々な変形が可能である。例えば仮想表示領域画像２０３が示す領域は、仮想表示領域すなわち標準的なＰＣ用ディスプレイの表示領域に限らず、設計に応じて種々の領域に選択される。また仮想表示領域は、例えばブラウザ１０５１のメニュー操作により自在に設定できるようにしてもよい。あるいは、ディスプレイ１１１の姿勢（縦向きまたは横向き等）に連動して変化するようにしてもよい。

Claims (10)

1. 画面サイズよりも広い表示領域を想定して作成されたコンテンツを解析し、該解析結果に基づいて該コンテンツの一部の領域を画面上に表示するコンテンツ表示方法において、
   前記解析結果に基づいて、前記画面に表示中または表示が予定される前記コンテンツの一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成ステップと、
   前記コンテンツの高さおよび幅を計算するステップと、
   前記計算結果および前記第一の画像の表示サイズに基づいて前記コンテンツの高さおよび幅を示す第二の画像を生成する第二画像生成ステップと、
   前記コンテンツの一部の領域の位置に基づいて、前記第二の画像上に前記第一の画像が配置されるとともに、該第一の画像上に前記一部の領域の位置及び大きさを示す第三の画像が配置されたガイド画像を生成するガイド画像生成ステップと、
   前記生成されたガイド画像を前記画面に表示するガイド画像表示ステップと
   を含む方法。
2. ユーザによる入力操作にしたがって前記コンテンツに対する画面スクロールを行う画面スクロールステップと、
   前記画面スクロールの操作量に応じて、前記第三の画像を前記第一の画像内で移動させる、または、前記第三の画像を前記第一の画像内で移動させつつ該第一の画像を前記第二の画像内で移動させる画像移動ステップと
   をさらに含み、
   前記画像移動ステップにおいて前記第一の画像を移動させる場合には、該第一の画像を前記コンテンツのスクロール先の前記一部の領域の画像を含む画像に更新する、請求項１に記載のコンテンツ表示方法。
3. 前記画面スクロールが行われる間に限り前記画面に前記ガイド画像を表示する、請求項１に記載のコンテンツ表示方法。
4. 前記第二画像生成ステップにおいて、前記計算結果および前記第一の画像の表示サイズに基づいて前記第二の画像の高さおよび幅を算出し、該算出された高さまたは幅が所定の高さまたは所定の幅を超える場合には、該算出された高さまたは幅を該所定の高さまたは幅に縮小する、請求項１に記載のコンテンツ表示方法。
5. 請求項１に記載されたコンテンツ表示方法をコンピュータに実行させるためのコンテンツ表示プログラム。
6. 画面サイズよりも広い表示領域を想定して作成されるコンテンツの一部の領域を画面上に表示可能なコンテンツ表示装置において、
   前記コンテンツを解析するコンテンツ解析手段と、
   前記解析結果に基づいて前記画面に表示中または表示が予定される前記コンテンツの一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成手段と、
   前記解析結果に基づいて前記コンテンツの高さおよび幅を計算する計算手段と、
   前記計算結果および前記第一の画像の表示サイズに基づいて前記コンテンツの高さおよび幅を示す第二の画像を生成する第二画像生成手段と、
   前記コンテンツの一部の領域の位置に基づいて、前記第二の画像上に前記第一の画像が配置されるとともに、該第一の画像上に前記一部の領域を示す第三の画像が配置されたガイド画像を生成するガイド画像生成手段と
   を備え、前記生成されたガイド画像を前記画面に表示することを特徴とするコンテンツ表示装置。
7. ユーザによる入力操作にしたがって前記コンテンツに対する画面スクロールを行う画面スクロール手段と、
   前記画面スクロールの操作量に応じて、前記第三の画像を前記第一の画像内で移動させる、または、前記第三の画像を前記第一の画像内で移動させつつ該第一の画像自体を前記第二の画像内で移動させる画像移動手段と
   をさらに備え、
   前記画像移動手段により前記第一の画像が移動される場合には、該第一の画像を前記コンテンツのスクロール先の領域の表示画像を含む画像に更新することを特徴とする請求項６に記載のコンテンツ表示装置。
8. 前記画面スクロールが行われる間に限り前記画面に前記ガイド画像を表示することを特徴とする請求項６に記載のコンテンツ表示装置。
9. 前記第二画像生成手段は、前記計算結果および前記第一の画像の表示サイズに基づいて前記第二の画像の高さおよび幅を算出し、該算出された高さまたは幅が所定の高さまたは所定の幅を超える場合には、該算出された高さまたは幅を該所定の高さまたは幅に縮小することを特徴とする請求項６に記載のコンテンツ表示装置。
10. 画面サイズよりも広い表示領域を想定して作成されるコンテンツを解析し、該解析結果に基づいて該コンテンツの一部の領域を画面上に表示するコンテンツ表示プログラムにおいて、
    コンピュータを、
    前記解析結果に基づいて前記画面に表示中または表示が予定される前記コンテンツ内の一部の領域を少なくとも含む所定範囲の画像を縮小した第一の画像を生成する第一画像生成手段、
    前記解析結果および前記第一の画像の表示サイズに基づいて前記コンテンツの全域を示す第二画像生成手段、
    前記コンテンツの一部の領域の位置に基づいて、前記第二の画像上に前記第一の画像が配置されるとともに、該第一の画像上に前記一部の領域の位置及び大きさを示す第三の画像が配置されたガイド画像を生成するガイド画像生成手段、
    前記生成されたガイド画像を前記画面上の、前記コンテンツの閲覧を妨げない位置に表示するガイド画像表示手段、
    として機能させるためのコンテンツ表示プログラム。

Images