Building a responsive website
Regmi, Sagar (2022)
Regmi, Sagar
2022
All rights reserved. This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2022102221530
https://urn.fi/URN:NBN:fi:amk-2022102221530
Tiivistelmä
The purpose of the thesis was to research and study the concept of creating a responsive web design and implement the study to build a website design that is optimised for adaptive web design.
The theoretical part of the thesis work explains the concepts of creating responsive web pages and elements to create an adaptive design, including flexible text, flexible grid, and adaptive media, as well as a theory on media queries. For practical purposes, a website as a prototype was built, tested on various screen resolution devices, and evaluated in terms of adaptive design.
The development of the project involved various steps. Initially, the requirements of the project were analysed. Based on the requirements, the project was designed and developed using Virtual Studio Code, a software development tool. As an outcome, a website that can adapt content according to the screen size was created. HTML5, CSS3, SASS, VS Code, NPM, CSS grid, and CSS flexbox were the technologies used in the project.
The theoretical part of the thesis work explains the concepts of creating responsive web pages and elements to create an adaptive design, including flexible text, flexible grid, and adaptive media, as well as a theory on media queries. For practical purposes, a website as a prototype was built, tested on various screen resolution devices, and evaluated in terms of adaptive design.
The development of the project involved various steps. Initially, the requirements of the project were analysed. Based on the requirements, the project was designed and developed using Virtual Studio Code, a software development tool. As an outcome, a website that can adapt content according to the screen size was created. HTML5, CSS3, SASS, VS Code, NPM, CSS grid, and CSS flexbox were the technologies used in the project.