RE-PRESENT: Automatic Repair of Presentation Failures in Web Applications

Lead Research Organisation: University of Sheffield
Department Name: Computer Science

Abstract

Presentation failures are defects in the visual appearance of a web page. They range from flaws in the page's layout such as overlapping content, and text rendered off the edge of the page, to usability problems such as unreadable text and inaccessible navigation. An organisation's website is often one of its primary means of driving its business and establishing information about itself. As such, presentation failures undermine an organisation's message, its credibility, and potentially its revenue.

Repairing presentation failures is difficult for web developers. Websites need to display correctly on a wide range of devices from mobile phones to desktops, meaning that developers need to ensure web pages lay out correctly on a vast range of screen sizes, with varying amounts of space available to lay out content and graphical elements. Websites need to format correctly regardless of the browser that a user is using, or what language it has been translated to. Furthermore, they must be accessible to disabled users.

The complexity of presentational code (developed using a combination of HTML, CSS, and JavaScript) means that accounting for each of these different aspects when repairing a presentation failure manually is challenging. Manual "repairs" can even inadvertently lead to further defects. Automated repair techniques would therefore greatly assist developers in this task.

RE-PRESENT is a proposal for an overseas travel grant intended to allow the PI to continue and develop international collaborations to solve these problems. It intends to develop search-based techniques to automatically generate repairs to HTML, CSS, and JavaScript code used to manage the layout and design of web pages. Search-based techniques treat the current version of the code as a point in a search space, and use a problem-specific fitness function to guide a search method to another point in the space that constitutes a repaired, or "fixed" version of the page.

RE-PRESENT will make the following innovations:

- It will develop automated repair techniques for presentation failures currently unrepairable automatically, including those related to "responsive designs" (web page layouts that are intended to adjust to different screen sizes), accessibility issues, and defects related to faulty JavaScript code responsible for handling user interaction.

- It will develop techniques that are capable of accounting for different types of presentation failure at once, rather than in isolation. This is important, because the act of fixing one presentation failure (e.g., reducing the size of a button, so that it no longer overlaps other content on a page) may inadvertently cause others (e.g., an accessibility issue, because the button is now too small for visually impaired users to see).

- It will investigate techniques that produce results fast enough for developers to use in practice. Search-based approaches are effective, but often slow because repairs need to be evaluated by rendering the page with the fix applied in a browser. RE-PRESENT will investigate ways of modelling web page layout to avoid the need for more, lengthy, fitness calculations than are strictly needed.

Planned Impact

RE-PRESENT aims to automatically produce repairs to presentation failures, thereby assisting developers in this difficult task, and allowing websites and web applications to be released without visual problems and accessibility issues that might otherwise have interfered with their use.

The benefits of this project are wide-ranging. We expect it to make an impact on the following types of people:

1. Users of the Web.

One of the primary beneficiaries is web users themselves, who account for over 80% of the developed world. Estimates suggest that some 15% have some form of disability that prevents them performing everyday tasks, which include using the web. This project will have an additional impact on these types of users, aiming to reduce the accessibility issues present in a web page by considering them part of its overall design.

2. Businesses and Organisations.

Presentation failures have a negative impact on the business and organisations in whose web pages they exist. These types of visual defects have been shown to affect a business/organisation's credibility, user loyalty, and revenue. Preventing presentation failures, through automated repair, is therefore positive for web application owners.

3. Software Developers, Testers, and Maintainers.

In automatically producing repairs, the techniques behind RE-PRESENT will save time for software developers, testers, and maintainers; and costs for the organisations they work for. Several big multinational companies are adopting automated repair approaches for fixing bugs in the logic of programs (but not yet presentation failures), and are therefore already receptive to the types of techniques that RE-PRESENT intends to develop.

Publications

10 25 50
 
Description A responsive layout failure (RLF) is a presentation flaw in a website when it is viewed in certain dimensions (e.g., on a specific device). Work published as a result of this award shows RLFs can be automatically detected and repaired with specialist algorithms.
Exploitation Route The algorithms / prototype tools could be made into industrial strength tools for use in web application development.
Sectors Digital/Communication/Information Technologies (including Software)