Evropský zemědělský fond pro rozvoj venkova: Evropa investuje do venkovských oblastí. v cestovním ruchu P2. Pavel Petr

Evropský zemědělský fond pro rozvoj venkova: Evropa investuje do venkovských oblastí

Využití informačních technologií v cestovním ruchu P2 Pavel Petr [email protected] @

1


Obsah kurzu Princip vyhledávání Definování vyhledávacích požadavků Vyhledávací nástroje Zdroje Zd j informací i f í Nástroje pro zpracování informací Shrnutí Praktické cvičení


Web a vyhledávače tvorba webu – doporučení a zkušenosti => účelnost zajímavost návštěvnost


Účel návštěvy stránek „KDO“ a „PROČ“ =>pravidla pro tvorbu stránek 1. Stránky nabízející přímé služby či prodej produktů. 2. Prezentujeme produkty. 3 P k t j i f i 3. Poskytujeme pouze informaci


1. Stránky 1 S á k nabízející bí jí í přímé ří é služby l žb či prodej d j p produktů. Základní vlastnosti: stručné,, zřetelně viditelné,, umístěné p po ruce snadný nákup – zaškrtnout a potvrdit srozumitelná stránka minimum grafiky krátká

Hlavní účel – objednat a nakoupit.


2. Prezentujeme produkty „komerční stránky“ – umístění produktu na webu Základní vlastnosti: stručné informace fotografie tabulky

Nutnost N t t lákat: lák t efektní ale malá animace atraktivní grafika g sporé texty další podrobnosti – formou odkazů na další stránky jedno okno ostatní (video, zvuk atd.) – odkaz „kdo se táže, jako kdyby již nakoupil“ – odkaz na kontakt


3. Poskytujeme pouze informaci nekomerční stránky (inzerce, sponzoři) užitečné a často navštěvované f informace zadarmo nezávislý zdroj

