We describe a system, implemented as a browser extension, that enables users to quickly and easily collect, view, and share personal Web content. Our system employs a novel interaction model, which allows a user to specify webpage extraction patterns by interactively selecting webpage elements and applying these patterns to automatically collect similar content. Further, we present a technique for creating visual summaries of the collected information by combining user labeling with predefined layout templates. These summaries are interactive in nature: depending on the behaviors encoded in their templates, they may respond to mouse events, in addition to providing a visual summary. Finally, the summaries can be saved or sent to others to continue the research at another place or time. Informal evaluation shows that our approach works well for popular websites, and that users can quickly learn this interaction model for collecting content from the Web.

Scalable Vector Graphics (SVG) is a language that describes two-dimensional vector graphics for storage and distribution on the Web. Unlike raster image formats, SVG-based images scale nicely to arbitrary resolutions and sizes. However, the current SVG standard provides little flexibility for taking into account varying viewing conditions, such as different screen formats, and there is little support for interactive exploration of a diagram. We introduce an extension to SVG called Constraint Scalable Vector Graphics (CSVG) that permits a more flexible description of figures. With CSVG, an image can contain objects whose positions and other properties are specified in relation to other objects using constraints, rather than being specified in absolute terms. For example, a box can be specified to remain inside another box, without being given an absolute position. The precise layout can then be left to the browser, which can adapt it dynamically to changing viewing conditions on the client side. Further extensions add support for alternate layouts, interaction, and declarative animation. Leveraging well-established methods for linear constraint solving, we implemented a prototype viewer for CSVG by embedding our Cassowary constraint solver into an existing SVG renderer.

The Multivalent Browser is built on an architecture that separates functionality from concrete document format. Almost all functionality is made available via relatively small modules of code called behaviors that programmers can write to extend the core system. Behaviors can be as significant and powerful as parser-renderers for scanned paper, HTML, or TeX DVI; as finegrained as hyperlinks, cookies, and the disabling of menu items; and as innovative or uncommon as in situ annotations, "lenses", collapsible outline displays, new GUI widgets, and Robust Hyperlink support. Behaviors can be combined in arbitrary groups for each individual document, in effect spontaneously creating a custom browser for every one. Common aspects of document functionality can be shared, so that, for example, the same behavior that handles multipage support for scanned paper documents also provides such support for DVI and PDF; similarly, the behaviors that support fine-grain annotation of HTML also support identical annotation on scanned paper, UNIX manual pages, DVI, and PDF. We have designed and implemented this architecture, and implemented behaviors that support all of the above functionality and more. Here we describe the architecture that allows such power and fine-grained access, yet composes disparate behaviors and resolves their mutual conflicts.

HTML has popularized the use of style sheets, and the advent of XML has stressed the importance of style as a key area complementing document structure and content. A number of tools are now available for producing HTML and XML documents, but very few are addressing style issues. In this paper we analyze the requirements for style manipulation tools, based on the main features of the CSS language. We discuss methods and techniques that meet these requirements and that can be used to efficiently support web authors in style sheet manipulation. The discussion is illustrated by the recent developments made in the Amaya web authoring environment.

Methods to support the creation of multi-device user interfaces typically use some type of abstraction of the user interface design. To retrieve the final user interface from the abstraction a transformation will be applied that specializes the abstraction for a particular target platform. The User Interface Markup Language (UIML) offers a way to create multidevice user interface descriptions while maintaining the consistency of certain aspects of a user interface across platforms. We extended the UIML language with support for layout constraints. Designers can create layout templates based on constraints that limit the ways a user interface can rearrange across platforms. This results in a higher degree of consistency and reusability of interface designs. THE USER INTERFACE MARKUP LANGUAGE (UIML) The UIML specification [2] is a high-level canonical markup language to describe the structure, style, content and behavior of a user interface. The declarative nature of UIML allows a clear separation of the user interface, its content, the mapping of its abstract concepts onto concrete widgets and the application logic. UIML’s separation of concerns enables reuse of the user interface and promotes consistency across different platforms.

