Svoje stránky byste vždy měli vyzkoušet alespoň na těchto prohlížečích:

Rozměr: px
Začít zobrazení ze stránky:

Download "Svoje stránky byste vždy měli vyzkoušet alespoň na těchto prohlížečích:"

Transkript

1 Příprava grafických podkladů pro web 1. O webových prohlížečích Stejná stránka se v různých prohlížečích může zobrazit odlišně. Autor webových stránek neví, jaký prohlížeč bude čtenář používat. Proto nemá cenu specializovat se na jeden typ prohlížeče a stránky ladit jen pro něj. Obvykle je potřeba, aby stránky vypadaly stejně ve všech hlavních prohlížečích. Svoje stránky byste vždy měli vyzkoušet alespoň na těchto prohlížečích: Internet Explorer 9 Firefox Opera Google Chrome nebo Safari Proč se prohlížeče liší Internet se zpočátku vyvíjel neuvěřitelně rychle. Podobně dynamicky se přetvářel jazyk HTML, tak aby umožňoval zařazovat do stránek nové a nové věci. Starší prohlížeče neumožňovaly stejné zobrazení stránek jako prohlížeče moderní, protože v době vzniku starších prohlížečů se prostě nevědělo, jak se budou stránky psát za pár let. Něco samozřejmě zůstalo stejné, ale staré prohlížeče neumějí zobrazovat nové styly, skripty a jiné vychytávky. Standard, nebo optimalizace? Kdo dělá internetové stránky, dostane se velmi brzy před dilema: dělat chudé, "standardní" stránky, které se dobře zobrazí ve všech prohlížečích, nebo stránky odladit pro jeden druh prohlížeče (optimalizovat) a pak se jenom modlit, aby se to jinde zobrazilo správně? 1.1. Metody optimalizace Optimalizace pro jeden prohlížeč Někteří autoři dokonce píší "tyto stránky jsou optimalizovány pro ten a ten prohlížeč". Tato cesta je často efektivním kompromisem mezi pracností a výsledkem. Je totiž pravděpodobné, že se v jiných prohlížečích stránka zobrazí stejně. Až na občasné přetékající okraje, rozbitá menu a nefunkční skripty, což ale zas tolik nevadí (tedy jak kdy a jak kde). Metoda pokusu a opravy Autor udělá krásné stránky optimalizované pro jeden prohlížeč a pak si to zkouší zobrazovat v jiných. Najde-li chybu, nějak ji opraví. To je slušná metoda, leč docela pracná. Používají ji i profesionálové. V minulosti tím prvním zkoušeným prohlížečem býval Internet Explorer, od roku 2007 už se vyplácí psát primárně pro Firefox a teprve nakonec řešit vrtochy Exploreru.

2 Metoda znalosti verzí HTML a CSS Autor, který ví, co může a nemůže použít, je na tom nejlépe. Pokud vytvoří na stránce něco, co by se ve starších prohlížečích zobrazilo špatně, udělá to tak, aby se v nich zobrazilo alespoň něco. Nejlépe je využít přitom CSS styly. Je to těžké na znalosti, ale jediné všeobecné. 2. Požadavky kladené na webové prezentace Na vizuální design www stránky klademe tři základní požadavky: 2.1. Vizuální přívětivost Nejjednodušeji řečeno, za vizuálně přívětivé můžeme považovat takové stránky, které působí jako jednotný harmonický celek. Pro vytvoření vizuálně přívětivého webu si těžko můžeme definovat nějaká konkrétní kritéria, neboť je zde jistá souvislost s estetickou hodnotou konkrétního objektu a to, co vnímáme jako estetické, je podmíněno individuálně i kulturně. Nemůžeme tedy říci, že vizuální přívětivost je požadavkem na to, aby se webové stránky uživatelům líbily, můžeme ji spíše považovat za potřebu celkové vizuální harmonie stránek. Jednotlivé prvky stránky by měly být ve vzájemném souladu, v prostoru stránky by se nemělo nacházet nic, co nebude zapadat do celkové vizuální koncepce webu, nic, co by vytvářelo nechtěné napětí či působilo rušivým dojmem Použitelnost Použitelnost www stránek je kvalitativní aspekt, který udává, nakolik je práce s webovými stránkami příjemná pro uživatele. Použitelnost zajímá především webové designéry a je centrální oblastí zájmu interaktivního, na uživatele zaměřeného designu. S tímto přístupem je spojena řada výzkumů a testů, jež zkoumají chování a preference určitých skupin uživatelů. Cílem tohoto snažení je v co největší míře vyjít vstříc potřebám uživatele a usnadnit mu tak práci s webovými stránkami. Pomocí vhodné kompozice, správného použití principů grafického designu, volbou vhodného typu a velikosti písma a výstižnými ikonami a obrázky můžeme ve velké míře usnadnit uživateli orientaci v prostoru stránky a tím také výrazně zvýšit použitelnost. Důležitou otázkou při výběru jednotlivých prvků a rozvržení pro web je tedy i jejich použitelnost 2.3. Přístupnost Přístupné jsou takové stránky, se kterými mohou bez větších potíží pracovat i různými způsoby znevýhodnění uživatelé. Přístupné stránky tedy nestaví svým uživatelům žádné překážky, které by jim znemožnily daný web efektivně používat. Přístupnost na webu je tedy podobná bezbariérovosti budov. Uživatelé na webu mohou být ale znevýhodnění různými způsoby, nejenom tělesným postižením. Uživatelé mohou být znevýhodnění v různých směrech. Tělesným či duševním postižením, nemocí uživatelé webu mohou být nevidomí nebo slabozrací, sluchově postižení, mít omezenou schopnost pohybu. Na to, aby se uživateli snížila schopnost efektivně pracovat s internetovými stránkami, stačí, aby byl nějakým způsobem omezen ve zpracování určitého druhu informací, významně znepříjemnit prohlížení webu může i běžná vada zraku. Technologiemi ne všichni uživatel jsou vybaveni nejnovějšími technickými novinkami z oblasti výpočetní techniky. Věkem mladší uživatelé často neumí ještě dostatečně rychle číst a nemají ještě natolik zažité konvence, které nám usnadňují orientaci v dokumentech vizuální komunikace. Oproti tomu senioři často trpí jistou formou psychických zábran z práce s počítačem, tedy jednou z forem technostresu.

3 S věkem se také zhoršují schopnosti lidského oka. Neznalostí nemůžeme počítat s tím, že všichni uživatelé jsou zběhlí v používání Internetu. V prostředí veřejné správy je nezbytné, aby nebyly skupiny hendikepovaných uživatelů při poskytování informací prostřednictvím webových stránek jakkoliv diskriminovány. Pravidla, jak upravit web do přístupné podoby jsou shrnuta na adrese pristupnosti.cz/ 3. Šířka webové prezentace a rozlišení obrazovky Šířka webových stránek se odvíjí od rozlišení obrazovky na monitoru čtenáře. V dnešní době se předpokládá, že nejmenší šířka monitoru je 1024 bodů. Někteří uživatelé používají rozlišení např bodu a vyšší. Pevná šířka webové prezentace Webové prezentace s šířkou, která se nastaví napevno. Všechno ostatní se potom odehráva uvnitř tohoto oddílu s nastavenou šířkou. Toto řešení je kritizováno majiteli mobilních počítačů s malým displejem, v nichž se musí horizontálně scrolovat. Majitelé velkých monitorů naopak mají na obrazovce hodně prázdna. Flexibilní struktura Flexibilní struktury se dosahuje pomocí procentních šířek. Jednotlivé šířky elementů tak nejsou zadávány v pixelech, nýbrž v procentech. Takto připravená struktura pak reaguje na různé šířky nejrůznějších zařízení. Jak dělat stránky tak šikovně, aby na šířce nezáleželo (udělat je "gumové" aneb "s plovoucí šířkou"). Dá se to (hodně pomáhají styly), ale přináší to některé komplikace, hlavně pokud bude stránka obsahovat pevně široké prvky (reklamy, obrázky, složitější grafiku). Druhý problém jsou velmi široké monitory, kde jsou pak řádky textu příliš dlouhé a dají se špatně číst. Kvůli gumovosti je důležité pracovat s procenty, ale kvůli čtení nepoužívat stoprocentní šířku. Flexibilní obrázky Technika flexibilních obrázků zajistí, že obrázky se budou přizpůsobovat stejně tak, jako samotná struktura. Aby tohoto bylo dosaženo, neuvádí se šířka a výška obrázku uvnitř tagu <img>. Aby nedocházelo k přetékání, nastylují se všechny obrázky následujícím kódem: max-width: 100%; height: auto; Takto nastylované obrázky se dokáží přizpůsobit obrazovce jednotlivých zařízení. Od roku 2012 profesionálové používají tak zvaný responzivní design. Zakládá se na použití relativně pokročilého stylování pomocí tzv. media queries. Responzivní design www prezentace Responzivní, nebo-li přizpůsobivý, design je speciální způsob stylování html stránky. Stránka s responzivním designem se mění v souvislosti na zařízení, ze kterého stránku prohlížíte ať už se jedná o notebooky, netbooky, mobilní telefony či tablety, vždy se bude prohlížená stránka zobrazovat korektně a to v závislosti na šířce obrazovky zobrazovaného zařízení.

