Webové

technologie

2023
Doc Ing. Zdeněk Linhart, CSc.
 Obsah
1. Obecně: Web tech. v 10 bodech 04 6. Front a back-end 31
Vyučující v 10 bodech 05 7. HTML 36
Rozvrh 06 8. Databáze 38
Tvorba stránky 07 9. Jazyky 41
Zkouška 12 10. SPA 44
2. Architektura klient-server 14 11. OOP 47
3. Webový prohlížeč 17 12. CMS 51
4. Hosting 20 13. Kód 54
5. Protokoly 23 14. Analytiky 56

Linhart, Webové technologie, VŠEM 2

1. Webové
technologie
obecně
Vzorová prezentace VŠEM 3
 1 2
Marketing in Five three hours lasting Examination by Electronic test
(1) or

10 points
lesson, consultations, self-
Written half page information
study, 5 ECTS
about results of analysis, own
plan and calls for projects (2)
Article for EL Všem (3)

3 4 5 6
Selection of topic for Consultations are Oral on Study aid at Articles at
marketing research and Mondays at 4 PM, room 409, http://vyuka.onemore.eu/u https://www.lib.cas.cz/ei
written at c2a.doc z/
process is verified by Science
http://predictive.mautic.net/fee
and commercialisation of dback
output or online at Teams

7 8 9 10
Example of book: SMITH, S.M., This course delivers knowledge Methods: Segmentation, Techniques: Shopping carts,
ALBAUM, G.S. (2011). An how to gain competitive targeting and positioning, questionnaire, validated
advantage by switch from foresight, preliminary research, questions, mass data from
introduction to marketing
market driven to market driving exploratory research, and Google Analytics, Google
research. Qualtrics. mode due to marketing marketing mix. Adwords, EDI, marketing
https://www.zamaros.net/Mar research. automation Mautic, calculators
ket%20Research.pdf with promotion content and
values
Vysoká škola ekonomie a managementu Linhart, Webové technologie 4

Lecturer in 10
points
3 4
Membership of
professional bodies:
Czech Academy of
Agricultural Sciences,
Group of Bruges, Czech
representative of Union of
Oil Seed Producers and
processors, chairman of
advisory co-operative
Agentura Agropro.
7 8
DIANOUX, C. – LINHART, Z.
The effectiveness of female
nudity in advertising in
three European countries.
International Marketing
Review (2010), 27 (5), 562-
578
Vysoká škola ekonomie a managementu
Linhart, Marketing research, VŠEM
1 2
Post graduate studies
with title CSc. (PhD
Associate professor of
Management in
equivalent) in
Economics
Agribusiness
5 6
Orientation on Reviewed up to 700 Participated in EU
Marketing research, projects of students per projects Tempus,
communication, e- year, sent about 8 Erasmus, Leonardo
Marketing of students for study abroad, da Vinci, Phare,
Innovations (own study supervised PhD students Grundtvig, H2020
texts available for food from Palestine, Pakistan,
and agricultural Equator and Bangladesh
products), Prognostics besides other Czechs
and Planning. finished PhDs
9 10
HÖNIG, V. – PEXA, M. – DIANOUX, C. – LINHART, Z. DIANOUX, C., KETTNEROVÁ, J. –
LINHART, Z. Biobutanol – VNOUČKOVÁ, L. Attitude LINHART, Z. Print advertising in
Standardizing Biodiesel toward Advertising in General the Czech Republic and France:
from Waste Animal Fat. and Attitude toward a Homogeneous or heterogeneous
Polish Journal of Specific Type of Advertising – practices? Conference: 13th
Environmental Studies, A First Empirical Approach. Annual Conference on Marketing
2015, roč. 24, č. 6, s. Journal of Competitiveness, and Business Strategies for
2433–2439. ISBN: 1230- 2014, 6, 1/2014, s. 87-103. Central and Eastern Europe 5
1485. ISSN: 1804-171X. Location: Vienna, 2005.
Webové technologie, Linhart,
pondělky

9:00 - 12:00
9:00 - 12:00
9:00 - 12:00
9:00 - 12:00
9:00 - 12:00
Linhart, Webové technologie, VŠEM
Postup tvorby webové stránky
Potřeby? Výzkum

Úspěch? Cílový segment

Kdo a proč se zastaví? Design

Co a jak povede čtenáře? Tvoř mapu!

Co dodá odpovědi? Piš!

Je nabídka unikátní? Vyhodnoť priority!

Co stránce říkají vyhledávače? Zveřejni ji!

Gratulace! Máš stránku

Proč se vše mění? Aktualizuj!

Vysoká škola ekonomie a managementu Linhart, Webové technologie 7

