Inovace webové prezentace školy

Mendelova univerzita v Brně Institut celoživotního vzdělávání

Inovace webové prezentace školy Závěrečná práce

Vedoucí práce:

Vypracovala:

Ing. Petra Čačková, Ph.D.

Mgr. Martina Straková

2012

Děkuji Ing. Petře Čačkové, Ph.D. za cenné rady a připomínky při vedení mé závěrečné práce.

Prohlašuji, že jsem závěrečnou práci zpracovala samostatně a použila jen literaturu uvedenou v seznamu literatury. V Brně říjen 2012

__________________

Abstrack Straková, M.,Innovation website of the school. Final thesis. Brno: Brno MUICV, 2012.Text work introduces the content of school web sites, analysis and subsequent design innovation school website. Keywords Final thesis, web, web presentation, analysis, innovation.

Abstrakt Straková, M., Inovace webové prezentace školy. Závěrečná práce. Brno: MUICV v Brně, 2012.Text práce seznamuje s požadavky naobsah webových stránek školy, analýzaa následný návrh inovace webové prezentace školy. Klíčová slova Závěrečná práce, web, webová prezentace, analýza, inovace.

Obsah 1

ÚVOD A CÍL PRÁCE .................................................................... 9 1.1 1.2

2

ÚVOD ......................................................................................................... 9 CÍL PRÁCE ................................................................................................. 10

JAK UCHOPIT WEBOVOU PREZENTACI .................................. 11 2.1 POŽADAVKY NA WEBOVOU PREZENTACI .......................................................12 2.1.1 Webové standardy...............................................................................14 2.1.2 Použitelnost .......................................................................................... 15 2.1.3 Přístupnost........................................................................................... 15 2.1.4 Optimalizace pro vyhledávání ............................................................ 15 2.2 POŽADAVKY NA ŠKOLNÍ WEBOVOU PREZENTACI ...........................................16 2.2.1 Úvodní stránka školy ..........................................................................16 2.2.2 Další stránky školy .............................................................................. 17 2.2.3 Náležitosti webové prezentace ........................................................... 18 2.3 POŽADAVKY NA TECHNOLOGICKÉ ŘEŠENÍ PREZENTACE ............................... 18 2.3.1 HTML .................................................................................................. 18 2.3.2 XHTML ............................................................................................... 18 2.3.3 CSS ...................................................................................................... 18 2.3.4 JavaScript ............................................................................................19 2.3.5 PHP ......................................................................................................19 2.3.6 MySQL .................................................................................................19 2.4 TVORBA WEBOVÝCH STRÁNEK .....................................................................19 2.4.1 WYSIWYG editory ...............................................................................19 2.4.2 Strukturní editory .............................................................................. 20 2.5 SYSTÉM PRO SPRÁVU OBSAHU .................................................................... 20

3

ANALÝZA WEBOVÉ PREZENTACE .......................................... 22 3.1 AUTOEVALUACE WEBU .............................................................................. 22 3.1.1 Obsah a poskytované Informace ....................................................... 22 3.1.2 Publikování na internetu.................................................................... 25 3.1.3 Webdesign ........................................................................................... 26 3.1.4 Bezpečnost a legislativa ..................................................................... 26 3.1.5 Bonus a penalizace ............................................................................. 27 3.1.6 Hodnocení ........................................................................................... 28 3.2 STRUKTURA WEBU .................................................................................... 30 3.3 WEBOVÉ STANDARDY ................................................................................ 32

4

INOVACE A IMPLEMENTACE WEBU ....................................... 35 4.1

URČENÍ WEBOVÉ PREZENTACE ................................................................... 35

4.2 4.3 4.4

NAVIGACE WEBOVÉ PREZENTACE ............................................................... 35 OBSAH STRÁNEK WEBOVÉ PREZENTACE ...................................................... 36 NÁSTROJ PUBLIKOVÁNÍ WEBOVÉ PREZENTACE ............................................ 37

5

ZHODNOCENÍ WEBOVÉ PREZENTACE ................................... 40

6

LITERATURA A ODKAZY ......................................................... 41

Seznam grafů Graf 1 – Kdo přímo vytváří a mění obsah školních webů .................................... 11 Graf 2 – Kdo ve škole mění obsah webových stránek školy ................................. 11 Graf 3 – Pořadí aplikací v České republice pomocí služby Google Trends ..........21 Graf 4 – Použitelnost školního webu (anketa mezi pedagogy školy).................. 32

Seznam obrázků Obrázek 1 – Náležitosti školního webu – autoevaluační asistent ....................... 22 Obrázek 2 – Oblasti hodnotících kritérii ............................................................. 29 Obrázek 3 – Výsledky autoevaluace webových stránek ...................................... 30 Obrázek 4 – Layout stránek – náčrt .....................................................................31 Obrázek 5 – Rozložení obsahu stránek ................................................................31 Obrázek 6 – Validace dokumentu bez chyby....................................................... 33 Obrázek 7 – Validace dokumentu s chybou ........................................................ 33 Obrázek 8 – Struktura analyzované webové prezentace školy ........................... 36 Obrázek 9 – Struktura příkladu inovované webové prezentace školy ................ 36 Obrázek 10 – Přihlašovací okno WordPressu (redakční systém školy) .............. 38 Obrázek 11 – Úvodní okno administrace WordPressu (redakční systém školy) 38 Obrázek 12 – Vizuální editor WordPressu (redakční systém školy) ................... 38 Obrázek 13 – HTML editor WordPressu (redakční systém školy) ..................... 39

Úvod a cíl práce

1 1.1

9

Úvod a cíl práce Úvod

Internet je v dnešní době pro většinu z nás nedílnou součástí každodenního života. Ale než se dostal k podobě dnešního Internetu, prošel velkým vývojem. Počátky internetu vznikaly na půdě vojenské, vládní a akademické, kde hlavním účelem bylo vytvoření počítačové sítě, která by spolehlivě propojovala počítače a byla co nejméně zranitelná. První experimentální pokusy s vytvořenou sítíARPANET se uskutečnily roku 1969,který propojoval čtyři americké univerzity. Internet postupně prošel vývojem technologických postupů a aplikaci řady nových technologií až po současnost.Roku 1991 nasazení WWW v evropské laboratoři CERN aod roku 1994 se začal Internet uplatňovat i pro komerční účely (Procházka, 2011). V současnosti jsou možnosti Internetu prakticky nekonečné. Webové stránky patří společně s elektronickou poštou k nejpoužívanějším službám Internetu. Na Internetu můžeme najít rozmanité informace, nejrůznější služby, hledání firem, prohlížení fotografií, poslouchání hudby, umožňuje pořádání videokonferencí, telefonování, chatování, přístup do galerií v elektronické podobě, nakupování, apod.Webové stránky slouží k prezentaci obchodů, které nabízí své zboží, banky či firmy své služby a proto je vhodné se v tomto světě Internetu zviditelnit a prezentovat iškoly.Webové stránkyby měli být součásti informačního systému školy. Kvalitní internetové stránkyovlivňujínejenom širokou veřejnost, ale především současné rodiče a žáky i potencionální rodiče budoucích žáků. Web školy by měl být přehledný, čtenář by se v něm neměl ztratit, má zde najít to co hledá a co ho zajímá. Školní webová prezentace jespíše informačně – prezenčního charakteru. Pojem Internet, web a WWW známe, ale jen pro upřesnění malá charakteristika těchto pojmů (Domes 2008): Internet – je celosvětová počítačová síť, ve které jsou počítače vzájemně propojeny a díky tomu mohou spolu komunikovat a předávat nebo sdílet informace. Každý počítač (server) má svou jedinečnou IP (Internet Protocol) adresu. Internet je tedy technologie, prostřednictvím které se mohou propojit počítače mezi sebou. Web – je jedna ze služeb Internetu, která zprostředkovává obsah Internetu (to co vidíme na monitorech – text, obrázky). Web se skládá z více vzájemně provázaných stránek pomocí jedné navigační nabídky (místa) tzv. webové sídlo – konkrétní WWW adresa. WWW(WorldWide Web) – umožňuje využití webové služby Internetu, díky adrese WWW jsme schopni zobrazit stránky uložené na Internetu (serverech). Webové stránky, internetové stránky i WWW stránky – význam těchto slovních spojení je totožné. Webové stránky (soubor stránek) dohromady tvoří web – stránky obchodu, firmy nebo stránky školy.

Úvod a cíl práce

10

