Change search
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • harvard1
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf
Modular responsiveweb design: An experience report
KTH, School of Engineering Sciences (SCI), Mathematics (Dept.), Mathematics (Div.).
KTH, School of Computer Science and Communication (CSC), Theoretical Computer Science, TCS.
2017 (English)In: Proceeding Programming '17 Companion to the first International Conference on the Art, Science and Engineering of Programming, Association for Computing Machinery (ACM), 2017, Vol. F129681, article id a22Conference paper (Refereed)
Abstract [en]

Responsive Web Design (RWD) enables web applications to adapt to the characteristics of different devices such as screen size which is important for mobile browsing. Today, the only W3C standard to support this adaptability is CSS media queries. However, using media queries it is impossible to create applications in a modular way, because responsive elements then always depend on the global context. Hence, responsive elements can only be reused if the global context is exactly the same. This makes it extremely challenging to develop large responsive applications, because the lack of true modularity makes certain requirement changes either impossible or expensive to realize. In this paper we extend RWD to also include responsive modules, i.e., modules that adapt their design based on their local context, independently of the global context. We present the ELQ project that includes an approach to enabling modular responsivity, and a novel implementation of resize detection of DOM elements. ELQ provides an implementation of element queries which generalize CSS media queries. Importantly, our design conforms to existing web specifications, enabling adoption on a large scale. ELQ is designed to be heavily extensible using plugins. Experimental results show speed-ups of the core algorithms of up to 37x compared to previous approaches. CCS Concepts • Software and its engineering → Domain specific languages; Reusability; Hypertext languages;.

Place, publisher, year, edition, pages
Association for Computing Machinery (ACM), 2017. Vol. F129681, article id a22
Keyword [en]
CSS, Element queries, Modularity, Responsive web design
National Category
Computer Sciences
Identifiers
URN: urn:nbn:se:kth:diva-214643DOI: 10.1145/3079368.3079404Scopus ID: 2-s2.0-85028759663ISBN: 9781450348362 (print)OAI: oai:DiVA.org:kth-214643DiVA, id: diva2:1142456
Conference
1st International Conference on the Art, Science and Engineering of Programming, Programming 2017, Brussels, Belgium, 3 April 2017 through 6 April 2017
Note

QC 20170919

Available from: 2017-09-19 Created: 2017-09-19 Last updated: 2018-01-13Bibliographically approved

Open Access in DiVA

No full text in DiVA

Other links

Publisher's full textScopus

Search in DiVA

By author/editor
Ekholm, TomasHaller, Philipp
By organisation
Mathematics (Div.)Theoretical Computer Science, TCS
Computer Sciences

Search outside of DiVA

GoogleGoogle Scholar

doi
isbn
urn-nbn

Altmetric score

doi
isbn
urn-nbn
Total: 39 hits
CiteExportLink to record
Permanent link

Direct link
Cite
Citation style
  • apa
  • harvard1
  • ieee
  • modern-language-association-8th-edition
  • vancouver
  • Other style
More styles
Language
  • de-DE
  • en-GB
  • en-US
  • fi-FI
  • nn-NO
  • nn-NB
  • sv-SE
  • Other locale
More languages
Output format
  • html
  • text
  • asciidoc
  • rtf