PaperlayerView exact revision on arXiv

Source-linked AI summary

TIE: Topological Information Enhanced Structural Reading Comprehension on Web Pages

Zihan Zhao, Lu Chen, Ruisheng Cao, Hongshen Xu, Xingyu Chen, Kai Yu

arXiv:2205.06435v1cs.CL

TL;DR

Web-page SRC has not effectively exploited page topology, and token-level models struggle to encode structures organized at the tag level. TIE predicts an answer-containing tag before refining the span with token-level QA, achieving state-of-the-art performance on WebSRC.

  • Problem

    Prior SRC work did not effectively exploit web-page topology, and token-level models struggle to encode structures organized at the tag level.

    Source: §1 · pp. 1–2

  • Method

    TIE predicts the answer-containing HTML tag, then refines the answer span, using GAT with DOM trees and NPR graphs to encode logical and spatial structures.

    Source: §1 · p. 2

  • Results

    TIE achieves state-of-the-art performance on WebSRC, and experiments demonstrate the effectiveness of its key components.

    Source: §1 · p. 2

  • Takeaways & Limitations

    WebSRC experiments validate TIE's effectiveness and its key components for modeling web-page topology.

    Source: §1 · p. 2

Abstract

from arXiv · show

Recently, the structural reading comprehension (SRC) task on web pages has attracted increasing research interests. Although previous SRC work has leveraged extra information such as HTML tags or XPaths, the informative topology of web pages is not effectively exploited. In this work, we propose a Topological Information Enhanced model (TIE), which transforms the token-level task into a tag-level task by introducing a two-stage process (i.e. node locating and answer refining). Based on that, TIE integrates Graph Attention Network (GAT) and Pre-trained Language Model (PLM) to leverage the topological information of both logical structures and spatial structures. Experimental results demonstrate that our model outperforms strong baselines and achieves state-of-the-art performances on the web-based SRC benchmark WebSRC at the time of writing. The code of TIE will be publicly available at https://github.com/X-LANCE/TIE.

1 Introduction

Earlier SRC work did not effectively use web-page topology, and token-level models struggle to encode structures organized at the HTML-tag level. TIE uses a tag-level, two-stage QA process and graph attention over logical and spatial structures, achieving state-of-the-art performance on WebSRC.

  • Prior work encoded logical structure implicitly, while token-level models struggle to use structures organized at the tag level.Spatial relations are complementary to logical structure because page layouts can express key-value relations in ways that vary across logical structures.Source: §1 · p. 2
  • TIE is a tag-level QA model that predicts which HTML tag contains the answer span.Source: §1 · p. 2
  • TIE applies GAT to DOM trees and NPR graphs to encode logical and spatial structure, respectively.Source: §1 · p. 2
  • TIE uses node locating followed by answer refining, where a token-level QA model extracts the span constrained by the predicted answer node.Source: §1 · p. 2
  • TIE achieves state-of-the-art performance on WebSRC, and experiments validate the effectiveness of its key components.Source: §1 · p. 2

2 Preliminary

Web-based SRC predicts an answer span in flattened HTML from a question and relevant web-page code. The DOM tree represents that HTML as tag-based nodes, whose direct contents exclude tokens contained in child nodes.

2.1 Task Definition

  • Web-based SRC is extractive QA over web pages: given a query and flattened HTML, it predicts the answer span's start and end positions.Source: §2.1 · p. 2

2.2 DOM Trees of HTML codes

  • A DOM tree is parsed from HTML; each node represents a tag closure, and its direct contents exclude tokens contained in its child nodes.Source: §2.2 · pp. 2–3

3 TIE

TIE changes web-page reading comprehension into node locating followed by answer-span refinement. It uses GAT over DOM-tree and NPR graphs to encode logical and spatial structure.

3.1 Architecture of the Whole SRC System

  • TIE first predicts the answer node, then constrains answer-span prediction to spans contained within that node.The node is the deepest DOM-tree node containing the complete answer span.Source: §3.1 · p. 3

3.2 Construction of GAT Graphs

  • GAT encodes both logical and spatial web-page structure using DOM trees and NPR graphs.The section introduces these two graph types to leverage both kinds of structure.Source: §3.2 · p. 3

3.2.1 DOM Trees

  • The DOM graph adds ancestor and descendant links to parent-child links, allowing nodes to communicate directly with all ancestors and descendants.This modification addresses the original DOM tree's sparsity and is intended to transfer information faster.Source: §3.2.1 · pp. 3–4

3.2.2 NPR Graphs

  • NPR graphs share the DOM tree's tag-based node set and connect nodes through positional relations derived from rendered-page coordinates.The introduced directed edge types are UP, DOWN, LEFT, and RIGHT; the passage also describes coordinate- and size-based conditions for these relations.Source: §3.2.2 · p. 4

G , and ERIGHT

TIE combines a pretrained context encoder, tag-level mean pooling, graph-based structure encoding, and a node classifier to predict the answer node.

