People's Newsroom


WA technologies differ from other web development technologies as they target improving existing Web pages and not creating new Web sites. These improvements can deeply alter the way users use and interact with Web sites. This characterization is used to position and compare the various contributions that have been made in WA. To make things more concrete we provide an illustration of WA technology through a case study using a dedicated tool called WebMakeup. Despite all their advantages, WA technologies present some limitations that might result in challenges on the user side.

Nowadays, many applications which, formerly, would have been designed for the desktop such as calendars, travel reservation systems, purchasing systems, library card catalogs, maps viewers, or even games have made the transition to the Web, largely successfully. Many Web sites are created every day to help users to find information and/or to provide services they need. However, there are cases where rather than a new Web site, what users need is to combine information or services that are already available but scattered on the www. Some examples follow:

  • users who want to have additional links on a Web page to improve the navigation (for example to create a personalized menu that gathers in one location multiple personal interests)
  • users who need to integratecontents from diverse Web sites (for example to include a Google’s map into a Web page that originally only shows addresses as flat text) in order to improve their performance in identifying distance from their personal location
  • simply to remove content from Web pages (such as contact details they consider irrelevant) to improve reading and selection performance.

Because these needs might be perceived as idiosyncratic, volatile (being shortlived or occasional), or dissenting with the interests of the Web site, they might well not be considered (or even not known) by Web developers. This is because Web sites are, by definition, designed for the masses and that at design time only a few users are available. Previous work on End-User Development (EUD) has demonstrated that, if appropriate tools are provided, end users might be able to create what they need (or at least define more precisely part of what they need). DENIM is a pioneering example that illustrates how tools can be used for involving users in the design of the Web sites to be developed. A more demanding scenario is when the target is not in-home Web sites but Web pages that have already been created by third parties. The options are here, either to redevelop what has already been done by the third party or to try to convince the third party to tune its development to fit a particular user need. This deeply collides with the principle of Web development that targets the masses and not the individual.

The term Web Augmentation (WA) is used to describe tools that can be used to improve (hence the word “augment”) existing Web pages (found for instance whilst browsing the Web) to create better fit users’ needs and activities. Some of the most popular WA tools work by extending the functionalities of the Web browser used by the user via plug-ins that can run client-side scripts to manipulate the structure of Web pages loaded in the browser. In that case, the augmentation will be applied to all the visited Web pages featuring specific characteristics. The potential of WA techniques can be illustrated by some advanced applications such as lightweight integration of information extracted from the Web, context-sensitive navigation across a diverse Web site, context-dependent multimodal adaptation, or refactoring Web sites for accessibility.

Another example is a spellchecking plug-in that would automatically check the text entered by the user on any Web page. The degree of expertise required for using WA tools varies dramatically. For example, some tools only require basic knowledge of how to install plug-ins in the Web browsers while others may require integrating sophisticated scripting code created by the user. The evolution of Web technology is changing the way users interact with Web sites. At first, users could only consume content provided by Web sites. Later, users could actively contribute with content by using tools such as CMS and wikis. More recently, WA tools empower people in different ways making these tools real EUD tools:

  • to create their own web sites
  • to combine information from diverse Web sites into a single hub (using mashups)
  • to modify Web pages created by others (using WA tools e.g. MADCOW and DiLAS). This highlights the broad range of approaches that Web-centered EUD tools explore.

Although the focus is on WA tools, we also introduce mashup tools because this provides some elements of comparison between the existing approaches for EUP of the Web. Mashup technology is an interesting alternative for final users to combine existing resources and services in a new Web application. Mashups are often very specialized and only operate with specific types of content (quite often structured data sources). For example, FaceMashup is a EUD tool for a mashup that allows users to manipulate social network APIs to combine data and share them with other users through the social networks. It is interesting to notice that some WA tools such as CSN Framework borrow from mashups the ability to integrate contents but they are even more flexible allowing to compose any kind of DOM element from a Web page. This seems to suggest that integrating different data sources is being considered more important than customizing existing Web sites. Though this might be true in a general sense, when it comes to empowering end-users, data integration might be more costly and hence, more difficult for end-users to achieve. By contrast, WA is not so demanding, and hence more affordable to end-users. This makes WA tools more likely to be adopted by end-users.


Tools might rest on the client-side, the server-side, or both. Client-side tools are executed as Web browsers’ extensions (or plug-ins) and processing happens on the user’s local computer. Common programming languages used to implement client-side applications include HTML, CSS, and Javascript. Conversely, server-side technology runs on a remote machine, and only the outcome of the execution returns to the user’s local computer. Common programming languages include Ruby, Python, PHP, C#… Server-side technologies can store persistent data. However, data can only be accessed through HTTP requests for a particular URL.

