[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.00,0:00:02.84,Default,,0000,0000,0000,,Už jsme se naučili hromadu HTML tagů.
Dialogue: 0,0:00:03.00,0:00:04.80,Default,,0000,0000,0000,,Ale víte vlastně, co to HTML znamená?
Dialogue: 0,0:00:04.85,0:00:09.09,Default,,0000,0000,0000,,HTML je zkratka pro hypertextový\Nznačkovací jazyk.
Dialogue: 0,0:00:09.11,0:00:14.18,Default,,0000,0000,0000,,Značkovací jazyk používá značky,\Nneboli tagy, k označení obsahu.
Dialogue: 0,0:00:14.18,0:00:16.86,Default,,0000,0000,0000,,Ale co je to vlastně hypertext?
Dialogue: 0,0:00:16.87,0:00:21.17,Default,,0000,0000,0000,,Je to fráze, která byla vynalezena\Nještě před existencí Internetu, v šedesátých letech.
Dialogue: 0,0:00:21.17,0:00:23.82,Default,,0000,0000,0000,,Byl to text, který byl spojen\Ns jiným textem,
Dialogue: 0,0:00:23.82,0:00:26.26,Default,,0000,0000,0000,,na který se čtenář mohl ihned přesunout.
Dialogue: 0,0:00:26.27,0:00:29.72,Default,,0000,0000,0000,,Tim Berners-Lee vynalezl HTML,
Dialogue: 0,0:00:29.72,0:00:32.76,Default,,0000,0000,0000,,a ostatní součásti Internetu, \Nnapříklad HTTP,
Dialogue: 0,0:00:32.79,0:00:34.91,Default,,0000,0000,0000,,jako způsob spojování\Ntextu s jiným textem
Dialogue: 0,0:00:34.91,0:00:36.72,Default,,0000,0000,0000,,kdekoliv na světě.
Dialogue: 0,0:00:36.75,0:00:39.19,Default,,0000,0000,0000,,Jak spojujeme webové stránky s ostatními
Dialogue: 0,0:00:39.19,0:00:41.28,Default,,0000,0000,0000,,v hypertextovém značkovacím jazyce?
Dialogue: 0,0:00:41.28,0:00:43.45,Default,,0000,0000,0000,,Pomocí hyperlinku, samozřejmě!
Dialogue: 0,0:00:43.45,0:00:46.28,Default,,0000,0000,0000,,Česky mu říkáme prostě odkaz.
Dialogue: 0,0:00:46.28,0:00:48.60,Default,,0000,0000,0000,,Jak se tvoří odkaz v HTML?
Dialogue: 0,0:00:48.64,0:00:50.30,Default,,0000,0000,0000,,Tady nastává problém.
Dialogue: 0,0:00:50.30,0:00:52.77,Default,,0000,0000,0000,,Mysleli byste si, že použijete značku\N'link' …
Dialogue: 0,0:00:52.77,0:00:57.63,Default,,0000,0000,0000,,Ta je ale ve skutečnosti použita pro \Njiné typy odkazů v HTML.
Dialogue: 0,0:00:57.63,0:01:01.61,Default,,0000,0000,0000,,Místo toho používáme tag '',\Nkde 'a' znamená "anchor",
Dialogue: 0,0:01:01.61,0:01:03.17,Default,,0000,0000,0000,,což je anglicky kotva.
Dialogue: 0,0:01:03.17,0:01:06.45,Default,,0000,0000,0000,,To zakotví odkaz na stránce v dané oblasti
Dialogue: 0,0:01:06.45,0:01:09.42,Default,,0000,0000,0000,,a propojí kotvu s jinou stránkou.
Dialogue: 0,0:01:09.44,0:01:11.99,Default,,0000,0000,0000,,Víme, že pro vytvoření odkazu\Nmusíme napsat tag,
Dialogue: 0,0:01:11.99,0:01:14.62,Default,,0000,0000,0000,,ale musíme se také rozhodnout,\Njaký bude text odkazu
Dialogue: 0,0:01:14.62,0:01:17.22,Default,,0000,0000,0000,,a jaká bude adresa odkazu.
Dialogue: 0,0:01:17.23,0:01:24.07,Default,,0000,0000,0000,,Pojďme udělat odkaz na stránku s dalšími \Ninformacemi o vzniku Internetu.
Dialogue: 0,0:01:24.07,0:01:29.51,Default,,0000,0000,0000,,Text odkazu napíšeme mezi\Notevíracím a uzavíracím tagem .
Dialogue: 0,0:01:29.60,0:01:31.90,Default,,0000,0000,0000,,Takže tam nechám kurzor a napíšu,
Dialogue: 0,0:01:31.90,0:01:36.61,Default,,0000,0000,0000,,"Přečtěte si více o historii HTML".
Dialogue: 0,0:01:36.61,0:01:41.02,Default,,0000,0000,0000,,Nyní vidíme, že tento text\Nvypadá jako odkaz,
Dialogue: 0,0:01:41.06,0:01:44.32,Default,,0000,0000,0000,,ale zatím nikam nepřesměruje.\NMusíme přidat adresu.
Dialogue: 0,0:01:44.35,0:01:47.48,Default,,0000,0000,0000,,Nechceme ovšem adresu odkazu\Nzobrazit na stránce,
Dialogue: 0,0:01:47.48,0:01:49.94,Default,,0000,0000,0000,,pouze potřebujeme, aby prohlížeč věděl,\Nco s tím.
Dialogue: 0,0:01:49.99,0:01:53.04,Default,,0000,0000,0000,,Takže to dáme do atributu tagu .
Dialogue: 0,0:01:53.09,0:01:56.94,Default,,0000,0000,0000,,Konkrétně atributu "href".\N(pozn. číst jako há-ref)
Dialogue: 0,0:01:56.98,0:01:59.75,Default,,0000,0000,0000,,Co samotné "href" znamená?
Dialogue: 0,0:01:59.77,0:02:03.26,Default,,0000,0000,0000,,Dám vám nápovědu:\NUž jste to "h" viděli hodně.
Dialogue: 0,0:02:03.28,0:02:06.12,Default,,0000,0000,0000,,Znamená to "hyper"! Hyper-reference.
Dialogue: 0,0:02:06.12,0:02:11.97,Default,,0000,0000,0000,,Nyní vložím dovnitř atributu adresu,\Nkteré se také říká URL.
Dialogue: 0,0:02:12.04,0:02:15.94,Default,,0000,0000,0000,,Všimli jste si, že URL začíná protokolem\N"http:"?
Dialogue: 0,0:02:16.05,0:02:19.04,Default,,0000,0000,0000,,A hádejte co to "h" znamená?\NHyper!
Dialogue: 0,0:02:19.08,0:02:21.48,Default,,0000,0000,0000,,Celé HTML je o hyper.
Dialogue: 0,0:02:21.55,0:02:25.66,Default,,0000,0000,0000,,URL adresa specifikuje vše, co prohlížeč\Npotřebuje k nalezení webové stránky:
Dialogue: 0,0:02:25.72,0:02:27.96,Default,,0000,0000,0000,,Protokol, který je použit,
Dialogue: 0,0:02:28.04,0:02:30.36,Default,,0000,0000,0000,,na jaké je doméně,
Dialogue: 0,0:02:30.46,0:02:34.26,Default,,0000,0000,0000,,a cesta ke stránce, která je\Nna nějakém serveru.
Dialogue: 0,0:02:34.29,0:02:38.58,Default,,0000,0000,0000,,Jelikož to specifikuje vše,\Nnazýváme to "absolutní URL".
Dialogue: 0,0:02:38.62,0:02:43.50,Default,,0000,0000,0000,,Na některých stránkách můžete vidět URL\Nadresy, které začínají lomítkem a cestou.
Dialogue: 0,0:02:43.56,0:02:46.18,Default,,0000,0000,0000,,To řekne prohlížeči, aby zůstal\Nna stejné doméně,
Dialogue: 0,0:02:46.18,0:02:48.63,Default,,0000,0000,0000,,a pouze v této doméně\Nnašel jinou cestu.
Dialogue: 0,0:02:48.64,0:02:50.63,Default,,0000,0000,0000,,Tomu říkáme "relativní URL".
Dialogue: 0,0:02:50.68,0:02:54.05,Default,,0000,0000,0000,,Používáme je po celé Khan academy,\Nkdyž odkazujeme mezi obsahem.
Dialogue: 0,0:02:54.14,0:02:57.62,Default,,0000,0000,0000,,Na vašich stránkách se raději\Ndržte absolutních URL,
Dialogue: 0,0:02:57.62,0:02:59.29,Default,,0000,0000,0000,,tím nic nezkazíte.
Dialogue: 0,0:02:59.32,0:03:02.15,Default,,0000,0000,0000,,Můžeme také prohlížeči říci,\Nkde má stránku otevřít:
Dialogue: 0,0:03:02.15,0:03:04.73,Default,,0000,0000,0000,,do aktuálního okna, nebo do nového.
Dialogue: 0,0:03:04.77,0:03:07.06,Default,,0000,0000,0000,,Aby otevřel prohlížeč odkaz v novém okně,
Dialogue: 0,0:03:07.06,0:03:10.75,Default,,0000,0000,0000,,přidáme další atribut, 'target'.
Dialogue: 0,0:03:10.80,0:03:15.26,Default,,0000,0000,0000,,target="_blank"
Dialogue: 0,0:03:15.29,0:03:19.41,Default,,0000,0000,0000,,Nyní chci, aby jste stopnuli video a\Nvyzkoušeli kliknout na odkaz.
Dialogue: 0,0:03:19.44,0:03:23.37,Default,,0000,0000,0000,,Nebojte se a zkuste to, počkám.\Nklik-klik!
Dialogue: 0,0:03:23.39,0:03:24.37,Default,,0000,0000,0000,,Co se stalo?
Dialogue: 0,0:03:24.48,0:03:28.24,Default,,0000,0000,0000,,Asi jste viděli varování o odkazu\Ngenerovaném uživatelskou stránkou.
Dialogue: 0,0:03:28.24,0:03:30.62,Default,,0000,0000,0000,,A dále když kliknete na "OK",\Notevře se odkaz.
Dialogue: 0,0:03:30.68,0:03:33.12,Default,,0000,0000,0000,,S odkazy na stránkách\Nvytvořených na Khan Academy\N
Dialogue: 0,0:03:33.12,0:03:34.40,Default,,0000,0000,0000,,zacházíme totiž opatrně.
Dialogue: 0,0:03:34.42,0:03:37.80,Default,,0000,0000,0000,,Nechceme, aby si lidé mysleli,\Nže je odkazujeme
Dialogue: 0,0:03:37.80,0:03:41.05,Default,,0000,0000,0000,,na stránky Khan Academy, a pak se dostali\Nna nebezpečné, neznámé stránky.
Dialogue: 0,0:03:41.07,0:03:43.99,Default,,0000,0000,0000,,Takže každý zde udělaný odkaz \Nmá toto varování.
Dialogue: 0,0:03:43.99,0:03:46.16,Default,,0000,0000,0000,,A každý odkaz vyskočí do nového okna.
Dialogue: 0,0:03:46.30,0:03:50.22,Default,,0000,0000,0000,,To znamená, že vlastně můžu odstranit\Ntento atribut target,
Dialogue: 0,0:03:50.22,0:03:53.05,Default,,0000,0000,0000,,jelikož je o něj už postaráno.
Dialogue: 0,0:03:53.09,0:03:54.42,Default,,0000,0000,0000,,Nebo to tu můžu nechat,
Dialogue: 0,0:03:54.42,0:03:57.76,Default,,0000,0000,0000,,v případě že bych chtěla jednou \Npřesunout toto HTML z Khan Academy
Dialogue: 0,0:03:57.76,0:04:00.84,Default,,0000,0000,0000,,a chci, aby se odkaz\Notevřel v novém okně.
Dialogue: 0,0:04:00.87,0:04:02.72,Default,,0000,0000,0000,,Kdy byste měli atribut target používat?
Dialogue: 0,0:04:02.78,0:04:06.30,Default,,0000,0000,0000,,Obecně pokud odkaz směřuje\Nna jinou stránku na stejné doméně,
Dialogue: 0,0:04:06.30,0:04:08.02,Default,,0000,0000,0000,,měla by se otevřít ve stejném okně.
Dialogue: 0,0:04:08.02,0:04:12.18,Default,,0000,0000,0000,,A pokud směřujete na stránku jiné domény,\Nje dobré ji otevřít v novém okně.
Dialogue: 0,0:04:12.55,0:04:16.65,Default,,0000,0000,0000,,Ještě vám chci ukázat jednu věc.
Dialogue: 0,0:04:16.69,0:04:19.05,Default,,0000,0000,0000,,K odkazování nemusíme používat jen text.
Dialogue: 0,0:04:19.05,0:04:22.08,Default,,0000,0000,0000,,K vytvoření odkazu můžeme\Npoužít třeba i obrázek!
Dialogue: 0,0:04:22.08,0:04:26.82,Default,,0000,0000,0000,,Zde máme obrázek,\Nna kterém je Tim Berners-Lee.
Dialogue: 0,0:04:26.87,0:04:30.45,Default,,0000,0000,0000,,Tento kód vyjmu...
Dialogue: 0,0:04:30.46,0:04:34.07,Default,,0000,0000,0000,,A vložím ho zde dovnitř tohoto odkazu.
Dialogue: 0,0:04:34.09,0:04:36.07,Default,,0000,0000,0000,,No krása!
Dialogue: 0,0:04:36.07,0:04:38.96,Default,,0000,0000,0000,,Nyní, pokud přejedu myší tento obrázek,
Dialogue: 0,0:04:38.96,0:04:41.31,Default,,0000,0000,0000,,uvidím, že můj kurzor se\Nzmění na ručičku,
Dialogue: 0,0:04:41.31,0:04:44.38,Default,,0000,0000,0000,,a kliknutím se dostanu na stránku CERNu.
Dialogue: 0,0:04:44.38,0:04:46.95,Default,,0000,0000,0000,,Ve skutečnosti můžete udělat\Nodkaz z celé stránky.
Dialogue: 0,0:04:46.95,0:04:49.87,Default,,0000,0000,0000,,Celá by se podtrhla a vybarvila modře.
Dialogue: 0,0:04:49.87,0:04:56.68,Default,,0000,0000,0000,,Ale to prosím nedělejte!\NA odkazy vytvářejte s láskou.