Zobrazení a tvorba webů a
aplikací
Základní pojmy a přehledy
• Web 1.0 = nástěnka –tvořená autorem (FTP, HTML,
CMS
• Web 2.0 = sociální sítě (FB, …) tvořené uživateli
• Web 3.0 = bezpečnější a svobodnější místo ve
virtuálním prostředí pomocí blockchain, NFT
sběratelství a obchod uměním, OSS obchod
aplikacemi, …
• Web 4.0 = je můj oponent a učitel (hlasoví asistenti,
AI), autonomní, kontextový, sebeučící, kolaborativní,
proaktivní, což vede k sebevědomému osvícení
Linhart, Webové technologie, Všem 8
 Konzultace

• písemným formulářem software

marketingové automatizace na
• https://predictive.mautic.net/instrukce
• Dotazy na výuce šetří čas konzultací!
• Individuální konzultace jsou každé
pondělí od 17 hodin na Teams
na

Vysoká škola ekonomie a managementu Linhart, Webové technologie, Všem

I. Potřeba: řízení počtu obsluhujících dodavatelů (servitizace)
I.1 Otevřená otázka na konkurenční – výstupní proměnné: Jakou zkušenost máte
s...DMS pro projektové kanceláře (Autodesk)? – Odpověď 1.1 Automatizace operací
se rozvíjí... Asatiani, A., Copeland, O., Penttinen, E. (2022). Deciding on the robotic
process automation operating model: A checklist for RPA managers. Bus.Horizons.
- Odpověď na dotaz na obsah předchozí odpovědi 1.1.1 (zdroj) Automatizace
robotických procesů (RPA) roste nejen u konkurence, ale i po celou dobu trvání
provozu podle toho zda byly použity proprietární nástroje RPA nebo řešení s
otevřeným zdrojovým kódem......................
I.2 Uzavřená otázka na nákupy v segmentech: Automatizaci jsme objednali podle...?
odpověď: faktor 1 (komunikace s subdodavateli) živnostníci 3 (30%), korporace 7
(70%); faktor 2 (koordinační situace) živnostníci 5 (50%), korporace 1 (10%); faktor 3
(znovupoužití stávajících struktur) živnostníci 2 (20%), korporace 2 (20%); Jiné ---
- slogan 1.2.1 ..............administrace práv partnerů OSS......................
- segment 1.2.2 IT práva vyvíjena decentralizovaně......................
II. Plánuji cílovému segmentu (II.1) OSS pro RPA.......II.2 hodnota konkurenční
proměnné), Klasifikační (prodejní) web robotizace pro architekty (pozemních i
liniových staveb), což dokládám odpověďmi o (II.3) bezpečnosti rychým vývojem
dokumentace robotizace.
III. Výběrovým řízení od partneři požaduji komplementaci m. mixu takto:
a. Pro služby: . práva prodeje specifických aplikací.
b. Pro investory: ..........rychlý nárůst počtu robotů
c. Na dotaci: ................NOVÝ daňový příjem od vývojářů OSS............
Linhart, Webové technologie, Všem
Zkouška

Linhart, Webové technologie, Všem 11

 Zkouška

1. Test, nebo
2. Alternativní zkouška 1: Psaná půl-strana s
výsledky analýzy pro plán osobní i partnerů
(zvládnutý marketing pro klienta) na
http://predictive.mautic.net/feedback
3. Alternativní zkouška 2: Publikovaná webová
stránka (zvládnutá technika)
Linhart, Webové technologie, Všem
 Cíl
• Vytvořit vhled do webových technologií pro pochopení práce
technických týmů a získání schopnosti organizovat, zadávat i
hodnotit práci techniků (koncepty a pojmy).
• Naučit se chápat programovací jazyky, frameworky, rozeznávat
„dobrý“ a „špatný“ kód, vytvářet základní databázové dotazy a
budou schopni vytvořit jednoduchou webovou stránku.
• Seznámit se s CMS OSS (Joomla!, Wordpress, Drupal, …),
zprovoznit jeden, včetně nastavení hostingu a doménových
záznamů.
• Pro seznámení se a rozlišování typů osobností studenti – budoucí
marketéři – se blíže seznámí s technologií kolem webu.
• Aplikovat nové znalosti podle potřeb různých pracovních pozic,
například marketingový analytik, správce webu nebo eshopu, SEO
specialista, odborník na digitalizaci státní správy, a další.

Vysoká škola ekonomie a managementu Linhart, Webové technologie, Všem

2.
Architektura
klient-server

14
Linhart, Webové technologie, Všem
Síťová architektura klient - server
• Server 24/7
• Klient 1 - 10‘
• IoT bez
serverů
• Roboti:
automaty
(robotická
ruka),
autonomní,
swarmy
Linhart, Webové technologie, Všem 15
Komunikace klientů se servery
• Servery (webhosting): Apache, Nginx, IIS, PHP, SQL, Redis.
• komunikace mezi službami mezi klienty a systémy webu
(Blok správy serveru (SMB), HTTP, HTTPS certifikáty)
• oddělení odpovědnosti - ověřování (přenos) a autorizace
(zpráva), Scénář 1: Komunikace mezi weby v hierarchii,
která zahrnuje doménové struktury, scénáře 2, 3, - řeší
webhosting
• Mikro služby jsou malé, umožňují zasílání zpráv, jsou
ohraničeny svým kontextem, autonomně vyvíjené,
nezávisle nasaditelné, decentralizované a sestavené a
nasazené do produkce pomocí automatizovaných
procesů
Linhart, Webové technologie, Všem
3. Web browser
a jeho funkce

17
Linhart, Webové technologie, Všem
Příklady webových prohlížečů
• Firefox.
• Google Chrome.
• Microsoft Edge.
• Apple Safari.
• Opera.
• Brave.
• Vivaldi.
• DuckDuckg