4 Významná hraniční rozlišení V následující tabulce je přehled hraničních rozlišení, která jsou ve webovém světě významná. 320px Malá rozlišení, obrazovka na výšku. 480px Malá zařízení, obrazovka na šířku. 600px Menší tablety, Amazon Kindle ( ), obrazovka na výšku. 768px Tablety, ipad 1 a 2, obrazovka na výšku. 1024px Notebooky, stolní monitory, tablety při obrazovce na šířku. 1200px Širokoúhlé zařízení. 4. Nejčastější rozvržení www stránky Na webu se obvykle používá několik základních druhů rozvržení stránky. Při vytváření návrhu je vhodné se jich držet, neboť uživatel je na takovéto stránky zvyklý a zorientuje se v nich snáze, než ve chvíli, kdy použijeme některé neobvyklé rozvržení. V závislosti na umístění navigace pak rozlišujeme čtyři základní schémata rozvržení stránek: 4.1. Navigace vlevo S přihlédnutím k výzkumu prokazujícímu, že uživatelé zkoumají stránku ve tvaru písmene F a vzhledem k faktu, že v naší kultuře postupujeme při čtení zleva doprava, se jeví jako nejvhodnější použít layout, při němž je navigace umístěna doleva Navigace vpravo Navigaci situovanou doprava pak používáme zejména na stránkách, u nichž očekáváme, že uživatel má primární zájem především o text v obsahové části. Této kompozice nejčastěji užívají on line noviny. V poslední době se vyskytují názory, že navigace umístěná napravo je stejně použitelná jako navigace levá a tvar písmene F při prohlížení stránky je dán zažitými konvencemi, takže se s ní setkáváme čím dál tím častěji Třísloupcový layout Třísloupcový layout v podstatě vznikne spojení layoutu s navigací vlevo a vpravo. Hodí se spíše pro komerční weby, které do pravého sloupce umísťují různě reklamní upoutávky Navigace nahoře Pole s navigací můžeme také umístit horizontálně, přímo pod hlavičku. Tento způsob navigace se užívá především v kombinaci s jednou z navigací umístěných po stranách stránky. Horizontální pruh pak plní funkci navigace primární, vertikální sloupec tvoří navigaci sekundární. 5. Obrázky na webu Různé typy obrázků, které se na webu mohou vyskytnout Navigační obrázky Tlačítka a ikony pro web by měly být vybírány tak, aby vhodně podporovaly funkčnost a vizuální styl celého webu. Není vhodné stránku ikonami a tlačítky přeplnit, uživatel opravdu nepotřebuje ikonu nebo tlačítko ke každému odkazu v navigaci.

5 Tlačítka Tlačítka nesmí svým vzhledem narušovat celkovou vizuální koncepci webu. Až příliš často se setkáme s celkem jednoduchými stránkami, které obsahují poměrně komplikovaná tlačítka, takže uživatel na první pohled z celého webu vidí jen ony tlačítka. Pokud se tedy rozhodneme vytvářet tlačítka vlastní, neměli bychom se řídit na Internetu hojně se vyskytujícími návody na stránkách s názvy jako Vytvořte skvělá tlačítka pro Váš web či Super plastická tlačítka pro web, neboť zde uvedená tlačítka nejsou příliš graficky sofistikovaná. Ikony Hlavním požadavkem, který na ikony klademe, je, aby byly srozumitelné, tedy aby bylo na první pohled jasné, kterou akci či objekt zastupují. I ve chvíli, kdy je zjevné, co ikony reprezentují, je mnohdy pro uživatele, který není zvyklý pohybovat se na webu, těžké odhadnout jejich význam. Ikony by tedy měly být opatřeny popiskem. Dále by ikony měly být vizuálně poutavé a jednotné, svým vzhledem a stylem by měly odpovídat vizuálnímu charakteru webu. Při výběru ikon pro web můžeme vzít v potaz předpokládanou cílovou skupinu uživatelů a přizpůsobit vzhled ikon jejích preferencím, tedy pro dětský web použijeme realističtější a barevnější obrázky, naopak pro web seriózní instituce či firmy se hodí ikony minimalistické, kvalitně graficky zpracované. Opravdu nevhodné je umísťovat na web určený dospělým uživatelům přehnaně pestré, plastické ikony, neboť web pak působí neseriózním a ne příliš vkusným dojmem. Pro ikony platí to, co pro tlačítka, na Internetu nalezneme mnoho webů, nabízejících zdarma ikony. I v tomto případě, stejně jako u webů obsahujících návody na tvorbu tlačítek, bychom měli postupovat opatrně, neboť ani zde nabízené ikony obvykle nemají příliš vysokou grafickou úroveň Logotyp Pokud stránky patří nějaké firmě, sdružení či instituci, rozhodně by jejich web měl obsahovat logotyp. Konvenčně se logotyp umísťuje jako součást hlavičky webu. Vizuální styl stránek a logotypu by měl být ve vzájemném souladu. Obvykle je například konvencí použít na webu barevnosti vycházející z barev loga. Barvy můžeme buď zopakovat, nebo doplnit dalšími, ale tak, aby barevnost dodržovala nějaké schéma nebo vzbuzovala asociace odpovídající zaměření webu. V případě, že logo opravdu na stránky nechceme umístit, třeba proto, že by skutečně rušilo celou vizuální koncepci webu, je dobré uvést jej alespoň v zápatí Ilustrační obrázky U tohoto druhu webových obrázků především platí, že by měly být používány účelně, tedy pouze ve chvíli, kdy mohou nějakým způsobem podpořit nebo doplnit význam textu na stránce. Neměli bychom umísťovat obrázky na stránku jen pro to, že se nám zdají prázdné či nezajímavé. V takovéto chvíli je mnohem lepší znovu se zaměřit na písmo a navigaci. Obrázky na webu by měly být rozmístěny v souladu s kompozičními principy, aby tak neporušovaly vyváženost a jednotu stránky. Měli bychom mít na zřeteli, že fotografie jsou díky své složitosti poměrně vizuálně těžké. Pokud je na stránce obrázků více, je dobré ustanovit při jejich rozmísťování nějaký rytmus. Samozřejmě, v případě stránek obsahujících nějaké instruktážní texty, například návody na použití či první pomoc, je mnohem efektivnější vytvořit jakýsi komiks znázorňující danou akci, než se uchýlit k pouhému popisu. Příklad takovéto stránky je uveden na následujícím obrázku.

