V tomto článku sa naučíte, ako používať HTML na napísanie svojej prvej webovej stránky! V článku budú uvedené názorné príklady pre lepšie pochopenie. Okamžite si urobme rezerváciu, že článok bol pôvodne navrhnutý pre tých, ktorí sa práve začínajú učiť HTML. Okrem toho sľubujeme, že do konca čítania tohto článku si zaručene vytvoríte svoju prvú webovú stránku.
HTML je skratka pre HyperText Markup Language, teda jazyk na organizovanie textu.
Na rozdiel od programovacích jazykov (JavaScript, PHP atď.), ktoré používajú skripty na vykonávanie akcií na webových stránkach, sekvenčný jazyk (HTML) používa značky na označenie obsahu webových stránok.
Začnime sa učiť HTML od začiatku
Tak ako angličtina pozostáva z písmen A, B, C atď., tak aj HTML sa skladá zo zvláštnych „písmen“:,,
atď. Tieto zvláštne „písmená“jazyka HTML nazývajú správcovia webu značky.
Nasleduje príklad značky HTML.
Značky Vytvorte podčiarknutie okolo okrajov tohto textu.
Značky HTML spárované s jazykovými štýlmi CSS vám umožňujú rýchlo a efektívne vytvárať webové stránky.
Miesto HTML medzi inými jazykmi
Ako viete, dobrý webzabudované aspoň v 5 jazykoch.
Moderná webová stránka je vytvorená v jazykoch:
- HTML (štruktúra a usporiadanie).
- CSS (obsah štýlu).
- JavaScript (akcie prehliadača).
- PHP (akcia servera).
- SQL (úložisko dát).
HTML je hlavný základný jazyk, na ktorom sú založené ostatné. Naučiť sa HTML by preto malo byť prvým krokom pre každého, kto sa naučí vytvárať webové stránky na webe.
Tag
Jazyk HTML sa v priebehu rokov od svojho vzniku zmenil. V súčasnosti väčšina internetových stránok prechádza na najnovšiu verziu jazyka - HTML5. Ale aj v HTML5 ostávajú základy jazyka nezmenené.
Štruktúra stránky HTML je ako sendvič. Rovnako ako sendvič má dva krajce chleba, HTML dokument má otváraciu a zatváraciu značku HTML.
Tieto štítky, ako chlieb v sendviči, obklopujú všetko vo vnútri.
Tag
Keď sa budete učiť HTML, určite by ste sa mali zoznámiť so značkou. Priamo vo vnútri nadradenej značky je celý obsah stránky vrátane značky. Táto značka je povinná a obsahuje všetky nastavenia stránky lokality, pre ktorú je napísaná. Tieto nastavenia nie sú viditeľné pre návštevníkov stránok, vidia ich iba prehliadače (Google Chrome, Mozilla Firefox atď.).
Blok nastavení webovej stránky obsahuje všetky „nevykreslené“prvky, ktoré pomáhajú prehliadaču správne zobrazovať vašu stránku na webe.
Všetky možnosti, ktorédá sa nakonfigurovať vo vnútri značky, pozrieme sa na to, ale o niečo neskôr - keď príde čas.
Tag
Štítok, podobne ako štítok, je vo vnútri štítku.
Táto značka je potrebná, aby sa na vašej stránke zobrazovali všetky informácie, ktoré chcete zobraziť.
Nadpisy, odseky, tabuľky, obrázky a odkazy sú len malou časťou prvkov, ktoré môžu byť obsiahnuté v značke.
Základná štruktúra HTML dokumentu:
… …
Vaša prvá stránka
Teraz už viete, že môžete vytvárať webové stránky pomocou HTML a že sa na to používajú základné značky:
- . Načrtáva hranice webovej stránky.
- . Obsahuje nastavenia pre zobrazenie webovej stránky v prehliadači.
- . Obsahuje všetky prvky webovej stránky (obrázky, videá, text atď.), ktoré chcete zobraziť návštevníkom lokality.
O ďalších značkách ako,,, si povieme čoskoro.
Bolo by skvelé, keby si čitateľ tento článok nielen prečítal, ale aj hneď bežal zdokonaľovať svoje zručnosti. Ak chcete zdokonaliť svoje znalosti HTML, budete si musieť vytvoriť svoju prvú webovú stránku, ktorá bude slúžiť ako testovacia plocha pre vaše nové zručnosti.
Je známe, že mobilní operátori ("MTS", "MegaFon" atď.) nám poskytujú mobilné služby. Rovnako aj služby na vytváranie a správu stránok nám poskytujú hostingoví operátori. Ak chcete vytvoriť svoju webovú stránku, prejdite na stránku ktoréhokoľvek bezplatného poskytovateľa hostingu.
Overení poskytovatelia hostingu zahŕňajú BEGET alebonapríklad reg. Môžete si vybrať kohokoľvek.
Po krátkej registrácii, po 24 hodinách, sa automaticky vytvorí vaša prvá webová stránka na internete, ktorú uvidí celý svet a môžete začať cvičiť!
Moderná štruktúra stránky
Teraz, keď máte svoje stránky, skontrolujte, aké značky obsahuje značka a ako organizujú informácie na stránkach.
Vyššie uvedený obrázok je schematickým znázornením štruktúry, ktorá bola dodaná s najnovšou verziou jazyka HTML – HTML5. Spolu s HTML5 neprišli len nové značky, ale aj význam tvorby webových stránok. Všetky značky, ktoré vidíte na obrázku, sú obsiahnuté v hlavnej značke. Tieto značky vám pomôžu „načrtnúť“štruktúru vašej stránky a dať jej význam.
Napríklad do značiek … je vhodné umiestniť názov stránky (tagy) a popis stránky (tagy).
Do značiek je vhodné umiestniť menu (odkazy) stránky (tagu).
Do značiek je vhodné umiestniť akýkoľvek veľký blok informácií, ktoré súvisia s významom. Môže to byť niekoľko článkov, z ktorých každý je „obalený“štítkami, fotografiami (tag) alebo tabuľkami (tags
) a ďalšie.
Do štítkov je vhodné umiestniť akékoľvek informácie, ktoré nezodpovedajú významu.
Vo značkách je zvykom umiestňovať dodatočné informácie, ako sú kontaktné informácie, ďalšie sekcie stránky atď.
Takže teraz ste o niečo zbehlejší v tom, z čoho sa skladajú moderné webové stránky. Vezmime si príkladzmätok v mojej hlave bol nahradený úžasom z vhľadu.
Keď teda otvoríte správcu súborov na stránke svojho prevádzkovateľa hostingu a nájdete dokument s názvom index.php, pokojne doň napíšte, akoby od začiatku, štruktúru svojej stránky.
Moja prvá webová stránka
Názov stránky
Popis stránky
Odkaz 1 | Odkaz 2 | Odkaz 3
Názov niektorého článku
Toto je blok, ktorý obsahuje akékoľvek informácie a pomocou CSS môžete tento blok a celú stránku s celým obsahom vyfarbiť tak, ako chcete. © Všetky práva vyhradené
Pamätáš si, že sme povedali, že pre web existujú rôzne nastavenia? No, tu je:
- Pomocou prehliadačov ukazujeme, že stránka môže obsahovať ruské aj anglické znaky (inak, keď stránku otvoríte, uvidíte hrozné krakozyabry).
- sa používa na označenie názvu stránky, ktorý sa zobrazí na karte prehliadača a vo vyhľadávači („Yandex“, Google a podobne).
Samozrejme, bez štýlu CSS bude vaša stránka vyzerať lakomo (čierne písmená na bielom pozadí), ale určite skúste svoju prvú stránku napísať najskôr v HTML.
Gratulujeme! Práve ste vytvorili svoju prvú webovú stránku na vlastnej webovej stránke! Bude to zaujímavejšie!
