Retrieving Web Page Layouts using Sketches to Support Example-based Web Design

Abstract

It is very difficult for inexperienced users to design good-looking web page layouts. Even with WYSIWYG editors, it is still difficult to obtain desired results because one must combine complicated HTML specific structures. Another reason is that it is inherently difficult for those who have limited artistic talents to design good layout from scratch. We address these problems by providing an environment where one can design web page layouts using existing well-designed web pages on the net as examples. The system basically works as a search system. The user sketches a simple layout as a query and the system returns web pages that have similar appearance. By referring to the example pages, the user can learn the basic principles of HTML design, obtain inspiration for better design, and also can directly use the professionally designed layouts by replacing the contents. This paper describes the user interface and the implementation of the system in detail. It also reports the result of an empirical user study. The users found the system very useful and the layouts designed using the system was scored highly by evaluators.