Linhart, Webové technologie, Všem 18

Technické odlišnosti browserů
• Funkce:
-- prohlížení webových stránek
-- komunikace se serverem a
-- zpracovává kód pro zformátování a zobrazení
prohlížených stránek
-- kód je psán v jazyku html (Hyper Text Markup Language)
• Omezení = nastavit oprávnění, aniž byste měnili výchozí
nastavení
• Ujistěte se, že je vaše mobilní zařízení spolu s aplikacemi
vždy aktualizováno

Linhart, Webové technologie, Všem 19

4. Hosting,
servery, emaily,
cloud, Azure,
AWS,
DigialOcean API
Linhart, Webové technologie, Všem 20
Webhosting
• K čemu slouží hosting? Webhosting služba provozování s technickými upgrady
serveru, kde běží web tvůrce nebo vlastníka stránek
• Virtuální hosting je způsob hostování více domén (s odděleným nastavením každé
z nich) na jednom serveru (seskupení serverů). Toto umožňuje serveru sdílet jeho
zdroje, jako je paměť a cykly procesoru, bez nutnosti všechny poskytované služby
používat na jednom jménu počítače.
• Server hosting je najmutí počítače jako serveru někde na páteřní síti internetu
• Cloud umožňuje umístění dat na něčí server.
• služeb Azure a AWS – viz
https://learn.microsoft.com/cs-cz/azure/architecture/aws-professional/services
• Load balancing a škálování zajišťují aplikace, které distribuují požadavky z Internetu

Linhart, Webové technologie, Všem 21

