V tomto článku se dozvíte, jak používat HTML k vytvoření své první webové stránky! V článku budou uvedeny názorné příklady pro lepší pochopení. Udělejme si hned rezervaci, že článek byl původně navržen pro ty, kteří se s HTML teprve začínají. Navíc slibujeme, že do konce čtení tohoto článku si zaručeně vytvoříte svůj první web.
HTML je zkratka pro HyperText Markup Language, tedy jazyk pro organizování textu.
Na rozdíl od programovacích jazyků (JavaScript, PHP atd.), které k provádění akcí na webech používají skripty, sekvenční jazyk (HTML) používá k označení obsahu webu značky.
Začněme se učit HTML od nuly
Stejně jako angličtina se skládá z písmen A, B, C atd., tak se HTML skládá ze zvláštních „písmen“:,,
atd. Tato zvláštní „písmena“jazyka HTML webmasteři nazývají tagy.
Následuje příklad značky HTML.
Tagy Vytvořte podtržení kolem okrajů tohoto textu.
Značky HTML spárované s jazykovými styly CSS vám umožňují rychle a efektivně vytvářet webové stránky.
Místo HTML mezi ostatními jazyky
Jak víte, dobrý webvestavěné alespoň v 5 jazycích.
Moderní web je postaven v jazycích:
- HTML (struktura a řazení).
- CSS (obsah stylu).
- JavaScript (akce prohlížeče).
- PHP (akce serveru).
- SQL (úložiště dat).
HTML je hlavní základní jazyk, na kterém jsou založeny ostatní. Naučit se HTML by proto mělo být prvním krokem pro každého, kdo se učí vytvářet webové stránky na webu.
Tag
Jazyk HTML se v průběhu let od svého vzniku změnil. V současné době většina internetových stránek přechází na nejnovější verzi jazyka – HTML5. Ale i v HTML5 zůstávají základy jazyka nezměněny.
Struktura stránky HTML je jako sendvič. Stejně jako sendvič má dva krajíce chleba, HTML dokument má úvodní a závěrečnou HTML značku.
Tyto štítky, jako chléb v sendviči, obklopují vše uvnitř.
Tag
Jak se budete učit HTML, měli byste se s tagem určitě seznámit. Přímo uvnitř nadřazené značky je veškerý obsah webu včetně značky. Tato značka je povinná a obsahuje všechna nastavení stránky webu, pro kterou je napsána. Tato nastavení nejsou viditelná pro návštěvníky webu, vidí je pouze prohlížeče (Google Chrome, Mozilla Firefox atd.).
Blok nastavení webové stránky obsahuje všechny „nevykreslené“prvky, které pomáhají prohlížeči správně zobrazovat váš web na webu.
Všechny možnosti, kterélze nakonfigurovat uvnitř značky, podíváme se na to, ale o něco později - až přijde čas.
Tag
Štítek, stejně jako štítek, je uvnitř štítku.
Tato značka je potřeba, aby se na vašem webu zobrazovaly všechny informace, které chcete zobrazit.
Nadpisy, odstavce, tabulky, obrázky a odkazy jsou jen malou částí prvků, které mohou být obsaženy ve značce.
Základní struktura HTML dokumentu:
… …
Váš první web
Nyní víte, že můžete vytvářet webové stránky pomocí HTML a že se k tomu používají základní značky:
- . Nastiňuje hranice webové stránky.
- . Obsahuje nastavení pro zobrazení webové stránky v prohlížeči.
- . Obsahuje všechny prvky webové stránky (obrázky, videa, text atd.), které chcete zobrazit návštěvníkům webu.
O dalších značkách jako,,, si povíme brzy.
Bylo by skvělé, kdyby si čtenář nejen přečetl tento článek, ale také hned běžel pilovat své dovednosti. Chcete-li zdokonalit své znalosti HTML, budete si muset vytvořit svůj první web, který bude sloužit jako testovací základna pro vaše nové dovednosti.
Je známo, že mobilní operátoři ("MTS", "MegaFon" atd.) nám poskytují mobilní služby. Stejně tak služby pro tvorbu a správu stránek nám poskytují provozovatelé hostingu. Chcete-li vytvořit svůj web, přejděte na web kteréhokoli bezplatného poskytovatele hostingu.
Ověření poskytovatelé hostingu zahrnují BEGET neboreg, například Můžete si vybrat kohokoli.
Po krátké registraci se po 24 hodinách automaticky vytvoří vaše první webová stránka na internetu, kterou uvidí celý svět a můžete začít cvičit!
Moderní struktura webu
Nyní, když máte svůj web, podívejte se, jaké tagy tag obsahuje a jak organizují informace na webech.
Obrázek výše je schematickým znázorněním struktury, která byla dodána s nejnovější verzí jazyka HTML – HTML5. Spolu s HTML5 přišly nejen nové značky, ale také význam tvorby webových stránek. Všechny tagy, které vidíte na obrázku, jsou obsaženy v hlavním tagu. Tyto značky vám pomohou „nastínit“strukturu vašeho webu a dát mu význam.
Například do tagů … je vhodné umístit název webu (tagy) a popis webu (tagy).
Do tagů je vhodné umístit nabídku (odkazy) webu (tagu).
Do značek je vhodné umístit jakýkoli velký blok informací souvisejících významem. Může to být několik článků, z nichž každý je „obalen“štítky, fotografiemi (tag) nebo tabulkami (tags
) a další.
Do štítků je vhodné umístit jakékoli informace, které neodpovídají významu.
Uvnitř tagů je obvyklé umísťovat další informace, jako jsou kontaktní informace, další sekce webu atd.
Takže teď jste o něco zběhlejší v tom, z čeho se skládají moderní webové stránky. Vezměme si příkladzmatek v mé hlavě vystřídal úžas z vhledu.
Když tedy otevřete správce souborů na stránce svého provozovatele hostingu a najdete dokument s názvem index.php, klidně do něj napište jakoby od začátku strukturu svého webu.
Můj první web
Název stránky
Popis stránky
Odkaz 1 | Odkaz 2 | Odkaz 3
Název některého článku
Toto je blok, který obsahuje jakékoli informace a pomocí CSS můžete tento blok a celý web s veškerým obsahem vybarvit tak, jak chcete. © Všechna práva vyhrazena
Pamatujete si, že jsme říkali, že pro web existují různá nastavení? No, tady to je:
- Pomocí prohlížečů ukazujeme, že stránka může obsahovat ruské i anglické znaky (jinak, když stránku otevřete, uvidíte hrozné krakozyabry).
- se používá k označení názvu stránky, který se zobrazí na kartě prohlížeče a ve vyhledávači ("Yandex", Google a podobně).
Samozřejmě, bez CSS stylů bude váš web vypadat lakomě (černá písmena na bílém pozadí), ale nezapomeňte nejprve napsat svou první stránku v HTML.
Blahopřejeme! Právě jste vytvořili svou první webovou stránku na svém vlastním webu! Bude to zajímavější!
