User-Customizable Web Components for Building One-Page Sites

摘要

Most of online website builders work by combining and customizing reusable HTML modules. This approach could rise the risk of conflicts among modules. The World Wide Web Consortium (W3C) is writing the specification of Web Components. This standard provides a browser-native solution in order to realize encapsulated Document Object Model (DOM) elements, in which the Cascading Style Sheets (CSS) and JavaScript scope is locally bound and the interaction with the document is strictly designed by the component author. Upon this standard, libraries have been built, Google's Polymer being an example, which provide a declarative and easy way to realize Components. In this paper, we provide a solution to the module approach limit in website builders by using Web Components as modules that are customizable by the end user. Our approach uses standard web technologies that modern browsers are natively supporting. We describe how a customizable Web Component is designed and how to bind their options with the generator UI. Furthermore, we will show an application of this approach in a Landing Page generator. We demonstrate that the generator could import again the generated HyperText Markup Language (HTML) and edit it, without any intermediary data structure (i.e., eXtensible Markup Language, XML or JavaScript Object Notation, Json). Finally, we outline further future development of this approach.