Historie vzniku a vývoje HTML. Základy jazyka HTML Co je jazyk HTML?

💖 Líbí se vám? Sdílejte odkaz se svými přáteli

V tomto článku se podíváme na otázku, co je html a podíváme se na historii jeho vývoje. Pojďme si říct, jak vytvořit web a zda je to vůbec náročné. Takže, začněme

1. HTML kód - co to je jednoduchými slovy

HTML (hyper text markup language) je speciální značkovací jazyk, který se používá k vytváření webových stránek na internetu.

Prohlížeče html perfektně rozumí a dokážou jej srozumitelně interpretovat. Obecně platí, že jakákoli stránka webu je html kód, který prohlížeč převede do uživatelsky přívětivé podoby. Mimochodem, kód jakékoli stránky je přístupný všem. Chcete-li jej zobrazit, klikněte pravým tlačítkem a vyberte Zobrazit zdrojový kód nebo stiskněte CTRL+U na klávesnici:

Značkovací jazyk HTML si získal velkou oblibu. V tuto chvíli je to jediný jazyk, pomocí kterého se vytváří označení webu. Chci zdůraznit skutečnost, že se jedná o značkování. V jiném programovacím jazyce (nejčastěji php) je vytvořen tzv. “engine”, který umožňuje vytvářet interaktivní stránky (html toto neumožňuje).

Poznámka

Pozorný čtenář si všimne, že ne všechny stránky na internetu mají na konci příponu .html. Existují například stránky /katalog/seznam (bez jakékoli přípony). Toto je nesprávné, ale prohlížeč bude schopen pochopit, že se jedná o webový dokument, a správně jej zobrazit.

2. Příklad a struktura html kódu

Níže je uveden příklad se strukturou typické html stránky. Upozorňujeme, že html kód je rozdělen do dvou oblastí: záhlaví a tělo stránky.

Titulek stránky ... Tagy nadpisů (spojující styly, skripty) ... ... Hlavička webu ... Levý sloupec ... ... Hlavní část webu ... ... Pravý sloupec ... Spodní část strana .. .

Tento kód lze upravit v libovolném textovém editoru. Nejčastěji se notepad++ používá k vývoji html webu (pokročilý editor, který zvýrazňuje značky a zobrazuje chyby). Pro práci s HTML značkami je ale lepší používat pokročilejší editory.

Značení se skládá z html značek (někdy psaných „tag“).

3. Co je HTML tag

Značka HTML je jedním z prvků rozvržení HTML, který je potřebný pro strukturu. Štítky mají otevírací znak< и закрывающий > .

Například, . Téměř každý tag je spárován a vyžaduje uzavírací tag. Pokud webmaster zapomene vložit uzavírací značku nebo to udělá špatně, rozložení nebude platné (viz ověření webu). Pokud je tato značka ta, která drží „rám“ webu, může se web „vznášet“ (postranní sloupec se posune dolů atd.).

Je zakázáno uzavírat štítky mimo pořadí, ve kterém byly otevřeny. Například

Přečtěte si článek, kde najdete další podrobnosti o vytváření stránky HTML.

Asi začnu od začátku...

Jazyk HTML není ve své podstatě programovacím jazykem, je to značkovací jazyk pro hypertextové dokumenty. Jinými slovy, je zodpovědný za uspořádání v dokumentu vašich textů, kreseb, tabulek... určených pro život na internetu. Není možné ho donutit vypočítat, kolik dvakrát dva jsou dva, nejsou v tom žádné logické funkce, ale je krásné a hlavně snadné zveřejnit informaci, že dvakrát dva jsou čtyři - to je snadné. Tento jazyk se čte pomocí vám známých programů, nazývaných prohlížeče (prohlížeče), které „znají“ standardní příkazy jazyka html a „žvýkají“ je, zobrazují dokumenty na monitoru počítače ve formě, ve které webmaster - překladač dokumentů – chce je prezentovat.

Nyní o příkazech - nazývají se deskriptory, ale častěji - značky.

Vraťme se na naši první stránku... takže jsme napsali:



Moje první stránka


Ahoj světe!!!


To je to, co je napsáno mezi - nazývají se tagy, nejsou viditelné pro čtenáře, který se dívá na vaši stránku, ale jsou jasně viditelné pro prohlížeč, který když na značku narazil, chápe ji jako signál, že bude; být dokumentem, který je potřeba přečíst a zobrazit na monitoru v požadované podobě.. ale tag říká, že dokument skončil a nic dalšího se od něj, tedy prohlížeče, nevyžaduje a může si s klidným svědomím odpočinout .

