1 Provázání stránek Vytvořte dvě www stránky, jednu růžovou a druhou modrou – viz. zdrojové kódy RŮŽOVÁ STRÁNKA Růžová stránka Odkaz na modrou stránku.

Slides:



Advertisements
Podobné prezentace
Rastrové obrázky – teorie Test
Advertisements

Jazyk HTML. Zdrojový kód  Elementy obsah obsah př. důležité př. důležité př. př.
WWW stránky.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
<. DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4
Základy HTML.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
Tvorba www stránek VLOŽENÍ OBRÁZKŮ ICT 4.ročník. Vložení obrázku OBRÁZEK NA WEBOVÝCH STRÁNKÁCH Binární data – ukládáme do samostatných složek (IMAGE,
Internetové stránky a Internetový prohlížeč
HyperText Markup Language
VY_32_INOVACE_4.3.IV1.02/Ku Html dokument a jeho struktura Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/
VY_32_INOVACE_4.3.IV1.03/Ku Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Pavla Kubínková CZ.1.07/1.5.00/ HTML & XHTML.
Obchodní akademie a Střední odborná škola, gen. F. Fajtla, Louny, p.o. Osvoboditelů 380, Louny Číslo projektu CZ.1.07/1.5.00/ Číslo sady29Číslo DUM14.
ÚVOD DO HTML Jak vytvořit stránky. Jak vytvořit www-stránky 1) Vytvořit soubor *.htm, nebo *.html 2) Nahrát soubor na server =>dát na internet.
VY_32_INOVACE_4.3.IVT1.14/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 na web První krůčky Lukáš Reindl. Co je potřeba Budeme potřebovat počítač, na kterém běží alespoň nějaký jednoduchý textový editor (ve Windows Notepad.
TVORBA WEBOVÝCH STRÁNEK
Elektronické prezentace Jiří Fejfar Brno Prezentace obsahuje Úvodní snímek Obsah - může být na druhém snímku Snímky Shrnutí - na závěr (pokud je nutno.
Tvorba www stránek ODKAZY ICT 4.ročník. Vložení odkazu ODKAZY K propojení jednotlivých souborů K propojení jednotlivých souborů K přechodu na jiný web.
Jazyk HTML.
Zadání samostatné práce SP1 Základy HTML. CÍL Ověřit znalosti použití základních HTML construkcí –Základní kostra –Kódování češtiny –Nastavení pozadí.
WWW stránky – Struktura, adresování, hosting Mgr. Lenka Švancarová.
INFORMATIKA 9. ročník.
Textový editor.
VY_32_INOVACE_In 6.,7.19 PowerPoint - Vkládání grafických objektů Anotace: Žák se seznámí se zásadami vkládání grafických objektů jako fotek, klipartů.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
Číslo projektuCZ.1.07/1.5.00/ Číslo materiáluVY_32_INOVACE_259 Název školyGymnázium, Tachov, Pionýrská 1370 Autor Ing. Roman Bartoš Předmět Informatika.
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.
XHTML – odkazy Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.
aneb zásady správné tvorby webových stránek Informatika Milan Šimek
Vzdělávací technologie 2 Tvorba jednoduchých webových stránek Martin Böhm (L06514)
Obrázky v HTML dokumentech Druhy a použití. Obrázky + Zvyšují atraktivitu stránek. + Zvyšují vypovídací schopnost stránek. - Zvyšují dobu načítání stránky.
Nové modulové výukové a inovativní programy - zvýšení kvality ve vzdělávání Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem.
Vytvoření hypertextového odkazu
Základní pojmy (1) Nejpoužívanější internetové prohlížeče: Google Chrome (32.0.x), Mozilla Firefox (27.0), Internet Explorer (11.0.2), Opera (19.0.x),
Párová a nepárová značka, atributy a jejich hodnoty
Klikací mapy v GIMPu Tvorba tzv. klikacích (obrázkových) map s pomocí grafického editoru GIMP Dostupné z Metodického portálu ISSN: ,
Elektronická prezentace Alžběta Srnová Brno Prezentace obsahuje Úvodní snímek Obsah - může být na druhém snímku Snímky Shrnutí– na závěr (pokud je nutno.
Základy HTML 1 Vložení obrázku. 2 Grafické formáty První předpoklad pro vložení obrázku do stránky je jeho uložení ve vhodném formátu. Prohlížeče podporují.
GIMP Využití nástroje Cesty Michal Zerzáň
Jak učit tvorbu www stránek Navarová Adéla. Proč učit tvorbu www stránek? Prezentace na internetu (Výrobky, firmy, celebrity, kluby…)
Registrace uživatele na pro užívání webhostingu.
Základní škola a mateřská škola Bzenec Číslo projektu: CZ.1.07/1.4.00/ Číslo a název šablony klíčové aktivity: III/2: využívání ICT – inovace Vypracoval/a:
Základy VY_30_INOVACE_GR_781. CO JE TO GIMP ? Název vychází ze zkratky GNU Image Manipulation Program, což česky znamená GNU program pro úpravu obrázků.
Programujeme v kódu HTML (Hyper Text Markup Language)
VY_32_INOVACE_GR_789 CD- OBAL. Zadání: vytvořte obal na CD použijte 5 fotografií (každou v samostatné vrstvě) vložené obrázky upravte pomocí nástrojů.
HTML stránka – vložení obrázku Gymnázium a Jazyková škola s právem státní jazykové zkoušky Zlín Tematická oblastTvorba WWW stránky v HTML Datum vytvoření2013.
Obchodní akademie a Jazyková škola s právem státní jazykové zkoušky Jihlava Šablona 32 VY_32_INOVACE_029.ICT.34 Tvorba webových stránek – fotogalerie ZPS.
Tvorba WEBOVÝCH stránek – kostra dokumentu Šablona 32 VY_32_INOVACE_12_10_Tvorba webových stránek-kostra dokumentu.
HTML pokračování. Co obsahuje každý html dokument? stránka stránka ahoj světe HTML.
Elektronické učební materiály - II. stupeň Informatika – aplikace informačních technologií Autor: Bc. Pavel Šiktanc Internetové stránky II. Co se všechno.
Microsoft FRONT PAGE Šablona 32 VY_32_INOVACE_19_10_Front Page.
Základy tvorby www stránky v HTML kódu. © Mgr. Petr Loskot, leden Časopis PPK Časopis PC World.
Název projektu: Učíme obrazem Šablona: III/2
NÁZEV ŠKOLY: Masarykova základní škola a mateřská škola Melč, okres Opava, příspěvková organizace ČÍSLO PROJEKTU: CZ.1.07/1.4.00/ AUTOR: Mgr. Vladimír.
Tvorba webových stránek - tabulka
EU_12_sada1_01_Inf_Úpravy obrázků 1_Šeb
HTML (II) (3).
NÁZEV ŠKOLY: Masarykova základní škola a mateřská škola Melč, okres Opava, příspěvková organizace ČÍSLO PROJEKTU: CZ.1.07/1.4.00/ AUTOR: Mgr. Vladimír.
NÁZEV ŠKOLY:SOŠ Net Office, spol. s r.o. Orlová Lutyně
EU_12_sada1_02_Inf_Úpravy obrázků 2_Šeb
Zadání ručního programování 2.čast - parametrizace
NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov
NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov
NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov
Tvorba webových stránek na google – Sites (4.)
Tvorba webových stránek na google – Sites (6.)
Tvorba webových stránek
Tvorba webových stránek
Transkript prezentace:

1 Provázání stránek Vytvořte dvě www stránky, jednu růžovou a druhou modrou – viz. zdrojové kódy RŮŽOVÁ STRÁNKA Růžová stránka Odkaz na modrou stránku MODRÁ STRÁNKA Modrá stránka Odkaz na růžovou stránku

2 Provázání stránek Obě stránky uložte do společné složky. Název stránky bude wwwr.html (růžová stránka) a wwwm.html (modrá stránka). A nyní doplňte do zdrojových kódů odkazy. Růžová stránka Odkaz na modrou stránku Modrá stránka Odkaz na růžovou stránku

3 Provázání stránek Vyzkoušejte funkčnost odkazů. Jistě jste si všimli zabarvení odkazů v prohlížeči. Barvu odkazů na stránce můžeme změnit v tagu BODY pomocí parametru: link="barva" - pro nenavštívený odkaz vlink="barva" – pro navštívený odkaz alink="barva" – pro aktivní odkaz

4 Provázání stránek A nyní doplňte zdrojové kódy tak, aby odkazy měly barvu textu stránky. Například pro modrou stránku bude úprava následující: Modrá stránka

5 Provázání stránek Teď si zopakujeme práci s obrázky. Soubor "zima.jpg" upravte pro monitory s rozlišením 800x600 pixelů, neměňte proporcionalitu. Dále vytvořte náhledový obrázek velikosti 120x? pixelů, zmenšení obrázku bude proporcionální.

6 Provázání stránek Ke správné funkci vašeho webu nezapomeňte dodržet organizační pravidla. Oba upravené obrázky uložte do složky " obr ". Obrázky pojmenujte dle náhledu a pomocí komprese upravte i jejich velikost.

7 Provázání stránek Nyní vložíme do modré stránky náhledový obrázek. Jistě jste si všimli efektu zarovnání pomocí značky DIV. Modrá stránka Odkaz na růžovou stránku <IMG src="obr/zima1_m.jpg" width="100" heiht="69" alt="Pracejovice v zimě">

8 Provázání stránek Přidáme odkaz. Velký obrázek se otevře v novém okně prohlížeče. Nezapomeňte do popisku uvést velikost stahovaného obrázku. Odkaz na růžovou stránku <IMG src="obr/zima1_m.jpg" width="100" heiht="69" alt="Pracejovice v zimě vel 25 kB">

9 Provázání stránek Na závěr se pokuste upravit zdrojový kód tak, aby výsledek v prohlížeči byl obdobný. Použijte jinou hodnotu parametru target. Popis obrázku alt zrušte a volte jinou možnost.