Nabídky a náklady webhostingu
Start
59,00 Kč -17 %49,00 Kčměsíčně bez DPH
Mám jen 1 web nebo e‑shop.
Teprve začínám a chci co nejlevnější,
kvalitní a bezúdržbový.
•ZDARMA .CZ doména (na 1. rok)
•1 doména
•5 GB pro web, e‑maily a databázi
•5 e‑mailových schránek
•1 databáze
WordPress na 1 kliknutí
•Turbo Cache 12× pro WordPress
•SSD disky pro nejvyšší výkon
•automatické malware scany
•24/7 ochrana proti kyberútokům
•SSL certifikát i pro subdomény
•automatická záloha dat (volitelné
Linhart, Webové technologie, Všem
Ultra
269,00 Kč -19 %219,00 Kčměsíčně bez
DPH
Rostu, můj byznys jede na plné obrátky,
ale na vlastní virtuální server to ještě
není.
•ZDARMA .CZ doména (na 1. rok)
•10 domén
•neomezeně místa
•neomezeně e‑mailových schránek
•neomezeně databází
WordPress na 1 kliknutí
•Turbo Cache 12× pro WordPress
•SSD disky pro nejvyšší výkon
•automatické malware scany
•24/7 ochrana proti kyberútokům
•SSL certifikát i pro subdomény
•automatická záloha dat (i 14 dní zpět)
•bezplatná obnova dat na 1 kliknutí
22
Cloud
• Cloud je multibilionový byznys.
• Platí se hodně, ale dost často jiným způsobem než u webhostingu
nebo server hostingu, kde se každý měsíc předplatí za jádra CPU a disk
stejná částka.
• U cloudu se platí za to, co aplikace spotřebuje. Tedy čas procesoru,
případně přenesená data. Každý měsíc se tedy platí jiná částka.
• Dost často tyto aplikace využívají autoscaling, takže se zvětšují a
zmenšují podle zatížení aplikace.

23
5. Protokoly
http, https, SSL,
https.V2, FTP, IP
adresy, DNS,
porty: 24

Linhart, Webové technologie, Všem

Komunikační protokoly na webu
• Rodina protokolů TCP/IP
• Komunikační pravidla komunikace počítač – internet,
o kterých uživatel nemusí vědět
• IP – Internet Protocol
• DHCP – dynamic host configuration protocol je síťový
protokol zajišťující dynamické přidělování IP adres
• TCP – transmission control protocol vytváří virtuální
okruh mezi koncovými aplikacemi a obousměrně
přenáší data

Linhart, Webové technologie, Všem 25

Protokoly pro webové stránky
• při práci ve webovém prohlížeči se setkáváme s
• HTTP – hypertext transfer protocol není šifrovaný
• HTTPS – hypertext transfer protocol secure je šifrovaný
• HTTP/2 je rychlejší

Linhart, Webové technologie, Všem 26

 Protokoly pro emailovou
komunikaci
• POP – post office protocol stahuje e-mailové zprávy ze vzdáleného
serveru
• SMTP – simple mail transfer protocol slouží pro přenos e-mailové
zprávy mezi přepravními servery MTA (mail transfer agent)
• IMAP – internet message access protocol řeší nevýhodu POP tím, že
umožňuje pracovat se zprávami přímo na serveru

Linhart, Webové technologie, Všem 27

Protokoly pro přenos souborů
• FTP – file transfer protocol od začátku sedmdesátých let slouží
k přenosu souborů.
• FTPS je pro zabezpečený přenos.
• SFTP – SSH file transfer protocol je zabezpečený normou SSH

Linhart, Webové technologie, Všem 28

Funkce komunikačních protokolů
• usnadňují interoperabilitu různých implementací počítačových programů,
které se podílejí na vzájemné komunikaci
• IP adresy – viz https://www.koutas.cz/cs/geospy. IP směruje datagramy
(pakety) ze zdrojového počítače do cílového hostitele přes jednu nebo více IP
sítí, včetně IP adresy počítače. Pouze speciální programy umožní IP adresu
počítače nezobrazit.
• Najděte svou IP adresu v Windows. Vyberte Start> Nastavení > Network &
internet > Wi-Fi a pak vyberte Wi-Fi síť, ke které jste připojení. V části
Vlastnosti vyhledejte svoji IP adresu, která je uvedená vedle
položky Adresa IPv4.
• Porty - ne všechny protokoly z transportní vrstvy používají porty k
rozlišení komunikace. I port může být identifikátorem původu zprávy.
Linhart, Webové technologie, Všem 29
DNS servery
• Funkce: DNS (Domain Name System) je hierarchický, decentralizovaný
systém doménových jmen, který je realizován servery DNS a protokolem
stejného jména
• K těm nejpoužívanějším patří služba Google Public DNS, OpenDNS (Cisco)
• Kde DNS najít? Otevřete nabídku Start – vyberte položku Hledat a zadejte
heslo cmd.
• zobrazí se vám spuštění příkazového řádku, do kterého napíšete příkaz
ipconfig/all.
• nyní se vám zobrazí kompletní výpis síťového nastavení vašeho počítače, ve
kterém téměř na konci naleznete řádek DNS Servers
• Nastavení DNS: Pro změnu DNS přistupte do “Ovládací panely” a zde si
zvolte “Centrum síťových připojení a sdílení”. Zde zvolte
“Změnit nastavení adaptéru”. V seznamu připojení nalezněte to přes které
jste připojen k internetu, klikněte na něj druhým tlačítkem myši pro vyvolání
volby a vyberte možnost “Vlastnosti” 30
Linhart, Webové technologie, Všem
6. Front-end,
back-end,
komunikace -
xml, json, csv
31
Linhart, Webové technologie, Všem
Front-end vidí čtenář

32
Linhart, Webové technologie, Všem
V back-endu je vytvářen obsah

33
Linhart, Webové technologie, Všem
Charakteristika, specifika, úlohy a
způsoby komunikace
• Čtenář nemůže z front-endu ovlivňovat obsah webu
• Může však dostat přístup do určené části back-endu
• Tvůrci obsahu v back-endu nemusí mít práva administrátora
• Administrátor je informován o upgradech a četnosti návštěv, která
může pocházet od botů
• Tvůrci CMS mohou pro zvýšení bezpečnosti post-instalačními zprávami
měnit části kódu i mimo upgrade

Linhart, Webové technologie, Všem 34

xml, json, csv
• Při exportu referenčních hodnot lze definovat nebo použít formáty
exportu.
• Hodnoty dat můžete exportovat do formátu hodnot oddělených
čárkami (CSV), třeba v Excelu, nebo
• soubor rozšiřitelného značkového jazyka (Extensible Markup
Language - XML) importovat do jiného souboru dat nebo pro použití v
externím systému.
• JSON je uživatelsky přívětivou náhradou za XML, protože je lehký a
snadno čitelný. Podporuje datové struktury, jako jsou pole a objekty a
dokumenty JSON, které jsou na serveru rychle prováděny.
35
7. Základy
tvorby webu –
html, CSS,
JavaScript,
Vzorová prezentace VŠEM 36
 Definice webu, tvorba webové stránky

• Web je celosvětová síť k prohlížení, ukládání a odkazování

• Praktické seznámení s html/css k tvorbě webové stránky:
https://cs.khanacademy.org/computing/computer-programming/html-css
• Značka <head> je kontejner pro metadata (data o datech) a je umístěn mezi
značkou <html> a značkou <body>
• Po stisknutí prvého tlačítka a kliknutí na view page source na webové stránce se
objeví její program, který bude začínat <html> byla-li v něm naprogramována.
• Css (kaskádové styly) slouží k zjednodušení práce se styly textu viz
https://www.jakpsatweb.cz/css/
• JavaScript je multiplatformní, objektově orientovaný, událostmi řízený
skriptovací jazyk
Linhart, Webové technologie, Všem 37
8. Databáze –
SQL, mySQL,
noSQL

Linhart, Webové technologie, Všem 38

Zálohování dat
• Data jsou automaticky zálohována na serveru a při
ztrátě funkčnosti webové stránky je možné dodavatele
webhostingu požádat o obnovení některé z předchozích
záloh
• Webové stránky, vytvořené v CMS z databáze plní
obsah polí tabulky front-endu při každém natažení
stránky
• OSS CMS používají i OSS databáze, například MySQL
• SQL Structured Query Language (Strukturovaný
dotazovací jazyk) - je obecný nástroj pro manipulaci,
správu a organizování dat uložených v databázi počítače
• Praktické ukázky dotazů SQL
Linhart, Webové technologie, Všem 39
Praktické ukázky dotazů SQL

40
Linhart, Webové technologie, Všem
9. Jazyky a
frameworky –
MVC, .NET, PHP,
NodeJs, Python,
CSS Vzorová prezentace VŠEM 41

Linhart, Webové technologie, Všem

Jazyky pro webový vývoj
• základní charakteristiky
• odlišnosti.
• MVC je softwarová architektura, která rozděluje datový model aplikace, uživatelské rozhraní a řídicí logiku
do tří nezávislých komponent Model-view-controller tak, že modifikace některé z nich má jen minimální vliv
na ostatní
• .NET je bezplatná multiplatformní vývojářská platforma open source pro vytváření mnoha druhů aplikací.
Je dostupná pro Web, Windows i Pocket PC
• PHP je programovací jazyk, který pracuje na straně serveru. Na rozdíl od html ukládá a mění data webových
stránek. Původní význam zkratky PHP byl Personal Home Page, nyní Hypertext Preprocessor
• NodeJs je softwarový systém navržený pro psaní vysoce škálovatelných internetových aplikací, především
webových serverů. Programy pro Node. js jsou psané v jazyce JavaScript, hojně využívající model událostí a
asynchronní I/O operace pro minimalizaci režie procesoru a maximalizaci výkonu
• Python je moderní programovací jazyk. Je univerzální – pohání weby, rakety a AI. V AI jsou používány v
něm vytvořené databáze.
• CSS je již zmíněný kaskádový styl

Linhart, Webové technologie, Všem 42

Frameworky a jejich využití
• Framework je softwarová struktura pro podporu programování,
vývoje a organizace softwarových projektů. Může obsahovat
podpůrné programy, knihovny API, podporu pro návrhové
vzory nebo doporučené postupy při vývoji
• Frozen spots definují celkovou architekturu softwarové struktury,
její základní komponenty a vztahy mezi nimi. Tyto části se
nemění při žádném použití frameworku.
• Komponenty a kód hot spots vytváří skoro pokaždé jinou
specifickou funkcionalitu
https://cs.wikipedia.org/wiki/Seznam_webov%C3%BDch_aplika
%C4%8Dn%C3%ADch_framework%C5%AF

• Při odinstalování frameworku již nebude možné

některé aplikace spustit.
Linhart, Webové technologie, Všem 43
10. Single Page
Applications –
SPA
44
Linhart, Webové technologie, Všem
Koncepty webových aplikací
• Webová aplikace je webové místo, které obsahuje
stránky s částečně nebo úplně neurčeným obsahem.
Stránka = místo = aplikace?
• Návrhové vzory a idiomy, například https://
extensions.joomla.org Testovat, testovat, testovat!
• Koncept webových aplikací a jejich charakteristiky:
placené OSS, Frameworky, přílepky

Linhart, Webové technologie, Všem 45

Tvorba SPA– Angular, VueJs, React
• SPA (single page application) je něco jako jeden projekt v
byznysu
• React je knihovna UI, Angular je front-end framework, zatímco
Vue. JS je progresivní rámec.
• Angular, VueJs a React mohou být použity téměř zaměnitelně k
vytváření front-end aplikací, ale nejsou to 100 procent stejné,
takže má smysl je porovnat a porozumět jejich rozdílům.
• Angular, VueJs, React nejsou vhodné pro back-end aplikace, kde
je řízena komunikace klient-server podle standardů byznysu,
třeba zásob nebo účetnictví.
• Výjimkou je NodeJS, kde i tyto frontend frameworky lze použít
na backendu. Například NextJs dokáže HTML vygenerovat jak na
backendu tak na frontendu. Tedy ve spojení s backendem jsou
tyto frameworky vhodné i pro řízení zásob nebo účetnictví.
Linhart, Webové technologie, Všem 46
11. Objektové
programování,
design patterns
47
Linhart, Webové technologie, Všem
Objektové programování (OOP)
• OOP (object oriented programming) je koncept a přístup k tvorbě
kódu.
• základní pojmy a principy konceptu OOP
• základní pojmy a principy přístupu OOP k tvorbě kódu
• Markery funkčního OOP v html kódu https://
www.w3schools.com/tags/tag_object.asp
• Pro marketéry je užitečné znát uvedené pojmy a vyžadovat jejich
znalost u dodavatelů i interních programátorů.

Linhart, Webové technologie, Všem 48

Základní pojmy a principy objektu

49
Linhart, Webové technologie, Všem
Principy webové komunikace SPA

• [Cit. 23.9.2022]. https://www.vovcr.cz/odz/tech/394/page02.html

50
Linhart, Webové technologie, Všem
12. CMS,
Wordpress,
Drupal, Joomla,
SiteCore,
October CMS Vzorová prezentace VŠEM 51

Linhart, Webové technologie, Všem

Redakční systémy (CMS)
• velmi populární nástroj pro tvorbu a správu webu.
• Rozdíly: Drupal je pro vývojáře, WordPress se zaměřuje
na jednoduchost a Joomla je někde mezi, pokud jde o
uživatelskou přívětivost a přizpůsobitelnost.
• Výhody: Není třeba znát kód a umět programovat.
Stačí klikat.
• Nevýhody: Neznalost kódu a webových technologií
uživateli komplikuje pochopit, proč jeho CMS kolabuje.
• Například: Uživateli se stále načítá starý obsah z cache
paměti. Aby byla změna viditelná pro návštěvníky
webu, je potřeba cache promazat.
Linhart, Webové technologie, Všem 52
Tutoriály k implementaci
• Newcomer, C. (2022). How to Create an eCommerce Website with
WordPress: Full Tutorial. [Cit. 23.9.2022].
https://athemes.com/tutorials/create-ecommerce-website-with-word
press/
• Drupal tutorials. (2022). [Cit. 23.9.2022].
https://www.drupal.org/documentation/customization/tutorials
• Joomla! Tutorials. [Cit. 23.9.2022].
https://docs.joomla.org/Tutorials:Beginners

53
Linhart, Webové technologie, Všem
13. Dobrý a
špatný kód

Linhart, Webové technologie, Všem 54

Jak rozeznat „dobrý“ a „špatný“
kód?
• Kód se kopíruje, například z githubu nebo
• Se zcela ignoruje, například u CMS.
• AI dnes umí kód generovat.
• Úskalí „špatného“ kódu jsou napadení hackery, a to je
důsledkem absence aktualizací.
• Aktualizace jsou dané počtem developerů. A to je to,
co označuje „dobrý“ kód.
• Nutné charakteristiky kódu, které je třeba vyžadovat
od dodavatelů jsou popisky a strukturovanost, aby se
v kódu vyznali nástupci.
Linhart, Webové technologie, Všem 55
14. Analýzy a
analytiky

56
Linhart, Webové technologie, Všem
 Vložení kódu, či scriptu
do stránky
• I v CMS vkládáte do kódu stránek například odkaz na Google analytics
nebo post-instalační doporučení.
• Ve stránce kliknete na oddělovač a do stránky přidáte další blok
a stránku uložíte.
• Vložením kódu s žádoucí funkcí:
- Technicky předcházíte útokům
- Marketingově poznáváte cílový segment. Z kontaktů děláte leady, z
nich zákazníky, pak případně influencery).