Závěrečná práce je zaměřena na inovaci webové prezentace školy, která sdružuje tato zařízení – základní školu, střední školu a dětský domov. Jednotlivé kapitoly závěrečné práce popisují určitý postup k dosažení stanoveného cíle. Začneme tím, že se seznámíme s požadavky na webovou prezentaci školy. Dále bude pokračovat analýza současného stavu webové prezentace školy. Na základě zjištěných informací bude navržen způsob inovace webové prezentace školy a následné zhodnocení inovace daného školního webu.

1.2 Cíl práce Cílem této práce je analýzaa následný návrh inovace webové prezentace školy. Funkční webová prezentace školy může plnit více cílů. Může být nejen dobrým způsobem jak prezentovat svoji vzdělávací a výchovnou činnost, ale i prostředkem komunikace školy s okolím, především s rodiči a žáky školy.

Jak uchopit webovou prezentaci

11

2 Jak uchopit webovou prezentaci Díky dnešnímu fenoménu – rychle se rozvíjejícímu Internetu s množstvím on-line služeb, mohou webovou prezentaci školy vytvářet i pověření pracovníci (pedagogové), kteří v tomto oboru nejsou profesionály. Poskytovatelé nabízejí školám zajímavé slevy, některé kvalitní služby jsou nabízeny zdarma. (Neumajer, 2010, s. 47). Ústavpro informace ve vzdělávání před třemi roky, v květnu 2009, provedl tzv. Rychlé šetření: Informační a komunikační technologie ve školách, Interaktivní tabule. Z šetření vyplývá, že webovou prezentaci má 93,7 % škol. Dále se šetřením zjišťovalo, kdo přímo vytváří a mění obsah školních webů, znázorňuje graf 1. A kdo všechno může ve škole ovlivňovat obsah webových stránek školy, znázorňuje graf 2. (ÚIV Rychlé šetření, 2009) Může některý pracovník Vaší školy přímo vytvářet a měnit obsah internetových stránek školy?

0%

10 %

20 %

30 %

40 %

50 %

60 %

70 %

80 %

90 %

ano ne, ale změny je možné provádět nepřímo přes externího autora stránek ne, stránky školy se nemění naše škola nemá internetové stránky

Graf 1 – Kdo přímo vytváří a mění obsah školních webů Zdroj – ÚIV Rychlé šetření, 2009, s. 41

Kdo všechno ve Vaší škole může přímo měnit obsah internetových stránek (mimo diskusní fórum apod.)? 100 %

80 %

60 %

40 %

Graf 2 – Kdo ve škole mění obsah webových stránek školy Zdroj – ÚIV Rychlé šetření, 2009, s. 45

kdokoliv z

žáků, kdo o to projeví zájem

vybraní žáci

zájem

kdokoliv z

učitelů, kdo o to projeví

učitelé

učitel/jiní pověření

jiný pověřený

učitel

informatiky

0%

vedení školy

20 %

100 %


12

Literatury zabývající se problematikou tvorby webových stránek je nepřeberně mnoho. Vychází v knižní podobě nebo se dá využít internetových zdrojů. Stručným výčtem doporučení pro vytváření či inovaci webových stránek se buduzabývat v následujících podkapitolách.

2.1 Požadavky na webovou prezentaci O tom, zda je webová prezentace „dobrá“ nebo „špatná“, rozhoduje většinou uživatel na základě určitých aspektů. Pro uživatele je důležitá funkčnost stránek a efektivní prezentace informací – aspekt použitelnosti. Ale uživatel je také ovlivněn vzhledem, grafikou stránky – aspekt estetický. Když budeme chtít oslovit co nejvíce uživatelů a udržet si jejich zájem, je nezbytné dosáhnout co nejlepších výsledků v daných aspektech. Web by měl fungovat jako jeden celek – uživatelům se líbí vzhled, ale přitahuje je obsah stránek, uživatelé mají k dispozici intuitivní navigační prostředky, uživatelé chápou každou stránku jako součást daného webu. (Beaird, 2010) Na začátku je velmi důležité promyslet si obsah a konečnou strukturu stránek. Je vhodné si na papír načrtnout propojení stránek, odkud a kam co povede. Rozmyslet si k jakému účelu budou stránky sloužit – proč je děláme? Pro koho je děláme? Stránky musí být přehledné, na to pamatujeme při tvorbě základní struktury. Čtenář, který si bude stránky prohlížet, se v nich musí orientovat. Odkazy na další stránky musí být přehledné, aby čtenář věděl, kam se poklepnutí dostane a co tam najde. Uvést potřebné kontaktní údaje. Stránky mají být přehledné, ale zároveň mají upoutat pozornost vhodným oživením, ale pozor na přehnané efekty. V jednoduchosti je síla. Stránky by měly mít jednotný vzhled – podklad, písmo, jeho barva, velikost, ovládací prvky. Ocení to i čtenář, pro lepší orientaci na stránkách. První stránka webu by měla být maximálně informativní, čtenář by se měl dozvědět,co na něm najde. Nezbytné je důkladně zkontrolovat správnou funkčnost stránek. To jsou v kostce uvedená pravidla z kapitoly Zásady pro správnou tvorbu stránek od P. Brože (2004). Další doporučení – pravidla dobrého webu jsou popsány v knize od O. Neumajera (2005) jsou zde odkazy na nejdůležitější pravidla a metodiky. Jako jsou: Webové standardy – stránky vytvořené podle určitých pravidel. Použitelnost – návštěvníci se na webu dobře orientují, rychle pochopí jeho uspořádání a ovládání. Přístupnost – použitelnost webových stránek pro všechny uživatele bez rozdílu znalostí a postižení. Optimalizace pro vyhledávače – umístění určité stránky ve vyhledávači co nejvýše. Nástroje pro psaní stránek – způsoby jak stránky (X)HTML vytvořit a publikovat (editory, redakční a publikační systém).


13

Psaní webu – je dobré dodržovat určitá pravidla (typografická pravidla) – využívejte běžně používaná slova, omezte cizí slova a odbornou terminologii, nutná cizí slova a odborné termíny vždy vysvětlete, pište krátké věty a krátké odstavce, strukturujte text pomocí úderných a výstižných nadpisů, mějte neustále na mysli své čtenáře, buďte k nim ohleduplní, buďte struční. Vlastní doména. Nechte se zkritizovat. Testujte – je užitečný úkon, kde dobrovolný uživatel plní zadané úkoly a autor stránek sleduje, jak se ve stránkách orientuje. Na tvorbu WWW stránek nejsou žádná závazná pravidla, jedná se spíše o doporučení, kterápopisuje M. Domes (2008, s. 215)v kapitole Desatero tvorby WWW stránek (některá z doporučení): Úvodní strana – na ní by mělabýt jasná a stručná informace kde se nacházíme (název organizace), navigace, z níž je patrné, jaký je obsah webu, další stručné lákavé slogany a jiné texty, které uživatele zaujmou. Načítání úvodní stránky by mělo býtrychlé. Vzhled webu atypografie textů – na webu se prezentují informace a proto by se obsah neměl podřizovat vzhledu. Ne každá barva se k sobě hodí – nejvhodnější kontrast je černý text na bílém pozadí, nadpisy jsou větší než běžný text a jsou jasně odlišeny od běžného textu, nepoužíváme více než dva druhy písma, odkazy by měly být stejné a smysluplně oddělené od okolního textu (podtržením) a především fungující. Strukturováníinformací – většinu uživatelů Internetu upoutají informace, které na první pohled zaujmou.Proto nepoužíváme dlouhé texty, využíváme odrážkové seznamy, zvýraznění v textu. Snadná orientace – používat standardní navigační nabídku, umístění navigace jasně patrné, navigaci nezdvojujeme (do zápatí stránky), návrat na úvodní stránku, více úrovní navigace (vhodné jsou dvě úrovně), počet odkazů navigace (asi tak do osmi odkazů). Aktuálnost– důležitá je pravidelná aktualizace a kontrola informací, oznámení o aktualizaci, přitáhnout opakovaně uživatele na stránky lze aktualizovanou fotogalerii, novými informacemi, akcemi, blog. Zpětná vazba – ke zpětné vazbě slouží několik prostředků – kontakt na správce (pověřenou osobu) např. v zápatí webu, e-mailový, telefonický a další kontakt, kontrolní formulář, anketa. Slouží k zjištění názoru, nahlášení chyby nebo slouží k dotazu od uživatele. Korektní zobrazení ve více prohlížečích. Přístupný web – web je vstřícný ke všem uživatelům bez ohledu na jejich omezení či specifika.


