Co je to webová stránka? Příklad přístupné webové stránky Vysvětlení jednotlivých elementů z příkladu Závěr.

Slides:



Advertisements
Podobné prezentace
Technologie pro publikování na webu 1
Advertisements

Zoner Foto Studio Bohumil Bareš.
Návod pro práci s internetovými stránkami společnosti Acros • Produkty Acros/Fisher je možno nalézt na internetových stránkách nebo na stránkách.
Poznámky pro výuku Předmět: Úvod do informatiky Autor: Mgr. Jan Míček
Štěpán Šípal Gymnázium Čakovice. Dnešní témata  Vznik XHTML a předchůdci  Základní prvky XHTML dokumentu  Tagy a atributy  Elementy a jejich druhy.
Tvorba webových stránek
Technologie pro publikování na webu 1 Ing. Jiří Štěpánek.
VY_32_INOVACE_4.3.IVT1.15/Oc Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Ing. Jaroslav Ochodek CZ.1.07/1.5.00/ Tvorba webových.
Jak naučit zákazníky, aby měli rádi vaši online samoobsluhu Marta Drahovzalová eBusiness manager T-Mobile Konference WebTop
HTML (XHTML) 3. 2 META INFORMACE V závěru se opět vracím k hlavičce dokumentu, kde se definují tzv. META informace. Zapisují se jako nepárová značka s.
Základní struktura, metainformace
Jazyk HTML Název školyZákladní škola a Mateřská škola Tatenice Číslo projektuCZ Název šablony klíčové aktivity Inovace a zkvalitnění výuky pomocí.
CSS a HTML 5. HTML 5 HTML5 je nová verze specifikace značkovacího jazyka HTML, která přináší podstatné změny v technologiích webových stránek. HTML5 umožňuje.
TVORBA WEBOVÝCH STRÁNEK
PHP – vkládání souborů a html 5
Základy práce s počítačem – lekce V.
Praha6.cz Nové trendy v e-publishingu Statické stránky, mapa stránek, menu a fulltextové vyhledávání.
Elektronická pošta Elektronická pošta ( ) je obdobou běžné pošty a umožňuje přijímat a distribuovat dokumenty v textové podobě na jednu nebo více.
Veronika Hladíková. V dnešní době se dají webové stránky zhotovit mnoha způsoby, ale zdaleka ne všechny jsou ty správné. V následující prezentaci se Vám.
GWEB2 MGR. VLASTISLAV KUČERA 2. PŘEDNÁŠKA. Obsah přednášky  Prvky rozdělující obsah  article, aside, nav, section  header  footer.
Návrh úprav stránek – návrh úprav stránek POŽADAVKY Date: 7/2013Návrh: redakční rada stránekVypracoval: Jiří RutkovskýGrafická.
Tutoriál DynaMed ~ Jednoduché prohledávání
Číslo projektuCZ.1.07/1.5.00/ Číslo materiáluVY_32_INOVACE_258 Název školyGymnázium, Tachov, Pionýrská 1370 Autor Ing. Roman Bartoš Předmět Informatika.
PHP – Základy programování
Základní služby Internetu
Maturitní okruh 22: Úvod do HTML. Značkovací a klasické jazyky Klasické: převládá strukturovaný text (programovací kód), skripty jsou prováděny na straně.
Informace a Internet Bohumil Bareš. Informace V nejobecnějším smyslu je informace chápána jako údaj o reálném prostředí, o jeho stavu a procesech v něm.
HTML jazyk Označovaný zkratkou HTML, je značkovací jazyk pro hypertext. Je jedním z jazyků pro vytváření stránek v systému World Wide Web, který umožňuje.
aneb zásady správné tvorby webových stránek Informatika Milan Šimek
Internet.  Celosvětový systém propojených počítačů  Funkce  Sdílení dat  Elektronická pošta.
WWW – hypertextový informační systém
WWW stránky – Úvod Mgr. Lenka Švancarová.
2 Petr Žitný znalosti.vema.cz 3 Báze znalostí Nová služba zákazníkům ▸Báze naplněná informacemi, ke které mají uživatelé přímý přístup Základní cíl ▸Poskytovat.
SubjektSpeciální ZŠ a MŠ AdresaU Červeného kostela 110, TEPLICE Číslo op. programuCZ Název op. programuOP Vzdělávání pro konkurenceschopnost.
Název projektu: Šablony Špičák číslo projektu: CZ.1.07/1.4.00/ šablona III/2 autor výukového materiálu: Mgr. Jana Jiroušová, VM vytvořen: leden.
Podnikání na Internetu internet - zdroj informací Letní semestr 2005 Jana Holá III.
Školení WordPress a publikování na webu Mgr. Pavel Krejčí
e-Komunikace nevidomých občanů s veřejnou správou
Internet – služby Název školyGymnázium Zlín - Lesní čtvrť Číslo projektuCZ.1.07/1.5.00/ Název projektuRozvoj žákovských kompetencí.
Internet a informace MIS - Manažerské informační systémy Internet a informace Ing. Jan Luhan
Databáze MS ACCESS 2010.
Využití sestavy Zobrazení a typy Části sestavy Vytvoření sestavy Ovládací prvky.
 nejvíce využívaná služba internetu založená na www stránkách  poskytuje virtuální informační prostor, přístupný pomocí prohlížeče  výhodou www stránek.
