Design Principles for Responsive Web
Aryal, Chandra Shekhar (2014)
Metropolia Ammattikorkeakoulu
2014
All rights reserved
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2014122220624
https://urn.fi/URN:NBN:fi:amk-2014122220624
Tiivistelmä
The purpose of this bachelor’s thesis project was to study the responsive design paradigms and development approaches for creating web pages that are optimised for adaptive web design. The additional goals were to analyse the design principles and implement prototype to find out whether it is feasible to achieve responsive design for various screen resolution of devices.
The theoretical part of the thesis work explains more details of primary development approaches and design consideration for creating responsive web pages that work on the latest smartphones to desktop computers. The thesis also analysed the best design principles that help to optimize web performance. For practical purpose, simple web page as a prototype was built, tested on various screen resolution devices and evaluated in terms of adaptive design with the mobile first principle.
As a result of this project, a functional web page prototype was built using Dreamweaver, web application design software. HTML5, CSS3 and JavaScript were used for the structure, presentation and interaction of web functionality. The web page contains videos and text as web content. A mobile compatible menu was implemented using third parties library.
The development still needs further work for better user experience and more adaptive solutions with browser compatibility. The main challenges for developing project were designing web user interface across multiple devices with various browser supports. Understanding the responsive design paradigm, the mobile first approach, content planning, navigation and web performance were benefits gained from this study.
The theoretical part of the thesis work explains more details of primary development approaches and design consideration for creating responsive web pages that work on the latest smartphones to desktop computers. The thesis also analysed the best design principles that help to optimize web performance. For practical purpose, simple web page as a prototype was built, tested on various screen resolution devices and evaluated in terms of adaptive design with the mobile first principle.
As a result of this project, a functional web page prototype was built using Dreamweaver, web application design software. HTML5, CSS3 and JavaScript were used for the structure, presentation and interaction of web functionality. The web page contains videos and text as web content. A mobile compatible menu was implemented using third parties library.
The development still needs further work for better user experience and more adaptive solutions with browser compatibility. The main challenges for developing project were designing web user interface across multiple devices with various browser supports. Understanding the responsive design paradigm, the mobile first approach, content planning, navigation and web performance were benefits gained from this study.