6 5.4. Animace Animace je vhodné používat spíše na úvodních stránkách či jako samostatnou prezentaci, nikoliv jako doplnění textu. Animovaná sekvence může být na webu velmi užitečná, například může uživateli zajímavým způsobem předvádět důležité informace třeba postup sestavení skříně či návod k práci se softwarovou aplikací. Ve chvíli, kdy vkládáme na stránku nějaké pohyblivé prvky, bychom si měli uvědomit, jakým způsobem jsou rozmístěny tyčinky a čípky na sítnici. Na pohyb citlivé čípky se totiž nacházejí spíše na okrajích sítnice, oko je tedy citlivější na pohyb v oblasti periferního vidění. Umisťujeme li je tedy animace do krajních oblastí stránky, můžou působit rušivě a znemožnit uživateli soustředit se na text nacházející se v hlavní části stránky. Oko má totiž tendenci ve chvíli, kdy zaregistruje na periferii nějaký pohyb přeostřit na místo, kde byl pohyb zaregistrován. Tohoto faktu jsou si dobře vědomi tvůrci reklamních bannerů. Není ani nutné, aby animace na stránce běžela neustále, stačí, když je přehrána několikrát po načtení. Animace jsou v poslední době velmi oblíbenou součástí webu. Ve chvíli, kdy animace vhodně dotváří celou stránku a má nějaké sdělení či vtip, není důvod, proč jí stránky nedoplnit. Ale ve chvíli, kdy umísťujeme na stránku například obrázek míče, je poněkud zbytečné míč rozpohybovat pouze tím zbytečně snižujeme použitelnost stránky. Je poměrně zbytečné vytvářet animované ikony či animované texty, takovéto prvky na stránkách uživatele spíše vyruší, než pobaví. 6. Grafické formáty pro web Pro WWW stránky jsou doporučeny tři druhy rastrových grafických formátů - GIF, JPG (JPEG) a PNG a jeden vektorový SVG. Jelikož je běžná rastrová grafika pro prostředí webu prakticky nepoužitelná z důvodu velkého objemu dat obsažených v rastrovém obrázku (např. BMP px, 256 barev = B) je nutno se tedy poohlédnout po takovém grafickém formátu, který pojme stejnou grafickou informaci a zároveň s menším objemem dat. K tomuto jsou tedy určeny komprimované grafické formáty. Grafický formát GIF Grafický formát GIF (Graphics Interchange Format) používá tzv. neztrátovou kompresi (algoritmem LZW). Je to komprese informace, při níž nedochází k žádným změnám v komprimovaných datech. Tato komprese je vhodná pro jemnou a přesnou grafiku - texty, tlačítka snímky obrazovek apod. Formát GIF je určen pro ukládání obrázků s nejvýše 256-ti barvami a umí též ukládat data dvoubarevná. Mezi jeho hlavní přednosti patří neztrátová komprese a možnost volby průhlednosti (Transparent GIF - formát GIF89a). Jedna z barev může být označena jako průhledná a při zobrazení se tato barva nahrazena podkladovou barvou webové stránky. U tohoto formátu se též můžeme setkat s pojmem prokládaný (interlaced). Je li obrázek vytvořený s metodou prokládání, při jeho načítání se nejprve zobrazí hrubý nástin obrázku a postupně se grafická informace upřesňuje a obrázek se dotváří do výsledné podoby. Toho se využívá u stránek, kde je vhodné zobrazit již při načítání stránky alespoň částečnou grafickou informaci, která je posléze dočítána a zobrazována v plné kvalitě. Formát GIF byl prvním grafickým formátem využívajícím možností multimédií. Jako první dokázal pojmout více jak jeden obrázek (tzv. animovaný GIF) jinou metodou než je metoda videa. Dalším prvkem multimediálnosti tohoto souboru byla možnost přidat k obrázku zvuk. Tato možnost se ale neujala, neboť existují mnohem mocnější prostředky postihující tuto oblast multimédií.

7 Grafický formát JPG U grafického formátu JPG (Joint Photographic Experts Group) je používáno tzv. ztrátové komprese. Je založena na znalostech nedokonalosti lidského oka, které je schopné tolerovat některé změny v obraze za účelem vysoce účinné komprese. Tato komprese je vhodná pro fotografie a obrázky bez ostrých obrysů. Nevhodná je zejména pro obrázky nesoucí textovou informaci. Většina grafických editorů dokáže nastavovat u JPEGu stupeň komprese, což znamená nastavení kvality obrázku. U formátu JPEG se často používá jeho speciální vlastnost - tzv. progresivnost JPEGu. Je to obdoba prokládaného GIFu (Interlaced GIF), kdy se data zobrazují postupně. Grafický formát PNG Grafický formát PNG (Portable Network Graphics) vznikl pod záštitou konsorcia W3C jako náhrada za grafický formát GIF. Také tento formát využívá bezztrátové komprese dat (algoritmem Deflate). Účinnost komprese se nastavuje aplikací filtrů, přičemž kvalita je stejná jako u GIFu, ovšem účinnost je mnohem vyšší (soubor s daty je menší). Tento formát pracuje buď s indexovými barvami (16 nebo 256 barev), nebo s plnou paletou barev (24 nebo 48 bitů). Dále je možné do souboru uložit i další informace, jako je např. alfa kanál nebo gamma korekce. Stejně jako formát GIF využívá transparentnosti, ovšem mnohem lépe (zejména z důvodu plné palety). PNG má také ve srovnání s GIFem mnohem lepší algoritmus prokládání (Adam7). Jediná vlastnost, která PNG ve srovnání s GIFem chybí, je animace. SVG SVG (z anglického Scalable Vector Graphics škálovatelná vektorová grafika) je značkovací jazyk a formát souboru, který popisuje dvojrozměrnou vektorovou grafiku pomocí XML. Formát SVG by se měl v budoucnu stát základním otevřeným formátem pro vektorovou grafiku na Internetu. Grafika SVG neobsahuje obrazová data pixel po pixelu, ale seznam svých součástí grafických objektů, pomocí kterých lze obrázek vykreslit. SVG je ideální pro jednoduchou grafiku, například grafy, binární stromy, chronologie, rodokmeny, finálové pavouky apod. 7. Barvy na webu V HTML dokumentech se používá pro označení barvy dvou způsobů (CSS jich má mnohem více): #RRGGBB slovního pojmenování barvy U prvního způsobu je zobrazení barvy přibližně 100%, neboť barva je smíchána z určitého podílu červené (RED), zelené (GREEN) a modré (BLUE) barvy. Pouze Netscape pracuje s výpočtem barev trošku nešetrně, neboť posun mezi odstíny R, G, nebo B má větší než třeba MS Internet Explorer, který zobrazuje výslednou barvu věrněji. Druhý způsob zápisu barev, je opět Netscape trošku nešetrnější a dokonce se může stát, že barva zapsaná správným anglickým ekvivalentem bude v prohlížeči zobrazena jako úplně jiná. Zápis touto formou má výhodu zejména pro začátečníky, kteří se obejdou bez kalkulačky a složitého přepočítávání barev do HEXadecimální soustavy. Celkem existuje 140 barev, které je možné slovně pojmenovat. 16 základních barev s jejich HEXadecimálním kódem má slovní pojmenování. Zbývajících 124 barev se označuje jako barvy X11.

8 Velmi často se můžete též setkat s 216 barvami, kterým se říká bezpečné barvy (216 web-safe colors), které mají tu vlastnost, že by se měly zobrazit na jakémkoli zobrazovacím zařízení stejně. V současné době používáme pro grafické prvky na internetu barevný model RGB. 8. Co je kódování Počítač chápe každé písmenko jako číslo od 0 do 255 (jeden bajt). Američané a Angličané (a programátoři) si vystačí se 128 znaky. Těmto základním 128 znakům bez háčků a čárek se říká ASCII. Dalšími čísly od 128 do 255 se označily diakritizované znaky jazyků západní Evropy, a tak vznikl kód Latin-1. V něm české znaky nejsou (s výjimkou znaků á, í, š a ž). Pro neazbukové jazyky střední a východní Evropy (tedy i pro češtinu a slovenštinu) vznikly různé konvence, které zachovávají význam prvních 128 znaků ASCII (normalni pismena), ale dalších 128 znaků si definují po svém. A právě různá přiřazení diakritizovaných znaků číslům od 128 do 255 se označují jako kódování (případně jako znaková sada) Nejčastější kódování (v poslední době převládají tři kódování češtiny) ISO je, jak už název napovídá, kódování standardnější, používané na Unixu a na Linuxu, ale i v mnoha windowsáckých programech. Někdy se označuje jako Latin 2, ISO Latin 2. Microsoft jej nazývá takto: "Středoevropské jazyky (ISO)". Windows-1250 je preferováno na Windowsech. Jeho obliba na webových stránkách spočívá zejména kvůli tomu, že jej většina editorů na Windowsech používá jako základní kódování, např. FrontPage, HomeSite nebo Notepad (poznámkový blok). V Microsoftích programech se kódování windows-1250 označuje jako "Středoevropské jazyky" bez přívlastku, což je od Microsoftu samozřejmě srabárna a matení. Zápis UTF-8 je nejčastějším zápisem znakové sady Unicode. Unicode je narozdíl od výše zmíněných znakových sad určeno pro všechny světové jazyky najednou, protože znakům přiřazuje čísla až do 16 miliónů (zapisuje se většinou dvěma bajty). Jde o nejmodernější kódování. Všeobecná podpora Unicode je teprve hudbou budoucnosti, ale už lze bez problémů používat stránky kódované v UTF-8. UTF-8 je v prohlížečích podporované dobře. ISO (též Latin-1, Západoevropské ISO) je kódování západoevropské. Neobsahuje všechny české znaky. Pokud jde o češtinu, v zásadě se jeho použití rovná chybě. Další stará kódování jako kód bratří Kamenických, Mac, PC Latin 2 nebo čeština pro Dos se dnes již na webu užívají tak zřídka, že jim nyní nebudu věnovat pozornost.

9

Stejná stránka se v různých prohlížečích může zobrazit odlišně.

