Original title: Možnosti využití SVG ve webovém designu
Translated title: Possibilities of using SVG in web design
Authors: VČELÁK, Tomáš
Document type: Bachelor's theses
Year: 2019
Language: cze
Abstract: [cze] [eng]
Cílem bakalářské práce je představit možnosti využití jazyka SVG (Scalable Vector Graphics) ve webovém designu. Jazykem SVG vzniká škálovatelná vektorová grafika, která vzhledem k problematické podpoře ve starších verzích prohlížeče MS Explorer nenašla dlouho na webu uplatnění. V současné době je již možné plně využít výhod SVG při tvorbě front-end webu, jako je např. nezávislost na rozlišení displeje (mj. v souvislosti s nástupem Retina displejů), možnost libovolné změny velikosti bez ztráty vizuální kvality grafiky, strojová čitelnost obsahu a především minimální datová náročnost, díky nimž byl jazyk SVG také zařazen do rodiny HTML5 technologií. Autor se ve své práci zaměří na způsoby získání SVG k využití pro webový design včetně generování PNG alternativ a na varianty implementace SVG do kódu webu. Základem práce bude demonstrace využití SVG pro práci s webovým textem (výplně, přechody, filtry, animované efekty), s obrázky (výřezy a filtry), pro animace zatržítek a ikon, animované interakce s formulářovými input poli a tlačítky, interakční přechody, tvorbu bannerů a map s využitím animací cest apod. Vše bude představeno na vlastní webové prezentaci s mnoha originálními praktickými příklady se zdůrazněním výhod použitých technik v porovnání s tradiční webovou grafikou bitmapovou. The goal of the thesis is to introduce possibilities of SVG (Scalable Vector Gra- phics) in web design. SVG is a scalable vector graphic format which didn't find application on the web for a long time due to poor support in older versions of Microsoft Explorer. Nowadays, it is finally possible to fully benefit advantages of SVG in front-end web design, e.g. independence on a screen resolution (espe- cially with wide-spread Retina displays), resizing without visual quality loss, machine readability of embedded text content, and most importantly small file size. These features allowed SVG to be recognized as an HTML5 family member. Author of the thesis will focus on methods of bringing SVG to web design, including methods of generating PNG alternatives and variants of SVG inclusion into web page code. The foundation of the thesis will be a web page presentation, which will demonstrate use of SVG on text (fillings, gradients, filters, and animations), images (cropping and filters), animations of checkbo- xes and icons, animated interactions with form inputs and buttons, animated transitions, banners and maps with animated paths, etc. The presentation will emphasize advantages of used techniques in comparison with traditional bitmap graphics.
Keywords: front-end web design; HTML5; SVG; vector graphics; web design; front-end webu; HTML5; SVG; vektorová grafika; webový design
Citation: VČELÁK, Tomáš. Možnosti využití SVG ve webovém designu. České Budějovice, 2019. bakalářská práce (Bc.). JIHOČESKÁ UNIVERZITA V ČESKÝCH BUDĚJOVICÍCH. Pedagogická fakulta

Institution: University of South Bohemia in České Budějovice (web)
Document availability information: Fulltext is available in the Digital Repository of University of South Bohemia.
Original record: http://www.jcu.cz/vskp/51533

Permalink: http://www.nusl.cz/ntk/nusl-394436


The record appears in these collections:
Universities and colleges > Public universities > University of South Bohemia in České Budějovice
Academic theses (ETDs) > Bachelor's theses