SOUKROMÁ VYSOKÁ ŠKOLA EKONOMICKÁ ZNOJMO, s.r.o.
Bakalářský studijní program: Ekonomika a management
Studijní obor: Ekonomika veřejné správy a sociálních služeb
NÁVRH A ANALÝZA WEBOVÝCH
STRÁNEK PRO NEZISKOVOU
ORGANIZACI PIONÝR JEVIŠOVICE
BAKALÁŘSKÁ PRÁCE
Autor: Jaroslav NOVÁK
Vedoucí bakalářské práce: Mgr. Tomáš JURMAN
Znojmo, duben 2010
Poděkování:
Na tomto místě bych rád poděkoval vedoucímu své bakalářské práce Mgr. Tomáši
Jurmanovi za obětavý přístup, odborné konzultace a cenné připomínky, kterými přispěl
k vypracování této bakalářské práce. Dále bych chtěl poděkovat své rodině, že mi svoji
podporou umožnili studovat na této škole.
Abstrakt
Bakalářská práce „Návrh a analýza webových stránek pro neziskovou organizaci Pionýr
Jevišovice“ pojednává o možnostech, jakým způsobem se může dětská organizace sama
propagovat. V bakalářské práci představuji dětskou organizaci Pionýr Jevišovice, její
činnost, popisuji současnou situaci v organizaci a jaké marketingové nástroje používá.
Dále popisuji základní náležitosti webových stránek, strukturu a design. Vysvětlím zásady
přístupnosti a použitelnosti webových stránek. Předmětem bakalářské práce je vytvořit
teoretický návrh pro vytvoření funkčních webových stránek dětské organizace. Tyto
webové stránky budou po jejich aplikaci nejvhodnějším způsobem propagovat činnost
organizace na veřejnosti.
Klíčová slova
WWW stránky, web, nezisková organizace, Pionýr, analýza
Abstract
The bachelor thesis called “Web sites design and analysis for not-for-profit organization
Pioneer Jevišovice” deals with possibilities in what way a children´ s organization can
promote itself. In this bachelor thesis I present the children´ s organization Pioneer
Jevišovice, its activity, I describe present circumstances in the organization and what
marketing instruments it uses. I describe also some basic requirements of web sites, their
structure and design. I explain principles of accessibility and applicability of web sites.
To create a theoretical design for creating of children´ s organization functional web sites
is the subject of this bachelor thesis. These web sites will promote this organization
activity in public in the most appropriate manner after their application.
Key words
Web sites, web, not-for-profit organization, Pioneer, analysis.
Obsah
1 Úvod .............................................................................................................................. 9
2 Cíl práce a metodika .................................................................................................. 10
3 Teoretická část ........................................................................................................... 12
3.1 Vymezení pojmu nezisková organizace ................................................................ 12
3.2 Definice neziskové organizace .............................................................................. 12
3.3 Občanská sdružení ................................................................................................ 13
3.3.1 Dobrovolnictví ............................................................................................... 14
3.3.2 Motivace ........................................................................................................ 14
3.3.3 Pionýr ............................................................................................................. 15
4 Tvorba WWW. stránek ............................................................................................. 17
4.1 Hierarchie .............................................................................................................. 17
4.2 Zbytečná slova ...................................................................................................... 18
4.3 Orientace na stránkách .......................................................................................... 18
4.4 Důležitost navigace ............................................................................................... 19
4.4.1 Perzistentní (globální) navigace ..................................................................... 20
4.4.2 Prvky navigace ............................................................................................... 20
4.4.3 Optimálně navržené stránky .......................................................................... 21
4.5 Grafika a design .................................................................................................... 22
4.5.1 Barvy .............................................................................................................. 22
4.5.2 Text ................................................................................................................ 22
4.5.3 Obrázky .......................................................................................................... 23
4.6 Co je použitelnost stránek ..................................................................................... 23
4.7 Přístupnost webu ................................................................................................... 24
4.7.1 Kaskádové styly ............................................................................................. 24
4.7.2 Obsah webových stránek je dostupný a čitelný ............................................. 25
4.7.3 Ovládání webu je jasné a pochopitelné .......................................................... 25
4.7.4 Rozvoj webu .................................................................................................. 26
4.7.5 Webová prezentace ........................................................................................ 26
5 Dětská organizace Pionýr Jevišovice ........................................................................ 27
5.1 Jak pracujeme? ...................................................................................................... 27
5.2 Současný stav organizace ...................................................................................... 28
6 Testování webových stránek ..................................................................................... 29
6.1 Objektivní faktory testování .................................................................................. 29
6.2 Analýza konkurence .............................................................................................. 29
6.2.1 Analýza klíčových slov stránky ..................................................................... 29
6.2.2 Analýza zdrojového kódu stránky ................................................................. 29
6.2.3 Analýza síly webové stránky ......................................................................... 29
6.2.4 Analýza pozice webové stránky ve vyhledávačích ........................................ 30
6.3 Výsledky analýz .................................................................................................... 31
6.4 Výsledky analýz klíčových slov a textu ................................................................ 31
6.4.1 Analýza klíčových slov a textu webu koprivnice.pionyr.cz .......................... 31
6.4.2 Analýza klíčových slov a textu webu skautjevisovice.estranky.cz ............... 32
6.4.3 Analýza klíčových slov a textu webu orlice.abahoa.cz ................................. 32
6.5 Výsledky analýz zdrojového kódu ........................................................................ 33
6.5.1 Analýza zdrojového kódu webu koprivnice.pionyr.cz .................................. 33
6.5.2 Analýza zdrojového kódu webu skautjevisovice.estranky.cz ........................ 33
6.5.3 Analýza zdrojového kódu webu orlice.abahoa.cz ......................................... 34
6.6 Výsledky analýz síly webu .................................................................................... 34
6.6.1 Síla webu koprivnice.pionyr.cz ..................................................................... 34
6.6.2 Síla webu skautjevisovice.estranky.cz ........................................................... 35
6.6.3 Síla webu orlice.abahoa.cz ............................................................................. 35
6.7 Výsledky analýz pozice ve vyhledávačích ............................................................ 36
6.7.1 Analýza pozice ve vyhledávačích webu koprivnice.pionyr.cz ...................... 36
6.7.2 Analýza pozice ve vyhledávačích webu skautjevisovice.estranky.cz ........... 36
6.7.3 Analýza pozice ve vyhledávačích webu orlice.abahoa.cz ............................. 36
6.8 Vyhodnocení provedených analýz ........................................................................ 37
6.8.1 Vyhodnocení na základě analýz klíčových slov ............................................ 37
6.8.2 Vyhodnocení na základě analýz zdrojových kódů ........................................ 37
6.8.3 Vyhodnocení na základě analýz síly webu .................................................... 38
6.8.4 Vyhodnocení validace - porovnání ................................................................ 38
6.8.5 Vyhodnocení na základě analýzy pozice ve vyhledávačích .......................... 39
6.9 Subjektivní zhodnocení ......................................................................................... 40
6.9.1 Subjektivní zhodnocení úvodní stránky webu Pionýra .................................. 40
6.9.2 Subjektivní zhodnocení úvodní stránky webu Skauta ................................... 41
6.9.3 Subjektivní zhodnocení úvodní stránky webu Junáka ................................... 42
7 Vlastní návrh www stránek ...................................................................................... 43
7.1 Strukturální část .................................................................................................... 43
7.1.1 Verze pro mobily ........................................................................................... 44
7.1.2 Sekce O nás .................................................................................................... 45
7.1.3 Sekce Fotogalerie ........................................................................................... 46
7.1.4 Sekce Schůzky ............................................................................................... 46
7.1.5 Sekce Diskuse ................................................................................................ 46
7.1.6 Sekce Kontakty .............................................................................................. 47
7.2 Grafická část .......................................................................................................... 47
7.2.1 Znak ............................................................................................................... 48
7.3 Výběr domény a hostingu ..................................................................................... 48
7.3.1 Vlastní doména .............................................................................................. 49
7.3.2 Další možnosti ............................................................................................... 49
7.3.3 Naše cesta ...................................................................................................... 50
8 Závěr ........................................................................................................................... 51
9 Použité zdroje ............................................................................................................. 53
Seznam tabulek a obrázků ................................................................................................ 55
Seznam použitých zkratek ................................................................................................ 56
9
1 Úvod
S rozvojem Internetu a jeho snadné dostupnosti se většina organizací a firem začala stále
více orientovat na prezentace své práce a činnosti pomocí webových stránek. Pro jejich
zákazníky, partnery, sponzory, členy ale i nestranného člověka je to dobrý způsob, jak
představit a propagovat svou organizaci nebo firmu. Lidé si mohou z pohodlí domova
prohlížet jednotlivé webové stránky a sami si mohou vybrat, co potřebují vědět
a co je zajímá.
V této práci se budu zabývat teoretickým návrhem webových stránek, které by měli sloužit
dětské organizaci Pionýr Jevišovice, jako jedné z mnoha neziskových organizací,
především jako nástroj propagace, prostor pro oslovení uživatelů, členů, sponzorů
a partnerů, případně jako prostředek pro zlepšení image dětské organizace.
Popíši základní náležitosti webových stránek, strukturu a design. Vysvětlím zásady
přístupnosti a použitelnosti webových stránek, protože se při vytváření stránek nesmí
zapomínat na uživatele, kteří mají některý typ zdravotního postižení, nebo mají jinak
omezené schopnosti, nedisponují skvělými znalostmi a zkušenostmi s používáním webu
nebo prostě jen nevlastní optimální zobrazovací zařízení.
10
2 Cíl práce a metodika
Hlavním cílem bakalářské práce je navrhnout vlastní webové stránky pro dětskou
organizaci Pionýr Jevišovice, která tento druh propagace a komunikace v současné době
nepoužívá.
Tato práce je rozdělena na 8 kapitol. 3 kapitola představuje teoretickou část – vymezení
pojmu a definice neziskové organizace, typy nestátních neziskových organizací.
Vysvětlení pojmu občanské sdružení, které funguje především díky dobrovolnictví
ze strany členů, kteří se podílejí na vedení a činnosti organizace.
V kapitole 4 je teoretický návod na vytvoření webových stránek. Každý subjekt, který
přemýšlí o tvorbě svých vlastních webových stránek, si musí především uvědomit,
co konkrétně od tohoto kroku očekává. Z toho důvodu jsou zde vysvětleny pojmy
hierarchie stránek, co je myšleno pojmem zbytečná slova. Je zde popsána důležitost
navigace na stránkách a vyjmenovány samotné prvky navigace. Dále je zde popsána
grafika a design webových stránek. Vysvětleny důležité podmínky pro splnění správné
použitelnosti a přístupnosti webových stránek pro všechny skupiny uživatelů.
V kapitole 5 představuji dětskou organizaci Pionýr Jevišovice, které jsem členem od jejího
založení v roce 1990. Popisuji současný stav organizace, její způsob propagace
na veřejnosti, činnost a aktivity. Současný způsob propagace byl vyhodnocen jako
nedostačující. Vzhledem k dostupnosti velké části členů organizace k službám internetu,
byla zaznamenána iniciativa především ze strany členů oddílu na vytvoření vlastních
webových stránek, které naši komunikaci rozšíří o další moderní obzor.
V kapitole 6 je provedena analýza webových stránek organizací, které se stejně jako naše
organizace věnují práci s dětmi. Stránky, které byly pro účely analýzy této práce vybrány,
jsou zástupci dětských organizací Junák, Skaut a Pionýr. Z každé této organizace byl
vybrán jeden zástupce. Na těchto webových stránkách byly postupně provedeny analýzy
klíčových slov, zdrojového kódu, síly webu a pozice ve vyhledávačích. Webové stránky
byly také na závěr analýz podrobeny subjektivní analýze. Všechny tyto analýzy byly
porovnány a vyhodnoceny v závěru této kapitoly. Zjištěné výsledky analýz jsou motivací
pro samotný návrh vlastních webových stránek.
11
Kapitola 7 obsahuje vlastní návrh internetové prezentace dětské organizace Pionýr
Jevišovice. Tento návrh byl motivován některými pozitivními výsledky analýz v kapitole
6. Prostřednictvím těchto analýz jsem získal představu o tom, co chci do stránek
organizace zapracovat. Vzhledem k tomu, že nemám s tvořením webu zatím žádné
praktické zkušenosti, musím tento návrh v nejbližší době představit odborníkovi. Který
díky samotnému návrhu získá reálnou představu o tom, jak si naše organizace vlastní
webové stránky představuje. Tento odborník bude mít následně za úkol webové stránky
po profesionální stránce dotvořit a uvést do provozu na hostingu www.pionyr.cz.
Kapitola 8 je závěr, kde shrnuji nejdůležitější body své práce. Dále zde uvádím, jaký užitek
a jaké výhody organizaci mohou vytvořené webové stránky v budoucnu přinést.
12
3 Teoretická část
3.1 Vymezení pojmu nezisková organizace
Neziskové organizace představují velmi široký pojem, kterému řada lidí nerozumí. Z toho
důvodu chci hned v úvodu vysvětlit, co tento pojem ve skutečnosti znamená.
Nezisková organizace je charakterizována jako nevládní organizace nebo občanské
sdružení, které je obecně prospěšné společnosti. Je dobrovolným sdružováním občanů,
kteří mají společné cíle a jsou ochotni spolupracovat na uspokojování potřeb a zájmů buď
samotných členů, nebo druhých lidí. Občanskou společností jsou nazývány proto, že plní
a prosazují obecný zájem společnosti.
Nezisková organizace je sdružením členů nevládního sektoru, kteří rozhodují sami za sebe,
zatímco ve veřejném sektoru se na rozhodování podílí více odborných pracovníků.
Neziskové organizace pracují nezávisle na státu a jejich činnost prospívá veřejnému blahu
společnosti. Nestátní sektor, pod který neziskové organizace spadají, se zaměřuje
na pomoc, která doposud nebyla zapotřebí. Snaží se nahradit nefungující činnost státu. 1
3.2 Definice neziskové organizace
Sdružení osob a majetku, jehož cílem není vytvářet ekonomický zisk. Neziskové
organizace zisk sice vytvořit mohou, ale nerozdělují ho mezi vlastníky. Nejvýstižněji zní
anglický přívlastek pro neziskové organizace: „not-for-profit“, což v přesném překladu
znamená „ne pro zisk“. Přesně vyjadřuje skutečnost, že neziskové organizace fungují
nikoli pro zisk a ne že se vyhýbají zisku, jak se může z českého ekvivalentu zdát. 2
1 TUČKOVÁ Z., Ekonomika služeb, s. 93
2 TUČKOVÁ Z., Ekonomika služeb, s. 93
13
Typy nestátních neziskových organizací:
Ze zákona v České republice rozeznáváme čtyři právní formy neziskové organizace:
- občanská sdružení (včetně politických stran)
- obecně prospěšné společnosti
- nadace
- nadační fondy 3
Neziskové organizace můžeme dále klasifikovat podle:
Zdrojů financování – jestli zdroje, kterými je organizace financována pocházejí
z vládních dotací a grantů, dobrovolných příspěvků nebo jiných zdrojů;
Typu služby (výrobku) - zda se nezisková organizace zaměřuje na lidi a jejich
chování, nebo zda vyrábí hmotné výrobky;
Organizační formy – rozlišujeme následující typy organizační formy neziskových
organizací:
dárcovská - hlavní příjmy organizace pocházejí především z darů,
komerční – za služby, které organizace svým uživatelům poskytuje, od nich
vyžaduje platby,
vzájemná – organizaci řídí její uživatelé,
podnikatelská – řízení neziskové organizace podléhá profesionálním
manažerům. 4
3.3 Občanská sdružení
Sdružení se ustanovují podle zákona č. 83/1990 Sb., o sdružování občanů.
Občanské sdružení je sdružením fyzických i právnických osob, které mají společný zájem,
pro jehož uskutečnění je vhodné a praktické spojit svou činnost a případně i finanční
prostředky. Návrh na registraci spolu se stanovami sdružení, ve kterém je vymezen
pozitivní účel činnosti, musí podat nejméně tři občané České republiky. 5
3 TUČKOVÁ Z., Ekonomika služeb, s. 95
4 HANNAGAN T. J., Marketing pro neziskový sektor, s. 18
5 TOMEŠ I. a kol., Sociální správa, s. 266
14
3.3.1 Dobrovolnictví
Činnost v neziskových organizacích vykonávají především dobrovolníci. Dobrovolníci
jsou lidé, kteří tuto činnost vykonávají bez nároku na plat, nebo jinou finanční odměnu.
Vykonávají ji z přesvědčení, že pomáhat, konkrétně v našem případě, dětem a mládeži
se v budoucnosti vyplatí. Tak jak vychovává rodič své děti k tomu, aby z nich vyrostl
slušný člověk, tak i naši dobrovolní pracovníci v dětech rozvíjejí především kladné
vlastnosti osobnosti.
Pro tento druh neziskových organizací má velký význam prvek dobrovolnictví. Toto
dobrovolnictví je typickým ukazatelem toho, že jsou lidé ještě společenský druh.
Jednou z typických charakteristik organizace, kterou řadíme do neziskového sektoru,
je kriterium dobrovolnosti. 6
O kriteriu dobrovolnosti se dá pochopitelně hovořit jen tehdy, když nezisková organizace
pracuje s dobrovolníky i ve vedoucích funkcích. 7
Dobrovolník je člověk, který nabízí organizaci své znalosti, schopnosti, dovednosti
a zkušenosti za dohodnutých podmínek a není za tuto činnost finančně odměňován formou
platu. Organizace mu může poskytnout nové zázemí, nové přátele, může zde uplatnit své
dovednosti. 8
3.3.2 Motivace
Motivace pracovníků neziskových organizací můžeme mít různé důvody. Určitě to není
motivace finančního rázu. Nejpodstatnějším motivačním faktorem je ve většině případů
práce s dětmi.
Nejpevnějším tmelem, který spojuje občany účastnící se právě nějakého občanského
sdružení či iniciativy, je vzájemná důvěra. Vnitřní konflikt může být pro tyto organizace
zničující. 9
6 WILDMANNOVÁ, M., ŠELEŠOVSKÝ, J. a kol., Územní samospráva v ČR, Rakousku a SRN, s. 48
7 BADELT, Ch., Handbuch der Nonprofit Organisation, s. 8
8 BOUKAL, V., VÁVROVÁ, H. , NOVOTNÝ, J. Ekonomika a řízení neziskových organizací, s. 53
9 FRIČ, P., GOULLI, R Neziskový sektor v ČR, s. 59
15
Práce v neziskových organizacích nabízí široký prostor pro uspokojování osobních
potřeb:
- náležet k nějaké skupině, v níž se cítím dobře a která je společností (nebo její
částí) vnímána jako užitečná
- navazovat sociální kontakt
- smysluplně využívat svůj volný čas
- být uznávaný a respektovaný
- nalézt vlastní seberealizaci 10
3.3.3 Pionýr
Pionýr je občanské sdružení vzniklé podle zákona č. 83/1990 Sb. Rozhodnutí o obnově
padlo na mimořádné konferenci pionýrských pracovníků v lednu roku 1990. Organizace
vyšla z tradic pionýrského hnutí a navázala na činnost oddílů a skupin.
S názvem Pionýr je stále spojena řada předsudků, mylných představ i podcenění. To,
co však zůstalo stát, má základ v kvalitní a zajímavé činnosti oddílů a skupin. Fragmenty
organizace pak daly vzniknout celé řadě sdružení. Projevem svrchované demokracie bylo
svébytné rozhodování oddílů a skupin Pionýrské organizace Socialistického svazu mládeže
v roce 1990 o jejich samostatné budoucí existenci, či v soužití v rámci Pionýra, či Junáka,
Duhy nebo dalších sdružení.
Pionýr usiluje o spojení přirozených dětských zájmů - mít dobré kamarády, zažít hodně
legrace a dobrodružství, poznat neznámé věci, hrát si a soutěžit - s potřebami společnosti
a s rozvíjením dětského talentu a schopností. Činnost pionýrských oddílů a skupin proto
nutně spojuje přání a zájmy dětí s potřebami a požadavky společnosti na pozitivní
využívání volného času dětí a mládeže a rozvoj osobnosti občana demokratické
společnosti, v níž každý má svá práva, ale i určité povinnosti.
10
BOUKAL, V., VÁVROVÁ, H., NOVOTNÝ, J., Ekonomika a řízení neziskových organizací, s. 31.
16
Poznávat dosud nepoznané, společně prožívat dobrodružství i v tzv. všedním životě,
přitom nečekat až vše jen spadne do klína. Spolupracovat, nebát se těžkostí a problémů,
snažit se je překonávat čestně, hrdě se hlásit ke svým úkolům i průšvihům, nemít své slovo
za cár papíru – to je Program Pionýra.
Statut Pionýra vymezuje podstatu – co Pionýr dělá, pro koho je určený. V řadě ustanovení
řeší základní organizační i ekonomická pravidla života celostátní organizace. Program
Pionýra je dokument, který popisuje náplň činnosti. Jsou v něm zachycena východiska,
zásady i kořeny pionýrského hnutí. Oba dokumenty jsou v mnoha směrech provázány. 11
11
PIONÝR.cz Základní informace o Pionýru [online].
17
4 Tvorba WWW. stránek
Každý subjekt, který uvažuje o tvorbě svých webových stránek, si musí především
uvědomit, co konkrétně od tohoto kroku očekává. Po provedení podrobné analýzy by měl
tato očekávání promítnout do vlastní webové prezentace. Vytvoření samotných
internetových stránek může organizace svěřit odborníkům, jako např. různým reklamním
agenturám, nebo webovým designérům apod. Odborníkům musíme přesně popsat
a stanovit, případně i vysvětlit vlastní požadavky a představy, musíme s nimi po celou
dobu vytváření stránek úzce spolupracovat.
4.1 Hierarchie
Má-li být stránka snadno a rychle pochopitelná, je především důležitý její vzhled,
aby všechny vizuální podněty jasně a přesně vypovídaly o vztahu mezi objekty na stránce:
co spolu souvisí a co je součástí něčeho jiného.
Stránky s jasnou vizuální hierarchií mají tyto tři následující vlastnosti:
Čím je (něco) informace důležitější, tím je to nápadnější. Nejdůležitější nápisy jsou
buď větší, tučnější, nebo mají jinou barvu, případně kombinace těchto parametrů.
Objekty, které spolu logicky souvisí, jsou propojeny také vizuálně.
Objekty jsou vizuálně „zanořeny“, aby bylo zřejmé, co je částí čeho. 12
Správně navržená a provedená vizuální hierarchie nám obsah otevřené stránky dobře
nadefinuje, zorganizuje a určí priority. Díky těmto informacím stránku lépe a rychleji
pochopíme. Pokud ji však stránka nemá a vše je stejné a vypadá stejně důležitě, jsme
nuceni k mnohem většímu přemýšlení, abychom se na stránce správně zorientovali.
Rozdělení stránky na jasně definované oblasti je důležité, protože návštěvník stránku
především prohlíží a sám se v ní orientuje. Díky správnému rozložení stránky se následně
rozhodne, kterou oblast si otevře a prohlédne a kterou případně vůbec nenavštíví.
12
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 34
18
4.2 Zbytečná slova
Vynechejte zbytečná slova. Ve stručnosti je síla. Věta by neměla obsahovat zbytečná slova
a odstavce nadbytečné věty ze stejného důvodu, jako by kresba neměla obsahovat žádné
zbytečné čáry a stroj zbytečné součástky. 13
Pokud uživateli předložíme dlouhý článek na čtení, může se nám stát, že jej odradíme,
zde je celkem reálné článek znovu podrobit kontrole a odstranit polovinu slov. Musíme dát
pozor a odstranit slova, která stejně nikdo nebude číst. Z toho důvodu tím nijak neutrpí
hodnota článku, jeho obsah se stane přehlednější, protože nepodstatné věci zmizí.
I samotné stránky budou kratší a uživatelé uvidí více informací, aniž by je museli
posunout.
Abychom uživatele neodradili pročítáním dlouhého textu hned na začátku, musíme
se vyvarovat používání sebechvalných propagačních textů a textů, které nepřináší žádné
užitečné informace, stejně tak informací, jak jsou naše stránky či organizace dokonalá.
Nechme návštěvníka, ať si udělá obrázek sám a nic mu nepodsouvejme, nevnucujme.
Tyto informace mohou naopak na čitatele působit opačným dojmem – kontraproduktivně.
4.3 Orientace na stránkách
Uživatelé našich stránek nebudou používat web, pokud se v něm snadno a rychle
nezorientují. Účelem našich stránek je prezentace dětské organizace Pionýr, účelem této
prezentace je poskytnout návštěvníkům co nejrychlejší přístup k podstatným informacím
o organizaci. Stejně jako účelem stránek virtuálního obchodu je prodat zboží, naším
účelem je dobře „prodat“ naše zkušenosti. Chceme prezentovat naši činnost široké
veřejnosti, aby se organizace dostala do povědomí místních obyvatel svou činností a svým
kladným přístupem.
Na stránkách bude umístěno vyhledávací pole. Pokud bude uživatel hledat něco
konkrétního, postačí mu napsat vyhledávané slovo, případně název sekce do vyhledávače.
13
STRUNK, W., WHITE, E.B. The Element sof Style, s. 47
19
Tato praktická věc pomůže především těm návštěvníkům, kteří nejsou zvyklí prohlížet
jednotlivé odkazy a na hledanou věc se raději zeptají. Tyto vyhledávací pole mají své
opodstatnění především na obsáhlejších stránkách, kde je široká struktura
a hluboká hierarchie. Své místo nepochybně najdou i na přehledných stránkách.
Je to služba pro klienty, která urychlí jejich hledání.
Pokud se uživatel rozhodne pro procházení stránek, bude na hlavní (domovské) stránce
hledat seznam hlavních sekcí, postupovat prostřednictvím ukazatelů a klepat na odkazy,
které mu budou připadat nejvhodnější.
Domovská stránka je v hierarchickém uspořádání na vrcholu žebříčku a všechny ostatní
stránky webu by měly obsahovat přímý odkaz vedoucí zpět na tuto stránku. URL (Uniform
Resource Locator formální termín pro adresy na Internetu) adresa domovské stránky
je obvykle ta webová adresa, která odkazuje uživatele na daný web. Domovská stránka
je nejnavštěvovanější stránka daného webu, a proto je ideální pro umísťování
nejdůležitějších zpráv a informací. 14
4.4 Důležitost navigace
O úspěchu či neúspěchu navržených webových stránek rozhoduje jejich jednoduchost,
přehlednost a účelnost navigace. Navigačního systémy by měly být vytvořeny zodpovědně.
Účely navigace nám mají pomoci najít to, co hledáme a říci, kde jsme.
Poskytuje nám opěrné body – Nikdo se necítí dobře, když je ztracen. Dobrá navigace
zajišťuje půdu pod nohama (i když jenom virtuální).
Funkce navigace
Říká nám, co všechno tady je. Odkrytím hierarchie nám říká, co server (myšlen webový
portál organizace) obsahuje. Pokud rozumíme navigaci a pochopíme hierarchii, odkryje
se nám obsah webu.
Říká nám, jak máme stránky používat. Pokud navigace splňuje svůj úkol, pak implicitně
říká, kde máme začít a jaké máme možnosti. Správně navržená navigace by v sobě měla
obsahovat všechny instrukce, které potřebujeme. 15
14
LYNCH, P., HORTONOVÁ, S. Základní průvodce webdesignem s. 55-56 15
KRUG, S., Webdesign : Nenuťte uživatele přemýšlet! s. 52-53
20
4.4.1 Perzistentní (globální) navigace
Webový návrháři používají termín perzistentní navigace, jímž popisují řadu navigačních
prvků, které se objevují na každé stránce serveru. Přítomnost navigace na stejném místě
na každé stránce a její konzistentní vzhled nám dává neustále jistotu, že jsme na stejném
serveru. Perzistentní navigace na každé stránce by měla obsahovat prvky, které
potřebujeme mít po ruce (logo serveru, odkaz na domovskou stránku, vyhledávání,
pomůcky a sekce). 16
4.4.2 Prvky navigace
1) Sekce – jedná se o primární navigace a jsou to odkazy na základní sekce serveru:
nejvyšší úroveň serverové hierarchie. Většinou obsahuje perzistentní navigace místo
pro zobrazení sekundární navigace: seznam podsekcí v aktuální sekci.
2) Pomůcky – odkazy na důležité prvky serveru, které nejsou přímou součástí
hierarchie (například Nápověda, Mapa serveru, Kontakt). Měly by být vyvedeny
méně výrazným stylem než sekce. Pomůcky budou různé pro různé druhy serverů.
3) Domovská stránka – tlačítko nebo odkaz Home nám dává jistotu, že bez ohledu
na to, jak moc jsme se ztratili a kam jsme se při tom posunuli, nebo pokud se prostě
potřebujeme vrátit na výchozí stránku, nás na tuto stránku přenese okamžitě. Tuto
funkci může dobře suplovat i samotné logo serveru (mimo domovskou stránku),
je však dobré naznačit návštěvníkům přidáním slova Home přímo do loga, že na něj
lze klepnout. Domovská stránka není jako ostatní stránky – má jiné poslání. Na této
stránce, kterou návštěvník prohlíží jako první, by měly být všechny nejdůležitější
informace, všechny ostatní informace jsou dále z této strany snadno dostupné.
4) Vyhledávání – velká část návštěvníků webových stránek dává přednost vyhledávání
před prohlížením a brouzdáním, proto by mělo být na každé stránce vyhledávací
pole, nebo alespoň odkaz na vyhledávací stránku. Nejlepší variantou je: textové
pole, tlačítko a slovo Vyhledat.
5) Zde se nacházíte – navigace může utlumit pocit ztracenosti v prostoru stejným
způsobem, jako značka „zde se nacházíte“ na mapě v nákupním středisku nebo
v národním parku. Na webu toho dosáhneme tím, že zvýrazníme aktuální pozici
v navigačních panelech, seznamech nebo nabídkách, které se na stránce objevují.
Aktuální pozici můžeme vyzdvihnout mnoha způsoby a umístit před ní ukazatel,
16
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 54-55
21
změnit barvu textu, použít tučný text, inverzní tlačítko, změnit barvu tlačítka atd.
Já osobně bych citlivě zkombinoval několik způsobů najednou. Šikovnou
pomůckou v rámci stránek je cesta znázorňující směr od domovské stránky
do aktuálního místa. Doporučoval bych ji umístit na začátek stránky nad všemi
ostatními položkami. Nejvhodnějším oddělovačem jednotlivých úrovní je znak
„větší než“ (>), který vizuálně naznačuje pohyb směrem od vyšších úrovní k nižším.
Díky ní mohou uživatelé získat jasnou představu, kde se právě nyní nachází,
nezávisle se vracet do vyšších úrovní a to i bez kompletní znalosti celé hierarchie
serveru. Tuto navigaci bych spíše volil v případě, kdy není jedinou navigací.
Provedení menším písmem, aby bylo patrné, že se jedná pouze o doplněk.
6) Záložky - Záložky mohou stránky vylepšit a zároveň posloužit dobré věci bez
nutnosti zvětšení fyzické velikosti stránky. Ouška záložky vytváří iluzi, že se aktivní
stránka přesune dopředu. Je to sice laciný trik, nicméně efektní a hlavně efektivní.
Výsledek budí silnější dojem, že je server rozdělen na více sekcí a že jsme právě
v jedné z nich. Aby záložka fungovala k plné spokojenosti, musí jejich grafická
podoba vytvářet dojem, že aktivní záložka je před ostatními. Abychom dosáhli
tohoto dojmu, musí být aktivní záložka vyvedena v jiné barvě nebo kontrastním
odstínu a musí být fyzicky propojena s listem pod sebou. 17
4.4.3 Optimálně navržené stránky
Jsou-li stránky dobře navrženy, měli byste být schopni (pokud se dostaneme náhodně
na stránku nějakého webového serveru – kam jsme často vrženi, aniž bychom měli ponětí
o tom, kde jsme, jelikož jsme předtím klepli na odkaz v nějakém vyhledávači nebo jiném
serveru) bez váhání odpovědět na následující otázky:
O jaký server se jedná? (Logo serveru)
Na jaké jste stránce? (Název stránky)
Jaké jsou hlavní sekce tohoto serveru? (Sekce)
Jaké na této úrovni máte možnosti? (Lokální navigace)
Kde se nacházíte v hierarchii serveru? (Ukazatele „Zde se nacházíte“)
Jakým způsobem můžeme vyhledávat? 18
17
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 57-69 18
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 73
22
4.5 Grafika a design
Hlavním důvodem, proč vytváříme www stránky, je obsah stránek. Textová a obrazová
informace. Uživatelé na naše stránky přijdou nikoliv proto, že by chtěli obdivovat
úžasnou grafiku, ale protože hledají informace. 19
Je ale pravda, že uživatele na našich webových stránkách většinou nejprve upoutá grafika
a design stránek. Design naopak může kladně působit na čtenáře a může zvýšit jeho
důvěru k danému webu.
Grafika na stránce slouží jako prostředí, do něhož je informace zasazena. Vhodné, jemné
a nenápadné grafické zpracování je tím, čeho chceme dosáhnout. 20
Nevhodně zvolená grafika, nebo grafika animovaná může návštěvníka rozptylovat
od skutečného důvodu, proč na naše stránky přišel. Je velmi důležité na stránkách dobře
vyvážit poměr textu a obrázků ve prospěch uživatelů s pomalejším připojením. Nejprve
a také nejrychleji se načte text – tedy základ stránky. Čím více obrázků a grafiky, tím
je stahování pomalejší. V případě dodržení přiměřené velikosti stránek bude rychlost
načítání uspokojivá.
4.5.1 Barvy
Barvy do značné míry určují první dojem, celkové vyznění stránek a jsou mocným
nástrojem webového designu, ale jejich úloha není jen estetická. Vhodná volba barev totiž
přímo ovlivňuje i použitelnost stránek. Barevně bych především upozornil na důležité
informace. Text v jasné barvě dobře kontrastující s pozadím si každý přečte jako první.
4.5.2 Text
Hlavním předpokladem je, aby text na stránce byl snadno čitelný. Nejlepší barevná
kombinace je černé písmo na bílém pozadí, jako text psaný na psacím stoji na bílý papír.
Jsou možné různé barevné kombinace, ale je důležité, aby potom písmo v kontrastu
19
DOMES, M. Tvorba www stránek pro úplné začátečníky, s. 175 20
DOMES, M. Tvorba www stránek pro úplné začátečníky, s. 175
23
s pozadím bylo snadno čitelné. Kombinace s malým kontrastem barev jsou nevhodné.
Na jedné stránce navrhuji nepoužívat příliš druhů písma.
4.5.3 Obrázky
Obrázky webové stránky velmi oživují a zpestřují. Na stránky můžeme umístit i různé
interaktivní prvky. Ty se snaží zaujmout čtenáře webu. Možné je vytvořit i různé
animované obrázky, kdy jeden soubor obsahuje několik obrázků, které se v zadaných
intervalech střídavě zobrazují. Výsledný efekt pak budí dojem animace. Stránky mohou
pak vypadat působivě a vždy je zajímavě oživí.
4.6 Co je použitelnost stránek
Dobrá použitelnost stránek znamená, že:
uživatelům (čtenářům) se podaří na webu udělat to, co chtějí. Např.
o najít informaci, pro kterou přišli
o najít kontaktní e-mail
o přečíst si novinky
o zaregistrovat se
o objednat si zboží
zvládnou to v rozumném čase a bez velkého přemýšlení
zvládnou to bez chyb a zásadních zklamání
Na první pohled to není nic podstatného. Ale dobré weby se prosadily díky své
použitelnosti, vezměte si třeba Google. Z nepoužitelných stránek naopak lidé raději
odcházejí. 21
21
JANOVSKÝ, D. Jak psát web [online].
24
4.7 Přístupnost webu
Přístupná webová stránka je použitelná pro každého uživatele internetu, a to nezávisle
na jeho postižení, schopnostech, znalostech, zkušenostech nebo zobrazovacích
možnostech. Vnímat obsah webové stránky a ovládat její funkce je zkrátka právem
každého uživatele a nesmí mu být žádný obsah nebo funkce upřena jenom proto, že trpí
některým typem zdravotního postižení, má omezené schopnosti, nedisponuje skvělými
znalostmi a zkušenostmi s používáním webu nebo nevlastní optimální zobrazovací
zařízení. 22
Kromě lidí může internetové stránky navštívit i samostatný internetový robot. Ve většině
případů chceme, aby naše stránky byly ve vyhledávačích vidět, a my díky tomu měli
možnost získat návštěvníky. Proto bychom si příchodu vyhledávacího robota měli cenit
a nabídnout mu obsah stránek tak, aby byl schopný jej zpracovat, tzn. udělat pro něj web
přístupný. Robot vyhledávače není schopný zpracovat obrázky, zvuky a také některé
technologie (javascript, flash, ajax atd.). Pokud v sobě prvky obsahují informační hodnotu
a jestliže její pomocí chceme nalákat i návštěvníky přicházející z vyhledávačů, měli
bychom ji na webu nabídnout i v textové formě, kterou bude schopen vnímat i robot. 23
4.7.1 Kaskádové styly
Obsah stránek bude přístupnější, pokud budete požívat kaskádové styly (CSS – Cascading
Style Sheets). Pokud budou stránky formátovány pomocí kaskádových stylů, mohou
uživatelé používat vlastní formátování. Stránka, která používá červený text na zeleném
pozadí, představuje problém pro uživatele, kteří nejsou schopni tyto barvy rozeznat.
Při nastavení barev pomocí kaskádových stylů, může uživatel použít vlastní nastavení pro
nahrazení původních barev. Uživatelé mohou tedy formátovat obsah stránek způsobem,
který jim vyhovuje. 24
22
ŠPINAR, D. Tvoříme přístupné webové stránky s. 12 23
PODLAHOVÁ, I. Dobrý web, Přístupný web. [online]. 24
LYNCH, P., HORTONOVÁ, S. Základní průvodce webdesignem s. 27
25
4.7.2 Obsah webových stránek je dostupný a čitelný
Každý netextový prvek nesoucí významové sdělení má svou textovou alternativu.
Informace sdělované prostřednictvím skriptů, objektů, kaskádových stylů, obrázků
a jiných doplňků na straně uživatele jsou dostupné i bez kteréhokoli
z těchto doplňků.
Informace sdělované barvou jsou dostupné i bez barevného rozlišení.
Barvy popředí a pozadí jsou dostatečně kontrastní. Na pozadí není vzorek, který
snižuje čitelnost.
Předpisy určující velikost písma nepoužívají absolutní jednotky.
Předpisy určující typ písma obsahují obecnou rodinu písem.
4.7.3 Ovládání webu je jasné a pochopitelné
Každá webová stránka má smysluplný název, vystihující její obsah.
Navigační a obsahové informace jsou na webové stránce zřetelně odděleny.
Navigace je srozumitelná a je konzistentní na všech webových stránkách.
Každá webová stránka (kromě úvodní webové stránky) obsahuje odkaz na vyšší
úroveň v hierarchii webu a odkaz na úvodní WWW stránku.
Všechny webové stránky rozsáhlejšího webu obsahují odkaz na přehlednou mapu
webu.
Obsah ani kód webové stránky nepředpokládá, že uživatel již navštívil jinou
stránku.
Každý formulářový prvek má přiřazen výstižný nadpis.
Každý rám má vhodné jméno či popis vyjadřující jeho smysl a funkčnost.
26
Přístupný web je takový, který neklade uživateli žádné překážky v jeho používání a to bez
ohledu na uživatelovo technické vybavení, jeho schopnosti, znalosti či aktuální zdravotní
stav. Přístupnost webu si tedy klade za cíl poskytnout každému návštěvníkovi stránek
stejné (tj. všechny) informace, umožnit web používat všem. 25
4.7.4 Rozvoj webu
Stejně jako stavba nového webu má své opakující se kroky, i u rozvoje webových stránek
lze vymezit obvyklé činnosti. Mezi nejčastější úkony patří:
Technická a funkční inovace webu – a to jak jeho veřejné části, tak administrace.
Aktualizace obsahu, struktury informací a navigace.
Úpravy stávajících a programování nových funkcí na míru vašemu webu.
Spolupráce v technologickém zajištění webu (webhosting, serverové statistiky
apod.).
Grafické práce, propagace a marketingová podpora webu.
4.7.5 Webová prezentace
Webová prezentace firmy, nebo organizace je základním kamenem její působnosti
v oblasti Internetu. Jedná se prakticky o řadu vzájemně provázaných webových stránek,
na kterých mohou být publikovány základní informace o firmě, jejím poslání, oboru
činnosti, nabídce služeb a jejich specifikace a srovnání, seznam provozoven, kontakty
na odpovědné osoby a podobně. Obecně se jedná o jednoduchý způsob, jakým zákazníkům
sdělit to, co potřebují vědět. 26
25
WEB TVORBA. Přístupnost webu. [online]. 26
FORET, M. Marketingová komunikace, s. 331
27
5 Dětská organizace Pionýr Jevišovice
Jsme nestátní nezisková organizace zaměřená na mimoškolní, volnočasové aktivity dětí
a mládeže. Byli jsme založeni v roce 1990, plným názvem Pionýrská skupina Pionýr
Jevišovice.
Naše činnost se dělí na:
pravidelné schůzky v klubovně,
akce na jeden den nebo odpoledne,
vícedenní převážně víkendové akce.
Nabízíme dětem různorodé možnosti trávení volného času: rukodělná činnost, hry, kultura,
sport, soutěže, turnaje, turistika, setkání, výlety, tábory (v rámci družby s jinými
pionýrskými skupinami).
5.1 Jak pracujeme?
V období školního vyučování – v měsících září až červen se děti jednou za týden (v pátek)
schází v klubovně, kterou máme v nájmu od Městského úřadu Jevišovice. V klubovně
se schází pravidelně 15 - 20 dětí oddílu. Naše akce jsou otevřené pro všechny děti (tedy
i nečleny). Stačí pouze přijít a zúčastnit se. Za zcela zásadní považujeme to, že děti v době
účasti na našich schůzkách a akcích nepobíhají po ulicích, nenudí se, ani se nepodílí
na sociálně patologických jevech (drobná kriminalita, kouření a drogy). Prostě mají
možnost příjemně a užitečně strávit svůj volný čas v kolektivu kamarádů.
Dlouhodobě podporujeme talentované děti. Děti vyslané naší organizací už několikrát
prokázaly své schopnosti a dovednosti v celostátních kolech Sedmikvítku – obor divadlo,
obor hudba, obor rukodělná, výtvarná činnost a keramika, clona.
V roce 2003 jsme zvítězili v celostátním kole Sedmikvítku v Opavě v oborech výtvarná
a rukodělná činnost a získali putovní Pohár předsedy vlády Vladimíra Špidly. V roce 2005
jsme získali putovní Pohár předsedy vlády Jiřího Paroubka v oboru divadlo. V letošním
roce jsme držiteli putovního Poháru předsedy vlády Jana Fišera v oborech výtvarná
činnost, rukodělná činnost a keramika.
28
V naší organizaci působí zkušení vedoucí s mnohaletou praxí práce s dětmi. Řada rodičů
našich dětských členů se často zapojuje do činnosti při samotných schůzkách, ale i akcích
pořádaných naší organizací. Vedení naší organizace prochází školením vedeným ústředím
Pionýra (psychologie skupin, zdravověda a první pomoc, bezpečnost při akcích s dětmi,
hospodář, vedoucí PS apod.). Veškeré úsilí a náš volný čas věnujeme dětem zcela zdarma.
5.2 Současný stav organizace
V letech 1993-2005 jsme v naší organizaci hráli dětské ochotnické divadlo. Jako
propagaci naší činnosti jsme o konání divadelního představení veřejnost informovali
především vytvořenými plakáty a osobními pozvánkami, které jsme si sami vyrobili
a členové oddílu je před představením roznesli a umístili na strategická místa v obci
a do schránek občanů obce Jevišovice. Prostřednictvím místního rozhlasu jsme občany
pozvali na toto představení. Podobně jako u divadelního představení probíhala a stále
probíhá propagace dalších našich akcí a činností - sběr železa, čištění studánek, jarní úklid
(to už ale bez osobních pozvánek do schránek).
V posledních dvou letech se naše komunikace rozšířila o nový fenomén a to emailovou
poštu, protože každý třetí člen uvedl do svých kontaktů vlastní email, nebo email rodiče,
začala organizace využívat i této služby k informování členů a jejich rodičů o plánu akcí
a schůzek. Tato činnost byla v minulosti řešena tak, že se napsaly propozice ke schůzkám,
nebo plánovaným akcím a výletům. Tyto propozice se členům poté předaly na schůzce
a podávaly informace o náplni činnosti s měsíčním předstihem.
Z výše uvedeného je patrné že v dnešní době nejméně jedna třetina až plná polovina členů
má přístup na internet. Další přístup na internet mají děti ve škole, nebo rodiče ve svém
zaměstnání. Dá se říct, že kdo chce informace znát, má možnost si je zjistit a najít. Z toho
důvodu vyvstal v naší organizaci požadavek, který byl iniciován převážně ze strany dětí,
členů oddílu na vytvoření vlastních webových stránek, které naši komunikaci rozšíří
o další moderní obzor.
29
6 Testování webových stránek
Tvorba webových stránek je činnost poměrně náročná a celý proces od prvotního nápadu
až po finální verzi stojí mnoho času a úsilí. Testování je velice důležitou součástí vývoje,
může nás totiž ještě v době tvoření webu upozornit na chyby, které můžeme odstranit před
samotným spuštěním webu do provozu.
6.1 Objektivní faktory testování
Výsledek testování objektivních faktorů se dá přesně vyhodnotit. Můžete tak určit, zda
vaše stránky splňují nebo nesplňují požadovanou vlastnost. Mezi objektivní faktory patří
validita zdrojového kódu a kaskádových stylů podle zvoleného standardu, funkčnost všech
odkazů nebo splňování kritérií přístupnosti. Díky jednoznačnosti výsledků testování těchto
faktorů by měla být jejich správnost u kvalitních webových stránek samozřejmostí.
6.2 Analýza konkurence
Analyzovat webové stránky jiných dětských organizací jsem se rozhodl uskutečnit podle:
6.2.1 Analýza klíčových slov stránky
Vyhodnotí četnosti slov a frází.
6.2.2 Analýza zdrojového kódu stránky
Odhalí většinu závažných chyb, protože prověřuje: informace v hlavičce, chyby v HTML
(Hyper Text Markup Language, je značkovací jazyk pro hypertext) kódu, sémantiku
obsahu a přístupnost.
6.2.3 Analýza síly webové stránky
Analýza poskytne komplexní přehled o stavu, síle a potenciálu vašeho webu v globálním
měřítku. Analýza prověřuje: komplexně HTML kód, zpětné odkazy a jejich potenciál,
pozice ve vyhledávačích, návštěvnost a potenciál domény.
30
6.2.4 Analýza pozice webové stránky ve vyhledávačích
Zjištění pozice analyzovaného webu ve vyhledávačích na zadané slovo.
Pro analýzu byly vybrány následující 3 weby:
http://koprivnice.pionyr.cz/
http://www.skautjevisovice.estranky.cz/
http://orlice.abahoa.cz/
Tyto webové stránky byly vybrány záměrně, protože jde o neziskové organizace, které
stejně jako naše organizace pracují s dětmi. Webové stránky Pionýra Kopřivnice byly
vybrány z toho důvodu, že je to náš partner, kterého vzhledem k jeho vzdálenosti
od Jevišovic nepovažujeme za konkurenta. Stránky Skauta Jevišovice byly vybrány
především s přihlédnutím k tomu, že působí ve stejném městě jako naše organizace,
je to tedy náš přímý konkurent. Stránky Junáka Moravské Budějovice byly vybrány
jako další možný konkurent působící v nejbližším městě.
První část analýzy byla zaměřena na klíčová slova. Na každém webu byla pomocí služby
klíčová slova dostupné na webu http://www-seo-servis.cz zjištěna četnost výskytu
klíčových slov. Mimo nejčastěji používaná slova, která analýza vyhodnotí automaticky,
byla také testována tyto slova – děti, hry, akce, rodiče a název organizace – pionýr, skaut,
junák (podle konkrétní analýzy – webových stránek organizace). Další části analýzy byly
zaměřeny na analýzu zdrojového kódu, sílu webu a pozice ve vyhledávačích. Stejně jako
v prvním případě byl nyní pomocí služby analýza zdrojového kódu, síla webu a pozice
ve vyhledávačích dostupné na webu http://www-seo-servis.cz zjištěn výsledek provedené
analýzy.
Na závěr této kapitoly, testování webových stránek, jsem provedl i subjektivní analýzu
webových stránek Pionýr Kopřivnice, Skaut Jevišovice a Junák Moravské Budějovice.
31
6.3 Výsledky analýz
V následujících podkapitolách jsem se rozhodl z důvodu větší přehlednosti a možnému
okamžitému porovnání výsledků, zobrazit výsledky vždy jedné analýzy provedené
postupně na všech webových stránkách. Řazení výsledků analýz jsem zachoval
i v následujících kapitolách. Vždy jsou tedy výsledky analýz uvedené v následujícím
pořadí:
1. http://koprivnice.pionyr.cz/
2. http://www.skautjevisovice.estranky.cz/
3. http://orlice.abahoa.cz/
6.4 Výsledky analýz klíčových slov a textu
6.4.1 Analýza klíčových slov a textu webu koprivnice.pionyr.cz
Orientační počet slov na stránce je 430
Tabulka 1: Nejčetnější slova stránky webu Pionýra Kopřivnice
Slovo Výskytů Zastoupení v %
2010 22 5,09
kopřivnice 6 1,38
fotogalerie 6 1,38
května 2010 5 1,15
února 5 1,15
května 5 1,15
února 2010 4 0,92
zimní tábor 4 0,92
pionýr 3 0,75
2010 so 3 0,75
akce 0 0
rodiče 0 0
hry 0 0
děti 0 0
Zdroj: práce autora (7. 4. 2010)
32
6.4.2 Analýza klíčových slov a textu webu skautjevisovice.estranky.cz
Orientační počet slov na stránce je 130. Stránka obsahuje velice málo slov.
Tabulka 2: Nejčetnější slova stránky webu Skauta Jevišovice
Slovo Výskytů Zastoupení v %
středisko 3 2,27
jevišovická 3 2,27
jevišovice 3 2,27
akce 3 2,27
čr středisko 2 1,51
svaz skautů 2 1,51
středisko jevišovice 2 1,51
skautek čr 2 1,51
proběhlé akce 2 1,51
anebo 2 1,51
skaut 1 0,57
rodiče 0 0
hry 0 0
děti 0 0
Zdroj: práce autora (7. 4. 2010)
6.4.3 Analýza klíčových slov a textu webu orlice.abahoa.cz
Orientační počet slov na stránce je 1080.
Tabulka 3: Nejčetnější slova stránky webu Junáka M. Budějovice
Slovo Výskytů zastoupení v %
akce 18 1,67
2009 18 1,67
2010 13 1,21
orlice 11 1,02
rubrika akce 10 0,93
abahoa 10 0,93
orlice abahoa 9 0,83
http orlice 9 0,83
rodiče 3 0,21
junák 3 0,21
hry 2 0,14
děti 1 0,07
Zdroj: práce autora (7. 4. 2010)
33
6.5 Výsledky analýz zdrojového kódu
6.5.1 Analýza zdrojového kódu webu koprivnice.pionyr.cz
Celkové hodnocení: 69 %
Příliš mnoho klíčových slov - děti, mládež, volný čas, víkendy, tábory, Kopřivnice,
Olbramkostel, Sedmikvítek, Porta, Pionýr
Chybí soubor robots.txt.
Zdrojový kód má optimální velikost. Příliš velká stránka zatěžuje vyhledávač stahováním
přebytečných dat, a ten pak těžko určuje relevantní obsah. Navíc ho návštěvníci dlouho
stahují. Celková velikost HTML kódu: 14 kB. Stránka obsahuje 56 html chyb. Stránka
by měla být validní a bez chyb, jinak se nemusí správně popř. vůbec zobrazit u uživatele.
Stránka obsahuje příliš mnoho inline vložených CSS stylů, které by měly být ve zvláštním
souboru. Velikost v CSS navíc: 1.97 kB
Sémantika a přístupnost. Stránka neobsahuje vnořené tabulky. Netextové elementy mají
alternativní obsah. Na stránce dochází k míchání sémantického zvýrazňování s fyzickým
formátováním. Použité nesémantické značky: b. Stránka nemá strukturovaný text
do odstavců. Řešením může být - zpřehlednit obsah použitím odstavců.
6.5.2 Analýza zdrojového kódu webu skautjevisovice.estranky.cz
Celkové hodnocení: 67 %
Klíčová slova - Skaut, Jevišovice, Junák, skautský oddíl, tábor
Chybí soubor robots.txt.
Zdrojový kód má optimální velikost. Příliš velká stránka zatěžuje vyhledávač stahováním
přebytečných dat, a ten pak těžko určuje relevantní obsah. Navíc ho návštěvníci dlouho
stahují. Celková velikost HTML kódu: 7 kB. Stránka obsahuje 5 html chyb. Stránka
by měla být validní a bez chyb, jinak se nemusí správně popř. vůbec zobrazit u uživatele.
Stránka obsahuje příliš mnoho inline vložených CSS stylů, které by měly být ve zvláštním
souboru. Velikost v CSS navíc: 0.06 kB
34
Sémantika a přístupnost. Stránka neobsahuje vnořené tabulky. Netextové elementy mají
alternativní obsah. Na stránce dochází k míchání sémantického zvýrazňování s fyzickým
formátováním. Použité nesémantické značky: center. Text je kvalitně strukturovaný
do odstavců.
6.5.3 Analýza zdrojového kódu webu orlice.abahoa.cz
Celkové hodnocení: 75 %
Klíčová slova – neuvedena
Chybí soubor robots.txt.
Zdrojový kód má optimální velikost. Příliš velká stránka zatěžuje vyhledávač stahováním
přebytečných dat, a ten pak těžko určuje relevantní obsah. Navíc ho návštěvníci dlouho
stahují. Celková velikost HTML kódu: 28 kB. Stránka je validní podle deklarovaného
XHTML 1.0 Transitional. Stránka obsahuje inline vložené CSS styly, které by měly být
ve zvláštním souboru. Velikost v CSS navíc: 0.37 kB
Sémantika a přístupnost. Stránka neobsahuje vnořené tabulky. Netextové elementy mají
alternativní obsah. Na stránce dochází k míchání sémantického zvýrazňování s fyzickým
formátováním. Použité nesémantické značky: center. Text je kvalitně strukturovaný
do odstavců.
6.6 Výsledky analýz síly webu
6.6.1 Síla webu koprivnice.pionyr.cz
Celková síla webu: 52 %
Webová stránka Pionýr Kopřivnice je XHTML 1.0 Strict validní.
Srank testované stránky: 50/100. Google Pagerank testované stránky: 3/10.
Umístění webové stránky na Seznamu po zadání prvních 4 slov titulku: 1. (10/10)
Umístění webové stránky na Google po zadání prvních 4 slov titulku: 1. (10/10)
Počet zpětných odkazů vedoucích na testovanou doménu: 52. (3/10)
Stáří testované domény: 4.162 dnů. (10/10)
35
6.6.2 Síla webu skautjevisovice.estranky.cz
Celková síla webu: 37 %
Webová stránka Skaut Jevišovice je XHTML 1.0 Transitional validní.
Srank testované stránky: 40/100. Google Pagerank testované stránky: 2/10.
Umístění webové stránky na Seznamu po zadání prvních 4 slov titulku: 25. (1/10)
Umístění webové stránky na Google po zadání prvních 4 slov titulku: 34. (1/10)
Počet zpětných odkazů vedoucích na testovanou doménu: 13. (2/10)
Stáří testované domény: 2.187 dnů. (10/10)
6.6.3 Síla webu orlice.abahoa.cz
Celková síla webu: 48 %
Webová stránka Junák Moravské Budějovice je XHTML 1.0 Transitional validní.
Srank testované stránky: 40/100. Google Pagerank testované stránky: 0/10.
Umístění webové stránky na Seznamu po zadání prvních 4 slov titulku: 2. (8/10)
Umístění webové stránky na Google po zadání prvních 4 slov titulku: 2. (8/10)
Počet zpětných odkazů vedoucích na testovanou doménu: 3.549. (6/10)
Stáří testované domény: 3.381 dnů. (10/10)
Srank je algoritmus pro ohodnocení důležitosti webových stránek, tvořící základ
vyhledávače Seznam. PageRank je algoritmus pro ohodnocení důležitosti webových
stránek, tvořící základ vyhledávače Google.
36
6.7 Výsledky analýz pozice ve vyhledávačích
6.7.1 Analýza pozice ve vyhledávačích webu koprivnice.pionyr.cz
Tabulka 4: Pozice ve vyhledávačích na hledané slovo: pionýr
Vyhledávač Pozice Odkaz vyhledávače
Google Nenalezeno
Bing 13 Dětská organizace - Pionýr Kopřivnice
Jyxo Nenalezeno
Seznam 7 Dětská organizace - Pionýr Kopřivnice
Morfeo 7 Dětská organizace - Pionýr Kopřivnice
Zdroj: práce autora (7. 4. 2010)
6.7.2 Analýza pozice ve vyhledávačích webu skautjevisovice.estranky.cz
Tabulka 5: Pozice ve vyhledávačích na hledané slovo: skaut
Vyhledávač Pozice Odkaz vyhledávače
Google Nenalezeno
Bing Nenalezeno
Jyxo Nenalezeno
Seznam Nenalezeno
Morfeo Nenalezeno
Zdroj: práce autora (7. 4. 2010)
6.7.3 Analýza pozice ve vyhledávačích webu orlice.abahoa.cz
Tabulka 6: Pozice ve vyhledávačích na hledané slovo: junák
Vyhledávač Pozice Odkaz vyhledávače
Google 74 Skautský svět - Junák - svaz skautů a
skautek ČR, středisko ...
Bing Nenalezeno
Jyxo 99 Roverská přespávačka Skautský svět -
Junák...
Seznam Nenalezeno
Morfeo 26 Skautský svět - Junák - svaz skautů a
skautek ČR, středisko Moravské Budějovice
Zdroj: práce autora (7. 4. 2010)
37
6.8 Vyhodnocení provedených analýz
V následujících podkapitolách jsem provedl vyhodnocení výsledků analýz.
6.8.1 Vyhodnocení na základě analýz klíčových slov
Podle výsledků tabulky č. 1. v kapitole 6.4.1 se na analyzované domovské stránce Pionýr
Kopřivnice nevyskytlo žádné sledované slovo hry, děti, rodiče ani akce. Byl zde
zaznamenán výskyt slova pionýr a náznak propagace zimního tábora. Na základě
této analýzy lze předpokládat, že web patří pionýrské organizaci.
Podle tabulky výskytů č. 2. v kapitole 6.4.2 se na domovské stránce Skaut Jevišovice
nevyskytlo žádné sledované slovo hry, děti, rodiče. Byl zde ale zaznamenán výskyt slova
skaut (i v jiných podobách) a akce. Dle výskytu slov blízkých skautu je tedy
pravděpodobné, že stránky patří skautské organizaci, která pravděpodobně propaguje svoje
akce.
Na domovské stránce Junák Moravské Budějovice podle tabulky výskytů č. 3. v kapitole
6.4.3 se slovo akce velmi používá a také se nejlépe umístilo. Junák, hry, děti a rodiče mají
také své zastoupení v četnostech. Podle těchto výsledků se dá nyní celkem logicky
usuzovat, že stránky, které jsou analyzovány, pravděpodobně patří organizaci junáka, který
ve své propagaci na akce, hry, děti ani rodiče nezapomněl. Stejně tak nezapomněl
na propagaci své vlastní organizace.
Na základě analýz klíčových slov, které byly provedeny 7. 4. 2010, je nejlépe hodnocena
webová stránka Junáka Moravské Budějovice.
6.8.2 Vyhodnocení na základě analýz zdrojových kódů
Zde se nejlépe umístila webová stránka Junák Moravské Budějovice s hodnotou 75 %.
Za ní se umístila webová stránka Pionýr Kopřivnice s hodnotou 69 % a také webová
stránka Skaut Jevišovice s hodnotou 67 %. Analýzy zdrojových kódů byly provedeny
7. 4. 2010.
38
6.8.3 Vyhodnocení na základě analýz síly webu
Zde se nejlépe umístila, webová stránka Pionýra Kopřivnice s hodnotou 52 %, tato stránka
je validní podle XHTML 1.0 Strict. Za ní se umístila webová stránka Junáka Moravské
Budějovice s hodnotou 48 %, tato stránka je validní podle XHTML 1.0 Transitional.
I webová stránka Skauta Jevišovice s hodnotou 37 %, tato stránka je validní podle
XHTML 1.0 Transitional. Analýzy síly webů byly provedeny 28. 4. 2010.
Web Pionýra Kopřivnice byl vyhodnocen nejlépe v umístění webové stránky na Seznamu
i na Google po zadání prvních 4 slov titulku. Zde se velmi vysoko umístil i web Junáka
Moravské Budějovice. V počtu zpětných odkazů vedoucích na testovanou doménu byl
nejlépe vyhodnocen web Junáka Moravské Budějovice. Hodnota Srank byla průměrná
na všech testovaných webových stránkách. Hodnota PageRank nebyla u webu Junáka
Moravské Budějovice vyhodnocena. U zbývajících webů má průměrnou hodnotu.
6.8.4 Vyhodnocení validace - porovnání
Validace je proces, při kterém jsou dokumenty ověřovány proti příslušným DTD
(Document Type Definition). Zajišťuje, že struktura, použití elementů a atributů
v dokumentech je ve shodě s definicemi v DTD, na které je odkaz v DOCTYPE. DTD
obsahuje soubor pravidel, ta definují syntaxi, jaké elementy, atributy lze používat,
možnosti jejich vzájemného zanoření, typ obsahu, jaké atributy jsou povoleny
pro konkrétní elementy apod. Zjednodušeně řečeno, DTD jsou pravidla, jak může
dokument vypadat a slouží i jako instrukce pro prohlížeč, jak s dokumentem pracovat.
Proces ověřování, zda dokument skutečně ctí pravidla pro daný jazyk, se nazývá validace
a nástroj k ní užívaný je validátor. Dokument, který úspěšně projde validací, je validní.
Z toho důvodu jsem provedl analýzu prostřednictvím http://validator.w3.cz/.
Dokument http://koprivnice.pionyr.cz/ neprošel validací, 14 chyb a 66 varování. Stránka
není validní XHTML 1.0 Strict. Dokument http://www.skautjevisovice.estranky.cz/
neprošel validací, 13 chyb a 38 varování. Stránka není validní XHTML 1.0 Transitional.
Dokument http://orlice.abahoa.cz/ neprošel validací, 3 chyby a 32 varování. Stránka není
validní XHTML 1.0 Transitional.
39
Nevalidní stránka může mít tu podstatnou vadu, že spoléhá na opravy chyb v prohlížečích.
Různé prohlížeče (Internet Explorer, Firefox, Opera) mohou opravovat různý chybný kód
různě a na výsledek se tudíž nelze tolik spoléhat. To je případ dokumentu
http://orlice.abahoa.cz/, který byl vyhodnocen v analýze prostřednictvím http://www-seo-
servis.cz jako validní, ale prostřednictvím http://validator.w3.cz/ jako nevalidní.
6.8.5 Vyhodnocení na základě analýzy pozice ve vyhledávačích
Na základě analýzy pozice ve vyhledávačích jsem objevil, vážný problém u webu Skaut
Jevišovice. Z tabulky č. 5. v kapitole 6.7.2 je patrné, že tento web není indexován
v hlavních vyhledávačích jako Google, Seznam, Bing, Morfeo a Jyxo na hledané klíčové
slovo skaut. Špatně nebo vůbec indexovaný web na Internetu nikdo nenajde.
Web Pionýr Kopřivnice má podle tabulky č. 4. v kapitole 6.7.1 na hledané klíčové slovo
pionýr velice silnou pozici ve vyhledávači Seznam, Morfeo a Bing. Ve vyhledávačích
Google a Jyxo však žádnou pozici nemá.
Web Junák Moravské Budějovice má podle tabulky č. 6. v kapitole 6.7.3 na hledané
klíčové slovo junák slušnou pozici ve vyhledávači Morfeo. Má dále i pozici
ve vyhledávačích Google a Jyxo. Ve vyhledávačích Seznam a Bing však žádnou pozici
nemá.
Řešením zjištěných nedostatků u všech webů by byla např. registrace webu
do Internetových katalogů: Seznam, Atlas, Centrum. Dále podání žádosti o indexaci
na stránkách Google a Jyxo. Jako další postup bych doporučil vybudovat síť zpětných
odkazů na stránky s podobným zaměřením.
Všechny tři weby byly dále analyzovány i na stejná klíčová slova: děti, akce, hry, volný
čas, mládež, organizovaná mládež. Těmito analýzami bylo ale zjištěno, že žádný web není
indexován v hlavních vyhledávačích jako Google, Seznam, Bing, Morfeo a Jyxo na výše
uvedená klíčová slova.
40
6.9 Subjektivní zhodnocení
6.9.1 Subjektivní zhodnocení úvodní stránky webu Pionýra
Obrázek 1: Webová stránka, Pionýr Kopřivnice
Zdroj: PIONÝR KOPŘIVNICE. Úvodní webová stránka. [online].
http://koprivnice.pionyr.cz/ - zaměření stránek je zcela zjevné z hlavičky, kde je název
organizace a ilustrační fotka. Stánka obsahuje dně menu: horizontální pod hlavičkou
obsahuje hlavně statické informace o organizaci, vertikální menu vpravo je dynamické
a upozorňuje na nejbližší akce a nabízí přímé linky na důležité informace. Dominantní
částí úvodní stránky jsou odkazy na články o uskutečněných akcích, které obsahují
i fotogalerie. Aktualizace informací je dostatečná. Barevné schéma stránky, obzvlášť
kombinace žluté a oranžové, není úplně kontrastní a může působit problémy zrakově
handicapovaným návštěvníkům. Funkce vyhledávání chybí. Pro formátování stránek jsou
použity kaskádové styly.
41
6.9.2 Subjektivní zhodnocení úvodní stránky webu Skauta
Obrázek 2: Webová stránka, Skaut Jevišovice
Zdroj: SKAUT JEVIŠOVICE. Úvodní webová stránka. [online].
http://www.skautjevisovice.estranky.cz/ - vhodně pojatá hlavička, která zcela jasně
ukazuje zaměření stránek. Menu se nachází vlevo a nabízí odkazy na aktivity organizace
(minulé i budoucí). Barevné schéma, s ohledem na dětskou organizaci, považuji
za nevhodnou. Dominantní hnědá barva nepůsobí příliš optimisticky. Jako nedostatek
hodnotím málo fotografií, které návštěvníka zaujmou. Web působí hodně formálním
dojmem. Stránku lze hodnotit jako minimalistickou. Zdrojový kód je napsaný čistě přes
kaskádové styly s minimem chyb, což zajišťuje systém estranky.cz. Je zde funkce
vyhledávání, kde se využívá systém estránek. Výsledky vyhledávání mě ale moc
nepřesvědčily o užitečnosti a funkčnosti. U tohoto webu je tak malý obsah informací, že
zde funkce vyhledávání snad nemá ani smysl - není totiž co hledat.
42
6.9.3 Subjektivní zhodnocení úvodní stránky webu Junáka
Obrázek 3: Webová stránka, Junák Moravské Budějovice
Zdroj: SKAUTSKÝ SVĚT. Úvodní webová stránka. [online].
http://orlice.abahoa.cz/ - moderní odlehčený design ve světle šedé barvě. Možná trochu
barevného oživení by neškodilo. Vždyť je to web dětské organizace. Kladně hodnotím širší
layout. Hlavička obsahuje i logo mateřské organizace, což jasně ukazuje příslušnost k
Junákům. Menu jsou vertikální a nachází se vpravo i vlevo. Jedná se o tří sloupcový layout
stránek. Odkazy z něj vedou na očekávané informace o organizaci a její aktivitě. Vypadá
to, že stránky jsou aktualizovány často, což je velký klad. Opět by asi neuškodily nějaké
fotky, byť malé náhledy. Funkce vyhledávání chybí. Zdrojový kód je napsán čistě, zřejmě
je zde nasazen systém Wordpress.
Webové stránky Junáka Moravské Budějovice i Pionýra Kopřivnice dopadly velmi dobře
ve všech analyzovaných kategoriích. Tyto stránky se tedy mohou stát dobrým zdrojem
inspirace pro vlastní návrh webových stránek naší organizace.
43
7 Vlastní návrh www stránek
Vlastní návrh jsem rozdělil na 2 části. Na strukturální a grafickou část
7.1 Strukturální část
Na úvodní stránce je jako obrázek znázorněno oficiální logo pionýra, s názvem Pionýr
Jevišovice, který bude proveden modrou barvou a bude umístěn nad logem. Pod logem
bude přivítání návštěvníka na webu dětské organizace Pionýr Jevišovice, tento nápis bude
proveden červenou barvou. Pozadí zůstane bílé, z důvodu symboliky národní trikolóry.
Dále zde budou umístěny dva odkazy. Normální verze stránek a mobilní verze stránek pro
mobilní zařízení.
Obrázek 4: Úvodní stránka navrhovaného webu www.jevisovice.pionyr.cz
Zdroj: vlastní návrh autora
44
7.1.1 Verze pro mobily
V dnešní moderní době, kdy se internet běžně rozšiřuje i do mobilních zařízení, je potřeba
při vytváření webu myslet i na tato mobilní zařízení a přemýšlet už trošku do budoucnosti,
protože zobrazovací display mobilu má daleko menší rozlišení (počet zobrazovacích bodů)
než klasické monitory. Proto musí vývojář webu pamatovat na to, aby tuto verzi stránek
přizpůsobil tak, aby i pro uživatele s mobilními zařízeními bylo prohlížení jeho stránek
přívětivé. Časté a zdlouhavé posunování do stran je totiž nepohodlné (s posunováním
nahoru a dolů se počítá).
Srovnáme-li například obrazovku běžného stolního počítače s monitorem o rozlišení 1280
x 1024 obrazových bodů a mobilní telefon s rozlišením 240 x 320 obrazových bodů,
je zřejmé, že to, co se bez problémů zobrazí najednou na počítači, bude se muset na mobilu
zobrazit pomocí posunování. Cílem je tedy napsat stránky s verzí pro mobily tak,
aby uživatel přihlášený na web prostřednictvím mobilního telefonu nemusel pokud možno
posunovat do stran vůbec a jen si plynule prohlížel obsah stránek ze shora dolů.
Pokud na webové stránce není k dispozici verze stránek pro mobily, pak se uživateli
na mobilu zobrazí klasická verze stránek ve velkém rozlišení a bude muset pravděpodobně
hodně posunovat do strany, protože klasická verze stránek prozatím nepočítá
s tím, že stránky budou prohlíženy zařízením s nízkým rozlišením displeje, jakým je třeba
mobilní telefon.
Obě verze jsou obsahově totožné, liší se pouze uspořádáním obsahu na stránkách. Z tohoto
důvodu budu v následujícím textu hovořit o popisu normální verze stránek.
Domovská stránka webu Pionýr Jevišovice bude rozdělena do samostatných sekcí, které se
volí z hlavního menu, tvořeného sadou tlačítek v horní části okna. V levém horním rohu
okna bude umístěno loga Pionýra. Na úvodní stránce bude vytvořen text, který
v minimálním rozsahu představí dětskou organizaci s uvítacím oslovením návštěvníka
těchto stránek. Má představa je následující – Dobrý den vítejte na stránkách dětské
organizace.
45
Hlavní stránka webu bude strukturálně rozdělena do více částí (panelů):
Hlavní titulní banner nahoře přes celou šířku stránky – obsah zleva: logo Pionýra, titulní
text (např. Pionýr Jevišovice)
Navigace (menu) – jsou 2 možnosti: horizontální (umístěné pod titulním bannerem)
nebo vertikální (umístěné ve sloupci vlevo – začíná už pod titulním bannerem –
v případě toho typu menu se pod položkami dá umístit formulář pro vyhledávání
na stránkách)
Reklamní sponzorský banner – umístěn ve sloupci napravo
Plocha pro konkrétní stránku, která se mění podle zvoleného záznamu v menu
(pokud se zvolí vertikální menu, pak bude umístěna mezi sloupcem menu
a reklamním sloupcem, pokud bude menu horizontální, pak bude umístěna u levého
okraje)
Počítadlo návštěv, datum poslední aktualizace – umístěno bude až dole pod
veškerým obsahem, protože to není nijak důležitá informace.
Z úvodní stránky bude přes hlavní menu možné přejít do dalších sekcí
O nás
Fotogalerie
Schůzky
Diskusní fórum
Kontakty
7.1.2 Sekce O nás
Po otevření okna O nás se zobrazí informace, které jsou zobrazeny jako souvislý text
a členěny do odstavců k jednotlivým tématům. Tyto informace musí návštěvníkům podat
základní informace o naší organizaci. Bude to výběr textu, který je uveden v kapitole 5
a kapitole 5.1 této bakalářské práce (zde je dětská organizace představena).
46
7.1.3 Sekce Fotogalerie
Po otevření okna se objeví volba Nabídka fotek z akcí a Hledání podle zadaných
parametrů, které se otevřou ve stejném okně. Po volbě Nabídka fotek z akcí se v okně
otevře seznam uskutečněných akcí s možností filtrovat podle zadaných parametrů. Seznam
akcí je proveden po jednotlivých řádcích, které představují jednotlivé nabízené fotografie
z akcí. Po kliknutí na jednotlivý řádek se otevře prezentace s fotografiemi zobrazenými
v náhledu, po kliknutí na náhled se otevře vlastní okno se zvětšenou fotografií a s možností
listovat ve fotografiích a s možností zavřít okno. Detailní výpis informací má možnost
volby Zpět pro návrat na seznam akcí.
Další možností je, že po zobrazení sekce se uživateli nabídne seznam akcí, které obsahují
fotografie. Seznam bych volil seřazený od nejnovější po nejstarší, přičemž zobrazeno bude
pouze např. 3-5 nejnovějších akcí; další starší budou dostupné např. pod odkazem archiv
fotografií. Po kliknutí na odkaz akce se pod seznamem akcí zobrazí fotografie společně
s navigačními tlačítky pro přesun na předchozí/další, první/poslední fotografii.
7.1.4 Sekce Schůzky
Po otevření okna Schůzky se zobrazí informace o možnostech navštívit propagovanou
schůzku. Zde bude napsán termín, datum konání schůzky a činnost nebo aktivita, která
se bude na samotné schůzce provádět. Nejlépe plánovat schůzky měsíc dopředu, aby
si návštěvník našich stránek, stejně tak i náš člen mohl udělat představu o naší plánované
činnosti.
7.1.5 Sekce Diskuse
Po otevření okna z hlavního menu s volbou Diskuse se otevře v okně přehled
diskutovaných témat s možností podrobného výpisu příspěvků k jednotlivým tématům.
Součástí okna Diskuse je volba Vstup do diskuse pro založení nového tématu, po zobrazení
podrobného výpisu diskusních příspěvků je možné vkládat k jednotlivým příspěvkům
odpovědi. V obou případech se otevře vkládací diskusní formulář pro zadání jména,
případně emailové adresy a textu příspěvku. K jednotlivým příspěvkům má administrátor
pomocí vlastního přístupu možnost vkládat odpovědi jménem dětské organizace a tyto
odpovědi jsou graficky zvýrazněné. Administrátor bude mít také možnost nevhodné,
47
především vulgární, osobní útoky na jednotlivce, nebo příspěvky diskreditující z diskuze
vyjmout, tak jak je obvyklé na mnoha slušných diskusních fórech. Ten kdo se účastní
diskuse, musí dodržet základní podmínky, které budou vymezeny úvodním textem diskuse.
Tyto příspěvky mohou zefektivnit komunikaci mezi občany a organizací.
7.1.6 Sekce Kontakty
Po otevření okna Kontakt se zobrazí základní osobní informace o dobrovolných
pracovnících dětské organizace Pionýr Jevišovice s jejich telefonním číslem a emailovou
adresou. Dále se zde zobrazí i poštovní adresa sídla dětské organizace Pionýr Jevišovice
a adresa klubovny.
7.2 Grafická část
Základní grafické schéma webových stránek bude vycházet z motivu loga Pionýr, které
bude ve formě vodoznaku použito jako pozadí v otvíraných oknech. Barevné ladění celých
stránek bude do světle modré, v kombinaci s bílou a černým textem.
V tiráži, zobrazované v každém okně, bude uvedeno počítadlo návštěv webových stránek
a datum poslední celkové aktualizace stránek. Toto datum se aktualizuje podle aktuálního
data přístupu přes administrátorský vstup do kterékoliv sekce webových stránek. Správce
stránek bude mít možnost přístupu přes administrátorský vstup do všech sekcí stránek,
s možností zadávání nabídky a vkládání fotografií do sekce Fotogalerie, vkládání odpovědí
do diskusní sekce, případně změny a aktualizace textových informací v ostatních sekcích.
48
7.2.1 Znak
Tato kruhová stylizace znázorňuje planetu Zemi a vyjadřuje demokratický princip rovnosti
práv a povinností členů Pionýra. Tvar znaku připomíná list národního stromu lípy.
Vlaštovka je symbolem štěstí a jara, počátku nového života. Směr letu vzhůru znamená
úsilí o naplnění ideálů Pionýra, pokrok a poznávání. Bílá barva spolu s červenou a modrou
barvou národní trikolóry zdůrazňuje i myšlenku vlastenectví a občanství. Převažující bílá
symbolizuje pravdu, mír a naději.
Obrázek 5: Oficiální logo dětské organizace Pionýr
Zdroj: PIONÝR.cz, grafické podklady Pionýra [online].
7.3 Výběr domény a hostingu
Nyní je důležité, když už máme navrhnutý web a strukturu webového sídla rozhodnout,
kde budeme své stránky hostovat a zda nám stačí freehosting s doménou třetího řádu,
nebo zvolíme placený webhosting s profesionálními službami.
Freehostingy (domény třetího řádu) se staly v poslední době velmi oblíbenými. Především
z toho důvodu, že cena služby je zdarma. Druhým faktorem je také rychlost,
po zaregistrování můžete ihned spustit svůj nový web. Má ale i řadu nevýhod (např. slabá
technická podpora).
49
7.3.1 Vlastní doména
Řešením je vlastní doména. Výše ceny se odvíjí od zvolené TLD (Top-Level Domain -
doména nejvyšší úrovně - například .cz, .com nebo .net). Snadno zapamatovatelná doména
je velkou výhodou.
Rozeznáváme tyto typy domén:
Doména I. řádu: Jedná se o nejvyšší úroveň domén. Top-level doménu (TLD) neboli
národní doménu. Pro Česko je to .CZ, pro další státy například Slovensko je to .SK.
Doména II. řádu: CZ doména II. řádu je doména ve tvaru například pionyr.cz.
Doména III. řádu neboli subdoména: Subdoména je rozšíření doménového názvu o další
úroveň. Je ve tvaru např. Jevišovice.pionyr.cz, kde Jevišovice je název domény III. řádu.
Subdomény je možné vytvářet u domén II. řádu. Za domény III. řádu se správci domény
zpravidla již neplatí.
7.3.2 Další možnosti
Jednou z dalších možností prezentace organizace je zvolit si tvorbu www stránek
na serveru estránek.cz. Zde je možné si vytvořit vlastní prezentaci do předem vytvořených
šablon. Do těchto šablon si můžeme sami vložit to, co potřebujeme. Jedná se o navržené
stránky s jednoduchým ovládáním. Design je vytvořen profesionálními grafiky a je pouze
na uživateli, jaký vzhled z nabízených šablon si vybere a které z navrhovaných funkcí
ke své prezentaci využije.
Zdarma nabízí estránky pro zájemce o web 100 MB prostoru. Přenos 1 GB za měsíc.
Je zde, ale vložená reklama provozovatele a není určen firmám. Pro potřeby dětské
organizace se dá plně využít. Pro nekomerční účely navíc nabízí zámek stránek, vlastní css
a úpravu xhtml. Přenos 5 GB za měsíc. 1 GB prostoru. Přístup je zde umožněn přes FTP.
Je bez reklam provozovatele a nelze umístit cizí reklamu. Cena 420,- Kč za rok (bez DPH
20%). Pro komerční účely oproti nekomerčním účelům lze umístit cizí reklamu. Také
nabízí větší kapacitu - 5 GB prostoru a přenos 10 GB / měsíc. Cena 1500,- Kč za rok (bez
DPH 20%).
Jako další možnost se nabízí vytvořit prezentaci v systému CMS. Po úspěšné instalaci není
potřeba zasahovat do zdrojového kódu webové stránky. CMS je zkratka z anglických slov
Content Management Systém, což v doslovném překladu znamená systém pro správu
obsahu. Častěji se používá termín redakční systém. Redakční systém je program, který
50
umožňuje jednoduše vytvářet obsah stránek bez zásahu do zdrojového kódu stránky.
Vzhled si vyberete pomocí tzv. šablony a do této šablony je pak převeden vytvořený obsah
textu článku, ale i obrázky. Změna vzhledu webového sídla pak spočívá ve výměně
šablony, na obsah pak nemusíte sáhnout, je přizpůsoben novému vzhledu automaticky.
Redakční systém je pak určen také začátečníkům, neboť vkládání obsahu se podobá práci
s textovým editorem, což lze v dnešní době považovat za nutné minimum každého
uživatele osobního počítače. S redakčním systémem také nejste vázáni na konkrétní
operační systém, vše se ovládá pomocí standardního internetového prohlížeče. Mezi známé
představitele CMS systémů patří Joomla, která podporuje používání českého prostředí,
ale také umožňuje vkládat obsah článků v češtině, případně vytvářet obsah i ve více
jazycích. Mezi další představitele patří Drupal, který má snadnou rozšiřitelnost pomocí
modulů a navíc je zdarma i se zdrojovými kódy.
Co je tedy šablona? A jakou má funkci? Jednou z hlavních výhod redakčních systémů
je to, že ten, kdo zadává obsah - články, zprávy, dokumentaci apod., se nemusí starat o to,
kam se daný článek vloží a jak zapadne do celkové koncepce stránek. O to se starají
zmiňované šablony. Jedná se o jakýsi předpis vzhledu, který říká, kde a jak bude umístěno
logo stránek, co se kde bude vypisovat apod.
7.3.3 Naše cesta
Vzhledem k tomu, že naše dětská organizace je součástí organizace Pionýr, která vlastní
doménu druhého řádu i hosting je pro nás nejlepší a zároveň i nejlevnějším řešením využít
možnosti zřízení domény tak i hostingu u své domovské organizace.
Zřízením domény 3. řádu na serveru pionyr.cz získá naše organizace tyto výhody.
Reprezentativní i lehce zapamatovatelná adresa stránek ve formátu: jevisovice.pionyr.cz.
Bezplatný hosting a všechny služby s tím související. Vlastní FTP s prostorem 500 MB.
Možnost zřízení až pěti e-mailových adres (každá s prostorem 20 MB). Možnost zřízení
doménového koše, e-mailových konferencí a vlastní správy databází. Podpora správce
serveru – pracovníka informační technologie Ústředí Pionýra.
FTP (File Transfer Protocol - protokol pro přenos souborů)
51
8 Závěr
Hlavním cílem bakalářské práce bylo pomocí teoretických znalostí problematiky tvorby
webových stránek navrhnout funkční a uživatelsky úspěšné webové stránky pro dětskou
neziskovou organizaci Pionýr Jevišovice, která tento druh propagace a komunikace
v současné době nepoužívá.
Dříve než jsem začal vytvářet vlastní návrh webových stránek, tak jsem v teoretické části
bakalářské práce vysvětlil základní pojmy, jako jsou nestátní nezisková organizace, typy
neziskových organizací, občanské sdružení a organizace Pionýr. Teoretická část také
popisuje základy tvorby www stránek, kde jsou vysvětleny pojmy hierarchie stránek,
orientace na stránkách. Je zde popsána důležitost navigace a vyjmenovány samotné prvky
navigace. Dále je zde popsána grafika a design webových stránek. Vysvětleny důležité
podmínky pro splnění správné použitelnosti a přístupnosti webových stránek pro všechny
skupiny uživatelů.
V praktické části jsem nejdříve představil dětskou organizaci Pionýr Jevišovice, její
činnost, zaměření a aktivity. Popisuji současný stav organizace a její způsob propagace
na veřejnosti. Současný způsob propagace byl vyhodnocen jako nedostačující. Vzhledem
k tomu, že organizace do dnešní doby nepoužívá ke své propagaci webové stránky, bylo
členy a vedením rozhodnuto, že webové stránky organizace potřebuje. Nejdříve jsem tedy
potřeboval získat představu o tom, jak by měli tyto vlastní stránky vypadat, jaké mají mít
prvky a prostředky. Z toho důvodu bylo využito řady dostupných analýz, které byly
provedeny na třech vybraných webech dětských organizací. Provedl jsem analýzy webů
Pionýr Kopřivnice, Skaut Jevišovice a Junák Moravské Budějovice. Na těchto webových
stránkách byly postupně provedeny analýzy klíčových slov, zdrojového kódu, síly webu
a pozice ve vyhledávačích. Webové stránky byly také na závěr analýz podrobeny
subjektivní analýze. Všechny tyto analýzy byly porovnány a vyhodnoceny. V některých
případech jsem uvedl i návrhy a doporučení na zlepšení zjištěné situace. Především jsem
si díky zjištěným výsledkům analýz udělal jednotnější představu o webu, který jsem chtěl
navrhovat, získal jsem inspiraci a motivaci. Z některých chyb jsem se poučil, abych tyto
chyby konkurence neopakoval při vlastním návrhu webových stránek.
52
Poslední kapitola praktické části obsahuje vlastní návrh internetové prezentace dětské
organizace Pionýr Jevišovice. Tento návrh byl motivován některými pozitivními výsledky
provedených analýz. Nyní tedy má organizace reálnou představu o tom, jak mají vlastní
webové stránky vypadat. Je zde předložen návrh, který po konzultaci s odborníkem bude
uveden do provozu na hostingu www.pionyr.cz.
Co nám mohou vytvořené webové stránky v budoucnu přinést? Jaký užitek a jaké výhody?
Mezi první bych zařadil to, že se dostaneme především do povědomí více lidí. Organizace
má totiž možnost prostřednictvím svého webu komunikovat s širokou veřejností velmi
jednoduchou a nenásilnou formou. Publikováním článků z akcí a činností přináší
náhodným návštěvníkům stránek obrázek o naší dobrovolnické práci s dětmi. Vzniká
tak širší povědomí o naší organizaci.
Tato propagace publikováním článků a následným hodnocením dětí umístěná na vlastních
stránkách může přinést úspěch i v podobě různých doporučení a odkazů našich sponzorů,
partnerů, ale i třeba regionálních médií na naši webovou stránku. Tímto se povědomí o naší
činnosti rozšíří do širšího okolí. Kvalitní webové stránky mohou přinést i nečekaný zisk
pro organizaci. To se může stát v případě, když jejich obsah zaujme případné nové
zájemce, kteří chtějí sponzorovat a podporovat neziskovou organizaci.
Pokud budou webové stránky dostatečně kvalitní svojí strukturou i obsahem, tak se časem
budou zobrazovat vysoko ve výsledcích vyhledávání fulltextových vyhledávačů. Už
samotné takové zobrazení jim přinese slušnou publicitu. To může ovlivnit i početnost
samotných přístupů na webovou stránku. Toto je prostě reklama, kterou nemusí organizace
nikde draze platit.
V neposlední řadě nám může přinést nové zájemce o členství v organizaci. Svůj význam
bude mít i pro samotné členy organizace. Stávající, ale i bývalé členy organizace bude
prostřednictvím článků a galerií (fotografií a videí) informovat o uskutečněných, ale
i plánovaných akcích. V budoucnu se pro ně samotný web stane hodnotným zdrojem
informací, vzpomínek na dětství a mládí, především v době, kdy se již nebudou sami
aktivně zapojovat do činnosti organizace.
53
9 Použité zdroje
Literatura
BADELT, Ch. Handbuch der Nonprofit Organisation,Stutgart: Schäffer-Poeschel, 1997
BOUKAL, V., VÁVROVÁ, H., NOVOTNÝ, J. Ekonomika a řízení neziskových
organizací, 1. vyd. Praha: Oeconomicas, 1998. 103 s. ISBN 80-245-0604-1
DOMES, M. Tvorba www stránek pro úplné začátečníky, 1.vyd. Brno: Computer Press,
2008. 248 s. ISBN 978-80-251-2160-3
FORET, M. Marketingová komunikace, 1.vyd. Brno: Computer Press, 2006. 443 s. ISBN
80-251-1041-9
FRIČ, P., GOULLI, R. Neziskový sektor v ČR: Výsledky mezinárodního srovnání sektoru
John Hopkins university, 1. vyd. Praha: Eurolex Bohemia, 2001. 203 s. ISBN 80-8643-
204-1.
HANNAGAN, T. J. Marketing pro neziskový sektor, 1. vyd. Praha Management Press,
1996. 205 s. ISBN 80-85943-07-7.
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! 2. aktual. vyd. Brno : Computer
Press, 2006. 168 s. ISBN 80-251-1291-8
LYNCH, P., HORTONOVÁ, S. Základní průvodce webdesignem, 1. vyd. Brno: Zoner
Prees, 2004. 224 s. ISBN 80-86815-05-6.
STRUNK, W., WHITE, E. B. The Element sof Style, Allyn and Bacon 1979
ŠPINAR, D. Tvoříme přístupné webové stránky, 1. vyd. Brno: Zoner Prees, 2004. 360 s.
ISBN 80-86815-11-0.
TOMEŠ, I. a kol., Sociální správa, 1. vyd. Praha: Portál, 2002. 304 s. ISBN 80-7178-560-1
54
TUČKOVÁ, Z. Ekonomika služeb, SVŠE Znojmo 2009 110 s. ISBN 978-8087314-03-6
WILDMANNOVÁ, M., ŠELEŠOVSKÝ, J. a kol. Územní samospráva v ČR, Rakousku a
SRN, 1. vyd. MU Brno: 2001. 139 s. ISBN 80-210-2514-X
Elektronické zdroje
POINÝR.cz. Základní informace o Pionýru. [online]. [cit. 2009-12-23]. Dostupný
z WWW: <http://www.pionyr.cz/index.php?page=mzi>.
JANOVSKÝ, D. Jak psát web [online]. Poslední revize 2010. [cit. 2009-03-24]. Dostupný
z WWW: <http://www.jakpsatweb.cz/pouzitelnost.html >.
WEB TVORBA. Přístupnost webu [online]. [cit. 2009-03-24]. Dostupný z WWW:
<http://www.webtvorba.cz/pristupnost/>
PODLAHOVÁ, I. Přístupný web [online]. [cit. 2009-03-26]. Dostupný z WWW:
<http://www.dobryweb.cz/newsletter-pristupny-web-robotizace/>
PIONÝR KOPŘIVNICE. Úvodní webová stránka. [online]. Poslední revize 2010. [cit.
2009-03-20]. Dostupný z WWW: <http://koprivnice.pionyr.cz/>.
SKAUT JEVIŠOVICE. Úvodní webová stránka. [online]. [cit. 2009-03-20]. Dostupný
z WWW: <http://www.skautjevisovice.estranky.cz/>.
SKAUTSKÝ SVĚT. Úvodní webová stránka. [online]. [cit. 2009-03-20]. Dostupný
z WWW: <http://orlice.abahoa.cz/>.
55
Seznam tabulek a obrázků
Seznam tabulek:
Tabulka 1: Nejčetnější slova stránky webu Pionýra Kopřivnice
Tabulka 2: Nejčetnější slova stránky webu Skauta Jevišovice
Tabulka 3: Nejčetnější slova stránky webu Junáka M. Budějovice
Tabulka 4: Pozice ve vyhledávačích na hledané slovo: pionýr
Tabulka 5: Pozice ve vyhledávačích na hledané slovo: skaut
Tabulka 6: Pozice ve vyhledávačích na hledané slovo: junák
Seznam obrázků:
Obrázek 1: Webová stránka, Pionýr Kopřivnice
Obrázek 2: Webová stránka, Skaut Jevišovice
Obrázek 3: Webová stránka, Junák Moravské Budějovice
Obrázek 4: Úvodní stránka navrhovaného webu www.jevisovice.pionyr.cz
Obrázek 5: Oficiální logo dětské organizace Pionýr
56
Seznam použitých zkratek
CMS (Content Management Systém) systém pro správu obsahu
FTP (File Transfer Protocol) protokol pro přenos souborů
TLD (Top-Level Domain) doména nejvyšší úrovně
URL (Uniform Resource Locator) termín pro adresy na Internetu
WWW (World Wide Web, zkráceně web) ve volném překladu „celosvětová pavučina“