Stejná stránka se v různých prohlížečích může zobrazit odlišně. Příprava grafických podkladů pro web 1. O webových prohlížečích Stejná stránka se v různých prohlížečích může zobrazit odlišně. Jako autor stránek na webu nevím, jaký prohlížeč bude můj čtenář používat.

Více

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN Škola: Gymnázium, Brno, Slovanské náměstí 7 Šablona: III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN prostřednictvím ICT Číslo projektu: CZ.1.07/1.5.00/34.0940

Více

Využití ICT techniky především v uměleckém vzdělávání. Akademie - VOŠ, Gymn. a SOŠUP Světlá nad Sázavou

Využití ICT techniky především v uměleckém vzdělávání. Akademie - VOŠ, Gymn. a SOŠUP Světlá nad Sázavou Datum: 1. 12. 2013 Projekt: Registrační číslo: Číslo DUM: Škola: Jméno autora: Název sady: Název práce: Předmět: Ročník: Obor: Časová dotace: Vzdělávací cíl: Pomůcky: Využití ICT techniky především v uměleckém

Více

Webové stránky. 6. Grafické formáty pro web. Datum vytvoření: 11. 10. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz

Webové stránky. 6. Grafické formáty pro web. Datum vytvoření: 11. 10. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz Webové stránky 6. Vytvořil: Petr Lerch www.isspolygr.cz Datum vytvoření: 11. 10. 2012 Webové Strana: 1/6 Škola Ročník Název projektu Číslo projektu Číslo a název šablony Autor Tématická oblast Název DUM

Více

VYUŽITÍ POČÍTAČOVÉ GRAFIKY

VYUŽITÍ POČÍTAČOVÉ GRAFIKY POČÍTAČOVÁ GRAFIKA VYUŽITÍ POČÍTAČOVÉ GRAFIKY ÚPRAVA FOTOGRAFIÍ NAFOCENÉ FOTOGRAFIE Z DIGITÁLNÍHO FOTOAPARÁTU MŮŽEME NEJEN PROHLÍŽET, ALE TAKÉ UPRAVOVAT JAS KONTRAST BAREVNOST OŘÍZNUTÍ ODSTRANĚNÍ ČERVENÝCH

Více

Úvod do počítačové grafiky

Úvod do počítačové grafiky Úvod do počítačové grafiky elmag. záření s určitou vlnovou délkou dopadající na sítnici našeho oka vnímáme jako barvu v rámci viditelné části spektra je člověk schopen rozlišit přibližně 10 milionů barev

Více

Barvy a barevné systémy Formáty obrázků pro WWW

Barvy a barevné systémy Formáty obrázků pro WWW Barvy a barevné systémy Formáty obrázků pro WWW Viditelné světlo. Elektromagnetické záření o vlnové délce 390 760 nanometrů. Jsou-li v konkrétním světle zastoupeny složky všech vlnových délek, vnímáme

Více

INTERNET A SÍTĚ. Role při tvorbě webových aplikací. Rozhodovací vrstvy při tvorbě webových aplikací. povrch kostra struktura obsah strategie

INTERNET A SÍTĚ. Role při tvorbě webových aplikací. Rozhodovací vrstvy při tvorbě webových aplikací. povrch kostra struktura obsah strategie INTERNET A SÍTĚ Ing. Pavel Smutný, Ph.D. Kancelář: H305 Telefon: 3511 Email: pavel.smutny@vsb.cz Role při tvorbě webových aplikací 1996 2009 GIF HTML CSS CGI analytik, informační architekt, grafik, programátor

Více

Barvy a barevné systémy Formáty obrázků pro WWW

Barvy a barevné systémy Formáty obrázků pro WWW Barvy a barevné systémy Formáty obrázků pro WWW Viditelné světlo. Elektromagnetické záření o vlnové délce 390 760 nanometrů. Jsou-li v konkrétním světle zastoupeny složky všech vlnových délek, vnímáme

Více

III/ 2 Inovace a zkvalitnění výuky prostřednictvím ICT

III/ 2 Inovace a zkvalitnění výuky prostřednictvím ICT Metodický list k didaktickému materiálu Číslo a název šablony Číslo didaktického materiálu Druh didaktického materiálu Autor Téma sady didaktických materiálů Téma didaktického materiálu Vyučovací předmět

Více

Barvy na počítači a grafické formáty

Barvy na počítači a grafické formáty Barvy na počítači a grafické formáty Hlavním atributem, který se používá při práci s obrazem či s grafickými formáty, je barva. Při práci s barvami je důležité určit základní množinu barev, se kterou budeme

Více

Počítačová grafika. OBSAH Grafické formy: Vektorová grafika Bitmapová (rastrová grafika) Barevné modely

Počítačová grafika. OBSAH Grafické formy: Vektorová grafika Bitmapová (rastrová grafika) Barevné modely Počítačová grafika OBSAH Grafické formy: Vektorová grafika Bitmapová (rastrová grafika) Barevné modely Vektorová grafika Vektorová grafika Příklad vektorové grafiky Zpět na Obsah Vektorová grafika Vektorový

Více

Funkce grafiky na webu. Primární grafická informace Fotografie Schémata Diagramy Loga Bannery

Funkce grafiky na webu. Primární grafická informace Fotografie Schémata Diagramy Loga Bannery Grafika pro web Funkce grafiky na webu Primární grafická informace Fotografie Schémata Diagramy Loga Bannery Funkce grafiky na webu Sekundární grafická informace Dekorace Zvýraznění Šipky Oddělovače Funkce

Více

Webové stránky. 16. Obrázky na webových stránkách, optimalizace GIF. Datum vytvoření: 12. 1. 2013. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.

Webové stránky. 16. Obrázky na webových stránkách, optimalizace GIF. Datum vytvoření: 12. 1. 2013. str ánk y. Vytvořil: Petr Lerch. www.isspolygr. Webové stránky 16. Vytvořil: Petr Lerch www.isspolygr.cz Datum vytvoření: 12. 1. 2013 Webové Strana: 1/6 Škola Ročník Název projektu Číslo projektu Číslo a název šablony Autor Tématická oblast Název DUM

Více

Konverze grafických rastrových formátů

Konverze grafických rastrových formátů ČESKÉ VYSOKÉ UČENÍ TECHNICKÉ V PRAZE FAKULTA STAVEBNÍ OBOR GEODÉZIE A KARTOGRAFIE KATEDRA MAPOVÁNÍ A KARTOGRAFIE Konverze grafických rastrových formátů semestrální práce Jakub Hořejší Ondřej Šalanda V

Více

Počítačová grafika SZŠ A VOŠZ MERHAUTOVA 15, BRNO

Počítačová grafika SZŠ A VOŠZ MERHAUTOVA 15, BRNO Počítačová grafika SZŠ A VOŠZ MERHAUTOVA 15, BRNO 1 Základní dělení 3D grafika 2D grafika vektorová rastrová grafika 2/29 Vektorová grafika Jednotlivé objekty jsou tvořeny křivkami Využití: tvorba diagramů,

Více

Rastrová grafika. Grafický objekt je zaznamenán jednotlivými souřadnicemi bodů v mřížce. pixel ( picture element ) s definovanou barvou

