Due to the varied climate of devices used today, the web must accommodate to every use case via responsive design. The problem is that images are often forgotten when implementing fluid design, resulting in slower loading of pages and more data sent than necessary. This thesis aims to explore through a literary study which valid standardized responsive image solutions there are using HTML5 and how to implement them. The empirical study of this thesis will be an experiment conducted to find answers on what the benefits are and what you must consider when implementing responsive image solutions. The experiment consists of collecting data from three different websites implementing various degrees of responsive image solutions. We conclude from the literary study that there are currently two valid standardized responsive image solutions in HTML5 in the form of the ‘picture’ element and the ‘srcset’ attribute. We find that the increased size of data stored on disk and the increased complexity of the markup and images must be considered when implementing responsive image solutions. The benefits of the technique will show in terms of decreased loading times of the page and less data sent over the network. We also concluded that a clearer focus and more context was achieved on the images implementing art direction.
| Identifer | oai:union.ndltd.org:UPSALLA1/oai:DiVA.org:bth-16260 |
| Date | January 2018 |
| Creators | Esmailzade, Philip |
| Source Sets | DiVA Archive at Upsalla University |
| Language | English |
| Detected Language | English |
| Type | Student thesis, info:eu-repo/semantics/bachelorThesis, text |
| Format | application/pdf |
| Rights | info:eu-repo/semantics/openAccess |
Page generated in 0.0017 seconds