14

Validní zdrojový kód a styly–to znamená, že při tvorbě webu byla dodržena všechna pravidla (standardy). V praxi to znamená, že web správně funguje a správně se zobrazuje. Jestlibyl dodržen standard daného jazyka, zjistímepomocí online nástrojů tzv. validátory od společnosti W3C. Jak je prozatím patrné, jednotliví autoři knih pro tvorbu webu se v doporučeních (s malými rozdíly) v podstatných bodech shodují. Ještě se pro srovnání podíváme na doporučení od D. Procházky (2011, s. 21). Jak postupovat při plánování projektu WWW stránek (stručný výpis z doporučení): Stanovení cíle svého snažení. Jaké technologie pro realizaci využijeme. Tvorbu nezačínat pouze od vzhledu a od výsledného efektu. Konzultujte vývoj, vzhled a chování webu s osobou, která má v této problematice přehled. Dodržování validity, vhodné je testovat stránky v několika prohlížečích na více počítačích (i s jiným operačním systémem než Windows). Zvážit možnost vytvoření mobilní verze stránek (možnost prohlížet stránky z mobilu, tabletu). Pro propagaci webu je důležité dodržet zásady SEO (optimalizace pro vyhledávače). Doporučení od všech zmiňovaných autorů se velice shodují,i když byla psána v rozmezí šesti let. Z doporučení vyplývá, že kvalitní webová prezentace by měla splňovat určité webové standardy, použitelnost, přístupnost a optimalizaci pro vyhledávače. Nyní podrobněji k těmto pravidlům. 2.1.1

Webové standardy

Při tvorbě webových stránek by se měla dodržovat určitá pravidla neboli specifikace. Tvořením těchto specifikací se zabývá nezisková standardizační organizace W3C (WorldWide Web Consortium). Jedná se o jednu z možností, jak zajistíme, že budou stránky vypadat a fungovat ve všech prohlížečích stejně (Neumajer, 2005). Jestli byl dodržen standard (zda je stránka v pořádku – validní) se dovíme pomocí online nástrojů tzv. validátorů, které poskytuje organizace W3C. Validátor zkontroluje správnost zdrojového kódu a vytvoří hodnocení (bez chyb, nebo s popisem chyb). Nejznámějším validátorem je http://validdator.w3.org . Další možností je manifest Dogma W4 , vytvořený skupinou českých webdesignerů. Jsou to určitá pravidlapro tvorbu jak validního, ale také použitelného a přístupného webu. Nejde o definici obecně závazné normy, jedná se o doporučení – 14 zásad WED.(Manifest Dogma W4, online)


15

Zásady najdeme na stránkách:http://www.pixy.cz/dogma/dogmaw41/cs/#principle s. 2.1.2

Použitelnost

Neboli snadná intuitivní orientace při prohlížení webu. Stránky by měli být pro uživatele přehledné, neměl by na nich bloudit, měl by rychle pochopit jeho uspořádání a ovládání, najít potřebné informace a vědět o čem stránka je co mu může nabídnout. Zásady použitelnosti – jednoduchost, standardní ovládání (běžné na většině webů), nenuťte uživatele přemýšlet. Správně použitelné stránky jsou efektivní stránky. Na to by se mělo pamatovat při návrhu základní struktury. (Neumajer, 2005; Broža, 2004; Použitelnost stránek, 2012) 2.1.3

Přístupnost

Neboli bezbariérovost. Jde o dobře přístupnou webovou prezentaci i pro uživatele s určitým omezením nebo specifikaci (zdravotní omezení – oční vada, tělesné indispozice; používání mobilního zařízení – mobilní telefon, PDA, malý notebook; malé nebo žádné zkušenosti s internetem). Na danou problematiku byly vytvořeny obecné právní normy a zákony. Od roku 2004 máme i v naší republice „Pravidla pro tvorbu přístupného webu“.Při vytváření školních stránek je vhodné se s touto problematikou obeznámit a akceptovat ji. (Neumajer, 2005; Domes, 2008) Pravidla pro tvorbu webu najdeme na stránkách:http://aplikace.mvcr.cz/archiv2008 /micr/scripts/detail.php_id_1588.html. Stručný přehled hlavních oblastí z pravidel přístupnosti (Neumajer, 2005, s. 36): Obsah webových stránek je dostupný a čitelný. Práci s webovou stránkou řídí uživatel. Informace jsou srozumitelné a přehledné. Ovládání webu je jasné a pochopitelné. Odkazy jsou zřetelné a návodné. Kód je technicky způsobilý a strukturovaný. 2.1.4

Optimalizace pro vyhledávání

Neboli SEO (SearchEngineOptimization). Cílem je dostat webovou stránku co nejvýše, tedy na přední místa ve vyhledávači. Co má vliv na (dochází tím k navýšení) zvýšení návštěvnosti, prestiže daného webu. Ne všichni uživatelé mají trpělivost v hledání požadované stránky, když se nachází v dolní části strany čí na dalších stránkách. Dobře přístupné stránky mají velkou pravděpodobnost dostat se ve výsledcích hledání výše. Proto mají vyhledávače rády přístupné stránky. Umístění stránky ve vyhledávači se řídí podle tzv. indexu. Jedná se o


16

program tzv. robot (či pavouk), který skenuje obsah dobře přístupné stránky a uloží do indexu, což je úložiště WWW stránek. Jde o komplexní obor, kde je nutné dodržovat určitá pravidla. V rámci školního webu postačí dodržet především pravidlo validní zdrojový kód – webové standardy. (Neumajer, 2005; Domes, 2008) Základních pravidel pro optimalizaci (SEO) je více např. na stránkách http://www.lepsiweb.cz/tvorba-www/seo/zakladni-pravidla-optimalizace, http://www.webprezent.cz/publikujeme/seo-optimalizace/10-zakladnichpravidel-seo.html. Stručný přehled některých hlavních oblastí z pravidel (Domes, 2008, s. 226): Klíčová slova. Zpětné odkazy na naše stránky. Správná struktura webu. Texty pro WWW stránky – copywriting. Upozornit vyhledávač na naše stránky. V této podkapitole jsem se zabývala obecnými doporučeními, některé z nich budou použity při analýze školní webové prezentace. Ale to až v další části této práce. Nyní se zaměřím nadoporučení pro školní webovou prezentaci.

2.2 Požadavky na školní webovou prezentaci Pěkné náměty a doporučení popisuje ve své knize O. Neumajer (2005, s. 53), která se zabývá problematikou školního webu. 2.2.1

Úvodní stránka školy

Jedná se o nejdůležitější stránku webové prezentace. Také je označována jako hlavní, titulní nebo domácí. Doporučený obsah úvodní stránky (výběr z doporučení): Přesný název a adresu školy. Nejlépe umístit hned do záhlaví. Kontaktní informace. Jestliže škola zveřejňuje více kontaktů (např. telefonní čísla a e-maily zaměstnanců), pak je vhodné tyto informace umístit z titulní stránky odkazem na samostatnou stránku, kde je možné tyto informace získat. Datum poslední aktualizace. Nejlépe u každého příspěvku. U menších webů je i možné pouze jedno datum poslední změny webu. Seznam rubrik nebo jinak řešená navigace. Nástroj, pomocí kterého je možné se po stránkách pohybovat. Nejčastěji se jedná o konzistentní navigaci, která je na všech stránkách na stejném místě.


17

Kontakt na správce webu. Bývá vhodné umístit například odkaz na emailovou adresu správce, kam mohou návštěvníci hlásit případné problémy. Prohlášení o přístupnosti.Kontakt na technického správce a prohlášení jasně vymezující míru přístupnosti webu a jeho částí. Na tuto webovou stránku odkazuje každá stránka webu. Počítadlo přístupů. Pokud chce mít škola přehled o počtu návštěvníků, může tak učinit například prostřednictvím malého počítadla nebo přímo odkazem na on-line statistiku přístupů. Nedoporučený obsah úvodní stránky(výběr z obsahu): Aktuální datum a čas. Každý uživatel, který potřebuje informaci o čase, ji má ve svém operačním systému. Animace. Web by měl být živý svým obsahem, nikoliv blikajícími prvky. Velké obrázky. Pokud je na web potřeba umístit nějaký obrázek, například fotografii, je nejlepší vložit menší náhled, který se rychle načítá. Teprve v případě, že o něj návštěvník projeví zájem a klepne na něj, otevře se obrázek ve skutečné velikosti. Reklama. Na okolních stránkách by se skutečně reklama objevovat neměla. Informace o sponzorování školy může být vhodně začleněna do textu v příslušné rubrice i s odkazem na web sponzora. 2.2.2