Vlastnosti (přitvrdit): delší a podrobnější stránky bez efektní animace a grafiky estetické jako časopis • vícesloupková sazba (hlavní text text, odkazy • typografie – nadpisy, řezy písma • čtenář chce číst (klidná stránka bez animací).


Úkol 1


„Typy tvůrců webu“ „Strukturalisti“ „Prezentátoři“ „Prezentátoři Závisí Zá i í na cílové íl é skupině k i ě => > estetika + strukturovanost.


Lidé na webu Role – vydatel => cílová skupina. Skupiny: zaměstnanci firmy a její spolupracovníci zákazníci profesionálové začátečníci začátečníci.


Skupina – zaměstnanci firmy Zaměstnanci firmy a její spolupracovníci • intranet • specifická skupina p • účelnost,, bez efektů,, ukázat přehledně informace.


Skupina – zákazníci Zákazníci vtáhnout do děje web)) j ((nesmí opustit p propustnost vzhledem k zákazníkům.


Prohlížeč ??? ? prohlížečů hlíž čů ? platforem Rozhodnutí: p prohlížeče jjen p pro text optimalizace pro definovaný prohlížeč ? pro všechny používané.

Poznámka: text <1% - možná textová alternativa (Text only) standard HTML – organizace W3C (posun k IE) (d t t nových ý h ? starší verze (rámce) – spíše ne (dostupnost verzí).


Rychlost připojení a průchodnost linek Obsah stránky ~ technické možnosti čtenářů Omezení: 20 – 30 kB/s – teorie (praxe 102 B/s) – čest výjimkám => šetřit na titulních stránkách ? doby načítání ~ stránka cca 20-40 kB • obrázky (10kB) – formáty.

Doporučení: 25 kB na stránku • 8 kB textu (základní kód) • 17 kB grafika – problém!!!


Úkol 2


Grafika pro web Pojmy: bezztrátová komprese p • např. GIF y, tlačítka,, • jjemná,, p přesná g grafika – texty, printscreen ztrátová komprese • např. JPEG • nedokonalost oka • fotografie, obrázky bez ostrých hran indexované barvyy – odkaz na barvu v p paletě.


Formát - GIF obrázky s 256 barvami Vlastnosti: bezztrátová komprese možnost průhlednosti (barva – průhledná). průhledná)


Formát - prokládaný GIF postupné zobrazení (hrubý náhled -> detaily). Vlastnosti nezvyšuje velikost pomáhá zobrazení aproximace řádková prokládání doporučení – GIF > 5x 5 pixelů – prokládání.


Formát - animovaný GIF Více obrázků v jednom souboru.


Formát - JPEG Vlastnosti: komprese vp pravých p ý barvách ztrátová komprese ý hran a detailů klasické obrázkyy bez ostrých

Použití: fotografie větší obrázky.


Formát - PNG Vlastnosti: bezztrátová komprese p až 16,7 *106 barev p p aproximace p postupná zobrazení prokládaný režim (čtvercová aproximace) klasické obrázky bez ostrých hran a detailů

Použití: jako GIF a JPEG


Formáty obrázků ČB 61kB


Formáty obrázků 16 bit 237kB


Formáty obrázků 24 bit 1 409kB


Formáty obrázků 256 úrovní 473kB


Formáty obrázků GIF 41663bit


Formáty obrázků JPG 23.403 kB PNG 188.122 kB TIF 246.456 kB


Formáty obrázků JPG 23403


Formáty obrázků JPG 23403


Velikosti grafických souborů ČB 61kB 16 bit 237kB 24 bit 1 409kB 256 úrovní 473kB

GIF 41663bit JPG 23.403 kB PNG 188.122 kB TIF 246.456 kB


Rastrový obrázek rastrový obrázek (počet bodů obrázku, rozlišení, barevná hloubka) (BMP GIF, GIF JPG, JPG PNG – přednosti a formáty ukládání (BMP, nevýhody, tvorba a použití) získání obrázku (malování, sejmutí obrazovky, digitální fotografie fotografie, skenování) prohlížení a úpravy obrázků (prohlížení, lupa, jas, kontrast atd.)) tisk obrázku (tisk, rozlišení, druhy papírů) a použití obrázku v dokumentu


Vektorový obrázek vektorový obrázek (základní objekty, kreslení objektů změna polohy a velikosti objektů) objektů, základní vlastnosti objektů (obrys a výplň, vlastnosti textu) uspořádání objektů ů (zarovnání a řazení objektů) ů praktické příklady (hrátky s objekty, vizitka, leták, obal CD, inzerát, kliparty)


PDF formát PDF formát (vlastnosti a použití, čtení PDF souborů, prohlížeče, práce s prohlížečem, tisk).


Úloha 3


JPEG versus GIF ikony – jemná struktura => JPEG Doporučení: < 50 x 50 bodů OR < 50 barev THEN GIF animované GIFy – animace – velikost souboru (animace~snímek)


Nástroj pro tvorbu webu Návrh stránky Microsoft Front Page g Allaire HomeSite 4.0

Ikony, tlačítka, další grafika Ikony tlačítka Adobe Photoshop 5.0 0 PaintShop Pro 5 5.0


Nástroj pro tvorbu webu Sharewarové filtry pro Photoshop a další filtry pro tvorbu tlačítek Microsoft Image Composer Macromedia Fireworks MapThis

Ukládání souborů Ulead Smartsaver

Animované GIGy Microsoft GIF Animator Ulead GIG Animator A i Animagic i GIF Animator A i t


Úloha 4


Přístupný web Základní motto přístupnosti

„Síla Síl webu b jje v jjeho h univerzalitě. i litě Přístup pro každého nezávisle na schopnostech je jeho základní prvek“


Přístupnost Stav, kdy věc neklade svým uživatelům žádné zásadní překážky. p y Přístupnost = bezbariérovost. Přístupnost webu = funkčnost www stránek (efektivně web používat)

Přístupná webová stránka „Přístupná webová stránka je použitelná pro každého uživatele Internetu Internetu, a to nezávisle na jeho postižení, schopnostech, znalostech, zkušenostech či zobrazovacích možnostech.“


Kontra opozice Web je z podstaty naprosto univerzální a přístupný p p ý a vše, co se z nějj vytvořilo y nepřístupné médium, mají na svědomí j g lajdáčtí webdesignéři. Přístupnost vychází ze samotných základů webu a nejde o žádnou nadstavbu. Za to, že dnes mají bezbariérovost a web k sobě tak daleko, mohou jen a pouze tvůrci www stránek kteří odvádějí špatně svou práci stránek, práci.


Přístupný web Není web, ke kterému bylo něco přidáno, aby se stal přístupným. p p ý Je to web web, u něhož byla dodržena původní pravidla, a tím byla přístupnost zachována.


Důležitost přístupnosti 1. Zdravotní dispozice. 2. Zkušenosti s Internetem. 3. Jazykové vybavení a schopnost porozumět psanému textu textu. 4. Technické vybavení. 5. Softwarové vybavení. Problém – podcenění počtu uživatelů s omezením (až 1/3)


Výhodnost bezbariérového webu 1. 2. 3. 4 4. 5.

Peníze. Lepší viditelnost webu. Lepší použitelnost webu. P il á í d Posilování dobrého b éh jjména. é Soulad se zákony.


Předpoklady Velká Británie 14% p populace – zdravotní p postižení p 9% populace – barvoslepost p 20% p populace – starší 60 let

Svět: nefunkční javascript 7% flash 11%


Handicapovaní každý: zpravodajské weby p j y portály p e-shop banky istituce


Zvláštnosti skupin webů Cestovní kancelář – krátkodobé postižení. e-Shop e Shop – knihy – porucha soustředění Bankovní dům – otázka např. platformy.


Šetříme náklady nejsou klasické dodatečné náklady vzhledem k uživateli úspora pro tvůrce přístupný web je levnější – otázka oslovení skupin zákazníků (70% versus 100%)


Lepší viditelnost webu pro vyhledávače: definovaná struktura stránek roboti – text, sémantika => přístupnost


Web pro vyhledávače „robot-friendly“: Veškeré informace jsou přítomny v textové podobě. Buď v ní b v podobě d bě ttextových t ý h alternativ lt ti grafických fi ký h prvků. ků nebo Žádný obsah nezůstal před roboty ukrytý (flash, javascript). Všechny odkazy jsou plně funkční a robot se pomocí nich dostává na další stránky. Je dodrženo sémantické označování textu. (název stránky, d i dů ě í atd.). td ) nadpisy, zdůraznění Nejdůležitější obsah je umístěn na začátku stránky, kdy existuje j větší p pravděpodobnost, p kde si ho robot vyhledávače y všimne.


Příklad zobrazení – uživatel -robot


Lepší použitelnost webu – navigace - obsah


Metodiky přístupnosti Priorita 1 Web musí splňovat danou zásadu,, jinak se stává p j nepřístupným pro hendikepované uživatele.

Priorita 2 Web by měl splňovat danou zásadu, jinak je obtížně přístupnýý pro některé skupinyy handicapovaných uživatelů.

Priorita 3 Web by mohl splňovat danou zásadu, protože tak ulehčí přístup handicapovaným uživatelům.


Hendikepovaní uživatelé Internetu 1. 2. 3. 4 4. 5. 6.

Zrakově postižení Sluchově postižení Pohybově postižení Uži t lé se zobrazovacími Uživatelé b í i problémy blé Uživatelé s poruchami učení a soustředění Roboti


Zrakově postižení Zrakově postižení - považování za jedinou skupinu hendikepovaných uživatelů Internetu. Mezi zrakově postižené řadíme: Zcela nevidomí a jinak těžce zrakově postižení • není tak velké množství, Internet - možnost, jak "překročit" svůj hendikep; • pomocná zařízení - hlasové čtečky nebo braillský řádek. ý formou dobře strukturovaného textu, g • obsah musí být grafické a multimediální prvky musí mít textové alternativy, navigace musí být použitelná apod. Slabozrací • omezené používání zraku, zvětšovat obsah stránky, velikost písma i jiných prvků na stránce definovat p pomocí relativních jjednotek a p použitelnost stránky y zkontrolovat i při radikálně zvětšeném písmu. Barvoslepí • problém rozeznávat od sebe některé škály barev, problém u barvy pozadí a popředí na webové stránce - stránka nepřístupná, dostatečný kontrast, obsahu – nespoléhat na barvu. Uživatelé s dočasně zhoršenou možností vidět • aktuální světelné a zobrazovací podmínky, kontrast barev a v nejdůležitějších případech na barvu nespoléhal vůbec. vůbec


\Sluchově postižení Výhoda - web se vizuální složku prezentace. Poskytovat plnohodnotnou textovou alternativu. Nepřístupný pro skutečně sluchově postižené a pro uživatele bez reprodukčního zařízení (vzhledem k externím podmínkám - hluk apod. - neslyší.


Pohybově postižení zásadní problém - nemohou používat myš postiženi trvale a dočasně potřebují ovládat webové stránky jinak než pomocí myši => klávesnice. klávesnice


Uživatelé se zobrazovacími problémy Uživatelé alternativních browserů používání browseru je otázkou volby - některý browser využívat musí Linux atd. stejný t j ý komfort k f t v každém k ždé internetovém i t t é prohlížeči hlíž či Správný tvůrce www stránek – testování funkčnosti funkčnosti.

Uživatelé jiných zobrazovacích zařízení škála zobrazovacích zařízení – široká správně udělané webové stránky by měly fungovat na všech.


Uživatelé s poruchami učení a soustředění Normálně vidí, slyší, pohybují s myší. Pro dyslektiky, osoby s poruchami soustředění a ji é podobně d b ě postižené tiž é uživatele ži t l – jednoduché, j d d hé jiné velké písmo. Obecně - tyto techniky pohybují spíše v oblasti použitelnosti webu, než ryzí přístupnosti. Potřebují: přehledné, strukturované jednoduše pochopitelné webové stránky strukturovaný obsah přehledná navigace. písmo í větší, ětší kkrátké átké odstavce, d t hodně h d ě nadpisů, d i ů více í vizuálních i ál í h "zarážek" pro oči, více obrázkových symbolů místo slov apod.


Roboti Mezi jednotlivými stránkami se pak pohybuje pomocí odkazů. R b t nevidí idí b l ší zvuk, k nerozpozná á obsah b h Robot barvy, neslyší obrázků, neumí dobře používat JavaScript ani Flash. Jádro je tedy v textu a odkazech odkazech. Označkovaný strukturálními značkami (nadpisy, odstavce, seznamy, zdůraznění apod.) a vždy se u toho spolehnout na čistý text – ne obrázky, JavaScript či Flash. Zobrazit stránku textový prohlížečem (např (např. pomocí on-line služby Lynx View) nebo třeba zkusit specializovanou službu Poodle Predictor.


Přístupnost webu - pravidla http://pristupnost.nawebu.cz/texty/pravidlastandardy.php?full yp p


Pravidla tvorby přístupného webu (1/6) Obsah webových stránek je dostupný a čitelný 1. 2.

3. 4. 5. 6.

Každý netextový prvek nesoucí významové sdělení má svou textovou alternativu alternativu. Informace sdělované prostřednictvím skriptů, objektů, appletů, 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í 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ředpisyy určující j typ y písma obsahují j obecnou rodinu písem.


Pravidla tvorby přístupného webu (2/6) Práci s webovou stránkou řídí uživatel 7. 8. 9. 10. 11. 12.

Obsah WWW stránky se mění, jen když uživatel aktivuje ěj ký prvek. k nějaký Webová stránka bez přímého příkazu uživatele p j uživatelským ý p nemanipuluje prostředím. Nová okna se otevírají jen v odůvodněných případech a uživatel je na to předem upozorněn. N webové b é stránce tá i nebliká bliká rychleji hl ji než ž jjednou d Na nic za sekundu. Webová stránka nebrání uživateli p posouvat obsahem rámů. Obsah ani kód webové stránky nepředpokládá ani nevyžaduje konkrétní způsob použití ani konkrétní výstupní či ovládací zařízení zařízení.


Pravidla tvorby přístupného webu (3/6) Informace jsou srozumitelné a přehledné 13. 14. 15. 16. 17. 18.

Webové stránky sdělují informace jednoduchým jazykem a srozumitelnou formou. Úvodní webová stránka jasně popisuje smysl a účel webu. Název webu či jeho provozovatele je zřetelný. y textového obsahu uvádějí j Webová stránka i jjednotlivé p prvky své hlavní sdělení na svém začátku. Rozsáhlé obsahové bloky jsou rozděleny do menších, výstižně nadepsaných celků. Informace zveřejňované na základě zákona jsou dostupné jako textový obsah webové stránky. Na samostatné webové stránce je uveden 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.


Pravidla tvorby přístupného webu (4/6) Ovládání webu je jasné a pochopitelné 19.Každá webová stránka má smysluplný název, vystihující její obsah. 20.Navigační a obsahové informace jsou na webové stránce zřetelně odděleny. 21.Navigace je srozumitelná a je konzistentní na všech webových stránkách. 22.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. 23.Všechny webové stránky rozsáhlejšího webu obsahují odkaz na přehlednou mapu webu. 24.Obsah ani kód webové stránky nepředpokládá, že uživatel již navštívil jinou stránku stránku. 25.Každý formulářový prvek má přiřazen výstižný nadpis. 26.Každý rám má vhodné jméno či popis vyjadřující jeho smysl a funkčnost. funkčnost


Pravidla tvorby přístupného webu (5/6) Odkazy jsou zřetelné a návodné 27. 28. 29. 30.

31 31.

Označení každého odkazu výstižně popisuje jeho cíl i bez okolního kontextu. Stejně označené odkazy mají stejný cíl. Odkazy jsou odlišeny od ostatního textu, a to nikoli pouze barvou. Obrázková mapa na straně serveru je použita jen v případě, že nebylo možné pomocí dostupného geometrického tvaru definovat oblasti v obrázkové mapě. V ostatních případech žita obrá ko á mapa na straně uživatele. ži atele Obrá ko á je po použita obrázková Obrázková mapa na straně serveru je vždy doprovázena alternativními textovými odkazy. Uživatel je předem jasně upozorněn upozorněn, když odkaz vede na obsah jiného typu, než je webová stránka. Takový odkaz je doplněn sdělením o typu a velikosti cílového souboru.


Pravidla tvorby přístupného webu (6/6) Kód je technicky způsobilý a strukturovaný 32.

33. 34.

35. 36.

37.

Kód webových stránek odpovídá nějaké zveřejněné finální specifikaci jazyka HTML či XHTML XHTML. Neobsahuje syntaktické chyby, které je správce webových stránek schopen odstranit. V metaznačkách je uvedena použitá znaková sada dokumentu. Prvky ve P k tvořící t ří í nadpisy d i a seznamy jsou j kkorektně kt ě vyznačeny č zdrojovém kódu. Prvky, které netvoří nadpisy či seznamy, naopak ve zdrojovém kódu takto vyznačeny nejsou. P popis i vzhledu hl d webové b é stránky t á k jjsou upřednostněny ř d t ě stylové t l é Pro předpisy. Je-li tabulka použita pro rozvržení obsahu webové stránky, neobsahuje záhlaví řádků ani sloupců. Všechny tabulky zobrazující tabulková data naopak záhlaví řádků a/nebo sloupců obsahují. Všechny tabulky dávají smysl čtené po řádcích zleva doprava.


Úloha 5


Závěr Shrnutí teorie praktické ukázky a cvičení

Evropský zemědělský fond pro rozvoj venkova: Evropa investuje do venkovských oblastí. v cestovním ruchu P2. Pavel Petr

Recommend Documents