Rastrová grafika. Grafický objekt je zaznamenán jednotlivými souřadnicemi bodů v mřížce. pixel ( picture element ) s definovanou barvou Rastrová grafika Grafický objekt je zaznamenán jednotlivými souřadnicemi bodů v mřížce. pixel ( picture element ) s definovanou barvou Kvalita je určena rozlišením mřížky a barevnou hloubkou (počet bitů

Více

Webové stránky. 13. Obrázky na webových stránkách, modul Uložit pro web a zařízení. Datum vytvoření: 04. 11. 2012. str ánk y. Vytvořil: Petr Lerch

Webové stránky. 13. Obrázky na webových stránkách, modul Uložit pro web a zařízení. Datum vytvoření: 04. 11. 2012. str ánk y. Vytvořil: Petr Lerch Webové stránky 13. Vytvořil: Petr Lerch www.isspolygr.cz Datum vytvoření: 04. 11. 2012 Webové Strana: 1/6 Škola Ročník Název projektu Číslo projektu Číslo a název šablony Autor Tématická oblast Název DUM

Více

Zdroj: http://www.root.cz/clanky/pravda-a-myty-o-gifu/

Zdroj: http://www.root.cz/clanky/pravda-a-myty-o-gifu/ Zdroj: http://www.root.cz/clanky/pravda-a-myty-o-gifu/ Bitmapový formát (rastrový obrázek) Většina z používaných grafických formátů (JPEG, PNG, TGA, BMP) obsahuje popis rastrového obrázku jako celku ukládají

Více

Webová grafika, struktura webu a navigace, použitelnost a přístupnost

Webová grafika, struktura webu a navigace, použitelnost a přístupnost Webová grafika, struktura webu a navigace, použitelnost a přístupnost Martin Kuna martin.kuna@seznam.cz Obsah Webová grafika Rozvržení stránky Typografické zásady Nejčastější chyby Struktura webu a navigace

Více

On-line škola mladých autorů , pořadatel: ČVUT FEL. Jak na obrázky? Martin Žáček

On-line škola mladých autorů , pořadatel: ČVUT FEL. Jak na obrázky? Martin Žáček On-line škola mladých autorů 20. 2. 18. 4. 2013, pořadatel: ČVUT FEL Jak na obrázky? Martin Žáček zacekm@fel.cvut.cz http://www.aldebaran.cz/onlineskola/ Jak na obrázky? Osnova 1. Co je to vůbec obrázek,

Více

VY_32_INOVACE_INF4_12. Počítačová grafika. Úvod

VY_32_INOVACE_INF4_12. Počítačová grafika. Úvod VY_32_INOVACE_INF4_12 Počítačová grafika Úvod Základní rozdělení grafických formátů Rastrová grafika (bitmapová) Vektorová grafika Základním prvkem je bod (pixel). Vhodná pro zpracování digitální fotografie.

Více

Práce s obrazovým materiálem CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ. Akreditované středisko dalšího vzdělávání pedagogických pracovníků

Práce s obrazovým materiálem CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ. Akreditované středisko dalšího vzdělávání pedagogických pracovníků Práce s obrazovým materiálem CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ Akreditované středisko dalšího vzdělávání pedagogických pracovníků Obrazový materiál příjemná součást prezentace lépe zapamatovatelný často nahrazení

Více

Počítačová prezentace. Základní pojmy. MS PowerPoint

Počítačová prezentace. Základní pojmy. MS PowerPoint Počítačová prezentace Základní pojmy Počítačová prezentace využití elektronického systému pro předávání informací jednoduché zpracování textu, grafiky, zvuku a animací vysoká účinnost prezentace - přehledná

Více

Základní práce v souborovém manažeru

Základní práce v souborovém manažeru Základní práce v souborovém manažeru 18-20-M/01 Informační technologie Základní pojmy a prostředky pro programování webových stránek Zvládnutí nástrojů typických pro programování webových aplikací Základní

Více

DATOVÉ FORMÁTY GRAFIKY, JEJICH SPECIFIKA A MOŽNOSTI VYUŽITÍ

DATOVÉ FORMÁTY GRAFIKY, JEJICH SPECIFIKA A MOŽNOSTI VYUŽITÍ DATOVÉ FORMÁTY GRAFIKY, JEJICH SPECIFIKA A MOŽNOSTI VYUŽITÍ UMT Tomáš Zajíc, David Svoboda Typy počítačové grafiky Rastrová Vektorová Rastrová grafika Pixely Rozlišení Barevná hloubka Monitor 72 PPI Tiskárna

Více

1. Začínáme s FrontPage 2003 11

1. Začínáme s FrontPage 2003 11 Úvod 9 1. Začínáme s FrontPage 2003 11 Instalace programu 12 Spuštění a ukončení programu 15 Základní ovládání 16 Hledání souborů 30 Najít a nahradit 31 Tisk 32 Schránka sady Office 34 Nápověda 36 Varianty

Více

Téma: Barevné modely, formáty souborů

Téma: Barevné modely, formáty souborů Téma: Barevné modely, formáty souborů Vypracoval/a: Ing. Jana Wasserbauerová TE NTO PR OJ E KT J E S POLUFINANC OVÁN EVR OPS KÝ M S OC IÁLNÍM FONDEM A STÁTNÍM ROZPOČTEM ČESKÉ REPUBLIKY. Barevné modely

Více

Návrh stránek 4IZ228 tvorba webových stránek a aplikací

Návrh stránek 4IZ228 tvorba webových stránek a aplikací 4IZ228 tvorba webových stránek a aplikací Jirka Kosek Poslední modifikace: $Date: 2013/12/12 20:40:58 $ Obsah Úvod... 3 Recept na dobré webové stránky... 4 Použitelnost... 5 Jak se pozná použitelný web...

Více

Počítačové formy projekce jsou: promítání snímků na obrazovce počítače, promítání snímků z počítače na plátno,

Počítačové formy projekce jsou: promítání snímků na obrazovce počítače, promítání snímků z počítače na plátno, Prezentace Počítačové formy projekce jsou: promítání snímků na obrazovce počítače, promítání snímků z počítače na plátno, využití interaktivní tabule. Postup při tvorbě prezentace I 1. Stanovení cílů.

Více

Reprodukce obrazových předloh

Reprodukce obrazových předloh fialar@kma.zcu.cz Podpořeno z projektu FRVŠ 584/2011 Historie Reprodukční fotografie V reprodukční fotografii se používají různé postupy pro reprodukci pérovek (pouze černá a bílá) jednoduché (viz přednáška

Více

POČÍTAČOVÁ GRAFIKA. Počítačová grafika 1

POČÍTAČOVÁ GRAFIKA. Počítačová grafika 1 Počítačová grafika 1 POČÍTAČOVÁ GRAFIKA Gymnázium Jiřího Wolkera v Prostějově Výukové materiály z matematiky pro nižší gymnázia Autoři projektu Student na prahu 21. století - využití ICT ve vyučování matematiky

Více

Digitální učební materiál

Digitální učební materiál Střední hotelová škola, s.r.o. Floriánské náměstí 350, 272 01 Kladno Digitální učební materiál Číslo projektu Název projektu Název školy Předmět Tematický okruh Téma CZ.1.07/1.5.00/34.0112 Moderní škola

Více

Rastrový obraz, grafické formáty

Rastrový obraz, grafické formáty Rastrový obraz, grafické formáty 1995-2010 Josef Pelikán CGG MFF UK Praha pepca@cgg.mff.cuni.cz http://cgg.mff.cuni.cz/~pepca/ RasterFormats Josef Pelikán, http://cgg.mff.cuni.cz/~pepca 1 / 35 Snímání

Více

Pavel Roubal Výukový modul projektu: Nové formy výuky ve školách kraje Vysočina

Pavel Roubal Výukový modul projektu: Nové formy výuky ve školách kraje Vysočina Pavel Roubal 2009 Výukový modul projektu: Nové formy výuky ve školách kraje Vysočina Projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky Pavel Roubal 2009 1. Výukový

Více

Webové stránky. 1. Publikování na internetu. Datum vytvoření: 4. 9. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz

Webové stránky. 1. Publikování na internetu. Datum vytvoření: 4. 9. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz Webové stránky 1. Publikování na internetu Vytvořil: Petr Lerch www.isspolygr.cz Datum vytvoření: 4. 9. 2012 Webové Strana: 1/6 Škola Ročník Název projektu Číslo projektu Číslo a název šablony Autor Tématická

Více

TNPW1 Cvičení 6 24.3.2015 aneta.bartuskova@uhk.cz

TNPW1 Cvičení 6 24.3.2015 aneta.bartuskova@uhk.cz 6 24.3.2015 aneta.bartuskova@uhk.cz Layout 24.3.2015 aneta.bartuskova@uhk.cz Layout stránky = strukturní i vizuální rozvržení webové stránky Stránka je chápána jako skupina oblastí, každá oblast má svůj

Více

David Tejzr I.2.C Společnost TzComp.cz

David Tejzr I.2.C Společnost TzComp.cz David Tejzr I.2.C 19.5.2017 Společnost TzComp.cz 1 Obsah 1. Úvod... 3 1.1. Volba tématu... 3 1.2. Volba designu stránek... 3 1.3. Použitá technologie... 3 2. Postup... 4 2.1. Layout... 4 2.2. Header...

Více

Uživatelský manuál. Aplikace GraphViewer. Vytvořil: Viktor Dlouhý

Uživatelský manuál. Aplikace GraphViewer. Vytvořil: Viktor Dlouhý Uživatelský manuál Aplikace GraphViewer Vytvořil: Viktor Dlouhý Obsah 1. Obecně... 3 2. Co aplikace umí... 3 3. Struktura aplikace... 4 4. Mobilní verze aplikace... 5 5. Vytvoření projektu... 6 6. Části

Více

VY_32_INOVACE_INF.19. Inkscape, GIMP, Blender

VY_32_INOVACE_INF.19. Inkscape, GIMP, Blender VY_32_INOVACE_INF.19 Inkscape, GIMP, Blender Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Jiří Kalous Základní a mateřská škola Bělá nad Radbuzou, 2011 INKSCAPE Inkscape je open source

Více

Zpracovnání digitální fotografie

Zpracovnání digitální fotografie Souvětí pro výběr Tato lekce se zabývá znalostmi a dovednostmi pro prohlížení digitálních fotografií a základy jejich zpracování. Úvodní obrazovka Vznik digitálních fotoaparátů na počátku 90. let přinesl

Více

IVT. Grafické formáty. 8. ročník

IVT. Grafické formáty. 8. ročník IVT Grafické formáty 8. ročník listopad, prosinec 2013 Autor: Mgr. Dana Kaprálová Zpracováno v rámci projektu Krok za krokem na ZŠ Želatovská ve 21. století registrační číslo projektu: CZ.1.07/1.4.00/21.3443

Více

INFORMATIKA MS WORD GRAFIKA VE WORDU

INFORMATIKA MS WORD GRAFIKA VE WORDU Škola: Autor: DUM: Vzdělávací obor: Tematický okruh: Téma: Masarykovo gymnázium Vsetín Mgr. Petr Koňařík MGV_VT_SS_1S3-D04_Z_WORD_GRAFIKA.docx Informatika MS Word Grafika ve Wordu INFORMATIKA MS WORD GRAFIKA

Více

MANUÁL. Jak používat administraci webových stránek. Obsah ZÁKLAD... 2 ÚPRAVY POLOŽKY... 3 ÚPRAVY TEXTOVÉ STRÁNKY... 4

MANUÁL. Jak používat administraci webových stránek. Obsah ZÁKLAD... 2 ÚPRAVY POLOŽKY... 3 ÚPRAVY TEXTOVÉ STRÁNKY... 4 MANUÁL Jak používat administraci webových stránek Obsah ZÁKLAD... 2 PŘIHLÁŠENÍ DO ADMINISTRACE... 2 HLAVNÍ MENU... 2 VÝBĚR POLOŽKY... 2 ÚPRAVY POLOŽKY... 3 DETAIL POLOŽKY... 3 ÚPRAVY TEXTOVÉ STRÁNKY...

Více

MODERNÍ WEB SNADNO A RYCHLE

MODERNÍ WEB SNADNO A RYCHLE SNADNO A RYCHLE Marek Lučný Pavoučí síť přes celý svět Co prohlížeče (ne)skrývají Tajemný kód HTML Všechno má svůj styl Interaktivní je IN Na obrazovce i na mobilu Začni podle šablony Informace jsou základ

Více

Elektronické učebnice popis systému, základních funkcí a jejich cena

Elektronické učebnice popis systému, základních funkcí a jejich cena Elektronické učebnice popis systému, základních funkcí a jejich cena Vytvořil TEMEX, spol. s r. o. Obsah 1. Úvod... 2 Formáty... 2 Cena... 2 2. Systémové požadavky... 3 Interaktivní PDF verze... 3 HTML

Více

KAPITOLA 3 - ZPRACOVÁNÍ TEXTU

KAPITOLA 3 - ZPRACOVÁNÍ TEXTU KAPITOLA 3 - ZPRACOVÁNÍ TEXTU KLÍČOVÉ POJMY textové editory formát textu tabulka grafické objekty odrážky a číslování odstavec CÍLE KAPITOLY Pracovat s textovými dokumenty a ukládat je v souborech různého

Více

Základy HTML. Autor: Palito

Základy HTML. Autor: Palito Základy HTML Autor: Palito Zobrazení zdrojového kódu Zobrazení zdrojového kódu Každá stránka je na disku nebo na serveru uložena ve formě zdrojového kódu. Ten kód je psaný v jazyce HTML. Když si chcete

Více

Ergonomie softwaru. Hana Bydžovská

Ergonomie softwaru. Hana Bydžovská Ergonomie softwaru Hana Bydžovská Osnova přednášky ergonomie jako věda ergonomie práce s počítačem ergonomie softwaru působení softwaru na člověka požadavky na software nežádoucí prvky 2 Ergonomie pojem

Více

22. Tvorba webových stránek

22. Tvorba webových stránek 22. Tvorba webových stránek Webové stránky jsou spolu s elektronickou poštou nejpoužívanější prostředky internetu. Brouzdáme li internetem používáme nějaký prohlížeč. To, co vidíme na obrazovce v prohlížeči

Více

Grafika a grafický design. Internetové publikování

Grafika a grafický design. Internetové publikování Grafika a grafický design Internetové publikování Design stránky Grafický design první dojem, rychlost stahování Struktura stránek navigace, rozvržení plochy Volba informací okruh čtenářů Syntaktická správnost,

Více

Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost

Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost Projekt je realizován v rámci Operačního programu Vzdělávání pro konkurence

Více

Příručka Vzdělávacího střediska Konero ke kurzu Milan Myšák

Příručka Vzdělávacího střediska Konero ke kurzu Milan Myšák MS PowerPoint (verze 2010) Příručka Vzdělávacího střediska Konero ke kurzu Milan Myšák e-mail: milan.mysak@konero.cz Obsah 1. Seznámení s prezentacemi 2. Zobrazení prezentace 3. Nastavení programu a prezentace

Více

Soukromá střední odborná škola Frýdek-Místek, s.r.o. VY_32_INOVACE_135_IVT_HTML_08_tvorba_www

Soukromá střední odborná škola Frýdek-Místek, s.r.o. VY_32_INOVACE_135_IVT_HTML_08_tvorba_www Číslo projektu Název školy Název Materiálu Autor Tematický okruh Ročník CZ.1.07/1.5.00/34.0499 Soukromá střední odborná škola Frýdek-Místek, s.r.o. VY_32_INOVACE_135_IVT_HTML_08_tvorba_www Ing. Pavel BOHANES

Více

Internet 2 css, skriptování, dynamické prvky

Internet 2 css, skriptování, dynamické prvky Internet 2 css, skriptování, dynamické prvky Martin Hejtmánek hejtmmar@fjfi.cvut.cz http://kmlinux.fjfi.cvut.cz/ hejtmmar Počítačový kurs Univerzity třetího věku na FJFI ČVUT Znalci 26. března 2009 Dnešní

Více

POČÍTAČOVÁ GRAFIKA. Lenka Bednaříková

POČÍTAČOVÁ GRAFIKA. Lenka Bednaříková POČÍTAČOVÁ GRAFIKA Lenka Bednaříková POČÍTAČOVÁ GRAFIKA - OBSAH Barevné modely Základní dělení počítačové grafiky Vektorová grafika Rastrová (bitmapová) grafika Rozlišení Barevná hloubka Komprese, komprimace

Více

Nové přístupy tvorby web site. Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001

Nové přístupy tvorby web site. Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001 Nové přístupy tvorby web site Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001 Osnova Úvod Web site - jasný cíl Technologie - dynamický web Forma - vyšší interaktivita Obsah - stálá aktualizace

Více

Počítačová grafika a vizualizace I

Počítačová grafika a vizualizace I Počítačová grafika a vizualizace I KOMPRESE, GRAFICKÉ FORMÁTY Mgr. David Frýbert david.frybert@gmail.com OSNOVA Barva pro TV Datový tok Bitmapové formáty (JPEG, TIFF, PNG, PPM, ) Formáty videa MPEG-1,2,4,7,21

Více

IVT. Prezentace pravidla a postupy. 8. ročník

IVT. Prezentace pravidla a postupy. 8. ročník IVT Prezentace pravidla a postupy 8. ročník listopad, prosinec 2013 Autor: Mgr. Dana Kaprálová Zpracováno v rámci projektu Krok za krokem na ZŠ Želatovská ve 21. století registrační číslo projektu: CZ.1.07/1.4.00/21.3443

Více

Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost

Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost Registrační číslo projektu: CZ.1.07/1.5.00/34.0553 Elektronická podpora zkvalitnění výuky CZ.1.07 Vzděláním pro konkurenceschopnost Projekt je realizován v rámci Operačního programu Vzdělávání pro konkurence

Více

CAD II přednáška č. 5. Grafické formáty PCX GIF TIFF BMP

CAD II přednáška č. 5. Grafické formáty PCX GIF TIFF BMP PCX GIF TIFF BMP PCX vyvinuto firmou ZSoft bezztrátová komprese každý obrázek obsahuje 128 bitovou hlavičku,následují komprimovaná data nabízítři druhy komprimace podle počtu barev (16-barev, 256-barev

Více

1. Úvod do obsluhy AutoCADu

1. Úvod do obsluhy AutoCADu 1. Úvod do obsluhy AutoCADu Studijní cíl V této lekci se naučíme: Seznámíme se s potřebným zařízením. Způsoby ovládání. Nastavení AutoCADu. Doba nutná k procvičení 1,5 hodiny 1.1 AutoCAD AutoCAD je plnohodnotný

Více

ŠKODA Portal Platform

ŠKODA Portal Platform ŠKODA Portal Platform Struktura LESS stylů Jan Obrátil Účel dokumentu Účelem tohoto dokumentu je vysvětlit strukturu stylů v Portálové Platformě tak, aby bylo možné je správně použít a rozšířit je pro

Více

Zobrazování bannerů podporují pouze nově vytvořené šablony motivů vzhledu.

Zobrazování bannerů podporují pouze nově vytvořené šablony motivů vzhledu. Bannerový systém ProEshop od verze 1.13 umožňuje zobrazování bannerů na popředí e-shopu. Bannerový systém je přístupný v administraci e-shopu v nabídce Vzhled, texty Bannerový systém v případě, že aktivní

Více

Vyšší odborná škola a Střední škola,varnsdorf, příspěvková organizace. Šablona 3 VY 32 INOVACE 0101 0203

Vyšší odborná škola a Střední škola,varnsdorf, příspěvková organizace. Šablona 3 VY 32 INOVACE 0101 0203 Vyšší odborná škola a Střední škola,varnsdorf, příspěvková organizace Šablona 3 VY 32 INOVACE 0101 0203 VÝUKOVÝ MATERIÁL Identifikační údaje školy Číslo projektu Název projektu Číslo a název šablony Autor

Více

Co je počítačová grafika

Co je počítačová grafika Počítačová grafika Co je počítačová grafika Počítačovou grafikou rozumíme vše, co zpracovává počítač a co lze sledovat očima Využití počítačové grafiky Tiskoviny - časopisy, noviny, knihy, letáky Reklama

Více

Identifikátor materiálu: ICT-1-20

Identifikátor materiálu: ICT-1-20 Identifikátor materiálu: ICT-1-20 Předmět Informační a komunikační technologie Téma materiálu Kancelářské balíky a grafické editory Autor Ing. Bohuslav Nepovím Anotace Student si procvičí / osvojí programové

Více

Zásady prezentace CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ. Akreditované středisko dalšího vzdělávání pedagogických pracovníků

Zásady prezentace CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ. Akreditované středisko dalšího vzdělávání pedagogických pracovníků Zásady prezentace CENTRUM MEDIÁLNÍHO VZDĚLÁVÁNÍ Akreditované středisko dalšího vzdělávání pedagogických pracovníků Prezentace Prezentace: přednášený text + elektronický materiál Přednášený text: poutavý

Více

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela Základy informatiky HTML, tvorba WWW stránek Daniela Szturcová Část převzata z přednášky P. Děrgela Obsah přednášky Princip WWW dokumentu, ukázka Nástroje pro tvorbu Pravidla tvorby HTML, tagy Kostra HTML

Více

HLEDEJCENY.mobi. Obsah. Mobilní verze e-shopu. Důvody instalace

HLEDEJCENY.mobi. Obsah. Mobilní verze e-shopu. Důvody instalace Obsah HLEDEJCENY.mobi Mezi Vodami 1952/9 e-mail: info@hledejceny.cz HLEDEJCENY.mobi... 1 Mobilní verze e-shopu... 1 Důvody instalace... 1 Výhody... 2 Co je k mobilní verzi potřeba... 2 Objednávka služby...

Více

Elektromagnetické záření. Zdroj: http://www.fotografovani.cz/images3/rom_svetlo_1_02.gif

Elektromagnetické záření. Zdroj: http://www.fotografovani.cz/images3/rom_svetlo_1_02.gif Počítačová grafika Elektromagnetické záření Zdroj: http://www.fotografovani.cz/images3/rom_svetlo_1_02.gif Jak vidíme Naše oči vnímají elektromagnetické záření Jsou citlivé na vlnové délky 390 až 800 nm

Více

Inovace výuky prostřednictvím šablon pro SŠ

Inovace výuky prostřednictvím šablon pro SŠ Název projektu Číslo projektu Název školy Autor Název šablony Název DUMu Stupeň a typ vzdělávání Vzdělávací oblast Vzdělávací obor Tematický okruh Inovace výuky prostřednictvím šablon pro SŠ CZ.1.07/1.5.00/34.0748

Více

b) červená, zelená, modrá, c) černá, bílá, d) černá, bílá, šedá. 5. PNG je formát: a) textový,