Co jsme tedy napsali? a jak to ten prohlížeč čte?

Myšlenky prohlížeče:

- začátek dokumentu.. opět spousta práce..
- podívejte se do anglického slovníku a přeložte „hlava“…není problém s pilinami v mé hlavě!! ... zde jsou základní servisní informace o dokumentu.. tak co po mě chtějí?
- „title“ znamená.. musíte napsat jeho název do záhlaví okna:
Moje první stránka - Kotlík opět trénuje..
- celý název je u konce.. můžete jít dál..
- jo, a kromě toho jména si v hlavě nedržíme žádné další nesmyslné myšlenky..
- „Tělo“ dokumentu, vše, co je napsáno níže, je vystaveno veřejnosti
Ahoj světe!!! - jak milé! Už dost!!!

- přesunout text na další řádek... dokonce tuším, co v něm bude...
Jmenuji se (zde vaše jméno), toto je moje první stránka! - no jo to je.. nic originálnějšího vymyslet nemůžou..
- to je vše? Ukázat nic jiného?
- No a to je konec!! Nebudit, nepřevracet se, v případě požáru vyndat jako první!!

Zhruba takto funguje čtení naší stránky.. Jak vidíte, prohlížeč je dost vrtošivý typ, takže potřebuje dávat jasné a přesné příkazy, jinak bude nadávat.. a nahlas.. a proto si pamatujme následující věci:

1) Je potřeba si jednou provždy pamatovat, že pokud existuje otevírací visačka, musí existovat i zavírací

I když existují výjimky, jako je náš tag
- nevyžaduje uzavření, protože pouze říká, že se má napsat na nový řádek. Mimochodem, zkuste přidat pár dalších stejných před řádek „My name is..“ a uvidíte, že ve výsledku to znatelně kleslo.. (No, samozřejmě, uložte změny do poznámkového bloku a klikněte na tlačítko „obnovit“ v prohlížeči)

2) Všechny dokumenty musí mít následující šablonu kódu:

- začátek dokumentu
- začátek hlavy
- zavírání hlavy
- začátek těla
- uzavření těla
- konec dokumentu

Tyto značky jsou povinné! Musí být vždy napsány pro každou novou stránku a pouze v tomto pořadí! Nesnažte se vše obrátit vzhůru nohama...

3) O objednávce:

Otevírací a zavírací tag je jakýsi kontejner, krabička, do které se dají ukládat další tagy - menší krabičky... proto by podle logiky měl dokument vypadat takto:




obsah


Pokud napíšete například takto:




obsah



Ukáže se, že je to svinstvo, které se vám nevejde do hlavy, „velký“ už je zavřený a „trčí“ z něj „malý“, který je zamčený „uprostřed“ a „ content” se rozsypal všude.. I pro člověka je těžké si představit, o čem je řeč o prohlížeči.. Jasně strukturujte kód své stránky, jinak nebude nic fungovat..

No, naučili jsme se psát jednoduchý text, začínáme! v další kapitole budu mluvit o tom, co s tím můžete dělat..

    Při psaní webu vytvořte složku na libovolném vhodném místě na pevném disku, nazvěte ji, jak chcete, pokud je to jasné... ukládejte své stránky do této složky a dejte jim smysluplné názvy... možnosti jako aaa. html, 123.html povede ke zmatkům a zmatkům... V této fázi se vám tato rada nebude zdát praktická, ale do budoucna vám značně usnadní práci. Představte si například alespoň 20-30 takových souborů, jejichž názvy musíte mít na paměti, abyste je mohli křížově odkazovat. Nejprve objednejte!

    Při psaní kódu vám radím, abyste se drželi „dobrého stylu psaní“, to znamená, že značky pište „žebříčkovým“ způsobem, protože jedna značka je vnořena do druhé. Postupem času pochopíte, že čtení kódu napsaného takto:



    Moje první stránka


    Ahoj světe!!!

    Jmenuji se Carlson, toto je moje první stránka!

    Mnohem jednodušší než toto:



    Moje první stránka


    Ahoj světe!!!

    Jmenuji se Carlson, toto je moje první stránka!

    A ještě víc než tohle:

    Moje první stránka Ahoj světe!!!
    Jmenuji se Carlson, toto je moje první stránka!

    I když jde o zvyk... pořád je lepší si zvyknout na psaní „čitelně“.