3.3 Design of TIE

  • TIE has four modules: context encoding, HTML-based mean pooling, structure encoding, and classification.The model architecture is shown in Figure 4.Source: §3.3 · p. 4
  • A pretrained language model encodes contextual information from the HTML code to initialize node representations.Experiments use H-PLM with RoBERTa or MarkupLM.Source: §3.3 · p. 4
  • Each node is initialized by averaging contextual embeddings of tokens in its corresponding HTML tag's direct contents.The direct contents are the token set used for that node's mean pooling.Source: §3.3 · pp. 4–5
  • The structure encoder applies GAT to topological information in DOM trees and NPR graphs, using learned query, key, and value projections.Attention-head outputs are concatenated to form node representations for the next GAT layer.Source: §3.3 · p. 5
  • A linear layer followed by Softmax assigns each structure-encoded node a probability of being the answer node.Source: §3.3 · p. 5

4 Experiments

The experiments evaluate TIE on WebSRC using answer and structural metrics, compare it with established baselines, and examine performance across website types and model components.

4.1 Dataset

  • WebSRC contains 0.4M QA pairs across 6.4K structured page segments, with tag bounding boxes and KV, Comparison, and Table site classes.Bounding boxes from rendered pages can be used to construct NPR graphs.Source: §4.1 · p. 5

4.2 Metrics

  • Evaluation uses EM for exact span matches, token-level F1 for span overlap, and POS for overlap between predicted and gold answer paths through HTML tags.POS compares paths from the root tag to the deepest tag containing each complete answer span.Source: §4.2 · p. 5

4.3 Baselines & Setup

  • Baselines range from tag-stripped T-PLM and HTML-token H-PLM to visual V-PLM and XPath-embedded MarkupLM; TIE uses three GAT blocks.H-PLM(RoBERTa) and MarkupLM serve as TIE context encoders.Source: §4.3 · pp. 5–6

4.4 Main Results

  • On WebSRC, TIEMarkupLM significantly outperforms MarkupLM, the previous SOTA, by 6.78% EM, 3.74% token-level F1, and 2.49% path-overlap (POS) on the test set.EM denotes exact match; F1 denotes token-level F1; POS denotes path overlap.Source: Table 2 · p. 6, §4.4 · p. 6
  • Table sites gain +20.30% EM, +17.48% F1, and +7.43% POS, while KV sees slight drops; Compare gains are +10.27% EM versus +0.71% F1.The authors attribute the smaller Compare F1 gain to cascading errors when node locating selects a node that is not an answer-node ancestor.Source: §4.4 · p. 7

4.5 Case Study

  • In the Table example, TIE resolves long-range header-cell links, while in the KV example MarkupLM groups semantically related nodes and TIE fails.The Table example requires locating an answer through row and column header-cell relations.Source: §4.5 · p. 7

4.6 Ablation Study

  • Removing DOM trees causes only slight drops, but using sparse original DOM trees significantly lowers performance; the authors suggest XPath information overlaps with DOM information.Source: §4.6 · p. 8
  • Removing NPR graphs significantly lowers performance; vertical relations matter more than horizontal ones because vertical tags are farther apart in row-built pages’ HTML.The authors report that horizontal relations are often easier for the context encoder to capture without NPR graphs.Source: §4.6 · p. 8

5 Related Work

Prior work addresses QA over text, tables, and other structured sources, but flexible, implicit topology in semi-structured HTML remains comparatively under-researched. TIE is positioned against these approaches as a tag-level method that explicitly uses web-page structures.

  • Prior QA spans plain text, tables, knowledge bases, and visual QA, but flexible implicit topology in semi-structured HTML remains under-researched.Source: §5 · p. 8
  • Table QA methods use candidate cells, row-column interactions, or SQL, but their reliance on neat table structures makes them unsuitable for web-based SRC.Source: §5 · pp. 8–9
  • Earlier WebSRC work flattened raw HTML for PLMs or used screenshots, while MarkupLM encoded XPath-based logical position; TIE instead uses DOM trees and NPR graphs in a tag-level two-stage pipeline.Source: §5 · p. 9

6 Conclusion & Future Work

TIE achieves state-of-the-art performance on WebSRC, with its key components validated. The authors identify increased parameter count and computation as a cost of the two-stage system.

6 Conclusion & Future Work

  • TIE achieves state-of-the-art performance on WebSRC, and experiments validate its key components.The conclusion also describes TIE as a tag-level QA model that captures logical and spatial structures using DOM trees and NPR graphs.Source: §6 · p. 9
  • TIE explicitly captures logical and spatial web-page structures using DOM trees and NPR graphs in a tag-level QA model.Source: §6 · p. 9
  • The two-stage system requires a separate token-level QA model for final answer spans, so parameter count and computation are at least doubled.Parameter sharing between the context encoder and answer-refining QA model was tried, but results were not promising.Source: §6 · p. 9

A Detail Setup

TIE is trained and evaluated for two epochs using AdamW, with settings specified for learning rate, batch size, hardware, and attention-head allocation.

A Detail Setup

  • TIE is trained and evaluated for two epochs with batch size 32 on four Nvidia A10 Graphics Cards.Source: A Detail Setup · p. 12
  • The learning rate is selected by searching between 1e-6 and 5e-5, using AdamW with a linear schedule.Source: A Detail Setup · p. 12
  • For BASE models, DOM trees supply masks for four attention heads and each of four NPR graphs supplies two heads.For LARGE models, one additional attention head is assigned to each of the four NPR graphs.Source: A Detail Setup · p. 12

B Additional Case Study

The case study describes strengths in capturing spatial relations and tag boundaries, alongside errors associated with weaker token-level semantic understanding.

B Additional Case Study

Related papers

Loading 2205.06435v1…