Tables are provided in virtually all document formatting systems and are one of the most powerful and useful design elements in current web document standards. Unfortunately, optimal layout of tables which contain text is NP-hard for reasonable layout requirements such as minimizing table height for a given width [1]. We present two new independently-applicable techniques for table layout. The first technique is to solve a continuous approximation to the original layout problem by using a constant-area approximation of the cell content combined with a minimum width and height for the cell. The second technique starts by setting each column to its narrowest possible width and then iteratively reduces the height of the table by judiciously widening its columns. This second technique uses the actual text and line-break rules rather than the constant-area approximation used by the first technique. We also investigate two hybrid approaches both of which use iterative column widening to improve the quality of an initial solution found using a different technique. In the first hybrid approach we use the continuous approximation technique to compute the initial column widths while in the second hybrid approach a modification of the HTML table layout algorithm is used to compute the initial widths. We found that all four techniques are reasonably fast and give significantly more compact layout than that of HTML layout engines.

The semantics of a constraint system for use in an interactive graphical application should accomodate state and change properly. Constraint hierarchies are one technique for expressing a semantics for hard and soft constraints, which is well-suited for this domain. The constraint hierarchy framework is parameterized by a comparator, which compares how well two potential solutions to the hierarchy satisfy the soft constraints. Two special varieties of constraints for interactive graphics are stay constraints and edit constraints. Stay constraints indicate that we prefer that a variable retain its previous value, unless there is a stronger reason for it to be changed. Edit constraints accomodate a sequence of changing inputs from an external device such as a mouse. A number of incremental algorithms have been developed for nding a solution to a constraint hierarchy, which include ecient treatment of stay and edit constraints. After a short review of the literature in this area, this paper discusses an issue regarding constraint hierarchies and interactive graphics that has up to now been solved only in an ad hoc fashion: the split stay problem. This problem arises for compound objects such as 2-d points. We prefer solutions that completely satisfy the stay constraints on the x and y components of a given point over solutions that consider the x and y components separately, for example satisfying the constraints on the x part of one point and the y part of another. Unfortunately, some comparators (including ones that turn out to be particularly useful) do not discriminate among solutions in this way. We present a new comparator that does correctly handle the split stay problem.

More powerful personal computers and higher network bandwidth has meant that graphics has become increasingly important on the web. Graph-based diagrams are one of the most important types of structured graphical information.

We present a system for designing and displaying grid-based document designs that adapt to many different viewing conditions and content selections. Our system can display traditional, static documents, or it can assemble dynamic documents “on the fly ” from many disparate sources via the Internet. Our adaptive layouts for aggregated documents are inspired by traditional newspaper design. Furthermore, our system allows documents to be interactive so that readers can customize documents as they read them. Our system builds on previous work on adaptive documents, using constraintbased templates to specify content-independent page designs. The new templates we describe are much more flexible in their ability to adapt to different types of content and viewing situations. This flexibility comes from allowing the individual components, or “elements, ” of the templates to be mixed and matched, according to the content being displayed. We demonstrate our system with two example applications: an interactive news reader for the New York Times, and an Internet news aggregator based on MSN Newsbot. ACM Classification H5.2 [Information interfaces and presentation]:

The Software Concordance is a hypermedia software development environment exploring how document technology and versioned hypermedia can improve software document management. The Software Concordance's central tool is a document editor that integrates program analysis and hypermedia services for both source code and multimedia documentation in XML. The editor allows developers to embed inline multimedia documentation, including images and audio clips, into their program sources and to bind them to any program fragment. Web style hyperlinks are also supported. The developers are able to move seamlessly between source code and the documentation that describes its motivation, design, correctness and use without disrupting the integrated program analysis services, which include lexing, parsing and type checking.