Další stránky školy

Stručný přehled obsahu informací, které se mohou nacházet na webové prezentaci (výběr z přehledu): Informace o škole

Školní jídelna

Propagační materiály

Rozpis zvonění

Školní řád a klima ve škole

Dokázali jsme

Školní dokumenty

Školní časopis

Veřejné zakázky

Fotogalerie

Seznam tříd

Odkazy na výukové stránky

Seznam zaměstnanců Studentské práce Studijní materiály Školní projekty Historie školy

Kalendárium

Školní informační systém na webu E-learning Diskuzní fóra


2.2.3

18

Náležitosti webové prezentace

Náležitosti webové prezentace školy můžeme zjistit pomocí autoevaluace webu na základě daných hodnotících kritérií, které najdeme na webové stránce Ondřeje Neumajera, http://ondrej.neumajer.cz/skolniweb/aea/, který je i autorem daného autoevaluačního asistenta. Můžeme využít online aplikaci, služby autoevaluačního asistenta jsou k dispozici zdarma. Hodnotící kritéria testu jsouvytvořena tak, aby byla inspirací a zároveň poukazovala na vlastnosti kvalitního školního webu. Předmětem hodnocení je obsah a provedení školních stránek a zároveň nastavení procesu, které zajistí funkčnost webu a platnost podávaných informací. Samotný test se skládá z pěti hlavních oblastí, které jsou děleny do konkrétně očíslovaných hodnotících kritérií. Za každé prošlé kritérium je možné získat maximálně pět a minimálně nula bodů. V páté oblasti lze získat bodové bonusy nebo penalizace. Celkový součet bodů poukáže na úroveň kvality webové prezentace školy.

2.3 Požadavky na technologické řešení prezentace Jedná se o samotnou problematiku vytváření webových stránek. Tedy o tvorbu obsahu a vzhledu webu. Při stavbě stránek používáme daného jazyka. Používáme jazyk značkovací, stylovací a skriptovací.Mezi základní technologie patří: HTML, XHTML, CSS, JavaScript, PHP, MySQL. 2.3.1

HTML

HyperTextMarkupLanguage (HTML) – hypertextový značkovací jazyk (hypertext → odkaz). Jazyk se skládá ze značek (tzv. tagů) a jejich atributů. Značek je mnoho a vždy se zapisují do špičatých závorek. Příklad použití značky:
text v odstavci
. Jazyk umožňuje zobrazení textového a obrazového obsahu stránek a propojit jednotlivé stránky mezi sebou pomocí tzv. odkazů. (Domes, 2008) 2.3.2

XHTML

Extensible Hypertext MarkupLanguage – rozšiřitelný hypertextový značkovací jazyk. Jazyk vycházející z HTML a přísnějšíchpravidel jazyka XML (ExtensibleMarkupLanguage – rozšiřitelný značkovací jazyk) vyvinutý organizaci W3C. Jazyk je možné použít pouze k dodání smyslu (významu) částem webové stránky, nikoli k určení jejich vzhledu. V současné době se pro tvorbu stránek používá spíše tento jazyk. (Domes, 2008) 2.3.3

CSS

Cascading Style Sheets – šablony kaskádových stylů (kaskádové styly). Jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML,


19

XHTML.Jazyk umožňuje oddělit vzhled webové stránky od jejího významu (struktury a obsahu). Jde o velkou výhodu při úpravě vzhledu webové stránky.Jazyk CSS navržen organizací W3C. (Procházka, 2011, Domes, 2009) 2.3.4

JavaScript

Jedná se o multiplatformní, objektově orientovaný skriptovací jazyk. Používá se zpravidla jako programovací jazyk pro webové stránky, vkládaný často přímo do HTML kódu stránky. Pomocí tohoto jazyka můžeme vytvořit různédynamické prvky (tlačítka, textová políčka, formuláře) nebo animace a efekty obrázků. Ke spouštění programu dochází obvykle, až po stažení webové stránky z Internetu (na straně uživatele) Novější variantou tohoto programu je tzv. AJAX. JavaScript lze svou skladbou nejlépe přirovnat k PHP.(Procházka 2011;Wikipedie, 2012) 2.3.5

PHP

PersonalHomePage (původně) nyní Hypertext Preprocessor (rekurzivně) – hypertextový procesor, skriptovací programovací jazyk. Používá se především pro programování dynamických webových stránek a webových aplikací, vkládaných přímo do struktury jazyka HTML, XHTML. Ke spuštění programu dochází na straně serveru, ještě před stažením z Internetu. To znamená, že k uživateli pošle pouze výsledek své činnosti. PHP je (spolu s ASP) jedním z nejpoužívanějších skriptovacích jazyků pro web. (Procházka 2011; Struška, 2010; Wikipedie,2012) 2.3.6

MySQL

Jedná se o multiplatformní databázi. Ke komunikaci se používá jazyk SQL – StructuredQueryLanguage (strukturovaný dotazovací jazyk). V současné době jde o nejpoužívanější databázový systém na světě.Je využívána při programování dynamických webových stránek. Databáze MySQl je součástí základního balíčku pro tvorbu webových stránek (PHP/Perl/Python, MySQL, Apache). (Procházka 2011;Wikipedie,2012)

2.4 Tvorba webových stránek Základním prostředkem pro vytváření webových stránek je editor HTML. Jde o programy, které můžeme rozdělit do dvou skupin: WYSIWYG editory, strukturní editory. (Procházka, 2011) 2.4.1

WYSIWYG editory

WhatYouSee IS WhatYouGet – co vidíš, to dostaneš. Editory slouží ke grafickému návrhu webových stránek. Fungují v grafickém módu, který umožňuje rychlou tvorbu webových stránek, bez znalosti jazyka HTML a CSS. Stránky se tvoří výběrem a stavěním prvků v grafickém rozhraní. Při tvoření stránky


20

okamžitě vidíme, jak bude daná webová stránka vypadat. (Domes, 2008, Procházka 2011) 2.4.2

Strukturní editory

Jedná se o textové editory, do kterých zapisujeme kód. Editory obsahují funkce, které tvorbu kódu usnadňují a automatizují. Konečný výsledek zapsaných kódů se zkontroluje v internetovém prohlížeči. (Domes, 2008)

2.5 Systém pro správu obsahu Neboli CMS (content management system). Je jednou z možností tvorby webové stránky známé také jako redakční a publikační systémy. Redakční systém je aplikaceumožňující kompletní správu obsahu webu. Jde o ideálním řešení pro uživatele, který si chce spravovat čí vytvářet webové stránky sám. Uživatel se přihlásí do administrace a může měnit obsah webu (doplňovat ho či mazat), nepotřebuje znalosti jazyka HTML. S webem se pracuje efektivněji a bez zásahů do jejich kódu. (Kudláček 2010) Velká část CMS je vytvořena ve skriptovacím jazyce PHP a používá MySQL databázi pro ukládání dat a prací. Využívá WYSIWYG editoru. Existuje mnoho CMS programů. (Kudláček 2010, Horňáková 2011). Mezi známé a kladně hodnocené systémy dle statistiky oblíbenostize stránek Google Trends(viz graf 3)patří aplikace WordPress na druhém místě Joomla a třetí Drupal. (C4 návody,2012)

WordPress

Joomla

Zdroj obrázků – C4 návody, 2012

Drupal


wordpress joomla drupal Graf 3 – Pořadí aplikací v České republice pomocí služby Google Trends Zdroj – Google Trends, 2012

21

Analýza webové prezentace

22

3 Analýza webové prezentace Předmětem hodnocení bude obsah webových stránek, struktura a validita webu.

3.1 Autoevaluace webu Pro zhodnocení obsahu a provedení školních stránek využiji on-line aplikaci tzv. autoevaluačního asistenta, autorem je Ondrej Neumajer. Webová stránka aplikace: http://ondrej.neumajer.cz/skolniweb/aea/online/index.php?pg=step0 Na stránce se otevřeokno s informacemi o postupu hodnocení viz obrázek 1. Hodnotící kritéria, kterými postupně buduprocházet jsou interpretována níže, pod obrázkem.

Obrázek 1 – Náležitosti školního webu – autoevaluační asistent

3.1.1

Obsah a poskytované Informace

