(57)【要約】【課題】ソース構造化文書と、中間構造化文書、レイアウトの三つの対応を分かりやすく表示する。【解決手段】ソース構造化文書の構造を表示するウインドウ1と、中間構造化文書の構造を表示するウインドウ2と、レイアウトを表示するウインドウ3と、ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域に対応するかを記録する対応管理手段2と、ウインドウ1からユーザがソース要素を選択する手段を備え、選択手段によって選択されたソース要素に対応する中間要素を対応管理手段1によって特定し、特定された中間要素をウインドウ2で強調表示し、特定された中間要素に対応するレイアウト領域を対応管理手段2によって特定し、特定されたレイアウト領域をウインドウ3で強調表示する。【選択図】図１
2018195009.tif 000002
【特許請求の範囲】
【請求項１】
スタイルシートを参照するソース構造化文書を与えられて、このソース構造化文書からまず中間構造化文書を生成し、生成された中間構造化文書をレイアウトするという処理をコンピュータに行わせるためのプログラムであって、
ソース構造化文書の構造を表示するウインドウ1と、
中間構造化文書の構造を表示するウインドウ2と、
レイアウトを表示するウインドウ3と、
ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、
中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域が生成されたかを記録する対応管理手段2と、
ウインドウ1からユーザがソース要素を選択する選択手段と、
をコンピュータに実現させ、
選択手段によって選択されたソース要素に対応する中間要素を対応管理手段1によって特定し、対応していることがユーザに分かるようにこの中間要素をウインドウ2で表示し、この中間要素に対応するレイアウト領域を対応管理手段2によって特定し、対応していることがユーザに分かるようにこのレイアウト領域をウインドウ3で表示する処理をコンピュータに行わせるためのプログラム。
【請求項２】
スタイルシートを参照するソース構造化文書を与えられて、このソース構造化文書からまず中間構造化文書を生成し、生成された中間構造化文書をレイアウトするという処理をコンピュータに行わせるためのプログラムであって、
ソース構造化文書の構造を表示するウインドウ1と、
中間構造化文書の構造を表示するウインドウ2と、
レイアウトを表示するウインドウ3と、
ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、
中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域が生成されたかを記録する対応管理手段2と、
ウインドウ2からユーザが中間要素を選択する選択手段と、
をコンピュータに実現させ、
選択手段によって選択された中間要素に対応するソース要素を対応管理手段1によって特定し、対応していることがユーザに分かるようにこのソース要素をウインドウ1で表示し、選択された中間要素に対応する領域を対応管理手段2によって特定し、対応していることがユーザに分かるようにこの領域をウインドウ3で表示する処理をコンピュータに行わせるためのプログラム。
【請求項３】
スタイルシートを参照するソース構造化文書を与えられて、このソース構造化文書からまず中間構造化文書を生成し、生成された中間構造化文書をレイアウトするという処理をコンピュータに行わせるためのプログラムであって、
ソース構造化文書の構造を表示するウインドウ1と、
中間構造化文書の構造を表示するウインドウ2と、
レイアウトを表示するウインドウ3と、
ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、
中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域が生成されたかを記録する対応管理手段2と、
ウインドウ3からユーザがレイアウト領域を選択する選択手段と、
をコンピュータに実現させ、
選択手段によって選択されたレイアウト領域に対応する中間要素を対応管理手段2によって特定し、対応していることがユーザに分かるようにこの中間要素をウインドウ2で表示し、この中間要素に対応するソース要素を対応管理手段1によって特定し、対応していることがユーザに分かるようにこのソース要素をウインドウ1で表示する処理をコンピュータに行わせるためのプログラム。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、前処理を含む文書レイアウト処理において、ユーザによる文書作成を支援することに関わる。
【背景技術】
【０００２】
文書レイアウト処理において、ユーザのデバッグを支援するための情報表示プログラムは近年になって発達している。とくに、ウェブブラウザにおいて、HTML文書をCSSスタイルシートによってレイアウトするときのデバッグ支援環境が整備されてきており、ウェブブラウザGoogle ChromeにおいてはDevTool（非特許文献１及び２を参照）というツールが、ウェブブラウザFirefoxにおいてはFireBugというツールが広く用いられている。
【０００３】
これらのツールは、HTML文書やCSSスタイルシートの内部構造を表示するとともに、文書のレイアウトを表示し、内部構造のどの部分が文書レイアウトのどの部分に対応するかを分かりやすく表示する。
【０００４】
より詳細に説明する。これらのツールは
HTML文書の構造を表示するウインドウ1と、
レイアウトを表示するウインドウ2と、
を備え、
HTML文書中の各ソース要素からレイアウトのどのレイアウト領域が生成されたかという関係を記録する。
【０００５】
ウインドウ1からユーザがソース要素を選択した場合には、選択されたソース要素に対応するレイアウト領域を、記録された関係に基づいて決定する。そして、選択されたソース要素に対応していることがユーザに分かるように、そのレイアウト領域をウインドウ2で表示する。
【０００６】
レイアウトを表示するウインドウからユーザがレイアウト領域を選択した場合には、選択されたレイアウト領域に対応するソース要素を決定し、記録された関係に基づいて決定する。そして、選択されたレイアウト領域に対応していることがユーザに分かるように、そのソース要素をウインドウ1において表示する。
【０００７】
ユーザは、意図しないレイアウトが得られたとき、これらのツールによってHTML文書やCSSスタイルシートのどこを修正すればよいのかを知ることができる。
【０００８】
次に、構造化文書一般のレイアウト処理について考える。HTML文書は、構造化文書の一例である。他の構造化文書として、LaTex、XMLなどがある。HTML文書にはCSSスタイルシートが一般に用いられているが、他の構造化文書は別のスタイルシート言語を用いることが多い。例えば、LaTeXのスタイルシートはTeXで書かれている。
【０００９】
構造化文書レイアウト処理における方法のひとつとして、構造化文書をまず前処理によって処理しやすい形の中間構造化文書に変形するという方法がある。この方法の一例として、索引を前処理によって自動生成してからレイアウトすることがあげられる。ユーザが与えるソース構造化文書では、末尾に索引は含まれていない。前処理によって作り出される中間構造化文書は、末尾に索引を含んでいる。前処理は、ソース構造化文書に含まれる情報を利用して索引を作り出している。LaTeXでは、mendexというプログラムが、この前処理を担当している。
【００１０】
中間構造化文書を利用する例のひとつに後注がある。これは、本文中に埋め込まれた注をすべて最後にまとめてレイアウトするものであり、中間構造化文書を利用することによってレイアウトが容易になる。図７に、ユーザが与えたソース構造化文書の木構造と、そこから前処理によって生成された中間文書の木構造を示す。ソース構造化文書の要素S4とS6が注であり、ソース構造化文書の中の要素S1とS2に分かれて格納されている。このS1とS2から、中間構造化文書の要素I8と要素I9がそれぞれ生成され、中間構造化文書に注をまとめるために生成された要素I3の下に置かれている。要素S3, S5,S6, S8は、要素I4, I5, I6, I7に対応する。
【００１１】
前処理は、HTML文書をレイアウトするとき、ウェブブラウザの能力を超えたレイアウトを行うためにも有益である。複雑なレイアウトであっても、いったん前処理によってレイアウト処理の一部を実現してやれば、残りのレイアウト処理をウェブブラウザに任せることができる。Vivliostyle.jsは、そのような前処理を実現するライブラリである。例えば、矩形ではない領域（円など）のまわりのテキスト流し込みをVivliostyle.jsは前処理によって実現している。Vivliostyle.jsでは、マルチカラムも同様に前処理によって実現している。Vivliostyle.jsの原型となったIDPFのEPUB Adaptive Layout (非特許文献３を参照)では、前処理によって処理されるCSSを定義している。
【００１２】
前処理を含むレイアウト処理においては、ユーザが与えたソース構造化文書がそのままレイアウト処理の対象となるのではない。したがって、ソース構造化文書の構造とレイアウトを表示しても、構造のどの部分がレイアウトのどの部分に対応するかを分かりやすくユーザに提示することが難しくなる。後注の例では、ソース文書の要素S4と要素S6が本文レイアウトではなく、最後のページに対応することを分かりやすく表示することが難しくなる。
【００１３】
前処理によって生成された中間構造化文書の内部構造とそのレイアウトを表示し、その対応を分かりやすく表示することは可能である。しかし、ソース構造化文書のどの部分が対応するのかはユーザには分からない。後注の例では、最後のページに対応する中間構造化文書の要素I8と要素I9が、ソース構造化文書の要素S4と要素S6に対応することがユーザには分からない。
【先行技術文献】
【非特許文献】
【００１４】
【非特許文献１】Google Chrome Developer Tools: Beginners Guide + Video Course (English Edition), SAPPROUK Limited, 2014
【非特許文献２】WEB+DB PRESS Vol.89, ISBN-13: 978-4774176383
【非特許文献３】IDPF, EPUB Adaptive Layout, http://www.idpf.org/epub/pgt/, 2012
【発明の概要】
【発明が解決しようとする課題】
【００１５】
本発明が解決しようとする課題は、ソース構造化文書と、中間構造化文書、レイアウトの三つの対応を分かりやすく表示することである。
【課題を解決するための手段】
【００１６】
第一の発明は、ソース構造化文書の構造を表示するウインドウ1と、中間構造化文書の構造を表示するウインドウ2と、レイアウトを表示するウインドウ3と、を備える。ウインドウ１、ウインドウ２、ウインドウ３はいずれもディスプレイによって実現される。
【００１７】
さらに、三者を連動させるデータを管理するために、ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域に対応するかを記録する対応管理手段2と、を備える。対応管理手段1、対応管理手段2はハードディスクやメモリなどのハードウェアによって実現される。
【００１８】
さらに、ユーザに入力させるためにウインドウ1からユーザがソース要素を選択する手段をハードウェアとして備える。
【００１９】
選択手段によって選択されたソース要素に対応する中間要素を対応管理手段1によって特定し、特定された中間要素をウインドウ2で強調表示し、特定された中間要素に対応するレイアウト領域を対応管理手段2によって特定し、特定されたレイアウト領域をウインドウ3で強調表示する。
【００２０】
ユーザは選択したソース要素が、どの中間要素に対応し、どのレイアウト領域が生成されたかを知ることができる。
【００２１】
第二の発明は、ソース構造化文書の構造を表示するウインドウ1と、中間構造化文書の構造を表示するウインドウ2と、レイアウトを表示するウインドウ3と、を備える。ウインドウ１、ウインドウ２、ウインドウ３はいずれもディスプレイによって実現される。
【００２２】
さらに、三者を連動させるデータを管理するために、ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域に対応するかを記録する対応管理手段2と、備える。対応管理手段1、対応管理手段2はハードディスクやメモリなどのハードウェアによって実現される。
【００２３】
さらに、ユーザに入力させるために、ウインドウ2からユーザが中間要素を選択する手段をハードウェアとして備える。
【００２４】
選択手段によって選択された中間要素に対応するソース要素を対応管理手段1によって特定し、特定されたソース要素をウインドウ1で強調表示し、選択された中間要素に対応する領域を対応管理手段2によって特定し、特定された領域をウインドウ3で強調表示する。
【００２５】
ユーザは選択した中間要素が、どのソース要素に対応し、どのレイアウト領域が生成されたかを知ることができる。
【００２６】
第三の発明は、ソース構造化文書の構造を表示するウインドウ1と、中間構造化文書の構造を表示するウインドウ2と、レイアウトを表示するウインドウ3と、を備える。ウインドウ１、ウインドウ２、ウインドウ３はいずれもディスプレイによって実現される。
【００２７】
さらに、三者を連動させるデータを管理するために、ソース構造化文書中の各ソース要素から中間構造化文書のどの中間要素が生成されたかという対応関係を記録する対応管理手段1と、中間構造化文書中の各中間要素はレイアウト中のどのレイアウト領域に対応するかを記録する対応管理手段2と、備える。対応管理手段1、対応管理手段2はハードディスクやメモリなどのハードウェアによって実現される。
【００２８】
さらに、ユーザに入力させるために、ウインドウ3からユーザがレイアウト領域を選択する手段をハードウェアとして備える。
【００２９】
選択手段によって選択されたレイアウト領域に対応する中間要素を対応管理手段2によって特定し、特定された中間要素をウインドウ2で強調表示し、特定された中間要素に対応するソース要素を対応管理手段1によって特定し、特定されたソース要素をウインドウ1で強調表示する。
【００３０】
ユーザは選択したレイアウト領域が、どの中間要素に対応し、どのソース要素に対応するかを知ることができる。
【図面の簡単な説明】
【００３１】
【図１】請求項1の実施形態の構成を示す図。
【図２】請求項1の実施形態のプログラムのウインドウ構成を示す図。
【図３】ソースHTML文書と中間HTML文書の対応関係を示す図。
【図４】中間HTML文書とレイアウト領域の対応関係を示す図。
【図５】請求項2の実施形態の構成を示す図。
【図６】請求項3の実施形態の構成を示す図。
【図７】後注をもつソース構造化文書と中間文書の対応を示す図
【発明を実施するための形態】
【００３２】
以下に添付図面を参照して、プログラムの実施形態を詳細に説明する。この実施形態においては、スタイルシートとしてはCSSスタイルシートを用い、構造化文書としてはHTML文書を用いる。
【００３３】
図１を用いて、請求項１の実施形態の構成を説明する。ソース構造化文書（ソースHTML文書）をウインドウ１が、中間構造化文書（中間HTML文書）をウインドウ２が、レイアウトをウインドウ３がそれぞれ表示している。ウインドウ１からソース構造化文書（ソースHTML文書）の一部を選択するための選択手段が提供されている。ソース構造化文書（ソースHTML文書）と中間構造化文書（中間HTML文書）の対応関係、中間構造化文書（中間HTML文書）とレイアウトの対応関係は、それぞれ対応管理手段１、対応管理手段２によってそれぞれ管理されている。
【００３４】
図２は、ウインドウ構成を示す図である。上のウインドウは、ウインドウ３であり、２カラムをもつレイアウトを表示している。左のウインドウは、ウインドウ１であり、あるソースHTML文書の構造を表示している。htmlは文書全体のルート要素であり、bodyは文書本体を表す要素であり、pは段落を表す要素であり、olは箇条書きを表す要素であり、liは箇条書き中の項目を表す要素である。右のウインドウは、ウインドウ２であり、このソースHTML文書から前処理によって生成された中間HTML文書の構造を表示している。htmlとbodyについてはソースHTML文書と同様である。先頭のdiv要素は、一ページ内の本文領域を表す要素である。二番目と三番目のdiv要素は、それぞれ左カラム、右カラムを表す要素であり、ソースHTML文書には存在しない。二つのp要素は、どちらもソースHTML文書のただ一つのp要素に対応しており、カラム境界によって分割されたものである。
【００３５】
どのソース要素がどの中間要素に対応するかの関係を図３に示す。中間HTML文書にある三つのdiv要素には、対応するソースHTML要素はない。中間HTML文書にある二つのp要素には、どちらもソースHTML文書の唯一のp要素が対応する。
【００３６】
この対応関係は、対応管理手段１によって表現される。具体的には、ソースHTML要素を表現するデータ構造に中間HTML要素を表現するデータ構造へのポインタを埋め込むこと、中間HTML要素を表現するデータ構造にソースHTML要素を表現するデータ構造へのポインタを埋め込むことよって表現することができる。ポインタでなくても、中間HTML要素を一意に特定する情報、ソースHTML要素を一意に特定する情報であれば何を埋め込んでも構わない。ポインタなどを直接埋め込むのではなく、要素を表現するデータ構造の外に、対応表を設けてもよい。
【００３７】
どの中間HTML要素がどのレイアウトに対応するかの関係を図４に示す。中間HTML文書の一番目のdiv要素は本文レイアウト領域に対応する。二番目と三番目のdiv要素は、それぞれ左カラムのレイアウト領域と右カラムのレイアウト領域に対応する。一番目のp要素は、左カラムに収まっている部分の先頭段落のレイアウト領域に対応し、二番目のp要素は、右カラムにあふれた部分の先頭段落のレイアウト領域に対応する。
【００３８】
この対応関係は、対応管理手段２によって表現される。具体的には、中間HTML要素を表現するデータ構造に、レイアウト領域を表現するデータ構造へのポインタを埋め込むこと、レイアウト領域を表現するデータ構造に、中間HTML要素を表現するデータ構造へのポインタを埋め込むことよって表現することができる。ポインタでなくても、中間HTML要素を一意に特定する情報、レイアウト領域を一意に特定する情報であれば何を埋め込んでも構わない。ポインタなどを直接埋め込むのではなく、対応表を外部に設けてもよい。
【００３９】
ウインドウ１に表示されたソースHTML要素を、ユーザはマウスなどを用いて選択し、プログラムはどのソースHTML要素が選択されたかを検出する。プログラムは、対応管理手段１を用いて、対応する中間HTML要素を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこの中間要素をウインドウ２で表示する。具体的には、ウインドウ２をスクロールさせてこの中間要素が見やすく表示されるようにしたのち、この中間要素を反転や色付けなどを行って表示する。
【００４０】
例えば、前述の例におけるソースHTML文書にあるp要素をユーザが選択したとする。対応管理手段１によって、中間HTML文書にある二つのp要素がこれに対応することが分かる。対応していることがユーザに分かるように二つの中間p要素をウインドウ２で反転表示する。
【００４１】
さらに、プログラムは対応管理手段２を用いて、特定された中間HTML要素に対応するレイアウト領域を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこのレイアウト領域をウインドウ３で表示する。具体的には、ウインドウ３をスクロールさせてこのレイアウト領域が見やすく表示されるようにしたのち、このレイアウト領域に反転や色付けなどを行って表示する。
【００４２】
例えば、前述の例では、中間HTML文書にある二つのp要素のうち、一番目のp要素は左カラム内の領域に、二番目のp要素は右カラム内の箇条書きの前までの領域に対応することが、対応管理手段２によって分かる。対応していることがユーザに分かるように二つのレイアウト領域をウインドウ３で反転表示する。
【００４３】
この実施形態では、ソース要素、中間要素、レイアウト領域だけについて述べた。しかし、ソース要素と中間要素は、属性、テキスト、適用されるCSSプロパティを持つ。レイアウト領域も、寸法や位置などの情報をもつ。ウインドウ１およびウインドウ２は、属性、テキスト、適用されるCSSプロパティも表示するようにしてもよく、ウインドウ３は、寸法や位置などを表示するようにしてもよい。対応管理手段1は、ソース要素と中間要素の対応関係だけではなく、ソース要素の属性、テキスト、適用されるCSSプロパティと、中間要素の属性、テキスト、適用されるCSSプロパティとの対応関係まで含めて管理するようにしてもよい。対応管理手段2は、中間要素とレイアウト領域の対応関係だけではなく、中間要素の属性、テキスト、適用されるCSSプロパティと、レイアウト領域の寸法、位置などの対応関係を管理するようにしてもよい。選択手段はソース要素だけではなく、ソース要素の属性、テキスト、適用されるCSSプロパティまで選択できるようにしてもよく、対応する中間要素の対応する属性、テキスト、適用されるCSSプロパティをウインドウ２で強調表示し、対応するレイアウト領域の寸法、位置などをウインドウ３で強調表示してもよい。
【００４４】
ウインドウ１, ２は、それぞれ二つ以上のサブウインドウに分けても構わない。例えば、三つのサブウインドウを設け、一番目のサブウインドウは要素からなる構造を表示し、二番目のサブウインドウには要素の内容、三番目のサブウインドウには要素の属性の一覧、四番目のサブウインドウには要素に適用されるCSSプロパティを表示してもよい。また、一つのウインドウのなかに要素、要素の内容、要素の属性、適用されるCSSプロパティを混在させて表示してもよい。
【００４５】
図５を用いて請求項２の実施形態の構成を説明する。ソース構造化文書をウインドウ１が、中間構造化文書をウインドウ２が、レイアウトをウインドウ３がそれぞれ表示している。ウインドウ２から中間構造化文書の一部を選択するための選択手段が提供されている。ソース構造化文書と中間構造化文書の対応関係、中間構造化文書とレイアウトの対応関係は、それぞれ対応管理手段１、対応管理手段２によってそれぞれ管理されている。
【００４６】
ウインドウ構成、ソース要素と中間要素の対応関係、中間要素とレイアウトの対応関係については、請求項１の実施形態のときと同様である（それぞれ図２、３、４を参照）。
【００４７】
ウインドウ２に表示された中間HTML要素を、ユーザはマウスなどを用いて選択し、プログラムはどの中間HTML要素が選択されたかを検出する。プログラムは、対応管理手段１を用いて、対応するソースHTML要素を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこのソース要素をウインドウ１で表示する。具体的には、ウインドウ１をスクロールさせてこのソース要素が見やすく表示されるようにしたのち、この中間要素を反転や色付けなどを行って表示する。
【００４８】
例えば、前述の例における中間HTML文書にある二つのp要素のうち二番目をユーザが選択したとする。対応管理手段１によって、ソースHTML文書にあるp要素がこれに対応することが分かる。対応していることがユーザに分かるようにソースp要素をウインドウ１で反転表示する。
【００４９】
さらに、プログラムは対応管理手段２を用いて、選択された中間HTML要素に対応するレイアウト領域を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこのレイアウト領域をウインドウ３で表示する。具体的には、ウインドウ３をスクロールさせてこのレイアウト領域が見やすく表示されるようにしたのち、このレイアウト領域に反転や色付けなどを行って表示する。
【００５０】
例えば、前述の例では、中間HTML文書にある二番目のp要素は右カラム内の箇条書きの前までの領域に対応することが、対応管理手段２によって分かる。対応していることがユーザに分かるようにこのレイアウト領域をウインドウ３で反転表示する。
【００５１】
この実施形態では、ソース要素、中間要素、レイアウト領域だけについて述べた。しかし、ソース要素と中間要素は、属性、テキスト、適用されるCSSプロパティを持つ。レイアウト領域も、寸法や位置などの情報をもつ。ウインドウ１およびウインドウ２は、属性、テキスト、適用されるCSSプロパティも表示するようにしてもよく、ウインドウ３は、寸法や位置などを表示するようにしてもよい。対応管理手段1は、ソース要素と中間要素の対応関係だけではなく、ソース要素の属性、テキスト、適用されるCSSプロパティと、中間要素の属性、テキスト、適用されるCSSプロパティとの対応関係まで含めて管理するようにしてもよい。対応管理手段2は、中間要素とレイアウト領域の対応関係だけではなく、中間要素の属性、テキスト、適用されるCSSプロパティと、レイアウト領域の寸法、位置などの対応関係を管理するようにしてもよい。選択手段は中間要素だけではなく、中間要素の属性、テキスト、適用されるCSSプロパティまで選択できるようにしてもよく、対応するソース要素の対応する属性、テキスト、適用されるCSSプロパティをウインドウ1で強調表示し、対応するレイアウト領域の寸法、位置などをウインドウ３で強調表示してもよい。
【００５２】
ウインドウ１, ２が、さらにサブウインドウに分けることができることは、請求項１の実施形態のときと同様である。
【００５３】
図６を用いて、請求項３の実施形態の構成を説明する。ソース構造化文書（ソースHTML文書）をウインドウ１が、中間構造化文書（中間HTML文書）をウインドウ２が、レイアウトをウインドウ３がそれぞれ表示している。ウインドウ３からレイアウト領域を選択するための選択手段が提供されている。ソース構造化文書（ソースHTML文書）と中間構造化文書（中間HTML文書）の対応関係、中間構造化文書（中間HTML文書）とレイアウトの対応関係は、それぞれ対応管理手段１、対応管理手段２によってそれぞれ管理されている。
【００５４】
ウインドウ構成、ソース要素と中間要素の対応関係、中間要素とレイアウトの対応関係については、請求項１の実施形態のときと同様である（それぞれ図２、３、４を参照）。
【００５５】
ウインドウ３に表示されたレイアウト領域を、ユーザはマウスなどを用いて選択し、プログラムはどのレイアウト領域が選択されたかを検出する。プログラムは、対応管理手段２を用いて、対応する中間HTML要素を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこの中間HTML要素をウインドウ２で表示する。具体的には、ウインドウ２をスクロールさせてこの中間HTML要素が見やすく表示されるようにしたのち、この中間HTML要素を反転や色付けなどを行って表示する。
【００５６】
例えば、前述の例では、右カラムの先頭から箇条書きの前までのレイアウト領域をユーザが選択したとする。対応管理手段２によって、中間HTML文書にある二番目のp要素がこのレイアウト領域に対応することが分かる。対応していることがユーザに分かるようこのp要素をウインドウ２で反転表示する。
【００５７】
さらに、プログラムは対応管理手段１を用いて、特定された中間HTML要素に対応するソースHTML要素を特定する。続いて、プログラムは、対応していることがユーザに分かるようにこのソースHTML要素をウインドウ１で表示する。具体的には、ウインドウ１をスクロールさせてこのソースHTML要素が見やすく表示されるようにしたのち、このソースHTML要素に反転や色付けなどを行って表示する。
【００５８】
例えば、前述の例では、中間HTML文書にある二番目のp要素が、ソースHTML文書にあるp要素に対応することが対応管理手段１から分かる。対応していることがユーザに分かるようにこのp要素をウインドウ１で反転表示する。
【００５９】
この実施形態では、ソース要素、中間要素、レイアウト領域だけについて述べた。しかし、ソース要素と中間要素は、属性、テキスト、適用されるCSSプロパティを持つ。レイアウト領域も、寸法や位置などの情報をもつ。ウインドウ１およびウインドウ２は、属性、テキスト、適用されるCSSプロパティも表示するようにしてもよく、ウインドウ３は、寸法や位置などを表示するようにしてもよい。対応管理手段1は、ソース要素と中間要素の対応関係だけではなく、ソース要素の属性、テキスト、適用されるCSSプロパティと、中間要素の属性、テキスト、適用されるCSSプロパティとの対応関係まで含めて管理するようにしてもよい。対応管理手段2は、中間要素とレイアウト領域の対応関係だけではなく、中間要素の属性、テキスト、適用されるCSSプロパティと、レイアウト領域の寸法、位置などの対応関係を管理するようにしてもよい。選択手段はレイアウト領域だけではなく、レイアウト領域の属性、テキスト、適用されるCSSプロパティまで選択できるようにしてもよく、対応するソース要素の対応する属性、テキスト、適用されるCSSプロパティをウインドウ１で強調表示し、対応する中間要素の属性、テキスト、適用されるCSSプロパティをウインドウ２で強調表示してもよい。
【００６０】
ウインドウ１, ２が、さらにサブウインドウに分けることができることは、請求項１の実施形態のときと同様である。
【図１】
2018195009.tif 000003
【図２】
2018195009.tif 000004
【図３】
2018195009.tif 000005
【図４】
2018195009.tif 000006
【図５】
2018195009.tif 000007
【図６】
2018195009.tif 000008
【図７】
2018195009.tif 000009