b) červená, zelená, modrá, c) černá, bílá, d) černá, bílá, šedá. 5. PNG je formát: a) textový, Opravil: Kontroloval: Přijímací zkouška xx_xx_xxxx_v1 (INF komb. st.) Identifikační údaje: 1. Mezi znakové sady nepatří: a) Windows CP 1250, b) ISO 8859-14, c) Unicode, UTF-13. 2. Unicode používá k reprezentaci

Více

VY_32_INOVACE_INF3_18. Textové formáty PDF, TXT, RTF, HTML, ODT

VY_32_INOVACE_INF3_18. Textové formáty PDF, TXT, RTF, HTML, ODT VY_32_INOVACE_INF3_18 Textové formáty PDF, TXT, RTF, HTML, ODT Standardem pro textové soubory jsou následující formáty: Rich Text Format (.rtf), Hypertext Markup Language (.html,.htm) Portable Document

Více

1. ZÁKLADNÍ POJMY POČÍTAČOVÉ GRAFIKY

1. ZÁKLADNÍ POJMY POČÍTAČOVÉ GRAFIKY 1. ZÁKLADNÍ POJMY POČÍTAČOVÉ GRAFIKY Pixel: je zkratka anglického PICture Element, tedy obrazový bod. Velikost obrázku: na monitoru v obrazových bodech - počet obrazových bodů, ze kterých je obrázek sestaven