Kontaktní informace na titulní stránce Domovská stránka obsahuje přesný název a celou adresu školy, aktuální kontaktní email a telefon (nebo odkaz na podstránku s kon-


23

takty), IČ organizace a případně i RED_IZO (resortní identifikátor právnické osoby dle rejstříku škol). (5 nebo 4 body) Informace na domovské stránce umožňují jednoznačně školu identifikovat a kontaktovat vedení školy. (3 nebo 2 body) Kontaktní informace na titulní stránce chybějí nebo nejsou úplné. (1 – 0 bodů) Představení školy Jednou z prvních dostupných informací školního webu je stručné představení školy obsahující informace o počtu žáků a tříd, informace o zaměření školy, studijních oborech, historii školy a představení vedení školy.(5 nebo 4 body) Škola se představuje formou dlouhých textů nacházejících se fragmentovitě v celé struktuře školního webu.(3 nebo 2 body) Škola o sobě bližší informace nezveřejňuje nebo pouze útržkovitě. (1 nebo 0 bodů) Školní vzdělávací program Škola zpřístupňuje na webu plný obsah svého školního vzdělávacího programu (dle školského zákona 561/2004 Sb.) i s komentářem pro rodiče. Jedná se zejména o výchovné a vzdělávací strategie, učební plány, učební osnovy, pravidla pro hodnocení žáků atp. (5 nebo 4 body) Škola zveřejňuje školní vzdělávací program ve zkrácené formě. Program není pro laickou veřejnost nijak komentován. (3 nebo 2 body) Školní vzdělávací program není součástí školního webu nebo jsou použity pouze krátké úryvky. (1 nebo 0 bodů) Důležité termíny školního roku, plán akcí Důležité termíny školního roku a školní akce jsou řazeny chronologicky a je možné jimi interaktivně procházet a dozvídat se o nich bližší informace. (5 nebo 4 body) Důležité termíny a školní akce jsou zveřejněny formou statického seznamu.(3 nebo 2 body) Organizaci školního roku s termíny škola dostatečně dopředu nezveřejňuje. (1 nebo 0 bodů) Výsledky hodnocení školy Výsledky hodnocení výchovněvzdělávacího procesu školy jsou součástí webu. Jedná se zejména o inspekční zprávy České školní inspekce a dále o výsledky testování (např. Scio, Kalibro, PISA, PIRLS), autoevaluaci školy nebo výsledky žáků v přijímacím řízení na vyšší stupeň školy. (5 nebo 4 body)


24

Inspekční zprávy nejsou přímou součástí webu, odkaz ale směruje na zveřejněnou inspekční zprávu na webu ČŠI. Při zveřejňování hodnocení školy jsou využity pouze fragmenty získaných výsledků, nikoli kompletní hodnocení. (3 nebo 2 body) O inspekční činnosti ČŠI se web nezmiňuje, jiné hodnocení chybí nebo obsahuje pouze obecné neověřitelné informace. (1 nebo 0 bodů) Žákovské a studentské práce Stránky jsou obohaceny o výstupy z žákovských projektů a prací. Na webu jsou texty, obrázky, grafika, hudba a video, které vytvořili žáci v rámci vyučování. Součástí webu je on-line podoba dětmi vydávaného školního časopisu. (5 nebo 4 body) Stránky obsahují několik ukázek prací žáků. Na webu je zmínka o vydávání školního časopisu. (3 nebo 2 body) Stránky nejsou obohaceny o studentské práce. (1 nebo 0 bodů) Fotografie Fotografie ze života školy jsou vhodně využívány jako doprovodný materiál podporující hlavní sdělení příslušné části webu. Fotografie web oživují, nezabírají zbytečně moc místa. (5 nebo 4 body) Fotografie jsou v některých částech webu použity, ale nebyly pořízeny přímo ve škole. (3 nebo 2 body) Školní web fotografie neobsahuje nebo jsou používány nevhodným způsobem (příliš velké nebo naopak příliš malé rozlišení, velký objem dat). (1 nebo 0 bodů) Komunikace, interaktivita a zpětná vazba Web zprostředkovává komunikaci s učiteli zveřejněním jejich školních emailových adres, případně dalších komunikačních prostředků (ICQ, Skype atp.). Součástí webu jsou i formuláře pro komunikaci se školou (např. návštěvní kniha, kniha přání a stížností určená vedení školy, odhlašování obědů atp.). Návštěvníci mohou vyjádřit názor vhodnou formou (např. hlasování v anketách, diskusní fórum). (5 nebo 4 body) Ze školy je možné elektronicky komunikovat pouze s vybranými pracovníky (vedoucí předmětových komisí, třídní učitelé, vedení školy). Vyjádřit názor elektronickou formou (např. hlasování v anketách, diskusní fórum) mohou návštěvníci pouze omezeně (např. po registraci). (3 nebo 2 body) Komunikace s pracovníky školy není možná elektronickými prostředky. Stránky neumožňují návštěvníkům komunikovat, reagovat a zanechat své názory. (1 nebo 0 bodů)


25

Přihlášení k odběru informací Zájemci mají možnost přihlásit se k odběru novinek, důležitých upozornění, školního bulletinu nebo časopisu formou rozesílky elektronickou poštou nebo kanálu RSS (tzv. syndikace obsahu). Na webu je popsán způsob přihlášení i odhlášení. (5 nebo 4 body) Určitý druh informací je rozesílán elektronickou poštou nebo distribuován kanálem RSS. Stát se příjemcem mohou pouze předem určené skupiny (např. rodiče) a přihlásit se není možné prostřednictvím webu (ale např. na rodičovských schůzkách). (3 nebo 2 body) Žádná pravidelná elektronická komunikace se zájemci není realizována. (1 nebo 0 bodů) 3.1.2

Publikování na internetu

Publikování obsahu Publikovat informace na webu může ředitelem školy schválený seznam osob. Každý schválený uživatel vlastní přístup (jméno a heslo) a může publikovat pouze v té části webu, do které má přístup. Jsou nastaveny procesy kontrolující nový obsah před zveřejněním (např. z důvodů kontroly pravopisu). (5 nebo 4 body) Publikovat nové informace je možné pouze prostřednictvím správce webových stránek (webmastera), kterému musejí být nové příspěvky zasílány. (3 nebo 2 body) Proces publikování je v rukou jedné osoby, která sama vytváří obsah i vzhled. (1 nebo 0 bodů) Redakční rada Redakční rada má hierarchické uspořádání, jsou vyjasněny kompetence a zodpovědnost jednotlivých členů. Počet členů odpovídá velikosti a druhu školy. Členy redakční rady jsou kromě učitelů také studenti, rodiče. (5 nebo 4 body) Redakční rada je malá skupinka osob, která sama koordinovaně vytváří obsah webových stránek. (3 nebo 2 body) Obsah stránek je dílem jedné osoby. (1 nebo 0 bodů) Aktualizace a zařazování novinek Změny webu probíhají zpravidla několikrát týdně, datum poslední aktualizace je zřejmý. Novinky jsou zřetelně označeny a je znám datum jejich zveřejnění. (5 nebo 4 body) Aktualizace webu probíhá přibližně jednou za čtrnáct dní, z webu je zřejmé, které události jsou právě ve škole aktuální. (3 nebo 2 body)


26

Web je aktualizován sporadicky, většinou pouze na začátku školního roku. Aktuálnímu dění ve škole se web nevěnuje. (1 nebo 0 bodů) Frekvence revizí a validita informací Všechny stránky webu jsou pravidelně, minimálně čtvrtletně procházeny a kontrolovány na přítomnost zastaralých informací. (5 nebo 4body) Stránky jsou kontrolovány tak, aby nedocházelo k zobrazování zastaralých informací jednou za pololetí. (3 nebo 2 body) Kontrola validity všech informací probíhá jednou ročně. (1 nebo 0 bodů) 3.1.3

Webdesign

