Hlavním cílem diplomové práce je vytvořit pojednání o tvorbě responzivního web designu, dostupných frameworcích pro jeho tvorbu a jeho návrhových modelech. V teoretické části práce nalezneme popis jak postupovat při návrhu a dále jsou zde rozebrány dostupné technologie, které při jeho tvorbě využíváme. V praktické části práce, nalezneme srovnání čtyř vybraných existujících responzivních šablon pro e-komerce systém OpenCart, popis samotného systému a jeho výchozí neresponzivní šablony. Dále následuje popis tvorby vlastního řešení responzivní šablony pro výše uvedený systém.
Annotation in English
The main topic of this thesis is a description of the creation responsive web design, available frameworks for the creating design and which design models can be used. In the theoretical part we can find a description of how to proceed with the proposal and discussed the available elements which could be used in the work. In the practical part, we can find a comparison of four selected existing responsive templates, OpenCart system description and its default unresponsive template. This part is followed by description of own created solution of responsive template for OpenCart system.
Keywords
responzivní web design, e-komerce, e-shop, OpenCart, frameworky pro tvorbu responzivního layoutu, Skeleton, Sass
Keywords in English
responsive web design, e-commerce, e-shop, OpenCart, framework for building responsive layout, Skeleton, Sass
Length of the covering note
75 s. (83 528 znaků)
Language
CZ
Annotation
Hlavním cílem diplomové práce je vytvořit pojednání o tvorbě responzivního web designu, dostupných frameworcích pro jeho tvorbu a jeho návrhových modelech. V teoretické části práce nalezneme popis jak postupovat při návrhu a dále jsou zde rozebrány dostupné technologie, které při jeho tvorbě využíváme. V praktické části práce, nalezneme srovnání čtyř vybraných existujících responzivních šablon pro e-komerce systém OpenCart, popis samotného systému a jeho výchozí neresponzivní šablony. Dále následuje popis tvorby vlastního řešení responzivní šablony pro výše uvedený systém.
Annotation in English
The main topic of this thesis is a description of the creation responsive web design, available frameworks for the creating design and which design models can be used. In the theoretical part we can find a description of how to proceed with the proposal and discussed the available elements which could be used in the work. In the practical part, we can find a comparison of four selected existing responsive templates, OpenCart system description and its default unresponsive template. This part is followed by description of own created solution of responsive template for OpenCart system.
Keywords
responzivní web design, e-komerce, e-shop, OpenCart, frameworky pro tvorbu responzivního layoutu, Skeleton, Sass
Keywords in English
responsive web design, e-commerce, e-shop, OpenCart, framework for building responsive layout, Skeleton, Sass
Research Plan
Zpracujte literární rešerši na téma responzivní layout.
Prostudujte dostupné CSS frameworky pro tvorbu responzivního layoutu.
Vypracujte srovnání dostupných řešení responzivních šablon pro e-commerce platformu OpenCart.
Navrhněte vlastní řešení responzivní šablony pro OpenCart s důrazem na kvalitu uživatelského zážitku a s možností jednoduchého brandingu.
Navrženou šablonu naimplementujte a vytvořte ukázkovou instalaci e-shopu.
Research Plan
Zpracujte literární rešerši na téma responzivní layout.
Prostudujte dostupné CSS frameworky pro tvorbu responzivního layoutu.
Vypracujte srovnání dostupných řešení responzivních šablon pro e-commerce platformu OpenCart.
Navrhněte vlastní řešení responzivní šablony pro OpenCart s důrazem na kvalitu uživatelského zážitku a s možností jednoduchého brandingu.
Navrženou šablonu naimplementujte a vytvořte ukázkovou instalaci e-shopu.
Recommended resources
CASTRO, Elizabeth a Bruce HYSLOP. HTML5 a CSS3: názorný průvodce tvorbou WWW stránek. 1. vyd. Brno: Computer Press, 2012, 439 s. ISBN 978-80-251-3733-8.
WROBLEWSKI, Luke. Mobile first. New York: A Book Apart, 2011. ISBN 19-375-5702-2.
KADLEC, Tim. Implementing responsive design: building sites for an anywhere, everywhere web. Berkeley, CA: New Riders, c2013, xv, 271 p. ISBN 03-218-2168-8.
FRAIN, Ben. Responsive web design with HTML5 and CSS3: learn responsive design using HTML5 and CSS3 to adapt websites to any browser or screen size. Mumbai: Packt Pub., 2012, vi, 305 p. Community experience distilled. ISBN 9781849693196.
MARCOTTE, Ethan a [foreword by Jeremy KEITH]. Responsive web design. New York: A Book Apart, 2011. ISBN 09-844-4257-X.
Recommended resources
CASTRO, Elizabeth a Bruce HYSLOP. HTML5 a CSS3: názorný průvodce tvorbou WWW stránek. 1. vyd. Brno: Computer Press, 2012, 439 s. ISBN 978-80-251-3733-8.
WROBLEWSKI, Luke. Mobile first. New York: A Book Apart, 2011. ISBN 19-375-5702-2.
KADLEC, Tim. Implementing responsive design: building sites for an anywhere, everywhere web. Berkeley, CA: New Riders, c2013, xv, 271 p. ISBN 03-218-2168-8.
FRAIN, Ben. Responsive web design with HTML5 and CSS3: learn responsive design using HTML5 and CSS3 to adapt websites to any browser or screen size. Mumbai: Packt Pub., 2012, vi, 305 p. Community experience distilled. ISBN 9781849693196.
MARCOTTE, Ethan a [foreword by Jeremy KEITH]. Responsive web design. New York: A Book Apart, 2011. ISBN 09-844-4257-X.