Více

PowerPoint 2010. Kurz 2, 3. Inovace a modernizace studijních oborů FSpS (IMPACT) CZ.1.07/2.2.00/28.0221

PowerPoint 2010. Kurz 2, 3. Inovace a modernizace studijních oborů FSpS (IMPACT) CZ.1.07/2.2.00/28.0221 PowerPoint 2010 Kurz 2, 3 CZ.1.07/2.2.00/28.0221 Jak by měla vypadat prezentace v PowerPointu Typy na správnou prezentaci Základním prvkem prezentace je text kontrola opakujících se slov v prezentaci Texty

Více

Úvod do jazyka HTML (Hypertext Markup Language)

Úvod do jazyka HTML (Hypertext Markup Language) Úvod do jazyka HTML (Hypertext Markup Language) WWW zdroje: http://www.jakpsatweb.cz/ Jak psát web, návod na HTML stránky (Dušan Yuhů Janovský) http://www.kit.vslib.cz/~satrapa/www/kurs/ Kurs vytváření

Více

Identifikátor materiálu: ICT-1-19

Identifikátor materiálu: ICT-1-19 Identifikátor materiálu: ICT-1-19 Předmět Informační a komunikační technologie Téma materiálu Komprimace, archivace dat Autor Ing. Bohuslav Nepovím Anotace Student si procvičí / osvojí komprimaci, archivaci

Více

Použití prezentací. K heslovitému sdělení informací. Oživení obrázky, schématy, tabulkami, Nevhodné pro dlouhé texty. Doprovodná pomůcka při výkladu

Použití prezentací. K heslovitému sdělení informací. Oživení obrázky, schématy, tabulkami, Nevhodné pro dlouhé texty. Doprovodná pomůcka při výkladu PowerPoint 2007 Osnova Koncept a použití prezentací Seznámení s pracovním prostředím MS Word 2007 Režimy zobrazení Užitečná nastavení Základní práce s dokumenty Práce s textem a objekty Šablony a jejich

Více

Obsah. 1. ČÁST Tisk na stolní tiskárně Kapitola 1. Kapitola 2. Úvod...11. Volba tiskárny a média...15

Obsah. 1. ČÁST Tisk na stolní tiskárně Kapitola 1. Kapitola 2. Úvod...11. Volba tiskárny a média...15 Obsah Úvod................................................11 1. ČÁST Tisk na stolní tiskárně Kapitola 1 Volba tiskárny a média................................15 Volba tiskárny....................................16

Více

Výukový materiál KA č.4 Spolupráce se ZŠ

Výukový materiál KA č.4 Spolupráce se ZŠ Výukový materiál KA č.4 Spolupráce se ZŠ Modul: Téma workshopu: Výpočetní technika Co je to internet? Jak si udělat vlastní www stránku? Vypracovala: Ing. Lenka Hellová Termín workshopu: 30. říjen 2012

Více

Pracovní prostředí Word 2003 versus Word 2010