S nástupem počítačových sítí a zejména World Wide Web vyvstala potřeba přenášet informace pro různé platformy. Je totiž nutné, aby všechny prvky dokumentu byly na všech počítačích zobrazeny shodně, bez ohledu na použitý systém. K tomu slouží speciální jazyk – HTML. První použití tohoto jazyka popisu stránky bylo použito k zobrazení vědeckých informací v Evropském středisku jaderného výzkumu (Ženeva) a bylo použito k zobrazení informací pro všechny počítače v místní síti. HTML dnes slouží jako nedílná součást většiny programů a především k zobrazování internetových stránek. Ve skutečnosti každý uživatel globální sítě používá HTML při návštěvě jakékoli webové stránky. Veškeré informace, které uživatel vidí v okně prohlížeče, jsou popsány pomocí HTML a samotné prohlížeče jsou specializované programy pro práci s jazykem HTML.

Co je HTML?

HTML nelze plně nazvat programovacím jazykem, i když mnoho funkcí umožňuje vytvářet jednoduché aplikace přímo v kódu. K popisu vlastností prvků se používají deskriptory (tagy), pomocí kterých se specifikuje velikost, poloha a speciální vlastnosti prvků a také odkazy na další prvky samotného textu nebo jiných dokumentů. Celý komplex kódu se nazývá hypertext a zkratka HTML je zkratka pro Hyper Text Markup Language, což v překladu znamená „velký a mocný“ znamená „hypertextový značkovací jazyk“.

Speciální vývoj HTML obdržel spolu s vývojem WWW (World Wide Web), protože byl vyvinut jako univerzální jazyk pro všechna zařízení bez ohledu na jejich vybavení. Použití jazyka umožňuje strukturálně zobrazovat informace a zjednodušuje jejich vnímání. Ve srovnání s tiskovinami by to odpovídalo sloupkům a stránkám novin. Nadpisy, pozice obrázků, tabulky - to vše je nezbytné pro strukturovanou prezentaci, protože souvislé pole textu je velmi obtížně čitelné.

První verze HTML byly fragmentované a neměly určitou jednotu. V důsledku toho bylo nutné vyvinout určitý jednotný standard. To bylo provedeno v roce 1995 a standard byl formalizován jako oficiální verze HTML 2.0. Po 2 letech (v roce 1997) do něj byly přidány některé funkce. Nový formát se jmenoval HTML 3.0 a byl navržen organizací W3C ( World Wide Web Consortium). Teoreticky zahrnoval všechny funkce 2.0, ale v té době byly možnosti prohlížeče velmi omezené, takže nebylo dosaženo plné kompatibility. Do konce roku 1997, po testování verze 3.2 jazyka, byl přijat nový standard 4.0. Odstranil staré deskriptory a zavedl nové, zejména použití kaskádových stylů (CSS).

Základní struktura dokumentu

Většina moderních programů pro sazbu stránek, jako je Dreamweaver a Microsoft SharePoint Designer, automaticky vytváří základní strukturu dokumentů, ale abyste ji mohli správně číst a vytvářet sami, musíte se seznámit s jednoduchými pravidly.

Označení dokumentů se provádí pomocí značek, obvykle ve dvojicích (otvírání a zavírání). Štítky jsou uzavřeny v lomených závorkách a uživateli se nezobrazují, ale přísně dodržují rozvržení stránky.

HTML dokument začíná a končí značkami formátu dokumentu.

Zde je kód stránky

Tag dokumentu může předcházet standard, podle kterého se bude obsah zobrazovat (tag DOCTYPE).

V dokumentu je název, který je čten prohlížečem, ale není zobrazen v okně, a tělo stránky, které uživatel skutečně vidí.

Záhlaví je definováno značkami a a obsahuje data určená k formátování dokumentu. Záhlaví také obsahuje načtené skripty, které jsou nutné k zobrazení dat. Ve značkách< title>a zapíše se název stránky, který se zobrazí v titulku okna nebo záložky.

Hlavní kód stránky je reprezentován pomocí značek a . Na obrazovce se zobrazí vše, co je mezi nimi napsáno, s výjimkou prvků, pro které jsou určeny speciální hodnoty, a samotných značek pro formátování dokumentu.