Použitelnost Návštěvníci se na webu dobře orientují, rychle pochopí jeho uspořádání a ovládání. Všechny stránky používají konzistentní navigaci. Grafické zpracování je adekvátní školnímu zaměření. (5 nebo 4 body) Některé stránky webu vybočují ze společného designu, používají rozdílnou navigaci. (3 nebo 2 body) Procházení webu není intuitivní, vyžaduje přemýšlení a nezvyklé ovládání. Struktura navigace není vyvážená. (1 nebo 0 bodů) Přístupnost Obsah stránek je dostupný a čitelný, informace jsou srozumitelné a přehledné. Stránky jsou vytvářeny v souladu s webovými standardy (W3C, WCAG, Pravidla přístupného webu dle bývalého MIČR). (5 nebo 4 body) Stránky jsou pro běžného uživatele dostupné, někteří uživatelé se specifickými potřebami (dyslektici, slabozrací, barvoslepí, nevidomí) nebo neobvyklým vybavením (starší počítače, minoritní operační systémy či prohlížeče) mohou mít s přístupem k obsahu stránek problémy. (3 nebo 2 body) Stránky se v některých prohlížečích (Opera, MozillaFirefox, Internet Explorer) zobrazují nekorektně, některé texty nebo navigace není vůbec nebo obtížně čitelná. (1 nebo 0 bodů) 3.1.4

Bezpečnost a legislativa

Bezpečnost Školní web neobsahuje citlivé údaje o žácích (RČ, datum narození, adresu bydliště), u portrétových fotografií nejsou uvedena jména dětí, fotografie nejsou choulostivé. Ke zveřejnění fotografií žáků má


27

škola souhlas zákonných zástupců. Odkazy nesměrují na nevhodné stránky (rasisticky, násilně, sexuálně laděné). (5 nebo 4 body) Stránky neobsahují citlivé údaje, zveřejněné informace o žácích nemohou vést k jejich jednoznačné identifikaci. U některých fotografií žáků jsou uvedena jména. (3 nebo 2 body) Škola zveřejňuje informace umožňující jednoznačnou identifikaci konkrétních žáků. Některé živé fotografie zachycují žáky v choulostivých situacích (např. svlečené při plavání). Na stránkách se zobrazuje reklama, která může vést na problematické stránky. (1 nebo 0 bodů) Autorské právo Všechny publikované texty i další multimediální prvky jsou dílem autorů webů. U částí od jiných autorů je pořízen souhlas ke zveřejnění a uveden zdroj. Na webu se nevyskytují prvky (např. fotografie nebo hudba), které by byly cizím autorským dílem a autor k jejich užití nedal souhlas. (5 nebo 4 body) Web využívá některé prvky, u kterých není znám autor (např. cliparty) a lze se domnívat, že jsou uvolněny pro veřejné užití. (3 nebo 2 body) Web obsahuje prvky, u nichž nejsou známy licenční podmínky užití. (1 nebo 0 bodů) Svobodný přístup k informacím Škola zveřejňuje všechny informace požadované zákonem č. 106/1999 Sb. v aktuálním znění. Odpovědi na dotazy dle tohoto zákona jsou zveřejněny na webu. Adresa elektronické podatelny je zřejmá. Informace jsou přístupné ve volně dostupném formátu, např. (X)HTML nebo OpenDocument. (5 nebo 4 body) Adresa elektronické podatelny není uvedena. Některé dokumenty dle zákona č. 106/1999 Sb. nejsou součástí webu. (3 nebo 2 body) Dokumenty jsou zveřejněny v proprietárních komerčních formátech (např. DOC). Školní web neřeší problematiku zákona č. 106/1999 Sb. (1 nebo 0 bodů) 3.1.5

Bonus a penalizace

Nefunkční odkazy Web obsahuje nefunkční odkazy (interní nebo externí). (- 5 bodů) Nedokončené stránky Součástí webu jsou nedokončené stránky ve výstavbě. (- 5 bodů) Indexace ve vyhledávačích


28

Web je indexován ve fulltextových vyhledávačích (např. Google, Jyxo) a katalogových službách (např. Seznam, Centrum, Atlas) tak, že na klíčová slova vztahující se ke škole je zobrazen v první pětici výsledků. (+ 5 bodů) Přístup do informačního systému Studenti či jejich zákonní zástupci mají možnost přistupovat vzdáleně pod přihlašovacím jménem a heslem do informačního systému školy (obsahujícího např. klasifikaci, suplování atp.). (+ 5 bodů) Doména Stránky jsou umístěny na vlastní doméně druhého řádu (např. naseskola.cz). Adresa stránek (tzv. URL) je intuitivní a snadno zapamatovatelná. (+ 3 body) Reklama Stránky obsahují reklamu nebo odkazy na produkty nesouvisející se vzděláváním. (- 3 body) Rušivé elementy Stránky obsahují rušivé elementy odvádějící pozornost čtenáře od obsahu sdělení, např. nadbytečné animace, blikající či rotující text, vyskakovací okna (tzv. pop-up) nebo nadbytečné odkazy od tématu směřující mimo problematiku školství. (- 3 body) Regionální pospolitost Web je zasazen do místního kontextu, propojen s regionem a lokální komunitou. Obsahuje odkazy na zřizovatele, obec, místní přírodní či kulturní zajímavosti atp. (+ 3 body) E-learning Škola nabízí na svých stránkách studijní materiály, případně celé vzdělávací kurzy pro školní i mimoškolní zájemce. (+ 3 body) Cizojazyčná verze Stránky nabízejí cizí jazykovou mutaci nebo je pro cizojazyčné návštěvníky připraveno stručnější představení školy. (+ 3 body) Modulární systém Způsob vytváření webu (typicky redakční systém) umožňuje jednoduše přidávat a odebírat funkcionality (např. modul anketa, kalendář, odkazovník). (+ 3 body) 3.1.6

Hodnocení

Hlavní čtyři oblasti jsou rozděleny do hodnotících podoblastí, každá podoblast má na výběr ze tří hodnotících kritérií bodově ohodnocených (jednotlivé odrážky). V poslední oblasti se mohou získat nebo ztratit body.


29

Hodnotící kritéria podle bodů poukazují na kvalitu webové prezentace: Příkladný školní web (5 nebo 4 body). Užitečný školní web (3 nebo 2 body). Školní web k dopracování (1 nebo 0 bodů). Oblasti hodnotících kritérií zobrazujících v okně on-line aplikaci autoevaluačního asistenta viz obrázek 2.

Obrázek 2 – Oblasti hodnotících kritérii

Celkové hodnocení Webové stránky školy z autoevaluačního asistenta vyšly jakoužitečný školní web s celkovým počtem 67 bodů. Z celkové hodnotící škály se školní web umístil ve středu konečných hodnotících kritérii. Není to špatný výsledek, ale je na daných webových stránkách co zlepšovat. Celková hodnotící kritéria školních webů: Do 30 bodů – Vybudujme nový školní web. 30 – 49 bodů – Školní web k přepracování 50 – 69 bodů – Užitečný školní web. 70 – 89 bodů – Dobrý školní web. 90 – 115 bodů – Kandidát na ocenění.


30

V okně výsledku on-line aplikaceautoevaluačního asistenta, kromě celkového počtu získaných bodů máme i slovní hodnocení a vypsané silné a slabé webové stránky školy viz obrázek 3.

Obrázek 3 – Výsledky autoevaluace webových stránek

V rámci inovace školního webu se zaměřím nejen na slabé stránky školy, na které poukázaly hodnotící kritéria, ale i na stránky, které byly ohodnoceny jako užitečné. Půjde o následující změnu obsahu: V oblasti obsah a poskytované informace – upřesnění a doplnění kontaktních informací, informace o škole o školním vzdělávacím programu. V oblasti publikování – informace o plánu akcí. V oblasti Webdesignu se zaměřím na přístupnost – webové standardy (blíže v kapitole 3.3) a použitelnost – struktura webu (blíže v kapitole 3.2).

3.2 Struktura webu Rozvržení obsahu stránek (neboli layout) může mít různou podobu. Jde o rozložení daného webu v okně internetového prohlížeče. Layout může být jednosloupcový, dvousloupcový, třísloupcový i čtyřsloupcový. (Procházka 2011)


31

Ale základem je intuitivní a srozumitelná navigace (odkazy na další WWW stránky webu). Jednotlivé odkazy vyjadřují obsah WWW stránky. Jednotlivé WWW stránky jsou řazeny hierarchicky, tvoří tzv. stromovou strukturu. Navigační odkazy jsou umístěny stabilně na jednom místě a jsou odděleny v samostatném bloku, odděleny od textového obsahu dané WWW stránky. (Beaird 2010; Procházka 2011) Rozložení obsahu stránek u analyzované školní webové prezentace má podobu jednosloupcového layoutu.Základní rozvržení stránky se skládá z hlavičky a z vodorovné navigační nabídky (záhlaví), ze samotného obsahu a z patičky (zápatí) viz obrázek 4 a 5.

Obrázek 4 – Layout stránek – náčrt

Obrázek 5 – Rozložení obsahu stránek


32