Pracovní prostředí Word 2003 versus Word 2010 Zdokonalování gramotnosti v oblasti ICT Pracovní prostředí Word 2003 versus Word 2010 Inovace a modernizace studijních oborů FSpS Vránová Hana 11.7.2012 OBSAH Srovnání pracovního prostředí Word 2003 a

Více

Rozšíření bakalářské práce

Rozšíření bakalářské práce Rozšíření bakalářské práce Vojtěch Vlkovský 2011 1 Obsah Seznam obrázků... 3 1 Barevné modely... 4 1.1 RGB barevný model... 4 1.2 Barevný model CMY(K)... 4 1.3 Další barevné modely... 4 1.3.1 Model CIE

Více

Osnova. Koncept a použití prezentací. Seznámení s pracovním prostředím MS Word Režimy zobrazení. Užitečná nastavení. Základní práce s dokumenty

Osnova. Koncept a použití prezentací. Seznámení s pracovním prostředím MS Word Režimy zobrazení. Užitečná nastavení. Základní práce s dokumenty PowerPoint 2007 Osnova Koncept a použití prezentací Seznámení s pracovním prostředím MS Word 2007 Režimy zobrazení Užitečná nastavení Základní práce s dokumenty Práce s textem a objekty Doporučení, jak

Více

Dokumentace k projektu

Dokumentace k projektu Mendelova univerzita v Brně Provozně ekonomická fakulta Dokumentace k projektu Kvetoucí kaktusy Chalupová Lenka LS 2012 Webový Design Obsah 1. Úvod a cíl práce... 3 2. Informační architektura... 3 2.1.

Více

Wichterlovo gymnázium, Ostrava-Poruba, příspěvková organizace. Maturitní otázky z předmětu INFORMATIKA A VÝPOČETNÍ TECHNIKA

Wichterlovo gymnázium, Ostrava-Poruba, příspěvková organizace. Maturitní otázky z předmětu INFORMATIKA A VÝPOČETNÍ TECHNIKA Wichterlovo gymnázium, Ostrava-Poruba, příspěvková organizace Maturitní otázky z předmětu INFORMATIKA A VÝPOČETNÍ TECHNIKA 1. Algoritmus a jeho vlastnosti algoritmus a jeho vlastnosti, formy zápisu algoritmu

Více

Obsah. Úvod... 9. Barevná kompozice... 16 Světlo... 18 Chromatická teplota světla... 19 Vyvážení bílé barvy... 20

Obsah. Úvod... 9. Barevná kompozice... 16 Světlo... 18 Chromatická teplota světla... 19 Vyvážení bílé barvy... 20 Obsah Úvod.............................................................................................. 9 Historie grafického designu a tisku..................................... 10 Od zadání k návrhu..............................................................

Více

Adobe Photoshop 18. Ukládání dokumentu formáty

Adobe Photoshop 18. Ukládání dokumentu formáty Adobe Photoshop 18. Ukládání dokumentu formáty www.isspolygr.cz Vytvořila: Bc. Blažena Kondelíková Vytvořila dne: 20. 11. 2012 Strana: 1/5 Škola Ročník 4. ročník (SOŠ, SOU) Název projektu Interaktivní

Více

Otevření souboru. - druhé tlačítko zleva (v nástrojové liště se symbolem šipky a dokumentu)

Otevření souboru. - druhé tlačítko zleva (v nástrojové liště se symbolem šipky a dokumentu) XnView Program XnView na prohlížení obrázků, (ale umí i přehrávat multimediální, tedy zvukové a video soubory) je zdarma a je celý zpracován v českém jazyce. Tento pozoruhodný program, v lecčems předčí

Více

SOU Valašské Klobouky. VY_32_INOVACE_3_01 IKT Pc grafika základní pojmy Mgr. Radomír Soural. Zkvalitnění výuky prostřednictvím ICT

SOU Valašské Klobouky. VY_32_INOVACE_3_01 IKT Pc grafika základní pojmy Mgr. Radomír Soural. Zkvalitnění výuky prostřednictvím ICT SOU Valašské Klobouky VY_32_INOVACE_3_01 IKT Pc grafika základní pojmy Mgr. Radomír Soural Zkvalitnění výuky prostřednictvím ICT Název a číslo projektu CZ.1.07/1.5.00/34.0459 Název školy SOU Valašské Klobouky,

Více

Testování aplikace Facebook Messenger pro Windows Phone 8.1

Testování aplikace Facebook Messenger pro Windows Phone 8.1 [ZDEJTE ÁZEV SPOLEČOSTI.] Testování aplikace Facebook Messenger pro Windows Phone 8.1 7B36TUR Jan Vitha 06.11.2016 Obsah 1. Úvod... 1 1.1. Popis aplikace... 1 1.2. Cílová skupina... 1 2. Přehled testovaných

Více

HbbTV reklama. Grafický návrh požadavky

HbbTV reklama. Grafický návrh požadavky HbbTV reklama Grafický návrh požadavky Základní pravidla Při tvorbě grafického návrhu HbbTV aplikace je nutné vycházet z toho, že uživatel je většinou vzdálen od obrazovky více než 2m, a proto by velikost

Více

Inovace a zkvalitnění výuky prostřednictvím ICT Databázové systémy MS Access formuláře a sestavy - vytváření Ing. Kotásek Jaroslav

Inovace a zkvalitnění výuky prostřednictvím ICT Databázové systémy MS Access formuláře a sestavy - vytváření Ing. Kotásek Jaroslav Střední průmyslová škola a Vyšší odborná škola technická Brno, Sokolská 1 Šablona: Název: Téma: Autor: Číslo: Anotace: Inovace a zkvalitnění výuky prostřednictvím ICT Databázové systémy MS Access formuláře

Více

Obsah. Kapitola 1 Stažení a instalace... 13. Kapitola 2 Orientace v programu a základní nastavení... 23. Úvod... 9

Obsah. Kapitola 1 Stažení a instalace... 13. Kapitola 2 Orientace v programu a základní nastavení... 23. Úvod... 9 Obsah Úvod......................................................... 9 Co vás čeká a co GIMP umí............................................... 9 Co s GIMPem dokážete?............................................................10

Více

Informatika Počítačová grafika Mgr. Jan Jílek (v.11/12) Počítačová grafika

Informatika Počítačová grafika Mgr. Jan Jílek (v.11/12) Počítačová grafika Počítačová grafika - obor informatiky zabývající se zpracováním grafické informace (př. obrázky, videa, fotografie, informační plakáty, reklamy, konstrukční plány, návrhy, virtuální světy, hry aj.) První

Více

Číslo DUM: VY_32_INOVACE_04_01 Autor: Mgr. Ivana Matyášková Datum vytvoření: březen 2013 Ročník: prima Vzdělávací obor: informační technologie

Číslo DUM: VY_32_INOVACE_04_01 Autor: Mgr. Ivana Matyášková Datum vytvoření: březen 2013 Ročník: prima Vzdělávací obor: informační technologie Číslo DUM: VY_32_INOVACE_04_01 Autor: Mgr. Ivana Matyášková Datum vytvoření: březen 2013 Ročník: prima Vzdělávací obor: informační technologie Tematický celek: počítačová grafika Název projektu: Zvyšování

Více

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant Základy informatiky 03 HTML, tvorba webových stránek Kačmařík/Szturcová/Děrgel/Rapant Obsah přednášky princip webového dokumentu, ukázka nástroje pro tvorbu pravidla tvorby HTML, značky kostra HTML dokumentu

Více

Multimediální prezentace MS PowerPoint I

Multimediální prezentace MS PowerPoint I Multimediální prezentace MS PowerPoint I Informatika Multimediální prezentace zažívají v poslední době obrovský rozmach. Jsou používány například k reklamním účelům, k předvedení výrobků či služeb. Velmi

Více

KIV/PIA 2012 Ing. Jan Tichava

KIV/PIA 2012 Ing. Jan Tichava KIV/PIA 2012 Ing. Jan Tichava Opera Mini Zobrazených stránek za měsíc 90 G 80 G 70 G 60 G 50 G 40 G 30 G 20 G 10 G 0 G January 2011 May 2011 September 2011 January 2012 May 2012 September 2012 State of

Více

P o w e r P o i n t 2 0 0 7

P o w e r P o i n t 2 0 0 7 4. Karta Domů Obsahuje skupiny příkazů, z nichž každá umožňuje zpracovat jednu ucelenou tematickou oblast úkolů: 1. Schránka 2. Snímky 3. Písmo 4. Odstavec 5. Kreslení 6. Úpravy 4.1. Schránka Text či objekt,

Více