Struktura dokumentu HTML může být znázorněna následovně.

< title>Název stránky (odráží se v okně!)

Název dokumentu. Nezobrazuje se na obrazovce

Tělo dokumentu. Zobrazeno na obrazovce

Základy HTML pro začátečníky, co by měl nyní znát každý začínající webmaster nebo blogger. Pokud se chcete naučit vytvářet základní webové stránky, rozumět samotnému kódu, vědět, co se za čím skrývá a co by mělo jít, bez znalosti základů jazyka HTML to prostě nejde. Na svém blogu budu mít celý řetězec článků, které se tomuto tématu budu věnovat od A do Z, popíšu každý tag, který je v dokumentu přítomen, co znamená a jak jej správně používat.

Základy HTML

Pokud neznáte nejzákladnější věci, vaše cesta je uzavřena. Věřím, že každý člověk, který se rozhodne vyvíjet a tvořit webové stránky, by měl znát a rozumět základům, z čeho se samotný web skládá, jak funguje a co se děje v samotném kódu.

Samozřejmě, existuje poměrně dost programovacích jazyků, všechny jsou svým způsobem složité, ale jsou některé, které bezpodmínečně potřebujete znát. Pokud chcete krásně navrhnout dopis, který má být zaslán poštou, máte svou vlastní skupinu VKontakte, skupinu na jiných sociálních sítích, stejný kanál YouTube, musíte si pohrát s kódem na kterémkoli z motorů webu, stačí znát základní pojmy.

Uvedl jsem jen pár příkladů, ve skutečnosti se tyto znalosti nyní na internetu využívají stále častěji. Jsem spíše praktik než teoretik, a tak vám ve svých článcích v této sekci ukážu své příklady, jak a co jsem dělal, krok za krokem. Uveřejním vzorové stránky i celé weby.

Html dokument je nejjednodušší textový dokument, značkovací jazyk, se kterým se na internetu setkáváte každý den. Tagy popisují strukturu dokumentu. Tagy jsou formátovány jako hranaté< >závorky, do kterých je napsán název značky. Prohlížeč se podívá na strukturu dokumentu, sestaví jej a zobrazí podle jeho pokynů na vašem monitoru, pokud jste samozřejmě vše udělali správně.

Celý tento proces začíná ještě předtím, než uvidíte hotový obrázek. Prohlížeče zpracovávají dokument postupně, od začátku do konce. Včetně všeho, co by na stránce mělo být. Tabulky, obrázky, skripty a tak dále, kromě stylů CSS.

Základy pro začátečníky

Co je html – když se podíváte na to, co píše Wikipedie – (HyperText Markup Language) hypertextový značkovací jazyk pro dokumenty. Většina stránek na internetu obsahuje označení stránek v tomto jazyce. Tento jazyk interpretují prohlížeče a výsledný formátovaný text se zobrazí na monitoru vašeho počítače nebo mobilního zařízení.

Tento jazyk je ze své podstaty velmi snadný a dostupný k naučení. Každý se může naučit a pochopit jeho základy. Abyste mohli takový jazyk používat, musíte znát a používat deskriptory, které se také nazývají tagy. Dokument se vytváří pomocí značek.

Z čeho by se měla skládat struktura dokumentu, jaké tagy by měly být přítomny. Pojďme se na vše podívat na jednom malém příkladu. Napsal jsem nějaký text v MS Office a ukázal ho na tomto snímku obrazovky.

Chcete-li tento text zobrazit v prohlížeči stejným způsobem, jako byl napsán v dokumentu, musíte k němu přidat označení stránky, které obsahuje některé značky. Nejprve se na ně podívejte, pak každého popíšu, kdo je za co zodpovědný.

Vítejte na mém blogu, nyní absolvujete lekci základů HTML. Pokud se vám tento článek líbil, můžete se přihlásit k odběru tohoto blogu a dostávat nové články do vaší e-mailové schránky.

Blog Evgeny Nesmelova! webové stránky Základy html a css pro začátečníky

Z jakých značek se skládá jakýkoli html dokument, co obsahuje a kde by to mělo být vše zapsáno?

< html >

< body >

< h2 >< / h2 >

< p >Vítejte na mém blogu, nyní si projděte výukový program Základy HTML. Pokud se vám tento článek líbil, můžete se přihlásit k odběru tohoto blogu a dostávat nové články do vaší e-mailové schránky.< / p >