WebCrystal is a Firefox plug-in that allows the inspection of code corresponding to visual objects. WebCrystal provides users feedback using a textual description and a customized code snippet that can be copied and pasted to rebuild the user-selected properties. Additionally, Miján et al. resort to a set of personalization rules to be applied in the client-side with minimum alterations defined without requiring either advanced programming skills or advanced configuration. Whilst Web browsers can store data in the local cache, server-side technology is used by many tools such as DireWolf, FaceMashup, Ardito, et al., and MultiMasher as a means to support data persistence.

DireWolf provides several extensible components for adapting Web sites and it implements a service for data persistence such as user device profiles and shared application states. As for client-server tools, most requests a kept in the client with sporadic calls to the server. For example, DashMash has a client-side module for mashup creation and a server module responsible for integrating and storing data from different types of services. In the mobile world, IVO follows a similar architecture. For mashups, MashupEditor allows for adaptations to be created on the client (using a dedicated editor). Next, a proxy server stores those adaptations that can be later reused during the creation of the mashup. It is clear that the client-side approach is the most popular architecture (49%). The Client-server option (21%) was boosted in 2011, presumably due to the popularity of Web 2.0 and the focus on sharing, and the need to have common repositories. The server-side option (28%) rose from 2013 onwards, arguably on the search for a business model for mashup platforms.


Web sites might be adapted in different ways: including brand-new content, changing the behavior associated with DOM elements, or altering the appearance (style and layout). Most tools provide functions to add/remove/replace contents. Adding content from other sources is often used as a means for making information readily available whilst removing content is useful to improve focus,  preventing users from distraction. Mixer resorts to WA to improve the organization of Web pages simply by letting users move content around and include/exclude contents needed. Mashups are also used to add content from different websites. SmartComposition is another content-based approach that is primarily used to build mashups but it also features unique functions that allow reorganizing contents to fit into different screen sizes. Whilst modifying CSS code (color, font, etc.) is relatively simple, few tools account for this kind of adaptation. RUMU is a web-based WYSIWYG editor that resorts to a semantic language to change the page style and simplify web design. OpenHTML is also a web editor to introduce laymen into HTML and CSS. Finally, changing the behavior of Web sites is far from trivial. It often requires adding some Javascript code to DOM elements like the show or hide web nodes, clicking on certain buttons, changing the content of an element, etc. Changing the behavior of websites might be necessary, for example, for automating repetitive tasks.

Inter-Widget Communication (IWC) is a semi-automatic, end-user-friendly approach to extend widgets employing the programming-by-demonstration paradigm. IWC is built by composing interactive widgets. IWC leaves users with the tedious task of manual wiring widgets to create mashups. SOA4All is a visual development environment that addresses the adaptation of Web applications through the connection of different service components into an assembly line.


This dimension tells if users work with one (singleton) or more (combination of) Web sites in a single project. Whilst many EUD tools are designed to augment a particular type of singleton Website (e.g. OpenHTML), some tools allow to mix content from diverse Web sites. Mashups tools like Baya, Deep, MamSaas, and Marmite are typical examples of tools that allow to extract data from different Web sites and recombine them in a form that better fulfills users’ needs. Nonetheless, other strategies combine Web sites that don’t necessarily involve structured data sets. For example, Ardito et al. is a platform for end-users to compose personal information spaces by assembling pieces of information from different sources. Such personal information spaces can be enacted on different devices and shared with other users. MamSaas is a layered architecture to deploy and identify mashup components as well as link and execute mashups for quick application development. MOWA is another EUD tool for WA that enables end-users to create a custom guided tour of a city based on contents collected from diverse Web sites. Its aim is to augment existing Web applications with mobile features. Using MOWA end users can pinpoint in a map content from a different Web site and then generate a custom script. This mobile Web application prompts the users to add points of their interests while they move around the city.

Finally, CrowdDesign can also be classified as a EUD tool in so far as it supports mashup based on the integration of scripts coming from diverse sources. CrowdDesign works as a storage for scripts and user interface components shared by a community of developers. CrowdDesign also features a visual authoring environment that allows users to combine contents and scripts available at the platform to create a more personal version of Web sites.


Whilst a WA strategy can be adopted only for personal purposes, sharing is an important aspect of end-user development. A distinction between sharing and collaborative development.

Sharing. Some tools focus on personal use, i.e. results cannot be reused and/or shared with other users. Tayeh et al. is a case in point. These authors provide a tool for the linking and the integration of arbitrary documents and multimedia content dynamically. Rana et al. and EasyApp are also tools for personal use. Both tools provide a systematic way of designing, developing, and deploying personalized apps. Reform is a Firefox extension that contributes with architecture for web enhancement that allows end-users to integrate existing enhancements with new websites. Despite the fact that it allows end-users to communicate with developers for requesting new features, they do not allow sharing developments. CapView is a mashup platform that provides instant feedback for user development actions. CapView helps nonprogrammers form components with recommendations provided by the system and it manipulates a mashup through visually composing component features.