V rámci inovace se zaměříme na strukturu jednotlivých odkazů vyjadřujících obsah WWW stránek. Jednosloupcový layout vyhovuje, daná navigace je intuitivní a srozumitelná, není potřeba tuto strukturu webu měnit. Co vyplývá i z ankety pro učitele dané školy, kde na dotaz: Použitelnost webu návštěvníky, většina odpověděla z možných tří variant, variantu – Dobrá orientace (rychle pochopí jeho uspořádání a ovládání) viz graf 4. Varianty odpovědí a procentové vyjádření odpovědí: Dobrá orientace (rychle pochopí jeho uspořádání a ovládání). Celkem 89% Částečně dobrá orientace (vyžaduje delší pochopení k jeho uspořádání a ovládání). Celkem 11% Procházení webu není intuitivní (vyžaduje přemýšlení a nezvyklé ovládání). Celkem 0%

Graf 4 – Použitelnost školního webu (anketa mezi pedagogy školy)

3.3 Webové standardy Webové stránky, které nefungují, uživatele odrazují od dalšího používání. Při tvorbě webových stránek by se měla dodržovat určitá pravidla neboli specifika (blíže v kapitole 2.1.1). Pro zjištění, zda jsou stránky školní webové prezentace validní, využiji on-line testování pomoci nástroje tzv. validátor. Nejznámější validátor poskytuje organizace W3C. Webová stránka validátoru:http://validator.w3.org/ Validátor je program, který projde celou stránku a zkontroluje strukturu dokumentu a všechny tagy, zda jsou použity v souladu se standardy. Validátor si obsah stránek načte a zkontroluje. Následně zobrazí výsledek validace s informací o bezchybném výsledku kontroly (dokument je validní), nebo se objeví chybové hlášení s uvedením počtu chyb – odchylek proti standardu. Validace je


33

pak oprava chyb. Standardizovanou verzí jazyka HTML, které jsou podporovány prohlížeči Internet Explorer, Mozilla, Opera aj. je HTML 4.01, XHTML 1.0. U analyzovaného školního webu validátor zobrazil, jak prohlášení o správnosti zdrojového kódu viz obrázek 6, tak i prohlášení kde ve zdrojovém kódu je chyba oproti standardům viz obrázek 7.

Obrázek 6 – Validace dokumentu bez chyby

Obrázek 7 – Validace dokumentu s chybou

V rámci inovace se zaměřím na odstranění chyb ve zdrojovém kódu stránek. I když prohlížeč dané stránky zobrazí, může větší množství chyb zvýšit riziko nekompatibilního chování, špatné zobrazování stránek v některém prohlížeči. Provádět kontrolu dodržování webových standardů je důležité také v souvislosti se SEO (viz kapitola 2.1.4). Stránky s validním zdrojovým kódem mají větší pravděpodobnost dostat se ve vyhledávačích výše.


34

Analyzovaná webová školní prezentace v on-line aplikaci tzv. autoevaluačního asistenta (viz kapitola 3.1.5) získala body za hodnotící kritérium – Indexace ve vyhledávačích. Ve vyhledávačích se vyskytuje na předních místech.

Inovace a Implementace webu

35

4 Inovace a Implementace webu Vizitkou kvalitní webové prezentace školy jsou uživatelé. Uživatelna webové stránky nahlíží z více hledisek. Kromě vzhledu webových stránek, který má(představuje) čistě estetické hledisko – je pozitivním doprovodným prvkem při získávání potřebných informací. Uživatelepředevším zajímá aktuální, živý, potřebnýobsah a snadná použitelnost – přehledný navigační přístup k danému obsahu.Držme se pravidla „v jednoduchosti je síla“. Inovace webové prezentace školy bude vycházet z provedené analýzy daného webu. Inovace je zaměřena na obsah stránek a úpravu struktury navigace obsahu. Konkrétní úprava obsahu byla vždy zmíněna v rámci daných oblastí analyzovaných webových stránek v průběhu celé kapitoly 3 – Analýza webové prezentace.

4.1 Určení webové prezentace Jednou zpodstatnýchotázek při plánování – inovaci webové prezentace školy je, pro koho je daný web určen? Jedná se o školu, která sdružuje více zařízení. Zaměření webové prezentace školy je určeno – veřejnosti, rodičům, žákům a studentům, budoucím uchazečům. Webová prezentace školy, na základě implementace inovovaného obsahu a struktury odkazunavigace, by se měla více otevřítkomunikace školy s okolím. Především by se měla implementace inovovaného obsahu školního webu více přiblížit rodičům a žákům, aby se stal součástí informačního systémuškolního dění.

4.2 Navigace webové prezentace U webové prezentace školy sezaměřím na úpravu strukturypojmenování odkazů navigace. Analyzovaná struktura odkazů navigace webových stránek školy je přehledná, intuitivní (uživatel rychle pochopí jeho uspořádání a ovládání), alepřesně nedefinuje jednotlivá zařízení, která škola sdružuje. Jedná se o strukturu 1. úrovně navigace stránek.Jednotlivá zařízení budou pod vlastním odkazem navigace (Základní škola, Praktická škola, Jídelna, atd.) Dále by bylo vhodné rozšířit jednotlivé odkazy navigace tzv. struktura 2. úrovně navigace stránek, upřesnění obsahu jednotlivých stránek webu. Strukturu původníchanalyzovaných webových stránek školy prezentuje obrázek 8. Navržená inovace struktury navigace webových stránek školy je prezentovaná na obrázku 9.


36

Obrázek 8 – Struktura analyzované webové prezentace školy

Obrázek 9 – Struktura příkladu inovované webové prezentace školy

4.3 Obsah stránek webové prezentace U webové prezentace školy se v rámci inovace obsahu zaměřím nejen na slabé stránky školy, na které poukázaly hodnotící kritéria (viz kapitola 3.1.6), ale i na stránky, které byly ohodnoceny jako užitečné. Jedná se o obsah stránek, který bude zachován i v inovované webové prezentaci školy. Půjde o následující úpravu obsahu stránek:


37

upřesnění a doplnění kontaktních informací v odkaze navigace kontakty (1. úroveň), upřesnění všeobecných informací o škole v odkaze navigace o škole (1. úroveň), doplnění informací o školním vzdělávacím programu v odkaze navigace dokumenty (2. úroveň), informace o plánu akcí – aktuální informace v odkaze navigace úvod (1. úroveň), jedná se o tzv. domovskou stránku, jde o jednu z nově vytvořených stránek ve školní webové prezentaci. Nově vytvořené stránky jednotlivých úrovní struktury a jejich obsahu, podle navrhované inovace webové prezentace a následné implementace je znázorněno v obrázku 9 (viz kapitola 4.2). Inovovaná webová prezentace školy obsahuje také původní stránky webové prezentace. Strukturální umístění některých původních webovýchstránek bylo změněno. Pro vzájemné porovnání obsahu původní webové prezentace a inovované webové prezentace školy je přehledně znázorněno na obrázcích 8 a 9 (viz kapitola 4.2).

4.4 Nástroj publikování webové prezentace Škola využívá pro vytváření webových stránek technologie redakčního systémuWordPress (viz kapitola 2.5).Daný redakční systém byl implementován odborníkem na dané technologie. V rámci publikování v daném redakčním systému jsou některá omezemí. WordPress je vyvíjen jako svobodný open source systém, je tedy nejen zdarma, je i otevřen dalším vývojářům, kteří se podílejí na jeho vývoji. Redakční systém se neustále vyvíjí a tím přináší nové funkce, které se dají ve webové prezentaci využít. Původně byl WordPress systém pro vytváření blogů.V současné době se již používá jako osobní, firemní či školní prezentace, malá sociální síť i jako elektronický obchod. (Horňáková, 2011) Ovládání WordPressu je přehledné a intuitivní je také v českém jazyce. Některé ukázky z administrace WordPressu můžete vidět na obrázku 10 – 13.


Obrázek 10 – Přihlašovací oknoWordPressu (redakční systém školy)

Obrázek 11 – Úvodní okno administrace WordPressu (redakční systém školy)

Obrázek 12 – Vizuální editor WordPressu (redakční systém školy)

38


39

Obrázek 13 – HTML editor WordPressu (redakční systém školy)