Linhart, Webové technologie, Všem 57

Náhled prostředí Google Analytics

Vysoká škola ekonomie a managementu Linhart, Webové technologie, Všem

 Měření odchozích odkazů,
Přesměrování, další typy
měření
•Měření odkazů ke stažení
Kliknutí na odkazy na soubory ke stažení (např. PDF, AVI, WMV) lze měřit jako události
nebo virtuální zobrazení stránky virtuální zobrazení stránky
•Měření elektronického obchodu (Universal Analytics
•Měření událostí
Pokud k měření Analytics používáte Správce značek Google, přečtěte si článek Události
Analytics.
Pokud je měření Analytics na váš web přidáno přímo, přečtěte si článek
Měření událostí – měření webu na webu pro vývojáře ve službě Analytics.
•Vlastní dimenze (ne/člen)
•Časování uživatelů (doba načítání zdrojů založených na technologii Ajax)
Flash už není podporován ani od Adobe – viz
https://www.adobe.com/products/flashplayer/end-of-life.htm

Linhart, Webové technologie, Všem

Literatura
• Video (5‘) k základům programování webových stránek a technologiím https://
www.youtube.com/watch?v=B4NyErXrbr8
• Franěk, Z. (2018). Objektové metody modelování v příkladech. Slezská univerzita. [Cit.
23.9.2022]. https://
repozitar.cz/repo/37712/Franek_Objektove_modelovani_181103.pdf?info
• Joomla! Extensions Directory TM. [Cit. 23.9.2022]. https://extensions.joomla.org/
• Merunka, V. (2005). Modelování podle metody BORM pomocí nástroje Craft.CASE. PEF
ČZU v Praze.
• Merunka, V. (2003). Metoda BORM. The BORM methodology: a third-generation fully
object-oriented methodology, Knowledge-Based Systems 3(10) 2003, Elsevier Science
Publishing, New York. [Cit. 23.9.2022]. https://
adoc.pub/vojtch-merunka-metoda-borm.html
• Newcomer, C. (2022). How to Create an eCommerce Website with WordPress: Full Tutorial. [Cit.
23.9.2022]. https://athemes.com/tutorials/create-ecommerce-website-with-wordpress/

Linhart, Webové technologie, Všem

Literatura
• Newcomer, C. (2022). How to Create an eCommerce Website with
WordPress: Full Tutorial. [Cit. 23.9.2022].
https://athemes.com/tutorials/create-ecommerce-website-with-word
press/
• Drupal tutorials. (2022). [Cit. 23.9.2022].
https://www.drupal.org/documentation/customization/tutorials
• Joomla! Tutorials. [Cit. 23.9.2022].
https://docs.joomla.org/Tutorials:Beginners

Linhart, Webové technologie, Všem 61

 Online materiály
- LINHART, Z. Marketing for Agricultural Economics and Management, ČZU Praha
2003. ISBN 80-213-1030-8 http://vyuka.onemore.eu/uc2a.doc
- Possible topic http://vyuka.onemore.eu/Product_Testing_Overview.pdf
- Assignment and self-evaluation scales
http://vyuka.onemore.eu/attitudinal_demand_of_innovations16.pptx
- Trade marketing http://vyuka.onemore.eu/private_labels2013.pdf
• Mora Corteza, R., Gillilandb, D.I., Johnstond, W.J. (2020).
Revisiting the theory of business-to-business advertising. Industrial Marketing
Management, 89, 642-656.
• Kienzler, M., Kowalkowski C. Pricing strategy: A review of 22years of marketing research.
Journal of Business Research, Volume 78, September 2017, Pages 101-110.
• MAUCUER, R.,RENAUD, A., RONTEAU, S., MUZELLEC, L. (2022). What can we learn from
marketers? A bibliometric analysis of the marketing literature on business model
research. Long Range Planning, 55(5).
• Examples of older articles http://vyuka.onemore.eu/mkt_readings00.doc
Linhart, Webové technologie, Všem
Diskuze

Linhart, Webové technologie, Všem 63

 Webové technologie

Co jsou webové technologie?

Webové Webové Pro zákazníky,

technologie lze
technologie klienty, partnery
zvládat v osobní
představuje a společnost se
kompetenci,
hardware, protože to, co osoba znalá
software a nezvládnete, se dá webových
znalost objednat a technologií stává
odstranění chyb
marketingu pro použitelnou.
dohledat na webu.
byznys
Vývoj webové stránky produktu s grafikou a sloganem
pro trh je možné zadání zkouškového projektu
Linhart, webové technologie, VŠEM 6
Vysoká škola ekonomie a managementu 4
Co Vás přenese přes propast k inovátorům?
Marketingové aspekty
• Pozvěte partnery k obsluze Vašeho projektu, třeba
prodejní nálevky (sales funnel servitization)
• V analytice si najděte husté klastry mezi řídkými daty
(odlište cílové segmenty)
• Ujasněte si funkci rozdělení pravděpodobnosti, a to, co
se dá kumulovat a jak to, co převést adaptací ke
komplementaci
• Budete homogenizovat distribuční funkci (cílový
segment) nebo standardizací snižovat náklady
• Stabilizujete základ Vašeho byznysu zmnožováním
alternativ a partnerů, nebo prodáte pilotní provoz?
Linhart, Webové technologie, Všem
 Webové technologie

Úkol I
Jaké trhy rostou nejrychleji a kdo na nich vítězí a proč?

Úkol II
ˇJakým ukazatelem budete měřit výstup a jak pořídíte
seznam zdrojů, které konkurence neobsadila?)