Moving away from the personal realm, Social Overlays and the CSN framework illustrate the use of repositories for script sharing. Social Overlays focuses on repairing either the behavior or the appearance of Web sites. Updates made by individuals are visible to the community which uses a  voting mechanism to decide if the updates are relevant and if so, be incorporated as part of the Web site offerings. CSN features a plug-in that allows users to adapt Web pages by triggering different types of scripts. It has different features depending on the user profile: developer or end-user.  Developers can write new augmentation scripts to extend the set of original sets of scripts available in the framework. Such scripts can then be obtained by other users who in their turn can execute them to adapt the Web sites. Finally, it is interesting to notice that a few tools allow publishing the code in social networks (e.g. Sticklet) whilst others allow to export files for personal use on an individual basis (e.g. WebMakeup).

Collaborative development. CrowdMock does not provide a voting mechanism but it permits to amend/complete augmentation script by people other than the author. CoScripter resorts to programming by demonstration to enable users to record all the information related to user interaction to edit a Website. The outcome is a script macro that can be automatically stored in a Web server from where they can be delivered to other users and they can use a collaborative scripting environment for recording, automating, and sharing web-based processes.


EUD tools resort to diverse programming paradigms: visual languages, spreadsheets, programming by demonstration, domain-specific languages (DSL), and model-based automation. Visual programming is mainly found in mashup tools that allow drag-and-drop to connect components to create a mashup. Examples include VisPro, ResEval Mash, MobiMash, SemanticWeb Pipes, and WebMakeup. VisPro creates mashups by dragging and dropping widgets from a library. ResEval Mash is a domain-specific mashup tool that explores dedicated mashup, in this case in the domain of research evaluation. MobiMash resorts to visual notations to create mobile mashups. The particularity of SemanticWeb Pipes is to blend mashups and the Semantic Web. Here, ontologies are used for better matching widgets parameters that build up the mashup. WebMakeup is an editor that delivers Chrome plugs-in for augmentation purposes. A DSL is defined that sets the expressiveness of the augmentation. WebMakeup helps construct DSL expressions on top of the page being augmented. Once constructed, WebMakeup generates and installs the corresponding Chrome extension.

Programming by demonstration is most popular for data extraction and visualization, where service composition and orchestration play an ancillary role. NaturalMash, WOA, Margmash, and MAIDL illustrate this approach NaturalMash is a WYSIWYG mashup tool. NaturalMash stands out for its formative support where the tool is able to collect user feedback. WOA enables users to create/extract Web content in the form of objects that they can manipulate to create Personal Web experiences. Margmash creates augmentations out of personalized information, which is gathered from diverse Web sites. Margmash behaves as a lightweight wrapper that guides end users on both data gathering and data recombination. MAIDL permits the rapid creation of mobile mashups out of components. Model-based Automation is concerned with the automatic creation of mashups out of knowledge about the user and the context of use. This technique’s weakness is the risk of generating irrelevant mashups w.r.t. the given requirements.

Ontocompo and Atomate illustrate this approach. Ontocompo makes use of an ontology to generate new applications based on existing ones. Atomate is a personal information assistant engine that automatically carries out tasks for the user. Atomate combines RSS/ATOM feeds from social networking into a simple RDF model representing people, places, and things. DSLs strive to abstract from general-purpose programming language. The challenge here is to find a compromise between expressiveness and learnability. DSLs in the augmentation realm can be illustrated by Cowpath and Sticklet. Cowpath focuses on “Web trails”, i.e. recurring navigation paths across distinct Web sites. Rather than switching between tabs and typing once and again the same URLs, Cowpath augments the affected websites with additional hyperlinks that “pave the way” of these Web trails. On the other hand, Sticklet explores the use of a dedicated assistant that helps users to come up with Sticklet expressions to augment Web sites.

Spreadsheets-like programming is often considered ease-of-use, intuitive, and with enough expressive power to represent and manage complex data. When it comes to mashups, Mashroom and MashSheet explore this approach. Mushroom builds Web applications by combining content coming from different Web sites. To this end, it resorts to an expressive data structure and a set of defined mashup operators. The data structure allows users to express complex data objects while mashup operators are visualized in the formula bar. MashSheet extends conventional spreadsheet paradigms to facilitate Web services “mashup” in a spreadsheet environment. MashSheet is a collection of operators that supports orchestrating Web services, manipulating and visualizing data created by the services.

Back to top button