< h2 >Blog Evgenia Nesmelov! Nesmelov. ru Základy HTML a CSS pro začátečníky< / h2 >

< / body >

< / html >

Jakýkoli kód se skládá ze znaků, které jsou umístěny v lomených závorkách. To vše se nazývá prvky. Všechny prvky se obvykle skládají ze dvou značek, otevírání a zavírání. Doporučuji vám, abyste si nejprve pečlivě prohlédli značky, pokud některý z nich vynecháte a nezavřete jej, budete muset opravit velké části kódu, abyste našli chybu.

Byly případy, kdy to trvalo déle než jeden den, člověk kontaktuje a žádá o pomoc, nemůže na svých stránkách najít chybu, proto se vždy velmi pečlivě podívejte, co a kam píšete. Pojďme se nyní pomocí tohoto příkladu podívat na každý prvek kódu, co je v něm napsáno, co to znamená a co se nakonec stane.

Většina tagů je párových, což zahrnuje úvodní tag a závěrečný tag. Kromě těchto značek existují také jednotlivé značky. Tagy mohou jít spolu s ostatními, a tak se vnořit do sebe. Například zobrazit text tučně a kurzívou najednou.

Text

< strong > < i >Text< / strong > < / i >

Struktura dokumentu HTML

Ještě jednou připomenu, že je třeba dodržovat pravidla, která jsou v dokumentu přítomna. Takto prohlížeč rozumí tomu, co je na stránce, její sekvenci, obsahu a podobně.

Značka je komponenta, která říká webovému prohlížeči, aby provedl konkrétní úkol. Například přítomnost odstavce, tabulky, formuláře nebo obrázku.

Atribut – upravuje značku. Můžete například zarovnat odstavec na střed nebo doprava, také nastavit umístění obrázku na stránce a tak dále.

VŽDY zavřete štítky, pokud je otevřete, měli byste je rozhodně zavřít. V opačném případě dojde k chybě a váš dokument se na stránce nezobrazí správně. Existují i ​​výjimky, na které bychom neměli zapomínat.

Je jasné, že je nutné pochopit, že existuje název dokumentu a jeho tělo. Titulek je vše, co tag obsahuje. Tělo dokumentu (), tělo dokumentu obsahuje veškerý obsah stránky. Pokud je potřeba zanechat část kódu pro sebe, a tím tyto značky uzavřít do komentářů, použije se k tomu značka. Vše, co je uvnitř takové značky, slouží jako komentář a prohlížeče to nevnímají.

Začněme tím úplně prvním. Na začátku dokumentu jsem otevřel tag a na konci jsem ho zavřel. Tento kód je přítomen v naprosto každém dokumentu a říká prohlížeči, že vše umístěné mezi těmito značkami je kód HTML. Je to kořen dokumentu samotného, ​​vše, co je následně přítomno za touto značkou, již není zahrnuto v dokumentu a není vnímáno prohlížeči. Na samém začátku dokumentu se tag otevře a na samém konci se musí zavřít.

Celá část této značky obsahuje všechny technické informace dokumentu. Stejně jako předchozí štítek musí být hlava také otevřena a zavřena na konci. Tyto informace zahrnují název stránky, popis, klíčová slova vyhledávače a kódování. O kódování trochu níže.

Obsah

< head >Obsah< / head >

Tato značka je součástí hlavy a musí být napsána uvnitř značky hlavy. Tento tag title je povinný a musí být přítomen v každém HTML dokumentu. Kromě toho se zobrazuje jako název okna prohlížeče. Délka takové hlavičky by neměla přesáhnout 60 znaků. Text takové hlavičky by měl obsahovat co nejúplnější informace, které charakterizují obsah stránky.

Pokud jste do záhlaví napsali „Ahoj světe“, toto je informace, která se má na stránce zobrazovat a žádná jiná. Neměli byste klamat lidi a vyhledávače, oni to nemají rádi, a tím to pro sebe ještě zhoršujete. Informace obsažené v této značce by měly být relevantní k obsahu vaší stránky.

Po povinném title tagu je volitelný, ale neméně důležitý meta tag. Tato značka je jednoduchá. Pomocí této značky nastavíte popis stránky (description) a její klíčová slova (keywords).

