Enhancing the Performance of University’s Website for Mobile Devices Based on Responsive Web Design Approach

With the evolution of the computer technologies, web page designs are getting richer with the scripts, stylesheets, and images on the web page. These current technologies increase the size of web pages and indirectly increase the load time. With a slow speed of web page loading speed of any website, users will leave these websites and redirect their searches to other competitors’ websites. This will not only reduce users’ satisfactions, but it also shows negative impressions towards these websites. Therefore, the aim of this paper is to investigate several performance techniques in order to improve the university’s responsive website for mobile devices based on Amazon Web Services. A prototype is developed by using a Bootstrap framework and several principle methods of responsive web design such as viewport, media query, flexible grid and flexible image will also be applied. The prototype is hosted at the Amazon Simple Storage Service and tested by using Viewport Resizer tool and real devices. In order to improve the load time, different performance techniques are implemented to the prototype that include compress images, remove unused CSS, combined files, minification, Gzip, cache and content delivery network. The experiments are tested by using Google PageSpeed Insights and WebPageTest tools. Based on the results obtained, using Google PageSpeed Insights tool, the measured speed score has increased on both mobile and desktop devices. Besides that, the WebPageTest tool also shows that the load time and HTTP requests can be reduced. In a nutshell, the performance techniques can be used to improve the performance of the university’s responsive website and as a result the websites provide a better user experience for mobile users.