Načrtovanje in oblikovanje odzivnega spletnega mesta

FEJZIĆ, DIANA (author), Bovcon, Narvika (mentor)

Zaradi vse večje razširjenosti pametnih telefonov in tabličnih računalnikov je odzivnost spletne strani postala zelo pomembna. Z obiskom odzivnega spletnega mesta se za vsakega posameznega obiskovalca zagotovi najboljša možna uporabniška izkušnja ne glede na to, ali si stran ogleduje preko mobitela, tablice ali računalnika. Tema diplomske naloge zajema postopek načrtovanja, oblikovanja in programiranja odzivnega spletnega mesta za fiktivno podjetje Creative Design d.o.o s pomočjo spletnih tehnologij. V začetnemu delu diplomske naloge se bomo spoznali s pojmom odzivnega spletnega mesta. Preden preidemo na grafično oblikovanje spletne strani, smo predstavili postopek načrtovanja in izdelave vsebinske zasnove odzivne spletne strani. V osrednjem delu diplomske naloge je podrobno opisan postopek oblikovanja grafične podobe strani s pomočjo programov Adobe Photoshop in Adobe Illustrator. Nato sledijo opisi in primeri funkcionalnosti uporabljenih spletnih tehnologij pri realizaciji spletne strani kot so HTML, CSS, SASS, JavaScript, jQuery, Bootstrap in PHP. V zaključnemu delu naloge smo testirali prilagodljivost spletne strani na različnih resolucijah in prikaz strani v različnih brskalnikih.

• Language: Slovenian
• Keywords: Odzivna spletna stran, Celostna grafična podoba, Adobe Photoshop, Adobe Illustrator, HTML, CSS, SASS, jQuery, JavaScript, Bootstrap, PHP
• Work type: Bachelor thesis/paper
• Organization: FRI - Faculty of Computer and Information Science
• Year: 2016
• PID: 20.500.12556/RUL-81046
• Publication date in RUL: 25.03.2016

Secondary language

• Language: English
• Title: Designing a responsive web site

Abstract

Due to the increasing prevalence of smartphones and tablet computers design became a crucial part of web design. For a user, responsive web design enables the best user experience, regardless of whether a user is visiting the site via a mobile phone, a tablet or a computer. This thesis covers the process of planning, designing and responsive web site development, for a fictitious company named “Creative Design d.o.o.”, with the help of web technologies. In the initial part of the thesis, we learn about the responsive web design concept. Before moving on to the graphical design of the web site, we will introduce the process of planning and development of responsive site’s concept. The main part of the thesis is a detailed description of the process of creating the graphic design of the web site with the help of Adobe Photoshop and Adobe Illustrator. This is followed by descriptions and examples of the functionality of applied web-based technologies in the web site implementation, such as, HTML, CSS, SASS, JavaScript, jQuery, Bootstrap and PHP. As a conclusion, we tested the adaptability of web pages in different resolutions and displayed them in different browsers.

• Keywords: Responsive Web Design, Corporate Visual Identity, Adobe Photoshop, Adobe Illustrator, HTML, CSS, SASS, jQuery, JavaScript, Bootstrap, PHP