Kromě toho může meta tag obsahovat údaje o autorovi stránky a další vlastnosti metadat. Můžete zabránit tomu, aby byla celá stránka indexována vyhledávači. Nastavte stránku tak, aby se automaticky obnovovala po 20 sekundách nebo po 5 sekundách, po níž následoval přechod na jinou stránku.

< meta name = "robots" content = "index, follow" >

< meta http - equiv = "refresh" content = "20" >

< meta http - equiv = "refresh" content = "5; url=http://сайт/" >

Takových meta prvků může být několik, protože mohou nést zcela odlišné informace. Ostatní uživatelé, když otevřou stránku v prohlížeči, nevidí všechny vaše popisy, to vše zůstává skryto.

Značku stylu lze také použít k nastavení stylů na stránce. Pokud používáte mnoho různých stylů css, je vhodné je nastavit v samostatném souboru. Pokud jich potřebujete specifikovat více, lze to vše specifikovat přímo v html dokumentu.

.base ( šířka: 100px; barva pozadí: #000; výška: 150px; barva: #fff; )

< style type = "text/css" >

Základna(

šířka: 100px;

pozadí - barva : #000;

výška: 150px;

barva : #fff;

Nebo přidejte styly konkrétně do jedné značky, abyste to udělali, musíte přidat prvek stylu do samotné značky. Tato značka musí být použita uvnitř kontejneru, který nastavuje styly pro stránku. Můžete použít několik takových značek, nebude to chyba.

Trochu podobně jako předchozí tag vám tag link umožňuje nastavit styly pro dokument, které jsou v jiném souboru. Jinými slovy, k existujícímu dokumentu můžete připojit kompletní šablonu stylů css, která se skládá z mnoha vlastností. Zmenšíte tak velikost dokumentu, který se v konečném důsledku bude rychleji načítat a otevírat na počítači nebo mobilním zařízení s nízkou rychlostí internetu.

Můžete připojit více než jeden soubor, neexistují žádná omezení. Takový tag není potřeba zavírat. Pokud je vše provedeno správně, do vašeho dokumentu se načtou konkrétní styly ze samostatného souboru. Tento tag lze přidat do základního html a nezapomenout na jeho existenci. Výsledkem je takový obrázek:

< link href = "css/style-lg.css" rel = "stylesheet" >

< link href = "css/style-md.css" rel = "stylesheet" >

< link href = "css/style-sm.css" rel = "stylesheet" >

Pomocí značky script můžete k dokumentu připojit různé scénáře (skripty). Je vyžadována přítomnost uzavírací značky. Samotný skript může být umístěn na začátku dokumentu, uvnitř nebo na konci.

Sděluje prohlížeči, že cokoli umístěné mezi těmito značkami by se mělo objevit v okně vašeho prohlížeče. Zde jsou hlavní značky, které mohou být přítomny v absolutně každém dokumentu. Značka body slouží jako hlavní tělo stránky, které zahrnuje veškerý její obsah. Je vhodné tuto značku otevřít a nezapomeňte ji na konci dokumentu zavřít.

Záhlaví stránek h1 h2 h3

Pojďme dále, vidíme tag, který se otevírá a zavírá stejným způsobem. Tato značka označuje hlavní nadpis textu ve většině případů pod nadpisem H1 je nadpis stránky. Ve skutečnosti existuje pouze šest datových nadpisů. . Používají se i v SEO, ale to je trochu jiné téma. Určitě na to zvýrazním jeden článek a dám k nim podrobný popis, přihlaste se k odběru aktualizací blogu, aby vám nic neuniklo.

Přítomnost takových nadpisů v článku bude hrát důležitou roli při propagaci stránky. Jejich použití vám navíc poskytne přehlednou strukturu stránky, její nadpis, podnadpisy, zvýraznění, pododstavce a tak dále. Vždy je používejte a uvádějte do praxe. Na mnoha CMS, jako je WordPress, můžete při psaní textu vidět „nadpis 1“, „nadpis 2“, „nadpis 3“ a tak dále. Jsou zodpovědní za h1, h2 a h3.

Pokud píšete hlavní text z nového odstavce, napíšete značku

Na začátku a zavřete to na konci

. Označení odstavce v html je ekvivalentní vytvoření nového odstavce v dokumentu MS Word. Do dokumentu jsem nic nového nepřidal. Ale to není vše, co by mělo být v html dokumentu. Podívejme se na další příklad, popis přijde o něco později.

HTML dokument

Tento text bude tučný, a tento je také kurzívou

< ! DOCTYPE html >

< html >

< head >

< meta http - equiv = "Content-Type" content = "text/html; charset=utf-8" / >

< title >HTML dokument< / title >

< / head >

< body >

< p >

< b >

< / b >

< / p >

< / body >

< / html >

Základní prvky Head and Title

Každý dokument obsahuje prvek head a title. První, která následuje bezprostředně po prvním tagu. Tento tag obsahuje všechny informace o stránce, obsahuje také prvek. Titulek – informace o titulku stránky, jinými slovy titulek stránky, její název. Právě v nadpisu uvádíte správný název stránky, podle které vás bude uživatel hledat prostřednictvím vyhledávače, což je velmi důležitý bod. Oba prvky musí být otevřené a také uzavřené. Každý prvek je uzavřen znakem „/“. Výsledkem je takový obrázek.

Nadpis a obsah stránky

< / html >

Jak vidíte, není nic složitého. Zde jsou nejzákladnější značky, které by měly být přítomny v každém html dokumentu. Nezapomeňte každou z nich zavřít, jinak prohlížeč nebude schopen vnímat úplný obrázek kódu. Musíte to vždy vědět a pamatovat si to. Poté začnete vkládat text, obrázky, videa a tak dále. Ale to už bude v jiných článcích.

Editor Notepad++

Pro práci s kódem použijte program Notepad++. Je zdarma a není těžké ho najít na internetu. Velmi pohodlné pro pochopení jakéhokoli kódu, také pohodlně zobrazuje otevírací a uzavírací značky. Podporujeme syntaxi více než 40 programovacích jazyků. Přesně to, co potřebujete, abyste se naučili základy html.

Poznámkový blok je ve všech směrech lepší než běžný poznámkový blok. Pro maximální pohodlí, jednoduchost a učení musí být tento editor nejprve nainstalován na vašem počítači. Nejdůležitější výhodou a pohodlím je, že editor Notepad++ zobrazuje rady při psaní kódu, díky čemuž je vaše práce mnohem rychlejší a kvalitnější.

prvek DOCTYPE

Každý dokument musí také obsahovat následující prvek doctype. Proč je potřeba a co by v ní mělo být. Lidé většinou tyto řádky moc nenadchnou, zkopírují si je do svých dokumentů a pracují tiše. Tyto prvky prohlížeči sdělují, jaká verze html je v dokumentu použita, jaký je popis stránky, jaké kódování je použito, jaká klíčová slova jsou obsažena, kdo je autor a jak se stránka jmenuje.

Obvykle jsou umístěny na samém začátku. Možností je více a všechny se od sebe liší, napíšu jeden příklad, který se používá nejčastěji. Tento polotovar lze použít jako hotovou šablonu. Dále bude jasný popis každého řádku, s tím by neměly být žádné problémy.

Stručně jasným jazykem o základech html: Tento řádek říká prohlížeči, že tento dokument je XHTML verze 1.0, používá se angličtina a celý tento nepořádek se nachází na této adrese. Dále v metaznačce uvedeme kódování, které se používá. Nejčastěji se používá Windows 1251.

Popis - dotýká se téma SEO, jeden ze tří hlavních tagů, který musí být přítomen naprosto v každém dokumentu, tento tag označuje popis stránky. Co je napsáno na této stránce, krátký popis, maximálně dvě věty. Tag keywords pokrývá také téma SEO, tento tag je povinný. Obsahuje klíčová slova, která uživatelé internetu použijí, aby vás našli pomocí vyhledávačů.

Tag title obsahuje název samotného dokumentu, jeho titulek, který vidíme v prohlížeči. Asi nejdůležitější tag v celém dokumentu, který má největší vliv na propagaci stránky. Článek o přidávání a navrhování popisuje tuto značku podrobněji.

Co si musíte zapamatovat z této lekce o základech html:

  • Téměř všechny značky se otevírají a zavírají;
  • Dokument začíná značkou ;
  • Přítomnost značky;
  • Přítomnost značky;
  • Přehledná struktura html dokumentu.
  • Všechny hlavní stránky by měly být vždy pojmenovány index. Takto je to přijímáno a všichni jsou na to zvyklí, bez ohledu na to, jaká je přípona souboru, může to být html nebo php. Vždy se tomu tak říká.

    Podívejte se na video o základech HTML od Webformyself.

    Hypertextový značkovací jazyk, základní prvky a struktura. To vše a mnohem více se pokusím popsat na svém blogu. Nejprve budou napsány užitečné informace pro začátečníky, bude poskytnut příklad kódu a bude poskytnuta možnost stáhnout si samotný příklad spolu s hotovou stránkou.

    HTML (Hyper Text Markup Language) je speciální značkovací jazyk pro dokumenty. Je důležité si uvědomit, že mluvíme o elektronických a nikoli tištěných dokumentech.

    Tištěný dokument má přesně specifikované velikosti stránek a okraje. Přesně specifikuje parametry písma. Elektronické dokumenty a webové stránky nejsou určeny k tisku na tiskárně, ale k prohlížení na obrazovce. Dopředu není známo, na jakém počítači bude dokument prohlížen. Velikost okna prohlížeče není známa a není známo, jaká písma jsou k dispozici.

    Jazyk HTML je speciálně vytvořen pro návrh dokumentů na obrazovce, které budou reprodukovány neznámými prostředky. HTML nebylo původně určeno pro formátování dokumentu, ale pro jeho funkční označení. Například „nadpis“ je charakteristikou obsahu, nikoli designu. Program pro prohlížení dokumentu na obrazovce (prohlížeč, prohlížeč, průzkumník) si zvolí způsob zobrazení části dokumentu popsané jako záhlaví.

    Vytvoření dokumentu v HTML je podobné programování. Autor dokumentu vezme prostý text a vloží do něj speciální kódy (nazývají se tagy). Při prohlížení dokumentu fungují značky jako příkazy. Pokud je například na začátku odstavce značka, bude celý odstavec zarovnán na střed okna bez ohledu na to, v jakém okně bude dokument zobrazen a jakým písmem bude text zobrazen.

    Značky HTML umožňují zarovnat řádky dokumentu, ovládat barvu pozadí a písma, vkládat ilustrace a obtékat kolem nich text, zahrnout do dokumentu multimediální objekty a mnoho dalšího. Výsledkem jsou smysluplné a působivě navržené webové dokumenty.

    Mezi mnoha HTML tagy existuje speciální skupina tagů určená k vytváření hypertextových odkazů. Hypertextový odkaz je vybraný kus textu nebo ilustrace, který je spojen s adresou jiného dokumentu. Hypertextové odkazy jsou obvykle zvýrazněny podtržením nebo jinou barvou. Pokud najedete myší na hypertextový odkaz, změní se tvar. Pokud kliknete levým tlačítkem na hypertextový odkaz, dostanete se na jinou webovou stránku, možná umístěnou na jiném serveru, možná dokonce na jiném kontinentu.

    Dokumenty vytvořené ve formátu HTML se ukládají do souborů s příponou html nebo htm.

    HTML tagy

    Kontrolní konstrukce v HTML se nazývají tagy. Tagy jsou sady znaků, které se používají k označení textu. Všechny značky jsou zapsány v lomených závorkách, které jsou tvořeny symboly menší než (). Za úvodní závorkou je klíčové slovo, které značku definuje.

    Na velikosti písmen v názvech značek nezáleží. Je však běžnou praxí psát značky velkými písmeny, aby se odlišily od hlavního textu.

    Tagy lze spárovat nebo nepárovat. K ovlivnění části dokumentu (například odstavce) se používají párové značky: otevření a zavření. Úvodní tag vytvoří efekt a koncový tag jej zastaví. Závěrečné značky začínají lomítkem (/).

    Nespárované značky ovlivňují celý dokument nebo mají jednorázový účinek tam, kde se objeví. V tomto případě se nepoužívá uzavírací značka.

    Pokud značka omylem obsahuje klíčové slovo, které není v daném jazyce, je značka zcela ignorována.

    Při prohlížení dokumentu v prohlížeči se samotné značky nezobrazují, ale ovlivňují způsob zobrazení dokumentu.

    Efekt vytvořený tagem může být ovlivněn atributy. Atributy jsou funkční slova oddělená od klíčového slova tag a od sebe navzájem mezerami. Pokud potřebujete zadat hodnotu atributu, zapíše se za rovnítko a vloží se do uvozovek. Ve spárovaných značkách se atributy přidávají pouze k úvodní značce. Závěrečné značky nikdy neobsahují .

    Jazyk HTML umožňuje vstupovat do dokumentu

    říct přátelům