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 Úvod .............................................................................................................................. 9 Cíl práce a metodika .................................................................................................. 10 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 1 2 3
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
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í.
9
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.
10
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.
11
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 2
TUČKOVÁ Z., Ekonomika služeb, s. 93 TUČKOVÁ Z., Ekonomika služeb, s. 93
12
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 HANNAGAN T. J., Marketing pro neziskový sektor, s. 18 5 TOMEŠ I. a kol., Sociální správa, s. 266 4
13
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 7 8 9
WILDMANNOVÁ, M., ŠELEŠOVSKÝ, J. a kol., Územní samospráva v ČR, Rakousku a SRN, s. 48 BADELT, Ch., Handbuch der Nonprofit Organisation, s. 8 BOUKAL, V., VÁVROVÁ, H. , NOVOTNÝ, J. Ekonomika a řízení neziskových organizací, s. 53 FRIČ, P., GOULLI, R Neziskový sektor v ČR, s. 59
14
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.
15
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].
16
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
17
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
18
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 15
LYNCH, P., HORTONOVÁ, S. Základní průvodce webdesignem s. 55-56 KRUG, S., Webdesign : Nenuťte uživatele přemýšlet! s. 52-53
19
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
20
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 18
KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 57-69 KRUG, S. Webdesign : Nenuťte uživatele přemýšlet! s. 73
21
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 20
DOMES, M. Tvorba www stránek pro úplné začátečníky, s. 175 DOMES, M. Tvorba www stránek pro úplné začátečníky, s. 175
22
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].
23
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 PODLAHOVÁ, I. Dobrý web, Přístupný web. [online]. 24 LYNCH, P., HORTONOVÁ, S. Základní průvodce webdesignem s. 27 23
24
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.
25
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.
25 26
26
WEB TVORBA. Přístupnost webu. [online]. FORET, M. Marketingová komunikace, s. 331
26
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. 27
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.
28
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.
29
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.
30
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 2010 kopřivnice fotogalerie května 2010 února května února 2010 zimní tábor pionýr 2010 so akce rodiče hry děti
Výskytů
Zastoupení v %
22 6 6 5 5 5 4 4 3 3 0 0 0 0
5,09 1,38 1,38 1,15 1,15 1,15 0,92 0,92 0,75 0,75 0 0 0 0
Zdroj: práce autora (7. 4. 2010)
31
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 %
3 3 3 3 2 2 2 2 2 2 1 0 0 0
2,27 2,27 2,27 2,27 1,51 1,51 1,51 1,51 1,51 1,51 0,57 0 0 0
středisko jevišovická jevišovice akce čr středisko svaz skautů středisko jevišovice skautek čr proběhlé akce anebo skaut rodiče hry děti
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 akce 2009 2010 orlice rubrika akce abahoa orlice abahoa http orlice rodiče junák hry děti
Výskytů
zastoupení v %
18 18 13 11 10 10 9 9 3 3 2 1
1,67 1,67 1,21 1,02 0,93 0,93 0,83 0,83 0,21 0,21 0,14 0,07
Zdroj: práce autora (7. 4. 2010)
32
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
33
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)
34
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.
35
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 Skautský svět - Junák - svaz skautů a Google 74 skautek ČR, středisko ... Bing Nenalezeno Roverská přespávačka Skautský svět Jyxo 99 Junák... Seznam Nenalezeno Skautský svět - Junák - svaz skautů a Morfeo 26 skautek ČR, středisko Moravské Budějovice Zdroj: práce autora (7. 4. 2010)
36
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.
37
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.
38
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-seoservis.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.
39
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.
40
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.
41
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.
42
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
43
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. 44
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).
45
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é, 46
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.
47
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).
48
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ý 49
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ů)
50
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.
51
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.
52
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-8643204-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 53
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:
. JANOVSKÝ, D. Jak psát web [online]. Poslední revize 2010. [cit. 2009-03-24]. Dostupný z WWW: . WEB TVORBA. Přístupnost webu [online]. [cit. 2009-03-24]. Dostupný z WWW: PODLAHOVÁ, I. Přístupný web [online]. [cit. 2009-03-26]. Dostupný z WWW: PIONÝR KOPŘIVNICE. Úvodní webová stránka. [online]. Poslední revize 2010. [cit. 2009-03-20]. Dostupný z WWW: . SKAUT JEVIŠOVICE. Úvodní webová stránka. [online]. [cit. 2009-03-20]. Dostupný z WWW: . SKAUTSKÝ SVĚT. Úvodní webová stránka. [online]. [cit. 2009-03-20]. Dostupný z WWW: .
54
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
55
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“
56