CSS raamistiku kasutamine veebilehe kujunduse loomisel

Abstract

Käesolevas töös esitati ülevaade veebilehtede kujundamiseks mõeldud CSS keelest ning CSS raamistikest. Kirjeldati CSS raamistike olemust ja võimalusi, eeliseid ja puuduseid. Töö eesmärk oli praktiliste näidete põhjal välja selgitada võimalikud erinevused ja probleemid veebilehe loomisel ilma kujundusraamistikuta ning kujundusraamistikuga. Selleks loodi bakalaureusetöö raames kaks näitelehte - üks lihtsama ning teine keerulisema ülesehitusega. Mõlemad veebilehed kodeeriti esmalt ilma CSS raamistikuta ning seejärel vabavaralist CSS raamistikku Blueprint kasutades. Eelnevalt fikseeriti ka nõuded, millele loodavad veebilehed vastama pidid.

Näitelehtede loomisel kirjeldati tekkinud olulisemaid probleeme ning otsiti neile lahendused. Valminud veebilehtedel uuriti HTML ja CSS failide suurust ning failide HTTP-päringute kogumahtu ja lehe laadimise kiirust. Seejärel võrreldi omavahel ilma raamistikuta ning raamistikuga valmistatud veebilehtede andmeid.

Bakalaureusetöö käigus loodud näitelehtede kohta koostatud võrdluse põhjal sai teha järeldused, et CSS raamistik ei muuda veebilehe andmete mahtu nii palju suuremaks, et see lehe laadimise kiirust mõjutaks. See tähendab, et kui on huvi või vajadus veebilehe loomisel CSS raamistikku kasutada, siis ei pea muretsema, et see andmetehulga väga suureks või lehe laadimise aeglaseks muudab.

The present Bachelor’s thesis presents an overview of the creation of websites using HTML and CSS languages and the freeware CSS framework Blueprint. The purpose of the thesis was to examine the problems that may occur during the creation of a website with and without a CSS framework.

To that end, two examples of websites were created – a personal website with a simple layout and another website with a more complex layout. Both websites were first created without a CSS framework and then by the aid of Blueprint CSS framework.

After creating these websites, some parameters of each website were analysed – the size of the HTML and CSS files, the total volume of HTTP requests and the loading speed of the page. Then the parameters of websites made without the framework and with Blueprint CSS framework were compared.

The comparison indicates that a CSS framework does not change the total volume of HTTP requests enough to affect the loading speed of a website. However it does speed up the process of coding a website’s design. This means that the coders may use a CSS framework to change the process of coding a website’s design quicker and more effective without having to worry that the use of a framework would make the website load slower.