Jaké metody a zdroje garantují, že dosáhnete výstupů? Otevřená

otázka, otázka s výčtem odpovědí o odlišnostech nakupování v
segmentech trhu. Plánujete dosáhnout výstupu s pomocí partnerů
sami, bez zaměstnavatele. Partnery vytvářejte výzvami k podávání
projetků.
Kdo bude dělat co? Řídíte postup nebo vstup a výstup?

Kdy začnete?
66
Linhart, Webové technologie, VŠEM
Vysoká škola ekonomie a managementu
 Studijní materiály
- Linhart, Z. (2022) Úvod do deep learning. VŠEM
Praha.
- Linhart, Z. (2021) Strategický marketing. VŠEM
Praha.
- Linhart, Z. (2023) Marketingový výzkum. VŠEM
Praha.
- Linhart, Z. (2003) Marketing. ČZU Praha, ISBN
80-213-1011-1. http://vyuka.onemore.eu/uc2c.doc
- Linhart, Z. (2017) Nová média. VŠEM Praha.
Linhart, Webové technologie, Všem
Doporučení
• Předmět webové technologie není o vědě, ale o standardech.
• Naučte se odvozovat otázky na to, co ze standardů v odpovědi
partnera neumíte provést.
• Kvantifikujte dle pracnosti svůj náklad učení a porovnejte s cenou
dodavatele služby.
a) Znáte a umíte kvantifikovat proměnné a komparovat jee v
hypotézách?
b) Umíte a chcete provádět měření analytikou, marketingovou
automatizací nebo AI?
c) Jak spustíte A/B testování a rozhodnete se, co patří do strategie?
d) Které odstálé hodnoty stojí za spuštění nových projektů, třeba i s
novými partnery?
Linhart, Webové technologie, Všem
Identifikátory výkonu webových
technologií
• Počet návštěv
• Čas strávený na stránce
• Míra opuštění stránky
• Dosažení cílů
• Zdroje návštěvnosti
• Prokliky
• Nákupy

