Using SVG for Responsive Web Site Development

Marija Štokelj (2014) Using SVG for Responsive Web Site Development. EngD thesis.

Preview

PDF Download (1816Kb)

Abstract

The principal goal of this thesis is to examine responsive web design approach and the SVG (Scalable Vector Graphics) standard for vector graphics. Both topics are ultimately used on designing a web page. The opening chapter presents the difficulty of ensuring the users with effective and accessible web pages, across all kinds of mobile devices that are currently available on the market. Responsive web design is presented as a viable solution for the development of web pages, which are optimised for viewing on any device. The following section describes the SVG standard as a particularly suitable graphics file format for responsive pages, as it preserves the original sharpness of images regardless of scaling intensity. Furthermore, the size of vector graphics files is significantly smaller in comparison to raster graphics, which is a beneficial fact, since mobile devices have more limited resources. Combination of both solutions is implemented on a responsive web page for generating graphs. Those are created with SVG by using the D3 (Data-Driven Documents) library. The conclusion presents the results of testing the web page across multiple browsers and devices, along with our evaluation of the benefits and downsides of both of the discussed topics.

Actions (login required)