Publikování v redakčním systému zajišťuje administrátor (pověřený pedagog školy) webových stránek, kterému jsou zasílány pověřenou skupinou pedagogů nové příspěvky. Pověřený pedagog pravidelně aktualizuje obsah webových stránek. Webová prezentace školy má vhodně zvolenou doménu 2. řádu, adresou webu je název ulice, kde se škola nachází. Daná adresa se žákům a rodičům dobře pamatuje. Prostor na Internetu, pro prezentaci školního webu, je zajištěn pomoci webhostingu.

Závěr, Zhodnocení webové prezentace

40

5 Zhodnocení webové prezentace Závěrečná práce byla zaměřena na inovaci a následnou implementaci webové prezentace školy, která sdružuje více zařízení. Jednotlivé kapitoly závěrečné práce popisují postup k dosažení stanoveného cíle. Jak poukazuji v úvodu, kvalitní internetové stránky ovlivňují nejenom širokou veřejnost, ale především současné rodiče a žáky i potencionální rodiče budoucích žáků. Web školy by měl být přehledný, čtenář by se v něm neměl ztratit, aby zde našel to, co hledá a co ho zajímá. Funkční webová prezentace školy může plnit více cílů. Může být nejen dobrým způsobem jak prezentovat svoji vzdělávací a výchovnou činnost, ale i prostředkem komunikace školy s okolím. Inovací dané školní webové prezentace se především docílilo otevření komunikace s rodiči, žáky a studenty. Začínají postupně využívat moderních informačních technologií – školní webovou prezentaci jako další možnost informačního systému školy. Kde nacházejí potřebné informace o vzdělávacím a výchovném procesu v zařízeních, které sdružuje daná škola.Inovovaná webová školní prezentace se také více přiblížila pedagogům školy, kteří zde nacházejí potřebné informace a někteří se podílejí na aktualizaci obsahu webových stránek, zasíláním příspěvků. Školní webová prezentace bude dále postupně procházet procesem inovace. Možnosti inovace jsou závislé od možností (omezení) používaného redakčního systému. Jednou z plánovaných inovací je využití modulu webové aplikace nejrozšířenějšího informačního systému Bakaláři používaného k vedení evidence ve školách, který používá i daná škola. Aplikace přináší rodičům informace o klasifikaci, docházce žáků, rozvrh žáka, akce školy, apod. Umožňuje lepší komunikaci mezi vedením školy, učiteli, žáky, studenty a jejich rodiči. Ke vstupu do dané aplikace – k požadovaným informacím se budou přihlašovat jednotliví žáci, studenti a rodiče prostřednictvím přihlašovacího jména a hesla. (Bakaláři, online) Tato závěrečná práce, kterou jsem se zaměřila na inovaci školní webové prezentace mi poskytla mnoho nových informací a dovedností, které jsem popisovala a využívala k realizaci inovace a následné implementaci školní webové prezentace. Jednotlivékapitoly závěrečné práce, počínaje teoretickými doporučeními dále samotnou analýzou webové prezentace a následnou inovací a implementací mi dalo mnoho nových zkušeností. Tato práce může být inspirací k možnosti inovace školníprezentace, využití teoretických informací či aplikací pro analýzu webové prezentace.

Literatura

41

6 Literatura a odkazy Archiv stránek bývalého Ministerstva informatiky.: Best practice – Pravidla pro tvorbu přístupného webu. [online]. [cit. 2012-08-25]. Dostupné z:http://aplikace.mvcr.cz/archiv2008/micr/scripts/detail.php_id_1588.htm l Bakaláři.: Programy pro školní administrativu. [online]. [cit. 2012-09-10]. Dostupné z: http://www.bakalari.cz/webapp.aspx BEAIRD, Jason. Principy krásného webdesignu: průvodce krok za krokem. 1. vyd. Překlad Martin Domes. Praha: Grada, 2010, 145 s. 333 tipů a triků. ISBN 978-80-247-2895-7. BROŽA, Petr. Tvorba www stránek pro úplné začátečníky. Vyd. 1. Praha: Grada, 2001, 149 s. ISBN 80-722-6423-0. BROŽA, Petr. Vytváříme WWW stránky. Vyd. 1. Brno: ComputerPress, 2004, 88 s. Jak na počítač. ISBN 80-251-0475-3. CEDERHOLM, Dan. Flexibilní webdesign: vytváříme přizpůsobitelné a přístupné stránky pomocí XHTML a CSS. Vyd. 1. Překlad Martin Domes. Brno: ComputerPress, 2006, 227 s. ISBN 80-251-1018-4. C4návody.: Redakční systémy. [online]. [cit. 2012-09-02]. Dostupné z: http://navody.c4.cz/redakcni-systemy DOMES, Martin. 333 tipů a triků pro CSS: [sbírka nejužitečnějších návodů pro váš web]. Vyd. 1. Brno: ComputerPress, 2009, 272 s. Jak na počítač. ISBN 978-80-251-2360-7. DOMES, Martin. Tvorba WWW stránek pro úplné začátečníky: podrobný průvodce tvorbou a správou webů. Vyd. 1. Překlad Martin Domes. Brno: ComputerPress, 2008, 246 s. 333 tipů a triků. ISBN 978-802-5121-603. Google Trends.: Webové vyhledávání Výraz: wordpress, joomla, drupal. Česká republika, 2004–současnost. [online]. [cit. 2012-09-02]. Dostupné z: http://www.google.com/trends/explore#q=wordpress,joomla,drupal&geo=C Z HORŇÁKOVÁ, Michaela. 333 tipů a triků pro WordPress: podrobný průvodce tvorbou a správou webů. Vyd. 1. Překlad Martin Domes. Brno: ComputerPress, 2011, 304 s. 333 tipů a triků. ISBN 978-80-251-3443-6. KUDLÁČEK, Lubomír. WordPress: podrobný průvodce tvorbou a správou webů. Vyd. 1. Překlad Martin Domes. Brno: ComputerPress, 2010, 261 s. ISBN 978-80-251-2734-6. Lepší web. [online]. [cit. 2012-08-25]. Dostupné z: http://www.lepsiweb.cz/tvorba-www/seo/zakladni-pravidla-optimalizace

Literatura

42

Manifest Dogma W4. [online]. [cit. 2012-08-22]. Dostupné z: http://www.pixy.cz/dogma/dogmaw41/cs/#principles. NEUMAJER, Ondřej. Budujeme školní web: podrobný průvodce tvorbou a správou webů. Vyd. 1. Překlad Martin Domes. Brno: CP Books, 2005, 133 s. 333 tipů a triků. ISBN 80-251-0612-8. NEUMAJER, O.: Jednoduše na školní web. [online]. 2010. Dostupné z: http://www.vuppraha.cz/wpcontent/uploads/2010/02/ICT_ve_skole.pdf#p age=47 NEUMAJER, O.: Náležitosti školního webu - autoevaluační asistent. [online]. [cit. 2012-08-22]. Dostupné z: http://ondrej.neumajer.cz/skolniweb/aea/ NEUMAJER, O.: Náležitosti školního webu - autoevaluační asistent. [online]. [cit. 2012-08-29]. Dostupné z: http://ondrej.neumajer.cz/skolniweb/aea/online/index.php?pg=step0 Použitelnost stránek. [online]. [cit. 2012-0822]. Dostupné z:http://www.jakpsatweb.cz/pouzitelnost.html PROCHÁZKA, David. CSS a XHTML: tvorba dokonalých WWW stránek krok za krokem. 2., aktualiz. vyd. Praha: Grada, 2011, 175 s. Průvodce (Grada). ISBN 978-80-247-3897-0. STRUŠKA, T. Internet jako nástroj pro prezentaci a komunikaci školy s veřejností. Diplomová práce. PedF MU, 2010. UIV.: Rychlé šetření, květen 2009, celková zpráva. [online]. [cit. 2012-08-19]. Dostupné z: http://www.uiv.cz/clanek/17/1765. W3C MarkupValidationService.: Validátor. [online]. [cit. 2012-08-22]. Dostupné z: http://validdator.w3.org. WebPrezent. [online]. [cit. 2012-08-25]. Dostupné z: http://www.webprezent.cz/publikujeme/seo-optimalizace/10-zakladnichpravidel-seo.html. Wikipedie: JavaScript. [online]. [cit. 2012-08-22]. Dostupné z: http://cs.wikipedia.org/wiki/JavaScript. Wikipedie: MySQL. [online]. [cit. 2012-08-22]. Dostupné z: http://cs.wikipedia.org/wiki/MySQL. Wikipedie: PHP. [online]. [cit. 2012-08-22]. Dostupné z: http://cs.wikipedia.org/wiki/PHP.

Inovace webové prezentace školy

Recommend Documents