ŠkolaZŠ Třeboň, Sokolská 296, Třeboň AutorMgr. Miroslava Tomanová Číslo VY_32_INOVACE_3466 NázevInternet - úvodní pojmy Téma hodinyInternet – úvodní.
INTERNET Mgr. Petra Toboříková. Internet = celosvětový systém navzájem propojených počítačových sítí –WWW (text, grafika a multimédia - hypertextové odkazy)
Nové stránky vytvořeny v rámci realizace projektu Moderní a efektivně řízená obec Dolní Břežany s reg. č. projektu CZ.1.04/4.1./
Jak fungují webové stránky Úvod do HTML (1). Projekt: CZ.1.07/1.5.00/ OAJL - inovace výuky Příjemce: Obchodní akademie, odborná škola a praktická.
Tvorba WWW stránek. Hyperlink Odkaz, bývá označený jinou barvou a podtržený Odkaz, bývá označený jinou barvou a podtržený Reaguje na událost myši – Reaguje.
Tvorba www stránek – (01) úvod Autor: Mgr. Josef Motl Datum: , ročník: 7. ročník ZŠ Vzdělávací oblast: Informační technologie Anotace: Prezentace.
EU peníze školám Registrační číslo projektu CZ.1.07/1.4.00/ Název projektu Inovace školství Šablona - název Inovace a zkvalitnění výuky prostřednictvím.
Internet. je celosvětový systém navzájem propojených počítačových sítí („síť sítí“), ve kterých mezi sebou počítače komunikují pomocí rodiny protokolů.
Inf WWW – World Wide Web. Výukový materiál Číslo projektu: CZ.1.07/1.5.00/ Šablona: III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Číslo.
Bradáčová, Šaková.  Velmi jednoduchá stránka, jejímž účelem není přímá podpora prodeje zboží, ale marketingová komunikace.  Technické problémy: 
Inf Webová stránka, princip HTML a CSS. Výukový materiál Číslo projektu: CZ.1.07/1.5.00/ Šablona: III/2 Inovace a zkvalitnění výuky prostřednictvím.
Číslo projektu CZ.1.07/1.5.00/ Kódování materiálu vy_32_INOVACE_inf3_web01 Označení materiálu web01_uvod.pptx Název školy Gymnázium Kladno Autor.
Návrh a tvorba WWW Cvičení 1 HTML 5. Pracovní prostředí Vývojové prostředí NetBeans ( Webový server Apache (
1.5 Systém aktualit Událost Událost = informace o tom, že se v určitý den něco chystá (shromáždění, přednáška, výstava aj.). Časově vymezena od-do. Aktualita.
Centrum informatizace a výpočetní techniky, Západočeská univerzita v Plznihttp:// Ukázky použití šablony a problémy s jednotným vzhledem.
Anotace Materiál je určen pro 1. ročník studijního oboru M/01 PROVOZ A EKONOMIKA DOPRAVY, předmětu Informační a komunikační technologie, inovuje.
Vypracováno kolektivem autorů České společnosti pro technickou normalizaci Úřad pro technickou normalizaci, metrologii a státní zkušebnictví
WWW a HTML Základní pojmy Ivo Peterka.
Vyhledávání v Internetu
Základní škola a mateřská škola Lázně Kynžvart Autor: Mgr
WWW a HTML Základní pojmy Ivo Peterka.
DynaMed ~ Jednoduché prohledávání
Přečtěte si o tom vše Příspěvky Microsoft SharePointu
Přizpůsobení webu Microsoft SharePointu Online
Představení Úvod Celé je to pojaté spíše jako představení služby a jejích možností, nežli konkrétní ukázky Lukáš Čochner.
Tvorba webových stránek
Základní informace - Ovládání systému
Transkript prezentace:

Co je to webová stránka? Příklad přístupné webové stránky Vysvětlení jednotlivých elementů z příkladu Závěr

Zobrazuje informace poskytované v rámci world wide web (www) Informace – prezentovány v podobě hypertextu, který je vytvořen pomocí značek HTML nebo XHTML Stránky jsou ukládány na webových serverech přístupné prostřednictvím pc sítě nebo sítě internet přenášeny pomocí protokolu HTTP (HyperText Transfer Protocol) Statické X Dynamické stránky statické – stejný obsah dynamické – mění svůj obsah, programem (nejčastěji redakční systém) na straně webového serveru

Pod čísly 1) hlavička (angl. header). V hlavičce se v tomto případě nachází logo VŠMIE, panel s vyhledáváním a 2 top menu. 1. top menu se nachází vlevo od vyhledávácího pole – položky v tomto menu jsou 3: Kontakty Mapa webu položka- ŠIS, slouží hlavně pro profesory a studenty

Panel vyhledávání - usnadní návštěvníkům webu přístup k informacím pomocí zadání konkrétního slova, či slovního spojení Vyhledávací skript - prohledá celý web nebo administrátorem definovanou oblast a zobrazí nalezené shody s hledaným výrazem (vstupem), který uživatel do vyhledávacího pole zadal. Případně zobrazí hlášku, že nebyly nalezeny žádné výskyty hledaného výrazu. 2. topmenu, které nás zavedou do hlavních sekcí webových stránek. Vpravo na panelu je umístěn přepínač jazykových mutací webu- angličtina, čeština.

Pod číslem 2 se nachází hlavní obsah titulní stránky (angl. main content). Nachází se zde banner, který upoutává a informuje potencionální zájemce o studium. Pod bannerem nalezneme 3 sloupce stěžejních hlavních sekcí webu Pro zájemce O škole Pro studenty umožňují rychlý přístup do nejvíce navštěvovaných a atraktivních podstránek, sekcí.

- Main content splňuje na úvodní stránce svou úlohu na výbornou, protože zaujme i přes jeho vypovídající hodnotu(banner) a zároveň slouží jako rychlý rozcestník. - bottom skýtá aktuality, které by na většině rozsáhlejších webů neměly chybět, jenž nenásilně kombinuje spolu s kontakty a zajímavými odkazy týkající se školy, které návštěvníka jistě zaujmou. Dělá stránky web vsmie.cz atraktivnější, přístupnější, leč by mohl být vypuštěn - Footer, nutnost každého webu- copyright, rok vytvoření (případně rok spuštění projektu – aktuální rok), tvůrce webu

grafika – nutnost je barevná harmonie (vlastní vzhled a texty- vyjma bannerů) a také použití 1, maximálně 3 barev a jejich odstínů, které budou vzájemně ladit a jejich kombinace bude příjemná na pohled pro lidské oko Na webu naleznete skript, který pomáhá se základním barevným schématem webu. Skript generuje ze škály barev barevné harmonie. Lze navolit až 4 barvy, leč obecně platí, že čím méně, tím lépe, nejlépe do 3 barev včetně

- design- volí se jednoduchý a přehledný v žádném případě by hlavička neměla zastínit ostatní prvky (jak se to nemá dělat viz. na přání zákazníka dělaný ostatní prvky by se také měly držet v určitém velikostním poměru k ostatním, zejména k main content. Záleží na cítění webdesignera a přání zákazníka.

Jako číslo 3 jsme označili postraní panel (angl. sidebar), kde může být umístěno případně další menu, novinky, aktuality či jiné informace, které by návštěvníci neměli přehlédnout. V případě VŠMIE škola vsadila na přehled oborů (odkazy na jednotlivé obory), které škola vyučuje, na elektronickou přihlášku ke studiu a informace pro zájemce (de-facto strukturované menu).

Poslední- 4. část stránky je patička (angl. footer), kam se většinou umísťují podmínky užití, odkaz na mapu webu a na web společnosti či osvč, která web realizovala. Stránky mají všechny náležitosti, co by mít měly (titulní stránka nemusí obsahovat drobečkovou navigaci – breadcrumb, protože by to bylo z hlediska povahy navigace a její funkce zcela zbytečné viz. další slidy).

5. částí stránky se přesouváme do spodní části titulní stránky prezentace (ang. bottom). Nalezneme zde nejdůležitější aktuality spojené se školou a také důležité kontakty, kde nechybějí ani odkazy kontaktní stránky jednotlivých poboček školy.

Stránky jsou čitelné a přehledné. Logo svou velikostí nezastiňuje ostatní pro uživatele důležité prvky na stránce Vyhledávací pole je umístěné tak, aby nerušilo, ale doplňovalo celkový vzhled stránky, stejně jako 1. topmenu, a 2. topmenu všechny výše zmíněné prvky tvoří sladěnou a výstižně informující hlavičku stránky.

elementy 1 a 4 jsou stejné jako na stránce titulní. element 3. – postranní panel (sidebar) se nám z přehledu oborů z titulní stránky změnil na výčet nejnovějších aktualit a panel s Facebookovou stránkou VŠMIE Ve 2. elementu se nám hlavní obsah (main content) rozšířil o další postranní panel (sidebar), tentokráte vlevo, který slouží jako menu, kde se nacházejí podřízené stránky stránce „Pro zájemce“.

5. element je takzvaná drobečková navigace (breadcrumb). Navigace by měla být součástí stránek, zejména na rozsáhlejších webech, kde slouží pro navigaci a snadnější orientaci uživatele- pomáhá se uživateli zorientovat, na kterém místě webu se právě nachází 6. element – zobrazení názvu aktuální stránky v záhlaví prohlížeče je také neméně důležitý prvek, který taktéž slouží pro navigaci, přehlednost a neměl by chybět na žádné stránce.

Z této prezentace jsme se dozvěděli jak by měla vypadat webová stránka se všemi náležitostmi a prvky co k ní patří. A také jsme si vysvětlili jednotlivé prvky nacházející se na webové stránce. Pro samostatné vytvoření tyto údaje ale samozřejmě nestačí. Poslouží nám však dokonale pro představení si správné webové stránky se vším všudy.