Linhart, Webové technologie, Všem

Design hypotéz pro vyjednávání s partnery
• H1. Význam globálního zboží poroste
• 1.1 Čím vyšší podíl na trhu globálního zboží, tím kratší čas budování
vlastního dodavatelského řetězce
• 1.2 Čím vyšší podíl na trhu globálního zboží, tím menší známost vlastní
značky
• Čím vyšší podíl na trhu globálního zboží, tím vyšší obrat logistiky
• H2. Vliv svépomoci (autarkie, vlastního zboží) se zvýší, když se omezí trh
• H3. Vliv válečného hospodářství se zvýší, když se omezí jak trh, tak
svépomoc
Linhart, Webové technologie, Všem
Diskuze

71
Linhart, Webové technologie, Všem
Prodejní koncept
• Kup za 100, prodáš za 50
• Prodáš jako první
• Vyděláš 1000

Linhart, Webové technologie, Všem

 Analýza sentimentu
Objektivita

Objectivní negativista Positivistická věda

(brání brand loajalitu)
Pozitivní výběr(x)

Korelace
Subjectiví
pozitivista
Teorie Y
Negativní výběr (x) (akvizice
humbukem)
Subjektivní negativista (kulturní tabu)

Subjektivita
Positivismus
Negativismus Linhart, Webové technologie, Všem 73
 Topic Mark
