Responsive HTML generation using SuperSQL

Kento Goto, Ryosuke Koshijima, Motomichi Toyama

Research output: Contribution to journalArticlepeer-review

1 Citation (Scopus)


Purpose: With the rapid spread of smartphones and tablets, it is becoming necessary for web developers to create responsive web pages which are visually appealing on devices of various sizes. However, building responsive UIs is a very challenging task, requiring deep knowledge of HTML and CSS. This paper aims to propose an approach to generate responsive web pages using SuperSQL, which is an extension of SQL that can format data retrieved from a database into various kinds of structured documents. Design/methodology/approach: By incorporating the methodology of bootstrap, a grid-based framework for front-end development, the authors have made it possible to create responsive web pages from simple SuperSQL queries. In addition, by utilizing SuperSQL's unique feature that can describe the structure of the output web page, the authors have proposed and implemented a mechanism to automatically optimize the web content's size and position. Findings: In the evaluation, the authors created some actual web applications with and without the use of SuperSQL and compared the code amount (number of lines). As a result, when using the proposed system, the amount of code was reduced to about 1/5. The authors also compared the layout generated by the proposed automatic layout generation mechanism with the responsive layout that was generated manually. As a result, the automatic layout generation mechanism created the same layout as the manually created layout 74.8 per cent of the time, and the user satisfaction level turned out to be 85.8 per cent. Originality/value: The way to generate a responsive HTML by using a single SuperSQL query, and the mechanism for automatic responsive layout generation.

Original languageEnglish
Pages (from-to)324-351
Number of pages28
JournalInternational Journal of Web Information Systems
Issue number3
Publication statusPublished - 2017


  • CSS
  • HTML
  • Relational database
  • Responsive design
  • SuperSQL
  • Web development

ASJC Scopus subject areas

  • Information Systems
  • Computer Networks and Communications


Dive into the research topics of 'Responsive HTML generation using SuperSQL'. Together they form a unique fingerprint.

Cite this