Name
Nguyenová Hai Anh Wheel and rail transportation marketing Fail 12.6.
Schejbal Lukáš AI in logistics
Chudějová Natálie MML for unpredicted events Good 5.6.
Seidl Andreas Storage logistics - automation

Mrázová Pavla Logistics management Good 12.6.

Veselá Iveta rental market crisis management Good 12.6.
Potential of outstanding types of logistical
Rusková Dominika Good 12.6.
marketing systems
Topolová Nikola
Online logistics Good 12.6.
Němečková Natálie Logistics of customer service (AI?) Good 5.6.
local heavy materials and transporting
Rödlová Tereza Very good 12.6.
highly added spare parts

Linhart, Webové technologie, Všem

Your selected topic at the first
lecture Topic
Name
Mark

Linhart, Webové technologie, Všem

5. User Interface Design

B. Training in small group

A. Relaxed body relax mind. for 166 CZK instead of 250
Discount 20 % for regular CZK besides the discount 20
Source: Linhart, Lozinska, in press 76
attendance in September Linhart, Webové technologie, Všem % in September
 Source: Acquia & Mautic Campaign Studio

“A”
Počet Počet Koeficient Počet Počet Obrat Konv
odeslaných otevřený konverze návštěv návštěv (počet erze
emailů ch otevřených webové Instagramu prodejů) prode
emailů emailů, % stránky jů

První 720 202 28,06% 22 8 8 3,96

mailing %,

Source: Linhart, Lozinska, in press

77
Linhart, Webové technologie, Všem
“B”
Počet Počet Koeficient Počet Počet Obrat Konv
odeslanýc otevřený konverze návštěv návštěv (počet erze
h emailů ch otevřených webové Instagramu prodejů) prod
emailů emailů, % stránky ejů

Segment 24 15 62,5% 3 0 5 33,3

“Leads” %

Segment 375 54 14,4% 5 1 2 3,7%

“neotevřeli
první mail”

78
Source: Linhart, Lozinska, in press Linhart, Webové technologie, Všem
Segmenty

Segment name Počet

kontaktů

Segment “Leads” 24
Segment “Neaktivní” 110
Segment “Neotevřeli 1. mail” 375
Segment “Unsubscribed” 6

Source: Linhart, Lozinska, in press Linhart, Webové technologie, Všem 79

 Očet udělených Kontakt poslal email
Denní náběh bodů po provedení
akce 1 is yes, and 2 is no

Výsledky V Všech
segmentu responde
Došli na
Došli na
webovou iPhone
Android Mac Windows
Instagram phone comp comp
"Leadů" ntů stránku
"B"
1 12 2 3 1 2 2 2
2 16 0 3 1 2 2 2
4 40 0 3 1 2 2 1
6 77 2 3 2 2 2 1
7 80 0 3 1 2 2 2
9 117 0 3 1 2 2 2
12 143 2 3 1 2 2 2
14 156 0 0 1 2 2 2
15 158 0 6 1 2 2 2
18 180 4 0 2 1 2 2
19 188 2 0 1 2 2 2
20 191 0 3 1 2 2 2
21 194 2 3 1 2 2 2
23 199 0 6 1 2 2 2
Source: Linhart, Lozinska, in press Suma bodů B 14 39 0,358974
Suma bodů A 30 90
t-test between campaigns 0,140320 0,296582 0,080834 0,424747

t-test iPhone vs. Ostatní OS 6,75866E-12

Linhart, Webové
technologie, Všem F-test iPhone vs. Ostatní OS 0,007722 80
 Kampaň A – přepočet na peníze
• Akce uvnitř e -mailu: 22 jedinečných kontaktů stisklo tlačítko „Přejít
na web“, což přineslo 27 návštěv. 8 jedinečných kontaktů stisklo
„Přejít na Instagram“. Celkem bylo identifikováno 30 kontaktů se
zvýšeným zájmem a 35 z kliknutí na mail.
• Počet uzavřených prodejů je 8, což představuje 25 900 kč v peněžních
termínech. 5 skupinových permanentek, každá 2000 kč a 3 jednotlivé
permanentky, každá 5300 CZK. 64,09% obratu je generováno od
uživatelů iPhone, což představuje 16 600 CZK.

Source: Linhart, Lozinska, in press

Linhart, Webové technologie, Všem 81

Kampaň A – přepočet na peníze
• Reakce na e -mail: 8 jedinečných kontaktů stisklo
„Přejít na web“. 1 Unikátní kontakt stiskl „Přejít na
Instagram“. Celkem bylo identifikováno 9 kontaktů
se zvýšeným zájmem.
• Celkový počet uzavřených prodejů je 7, což
představuje 20 600 CZK. 5 skupinových
permanentek, každá 2000 CZK a 2 jednotlivé
permanentky, každá 5300 CZK. 70,84% obratu je
generováno od uživatelů iPhone, což představuje
14 600 CZK.

Source: Linhart, Lozinska, in press Linhart, Webové technologie, Všem 82

 Tak, hodně
štěstí!

Doc. Ing. Zdeněk Linhart, CSc.