Abstrakt: Jazyk html: html programovací systémy, jazykové vlastnosti a implementace systému. Účel, příklady programování aplikací. HTML, CSS, PHP, JavaScript, SQL - co a proč
Reg.ru: domény a hosting
Největší registrátor a poskytovatel hostingu v Rusku.
V provozu je více než 2 miliony doménových jmen.
Propagace, mail pro doménu, řešení pro podnikání.
Již si vybralo více než 700 tisíc zákazníků po celém světě.
*Přejetím myší pozastavíte rolování.
Zpět dopředu
HTML, CSS, PHP, JavaScript, SQL – co a proč?
V tomto článku chci přezkoumat účel hlavních programovacích a značkovacích jazyků používaných při vývoji webu.
Nápad napsat tento článek se nezrodil spontánně, ale pod vlivem často se opakujících otázek, které mi jsou zasílány v dopisech a pokládány v podpůrné službě.
Jedná se o následující otázky:
V jakém pořadí byste se měli učit jazyky pro tvorbu webových stránek?
- Co je obtížnější: JavaScript nebo PHP?
Proč je SQL potřeba?
- Jak se verze CSS od sebe liší a kterou z nich byste si měli prostudovat?
- Jak fungují dynamické webové stránky?
- K čemu je PHP?
atd…
V tomto článku budu hovořit o roli každého z těchto jazyků při vytváření webových stránek a jsem si jistý, že drtivá většina obecné záležitosti odpadne to samo.
V tomto materiálu nebudou téměř žádné příklady kódu, protože. stojíme před dalším úkolem - získat obecnou představu o účelu každého z jazyků a jeho místě ve vývoji webu.
Tak pojďme. Začneme jazykem HTML.
Přípony souborů: .htm, .html
HTML je hypertextový značkovací jazyk. Hyper Text Markup Language).
Tento jazyk se používá k vytváření webových stránek. Je interpretován (zpracován) prohlížečem a zobrazen jako dokument ve formě přátelské k lidem.
HTML je nedílnou součástí a základem téměř každé webové stránky. Jazyk HTML je primárně nástroj pro označování logických stránek.
Právě HTML nám umožňuje dát obsahu stránky určitý význam a ten je realizován pomocí tzv. tagů.
Tagy jsou speciální značky, které prohlížeč interpretuje určitým způsobem. Podstatou značek je, že obsah stránky, uzavřený v různých značkách, je prohlížečem zpracováván odlišně.
Řekněme, že můžeme zabalit obsah stránky do značky odstavce a prohlížeč bude s tímto obsahem nakládat jako s odstavcem.
Obsah můžeme uzavřít do značky seznamu a informace v ní pak budou interpretovány jako seznam.
Obsah můžeme vložit do tagu tabulky a obsah ve výsledném dokumentu se zobrazí jako tabulka a tak dále.
Jinými slovy, každá ze značek HTML určená pro značkování textové informace, dává této informaci smysl..
Jazyk HTML má za sebou poměrně dlouhou historii vývoje a za tuto dobu prošel výraznými změnami. Většina změn souvisí s přidáním nových tagů do jazyka a „odchodem“ těch zastaralých. V době psaní tohoto článku již vývoj HTML 5.1 začal.
Pro různé verze HTML poskytlo různé prohlášení typ dokumentu. Podívejme se na pár příkladů deklarací typu HTML 4.01 (v tuto chvíli je lze považovat za zastaralé).
1. Přísný: neobsahuje prvky označené jako „zastaralé“ nebo „neschválené“ (zastaralé):
2. Přechodné: obsahuje zastaralé značky pro kompatibilitu a snadný přechod ze starších verzí HTML:
3. S rámečky (Frameset): podobný přechodovému, ale obsahuje také značky pro vytváření sad rámců:
Výše uvedené deklarace typu dokumentu budou postupem času stále více zastaralé a ustoupí HTML 5.
HTML 5 používá pouze jednu možnost DOCTYPE(typ dokumentu):
Je třeba také zmínit, že existuje i jazyk XHTML. Je to rozšiřitelný hypertextový značkovací jazyk. Extensible Hypertext Markup Language). V tuto chvíli je jeho vývoj zastaven a je doporučeno používat HTML. Nové verze XHTML nejsou vydány.
Na závěr chci také poznamenat, že HTML nástroje stále dokážou ovládat nejen logickou strukturu webových stránek, ale také některé aspekty jejich vzhledu.
Tento přístup je však považován za nesprávný a zastaralý, protože. existuje samostatný jazyk pro nastavení vzhledu.
Tím končí HTML a přechází se k jazyku CSS.
Přípona souboru: .css
css je jazyk pro popis vzhledu dokumentu napsaného pomocí značkovacího jazyka. Název pochází z angličtiny. Kaskádové styly- Kaskádové styly.
Jednoduše řečeno, jazyk CSS navrženy tak, aby poskytovaly potřebné vzhled HTML dokumenty.
Poskytování vzhledu HTML dokumentů je sice nejoblíbenější, ale pouze speciální případ použití jazyka CSS, protože. s ním můžete dát vzhled jiných typů dokumentů: XHTML, SVG A XUL. Nebudeme o nich mluvit samostatně, protože. to je mimo rozsah této otázky.
Takže cíl vytváření css byl oddělení popisu logické struktury webové stránky od jejího vzhledu. Jak již víte, HTML se používá k popisu struktury, ale CSS je odpovědí na popis toho, jak bude tato logická struktura vypadat.
Samostatný popis logické struktury a prezentace dokumentu umožňuje více flexibilně spravovat vzhled dokumentu a minimalizovat množství opakujícího se kódu, který by nevyhnutelně vznikl při použití HTML k popisu vzhledu dokumentu.
Pomocí CSS může webový vývojář nastavit různé druhy písma a velikosti písma, barvy prvků, odsazení prvků od sebe, umístění jednotlivých bloků na stránce atd. pro stránku a její jednotlivé prvky.
Samozřejmě, abyste pomocí CSS dali vzhled HTML dokumentu, musíte tento dokument nějak spojit se styly, tzn. "řekni" dokumentu HTML, že bude stylizován pomocí CSS.
Toho lze dosáhnout různými způsoby. CSS spojení do dokumentu, což dává prohlížeči najevo, že styl by měl být aplikován na stránku jako celek nebo na některé její jednotlivé prvky.
Šablony stylů mohou být umístěny buď přímo uvnitř dokumentu, na který budou aplikovány, nebo mohou být umístěny v samostatném souboru s příponou .css.
Je důležité tomu rozumět CSS soubor je normální textový soubor . Obsahuje speciální pokyny popisující vzhled prvku a jeho umístění na stránce a také komentáře (libovolná vysvětlení k písemným pokynům).
Styly CSS lze ke stránce připojit (nebo do ní vložit) čtyřmi způsoby:
1. Pokud je šablona stylů v samostatném souboru, je připojena k dokumentu pomocí speciální značky odkaz, který by měl být umístěn v tomto dokumentu uvnitř značky hlava:
V atributu href zároveň je uvedena cesta k obsaženému souboru stylu.
2. Druhý způsob připojení se také používá, pokud jsou styly v samostatném souboru. Toto používá směrnici @import, který by měl být v tomto dokumentu uvnitř značek styl hlava):
Zde, jak vidíte, je v závorkách za slovem uvedena cesta k přiloženému souboru url.
3. Třetí metoda se používá, když css styly umístěných v dokumentu, na který se mají vztahovat. V tomto případě by styly měly být v tomto dokumentu uvnitř značek styl(což zase musí být uvnitř značek hlava):
Ve výše uvedeném příkladu uvnitř značek styl existuje styl, který nastavuje barvu textu prvku na červenou tělo webové stránky.
4. Čtvrtá metoda platí také v případech, kdy je šablona stylů popsána v samotném dokumentu. V tomto případě je styl nastaven pro konkrétní prvek webové stránky (tag) pomocí jeho atributu styl.
V tomto případě budou všechna takto nastavená pravidla CSS aplikována pouze na aktuální značku (prvek webové stránky).
Používáme vestavěné styly.
Ve výše uvedeném příkladu nastavujeme velikost a barvu písma pro jeden konkrétní odstavec textu v dokumentu.
Shrneme-li způsoby propojení stylů, můžeme říci, že v prvních dvou případech externí styly, zatímco způsoby 3 a 4 se zabýváme vestavěný(nebo interní) styly.
Samotná pravidla stylu jsou určena jako dvojice "hodnota majetku;". Přitom se tato pravidla vztahují na tzv. selektory. Řekněme, že v příkladu 3 máme co do činění se selektorem prvků ( tělo). Nemovitost je barva a jako hodnotu - Červené.
Celkem se jedná o 10 typů selektorů, jejichž úvaha z pochopitelných důvodů přesahuje rámec této recenze.
Je důležité, abyste pochopili obecný princip.
Selektor určuje jeden nebo skupinu prvků, na které se použijí pravidla stylu.(v našem případě se jedná o celý obsah značky tělo)
Vlastnost může být definována jako druh transformace, která bude aplikována na prvek (v našem případě je barva, tj. barva textu).
Hodnota přímo určuje hodnotu určitého typu transformace (v našem příkladu toto Červené, tj. Červená barva).
Jazyk CSS ušel v procesu svého vývoje již dlouhou cestu a v současnosti existuje několik jeho úrovní: CSS1, CSS2, CSS2.1, CSS3. Od konce roku 2011 se vyvíjí CSS4.
Význam různých úrovní spočívá v tom, že se opravují stávající chyby, přidávají se nové vlastnosti, rozšiřuje se selektorový mechanismus atd.
Jinými slovy, každá další úroveň není něčím izolovaným, ale logickým vývojem a pokračováním úrovně předchozí, umožňující jemněji a flexibilněji ovládat vzhled webových stránek.
Tímto končíme naši recenzi CSS a přecházíme na další odkaz – jazyk PHP.
Přípona souboru: .php
Když už jste se s HTML a CSS alespoň trochu orientovali, hned se nabízí otázka: "A co bude dál?". Chtěli jste vytvořit skvělé webové stránky, ale s pomocí HTML a to CSS neumí...
Zde potřebujete jazyk zcela jiného typu a účelu.
PHP je již mnoho let trvale na seznamu nejoblíbenějších programovacích jazyků a jazyků pro vývoj webových aplikací.
Co je to PHP?
PHP znamená Hypertextový předprocesor(něco jako "HTML preprocesor").
Co to znamená? Začněme trochu zpovzdálí: existují dva typy jazyků. Jeden typ se nazývá "klient", a ostatní - "server".
Znamená to, že klientské jazyky fungují v prohlížeči každého konkrétního člověka. Typickým zástupcem jazyků na straně klienta je JavaScript, o kterém jste jistě slyšeli.
Všechny akce a příkazy, které nastavíme, řekněme JavaScript, jsou spouštěny prohlížečem (pro jednoduchost neuvažujeme JavaScript na straně serveru).
To znamená, že stejný námi napsaný kód je zpracován v jednom případě internetový prohlížeč Explorer, v jiném - Firefox, ve třetím - Opera, ve čtvrtém - Google Chrome, tj. prohlížeč, který každá jednotlivá osoba používá k zobrazení naší stránky.
Prohlížeč má tedy alternativní název - klienta.
V případě jazyků na straně serveru (které zahrnují PHP) vidíme jiný obrázek.
Naše stránky jsou vždy umístěny na nějakém serveru, tzn. výkonný počítač speciálně navržený pro hostování webových stránek mnoha lidí.
Všechny příkazy a skripty napsané v PHP se spouštějí na serveru, a nic jiného. Po spuštění PHP skriptu na serveru server „předá“ výsledek své práce prohlížeči, který tento výsledek převede do nám vyhovující podoby.
Zde je důležité porozumět následujícímu bodu: podle zdrojového kódu webové stránky, kterou lze zobrazit v libovolném prohlížeči pomocí možnosti jako " Zdroj page" není možné určit, zda bylo k vytvoření této stránky použito PHP nebo ne.
Není možné to udělat právě proto PHP skripty jsou zpracovány na serveru a hotová zpracovaná verze je přenesena do prohlížeče. V podstatě jen HTML kód.
Rozdíl oproti běžným statickým HTML stránkám je jeden další krok zpracování kódu.
V případě HTML stránky je jediný krok: prohlížeč zpracuje HTML kód, tzn. označení stránky v souladu s určitými pravidly, v důsledku čehož vidíme webovou stránku v její normální podobě.
V případě stránky PHP existují dvě fáze: nejprve tzv. PHP interpret (procesor) provede PHP kód (díky tomu se získá jednoduchý HTML kód) a poté prohlížeč zpracovává výsledkem tohoto zpracování, tj. ve skutečnosti je provedena stejná fáze, která je v případě HTML stránky jediná.
Vůbec PHP funguje skvěle s HTML. Navíc můžete vložit PHP kód do HTML kódu a pomocí pomocí PHP výstupní značky HTML.
Je důležité si zapamatovat tento jednoduchý bod: Bez ohledu na to, jak složitý je váš PHP kód, nakonec skončí jako prostý HTML.
Proč používat PHP?
HTML je 100% statické. Vložením PHP kódu do našich stránek můžeme zajistit, že obsah stejné stránky je odlišný v závislosti na určitých podmínkách (dynamické stránky).
Jazyk PHP se za léta své existence osvědčil jako skvělé řešení pro tvorbu dynamických webových stránek.
Co potřebujete, abyste mohli začít s PHP?
Pro plnohodnotnou práci s PHP na vašem počítači potřebujete následující věci:
1. Webový server Apache(používá se ve většině případů);
2. Database Management System (DBMS) MySQL (obsah stránek je uložen v databázi);
3. Nainstalovaný PHP interpret;
4. Textový editor, ve kterém budete psát kód;
5. Prohlížeč.
Nyní trochu více o prvních třech bodech.
1. Webový server je navržen tak, aby na vašem počítači napodoboval stejný server, který pak bude hostovat vaše stránky již hostované na internetu. To je nezbytné, abyste mohli psát libovolné PHP skripty na svém počítači a vidět, jak fungují, provádět v nich změny a úpravy. Jedním slovem je to nutné pro takzvané ladění.
2. MySQL DBMS potřebné k uložení informací, které budou na vašem webu. V případě HTML stránek je veškerý obsah webu umístěn přímo na nich. Každá stránka obsahuje určité množství informací (obsahu).
Při použití PHP se k ukládání užitečného obsahu webu obvykle používá databáze. V drtivé většině případů se jedná o MySQL.
3. PHP interpret je druh programu, který zpracovává PHP kód na webovém serveru. Bez něj nebudeme schopni spouštět naše PHP skripty a vidět výsledek jejich práce.
Aby bylo možné webovému serveru sdělit, že by měl být zpracován kód PHP, musí být při přidávání PHP do dokumentu HTML použita následující syntaxe:
V tomto případě webový server po dosažení úvodní značky PHP ( ) předá řízení PHP interpretu. Po uzavření bloku kódu PHP ( ?> ) PHP interpret přestane běžet.
Vraťme se nyní k roli PHP ve vývoji webových stránek.
Pro začátek si představte, že máme jednoduchý statický web napsaný v HTML. Skládá se z několika stránek a je to jednoduše sada neměnných souborů.
Na tomto webu nelze žádným způsobem vytvořit formulář zpětná vazba, komentáře, registrace uživatele, vyhledávání atd.
Navíc takový web nemůže mít ovládací panel, ze kterého bychom mohli přidávat nové stránky, případně upravovat a mazat stávající.
Při používání pouze jazyka HTML jsme značně omezeni ve vytváření opravdu pohodlných a funkčních stránek, protože nemáme žádné "ovládací páky" pro každou konkrétní stránku.
Jediné, co můžeme udělat, je ručně otevřít samostatnou HTML stránku v editoru kódu a nějak ji upravit.
Používání jazyka PHP nám umožňuje vytvářet opravdu výkonné stránky díky tomu, že dokážeme promyslet a implementovat „chování“ našich stránek..
Jinými slovy, můžeme vyrobit náš web se v různých situacích choval odlišně, jednající podle námi předepsaných algoritmů v závislosti na splnění či nesplnění určitých podmínek.
Možnost nastavit logiku „chování“ webu, kterou potřebujeme, je v jazyce PHP jedna z nejdůležitějších a nejcennějších.
Spolu s již zmíněnými výhodami je třeba zmínit, že PHP nám poskytuje mnoho nástrojů pro práci s daty. různé typy.
Nejčastěji se musíte vypořádat s textovými daty a daty prezentovanými ve formě polí. Pro usnadnění těchto úkolů poskytuje PHP mnoho funkce, které vám umožní snadno manipulovat s jakýmikoli informacemi.
Navíc jazyk PHP nám umožňuje pracovat se soubory a složkami. Můžeme jej použít k vytváření, úpravě a mazání souborů a složek. Můžeme je přesouvat a přejmenovávat a provádět mnoho dalších operací.
Takové samozřejmě nelze ignorovat důležitý bod jako příležitost Využití PHP uspořádat pohodlnější interakci uživatele s webem.
Jsou to věci jako:
Formulář zpětné vazby;
- možnost připomínkování;
- registrace uživatelů;
- Vyhledávání na stránkách;
- uložení informací zadaných uživatelem (podle principu "nákupního košíku"); atd.
A samozřejmě se PHP aktivně používá k vytváření nejrůznějších admin panelů, odkud můžete své stránky snadno a pohodlně spravovat.
Přidávání nových materiálů, úpravy kategorií, moderování komentářů, změna položek menu webu, správa nastavení – to vše a mnohem více lze provádět pomocí PHP.
Shrneme-li recenzi jazyka PHP, můžeme říci, že dalším krokem po zvládnutí HTML a CSS by mělo být naučení se jazyka PHP, protože. je to on, kdo vám umožní posunout se ve vytváření stránek na zásadně jinou úroveň.
S PHP končíme a přecházíme na další jazyk – JavaScript.
Přípona souboru: .js
JavaScript je programovací jazyk nejrozšířenější v prohlížečích pro přidání interaktivity na webové stránky.
Je důležité pochopit, že to není zdaleka jediná oblast použití JavaScriptu, nicméně v rámci našeho tématu je nejvhodnější zvážit tento konkrétní případ použití tohoto jazyka.
Hlavním úkolem JavaScriptu v kontextu, o kterém uvažujeme, je manipulace s prvky modelu DOM webové stránky.
Pojďme pochopit, co je DOM.
DOM je objektový model dokumentu. Objektový model dokumentu).
Podle DOM může být dokument (například webová stránka) reprezentován jako strom objektů, které mají řadu vlastností, které s ním umožňují provádět různé manipulace:
Získávání uzlů;
- změnit uzly;
- změna spojení mezi uzly;
- odstranění uzlů.
Právě tyto manipulace nám JavaScript umožňuje provádět na prvcích stránky.
Chcete-li na stránku přidat kód JavaScript, můžete použít značku skript. Doporučuje se umístit do štítku hlava, i když to není povinné.
kontejnery skript V jednom dokumentu jich může být tolik, kolik chcete. Zatímco atribut "type="text/javascript"" volitelné, protože význam javascript je výchozí hodnota.
Níže je uveden příklad skriptu, jehož výstupem je tzv modální okno s klasickým písmem "Ahoj světe!" uvnitř prohlížeče:
Do značky můžete také umístit kód JavaScript. Specifikace HTML popisuje sadu atributů používaných k definování obslužných rutin událostí. Zvažte tento příklad:
Vymazat
Zároveň, pokud je odpověď záporná (tedy „ne“, pokud si nejsme jisti), bude odkaz zablokován.
Vezměte prosím na vědomí, že tato praxe Použití JavaScriptu nepovažuje za dobré.
Správným způsobem použití JavaScriptu by byl tento přístup. Nejprve poskytneme identifikátor ( id="alertlink") odkaz:
Odstranit Poté zapíšeme následující kód do samostatného souboru JavaScript (jak jej připojit k dokumentu bude ukázáno níže): window.onload = function() ( var linkWithAlert = document.getElementById("alertLink"); linkWithAlert. onclick = function() ( return potvrdit ("Jste si jistý?"); ); );
V tomto příkladu vytváříme funkci, která se spustí při načtení webové stránky. Tato funkce najde prvek s id alertLink a sleduje událost kliknutí na něj (tj. na odkaz „Smazat“).
Na události click zobrazíme modální okno se zprávou, která je nám již známá.
Možná se vám tento příklad bude zdát trochu komplikovaný, pokud nevíte nic o JavaScriptu, ale tuto fázi není to tak důležité.
Je důležité, abyste pochopili samotný princip, přístup k práci při používání JavaScriptu.
A nakonec, jak jsem slíbil výše, podívejme se, jak můžete zahrnout JavaScript z externího souboru.
Zde je situace velmi podobná té, která byla v případě CSS, ale místo kódu CSS napíšeme kód JavaScript do souboru (s příponou .js), načež jej zahrneme do souboru, který potřebujeme v štítek hlava pomocí konstrukce:
Po takové manipulaci nám budou dostupné všechny funkce, které jsme napsali do souboru JavaScript.
Můžeme tedy říci, že JavaScript je jazyk, který vám umožňuje aktivně spravovat strukturu vaší stránky, manipulovat s jejími prvky.
V praxi to nachází své uplatnění při vytváření různých animačních efektů, efektů pohybu, rozpouštění, zvětšování a zmenšování objektů.
JavaScript se používá k vytváření různých fotogalerie, tzv posuvníky obsahu nebo rotátory, jehož podstatou je, že v určitém omezeném prostoru dochází ke střídání různých předmětů (například obrázků).
Často se používá JavaScript a pro prvotní ověření údajů které uživatel zadává do formulářů.
Když už mluvíme o JavaScriptu, nelze nezmínit speciál JavaScriptové knihovny (jQuery, Prototype, MooTools atd.)
Smyslem knihoven JavaScriptu je poskytovat rozhraní mezi různými prohlížeči k metodám DOM.
To znamená, že můžete použít určité funkce již napsané v rámci konkrétní knihovny a získat výsledek, který potřebujete, který funguje stejně dobře ve všech prohlížečích.
Knihovny navíc zbavují vývojáře webu nutnosti učit se podrobnosti o samotném JavaScriptu tím, že poskytují řadu snadno použitelných nástrojů, které usnadňují správu objektový model dokument.
V souhrnu můžeme říci, že JavaScript může být „vrcholem“ vašeho webu, a to jak z hlediska jeho dekorace, tak z hlediska doplňkové funkčnosti, kterou lze pomocí tohoto jazyka poskytovat.
S JavaScriptem jsme hotovi a pokračujeme dál poslední jazyk– SQL
Přípony souborů: .sql
SQL je informačně-logický jazyk určený k popisu, úpravě a získávání dat uložených v relačních databázích.
Abychom této definici lépe porozuměli, začneme nejzákladnějšími pojmy, bez kterých je prostě zbytečné jít dál.
K čemu vůbec je databáze?
Nyní se při vývoji seriózních webových aplikací téměř vždy používají databáze. Ukládají informace nezbytné pro provoz webu – počínaje samotným obsahem (obsahem) a konče přihlašovacími údaji a hesly uživatelů a různými nastaveními webu.
Navzdory skutečnosti, že databáze může ukládat nejen textové informace, ale také například obrázky, některé dokumenty atd., zpravidla se stále používá speciálně pro ukládání textových informací a informace jiného typu jsou uloženy ve formě soubory.
Databáze mají řadu výhod oproti například ukládání textových informací do souborů:
1. Vysoká rychlost získávání informací;
2. Umožňují náhodný přístup k datům. (tj. je snadné odkazovat na jakýkoli jeden konkrétní záznam v databázi);
3. Z databáze můžete extrahovat data, která splňují určitá kritéria, která nás zajímají;
4. Použití databáze nám umožňuje nestarat se o paralelní přístup k datům. Tito. pro nás v tomto případě není důležité, že o stejný záznam může požádat několik desítek lidí současně.
Pokud bychom se zabývali spisy, pak by to pro nás bylo mnohem obtížnější.
Proto je paralelní přístup k datům jednou z nejdůležitějších výhod databází.
Rozdíl mezi databází a DBMS
Je důležité rozlišovat mezi pojmy "databáze" A "systém správy databáze" (DBMS).
Databáze jsou informace, které uchováváme, a struktura těchto informací, zatímco DBMS je program, který poskytuje externí aplikace přístup k databázi.
Databáze je věc, kterou nezávisle navrhujeme pro každý konkrétní projekt a nastavujeme její strukturu na základě funkcí naší budoucí aplikace.
DBMS je námi vybrán z určitého omezeného seznamu (Oracle, MySQL, PostgreSQL atd.)
Nejběžnější spojení je PHP + MySQL. Ve většině případů s ním budete také pracovat.
Zvažte nyní koncept relační databáze.
K dnešnímu dni jsou nejoblíbenější tzv. relační databáze.
Relační databáze jsou databáze tvořené tabulkami.
Stejné slovo „relační“ pochází z angličtiny. vztah- přístup.
"Vztah" odkazuje na vztah mezi různými tabulkami v databázi.
Dá se říci, že tabulky v databázi jsou opravdu obyčejné tabulky, které jsou v podstatě totožné s tabulkami, se kterými jste se v životě setkali – od násobilky po tabulky v Microsoft Excel.
Tabulka má omezený počet sloupců (obvykle malých) a tolik řádků, kolik chcete.
Jak můžete do databáze vkládat nová data, měnit je, mazat a provádět další manipulace?
Pro toto existuje speciální jazyk SQL (z angličtiny. Strukturovaný dotazovací jazyk- strukturovaný dotazovací jazyk).
Tito. SQL je univerzální počítačový jazyk navržený speciálně pro správu relační databáze data.
S jeho pomocí můžeme provádět téměř jakoukoli operaci: od vytvoření databáze až po výběr libovolné sady informací z databáze.
SQL dotazy jsou zpravidla přenášeny do DBMS prostřednictvím externího programu. V tomto případě DBMS provede zadaný dotaz a jako odpověď vrátí nějaký výsledek.
Každý příkaz SQL je buď dotaz na data z databáze, nebo volání databáze, které mění data v databázi. V souladu s tím, jaké změny v databázi nastanou, existují následující typy požadavky:
Požadavek na vytvoření nebo úpravu nových nebo stávajících objektů v databázi (v tomto případě požadavek popisuje typ a strukturu vytvořeného nebo upraveného objektu);
- žádosti o údaje;
- požadavky na doplnění nových údajů (záznamů)
- žádosti o vymazání údajů;
- přístup do DBMS.
Tedy jazyk SQL je odkaz, která webové aplikaci umožňuje interakci s databází a informacemi v ní uloženými.
Jazyk SQL lze jen stěží nazvat jednoduchým a jeho plné využití od vás bude vyžadovat poměrně hodně úsilí, abyste se jej naučili.
To je důvod, proč v mnoha nástrojích pro vývoj webu (například v rámci CodeIgniter) je interakce webu s databází implementována pomocí jakéhosi „doplňku“, který vám umožňuje provádět s ním všechny potřebné akce bez učení samotného jazyka SQL.
Pokud však nepoužíváte nástroje jako CodeIgniter, pak se samozřejmě budete muset naučit SQL, abyste vytvořili kompletní webovou aplikaci řízenou databází.
No, pojďme si tuto recenzi trochu shrnout.
Základem vývoje webu byl a zůstává jazyk HTML. Bez něj je vše ostatní prakticky bezvýznamné, protože právě HTML značky převádí prohlížeč do výsledného obrázku, který vidíme na obrazovce monitoru.
css je nástroj pro nastavení vzhledu a umístění různých prvků webové stránky, který nám umožňuje flexibilně ovládat vzhled naší webové aplikace.
PHP nám umožňuje vytvářet výkonné dynamické stránky, které mají určitou logiku chování. PHP nám dává i prakticky neomezené možnosti k rozšíření funkčnosti webu.
JavaScript působí jako důležitý, ale ne vždy povinný doplněk. Může výrazně zvýšit použitelnost vašeho webu a jeho interaktivitu, dodat mu určitý „šmrnc“.
Konečně, SQL nám umožňuje organizovat interakci webu s databází, což nám umožňuje ve spojení s jazyk PHP vytvářet opravdu výkonné a funkční stránky.
S pozdravem Dmitrij Naumenko.
P.S. Něco je jasné, ale kam dál? Podívejte se na prémiové tutoriály o různých aspektech tvorby webových stránek a také volný kurz vytvořit svůj vlastní CMS systém v PHP od nuly. To vše vám pomůže rychle a snadno zvládnout webové technologie: od HTML a CSS po JavaScript, PHP a SQL.
Líbil se vám materiál a chcete poděkovat?
Stačí sdílet se svými přáteli a kolegy!
Dobrý den, vážení začínající webmasteři. Začněme se učit programovací jazyky.
A začneme je studovat s html.
Hned musím říci, že na konci kurzu budete schopni samostatně napsat webovou stránku v čistém html a dát ji na internet. Ale i tak doporučuji nespěchat a po html se seznámit s css.
Poté web zchladíte a budete moci opravit vzhled webu vytvořeného na hotovém CMS (systému pro správu obsahu).
Učit se programovací jazyk a učit se cizí jazyk není zdaleka totéž a je to mnohem jednodušší. Navíc to není děsivé, ale velmi vzrušující.
Je to tak, že nepochopitelné je vždy děsivé, ale slibuji vám, že po prvních hodinách všechny obavy pominou.
Naučíme se to pomocí editoru, který je potřeba nainstalovat do počítače.
V tomto editoru souborů můžete psát kód a pak se podívat, jak jej prohlížeč zobrazí. Velmi pohodlně.
Nejprve si řekněme něco málo o tom, co je HTML, a toto bude nudná část našeho kurzu, a pak si uděláme zajímavou praxi. Nuda tam rozhodně nebude.
NTML (HyperText Markup Language) doslova - hypertextový značkovací jazyk. Používá se k vytváření webových stránek.
A pokud v našem chápání je souborem pouhých stránek spojených jedním tématem kniha, nebo dokonce, lépe řečeno, tlustý časopis, pak souborem webových stránek spojených jedním doménové jméno- toto je webová stránka.
Každá webová stránka má svůj vlastní unikátní text, kterou jste napsali vy a vložili do html kódu.
Kód je příkaz pro prohlížeč, jak zobrazit ten či onen prvek. Předpokládejme, že jste napsali slovo, ale v jaké podobě bude na obrazovce, záleží na tom, do jakého kódu je uzavřete.
HTML kód se skládá z následujících prvků:
2. Atributy značek.
3. Hodnoty atributů.
Pojďme se na ně podívat popořadě.
HTML tag je hlavním prvkem kódu. Píše se to takto:
Jak vidíte, skládá se ze dvou částí. První úhlové závorky jsou otevírací část a druhá, s lomítkem, je uzavírací část.
Mezi tyto dvě části je zapsán zbytek kódu stránky, který se zobrazí na obrazovce.
Štítek sděluje prohlížeči, že se jedná o html dokument a je hlavní (nadřazenou) značkou pro všechny ostatní prvky.
V jiných značkách jsou prvky kódu, písmeno nebo slovo napsáno v lomených závorkách, což bude název značky a určí, který prvek se bude touto značkou zobrazovat.
Pokud například vložíte písmeno h1 do lomených závorek, text se na obrazovce zobrazí jako nadpis.
Ahoj
To znamená, že písmo slova „Ahoj“ bude větší a tučnější než zbytek textu.
Pokud vložíte písmeno p do lomených závorek, text uzavřený ve značce se zobrazí jako odstavec.
Ahoj
To znamená, že písmo bude normální, ale vše, co je napsáno za touto značkou, bude začínat na novém řádku.
Existuje několik desítek takových písmen a dokonce i slov, která definují typ příkazu, v html, i když se často používá ne více než 10-15 značek.
Podrobněji každou z nich zvážíme na cestě.
Následují atributy značek. Často používané, také ne více než tucet. A dovnitř Nedávno a ještě méně, protože všechny funkce atributů jsou přeneseny do css.
Ale o tom později, ale zatím stále zjistíme, co je atribut, protože některé z nich neztratily svou relevanci a nikdy neztratí.
atribut je dodatečný příkaz. Je napsáno v úvodní části štítku. Například, pokud chcete, aby byl titulek barevný, musíte do úvodní části tagu h1 vložit atribut color
A okamžitě přejděte k hodnotám atributů. Jde o to, že atribut musí mít hodnotu. To znamená, že jste zadali příkaz, že nadpis má být barevný, takže musíte určit, jakou barvu bude mít.
Tento údaj bude hodnotou atributu. Vypadá to takto:
Tohle je červené.
Stejným způsobem, ale s pomocí dalších atributů, můžete nastavit velikost textu, odsazení, zarovnání a mnoho dalšího.
I když styling se stále více posouvá k CSS a atributy stylingu postupně zastarávají a vymykají se praxi.
A nyní z výše uvedeného vyvozujeme závěr:
HTML je jazyk, kterému prohlížeče rozumí. Potřebujeme ho, abychom s prohlížečem komunikovali, nebo by se dalo říci, mohli jej ovládat, tedy dávat mu příkazy, jak vnímat a zobrazovat to, co píšeme na obrazovce.
Chci dodat, že značky, atributy a jejich hodnoty jsou snadno zapamatovatelné praktická cvičení, což budou v podstatě všechny následující články.
Tam tag hned vidíte, zjistíte jeho význam, v jakém případě a na jakém místě se používá, jakými znaky je doprovázen a jak se píše, takže teď vám nebudu ukazovat všechny tagy a atributy, my vše uvidí v praxi.
Úplný seznam značek a html atributy, pokud má někdo zájem, vždy se můžete podívat na . .
I když, pokud se nechystáte profesionálně věnovat programování, bude stačit znát pár (asi tucet) základních tagů a pár atributů.
No, to je snad vše. Málo? A víc není potřeba. Zbytek se naučí v procesu učení na konkrétních příkladech.
Myslím, že příklady usnadní pochopení. Naším cílem je vytvořit web a pochopit, jak to všechno funguje, takže do toho a trénujte.
Otočit se
Jakmile zasednete ke studiu, určitě vás probudí nějaký parchant !!!
Ve škole učitel říká studentům:
"Kdo z vás se konečně považuje za hlupáka?" Vstávej.
Po dlouhé pauze se jeden student zvedne:
"Takže si myslíš, že jsi hloupý?"
„No, vlastně ne, ale je trochu trapné, že stojíš sám.
Úvod
Základní informace o programovacím jazyce
1 O jazyce html
2 Tvorba webových stránek
3 Klíčové body
4 Struktura dokumentu
5 Značky těla dokumentu
Popis vytvoření webu
2 Grafika v dokumentu
3 Přidání stylů do dokumentu
4 Optimalizace grafiky pro web
Praktický algoritmus práce
1 Příprava
2 Vytvoření stránky "Mistr v digitálním zpracování informací"
Závěr
Seznam použité literatury
aplikace
Úvod
V době digitálních technologií a masové informatizace se internet stal nedílnou součástí našich životů a programování a design webu prestižní a žádanou profesí. Internet přeci nemůže existovat sám o sobě a někdo musí vytvářet webové stránky, aktualizovat weby každý den a dokonce každou hodinu tak, aby měl uživatel vždy přístup k aktuálním a ověřeným informacím v jemu srozumitelné podobě. Otázka programování a designu webu je tedy velmi aktuální. Proto téma mé práce souvisí s tvorbou webových stránek v jazyce HTML programování a programy, pomocí kterých můžete psát webové stránky. Ke své práci přikládám webovou stránku jako ukázku toho, co lze vytvořit znalostí programovacího jazyka HTML.
Objekt je webová stránka. Předmětem je programování webových stránek v HTML.
Cílem práce je prostudovat programovací jazyk HTML.
Prozraďte základní informace o jazyce;
Zvažte proces vytváření webu;
Vytvořte web na základě vyvinutého algoritmu.
Struktura: práce se skládá z úvodu, tří kapitol, závěru a seznamu literatury.
1. Základní informace o programovacím jazyce
.1 O jazyce html
Text Markup Language (HTML) je standardní jazyk pro vytváření hypertextových dokumentů na WEBu. HTML dokumenty lze prohlížet různými typy WEB prohlížečů. Když je dokument vytvořen pomocí HTML, webový prohlížeč může interpretovat HTML tak, aby extrahoval různé prvky dokumentu a zpracoval je jako první. Použití HTML umožňuje formátování dokumentů pro prezentaci pomocí písem, čar a dalších grafických prvků v libovolném softwaru pro procházení webu.
Většina dokumentů má standardní prvky, jako jsou nadpisy, odstavce nebo seznamy. Pomocí značek HTML můžete tyto prvky označit a poskytnout WEBovým prohlížečům minimum informací k zobrazení těchto prvků, přičemž zachováte celkový celková struktura a informační úplnost dokumentů. Ke čtení HTML dokumentu je potřeba pouze WEBový prohlížeč, který interpretuje HTML tagy a zobrazí dokument na obrazovce v podobě, jakou mu dává autor.
Ve většině případů autor dokumentu striktně definuje vzhled dokumentu. V případě HTML může čtenář na základě možností WEB prohlížeče do určité míry ovládat vzhled dokumentu (nikoli však jeho obsah). HTML vám umožňuje označit, kde by měl být nadpis nebo odstavec v dokumentu pomocí značky HTML, a poté nechat webový prohlížeč interpretovat tyto značky. Například jeden WEB prohlížeč může rozpoznat značku začátku odstavce a prezentovat dokument v požadované podobě, zatímco jiný tuto možnost nemá a dokument prezentuje na jednom řádku. Uživatelé některých WEB prohlížečů mají také možnost upravit velikost a typ písma, barvu a další parametry, které ovlivňují zobrazení dokumentu Tagy lze rozdělit do dvou kategorií:
Tagy, které určují, jak bude tělo dokumentu jako celek zobrazeno webovým prohlížečem.
Značky, které popisují obecné vlastnosti dokumentu, jako je název nebo autor dokumentu.
Hlavní výhodou HTML je, že dokument lze prohlížet ve WEBových prohlížečích různých typů a na různých platformách.
1.2 Tvorba webových stránek
dokumenty lze vytvořit pomocí libovolného textový editor nebo specializované HTML editory a konvertory. Výběr editoru, který bude použit k vytvoření HTML dokumentů, závisí pouze na konceptu pohodlí a osobních preferencích každého autora.
Například, HTML editory, jako je „Netscape Navigator Gold“ od Netscape, vám umožní vytvářet dokumenty graficky pomocí technologie WYSIWYG (What You See Is What You Get). Na druhou stranu většina tradičních nástrojů pro tvorbu dokumentů má převodníky, které umožňují převádět dokumenty do formátu HTML.
1.3 Základy
Všechny značky HTML začínají "<" (левой угловой скобки) и заканчиваются символом ">" (pravá lomená závorka). Zpravidla existuje počáteční značka a koncová značka. Zde jsou například značky title, které definují text, který je uvnitř počáteční a koncové značky a popisují název dokumentu, case není důležité při zadávání textu:
Koncová značka vypadá stejně jako počáteční značka a liší se od ní lomítkem před textem uvnitř úhlové konzoly. V tento příkladštítek
Některé značky jako
(tag, který definuje odstavec) nevyžadují koncový tag, ale jeho použití dává zdrojovému textu dokumentu lepší čitelnost a strukturu.
Pozornost! Nadbytečné mezery, tabulátory a konce řádku přidané do zdrojového textu dokumentu HTML pro lepší čitelnost budou webovým prohlížečem při interpretaci dokumentu ignorovat. HTML dokument může obsahovat výše uvedené prvky pouze v případě, že jsou umístěny uvnitř značek.
1.4 Struktura dokumentu
Když webový prohlížeč obdrží dokument, určí, jak má být dokument interpretován. Úplně první tag, který se v dokumentu objeví, musí být tag . Tato značka sděluje webovému prohlížeči, že váš dokument je napsán pomocí HTML. Minimální HTML dokument by vypadal takto:
Tělo dokumentu...
Záhlaví dokumentu
. Tag záhlaví dokumentu musí být použit bezprostředně za tagem a nikde jinde v těle dokumentu. Tato značka je obecný popis dokument. Do značky nevkládejte žádný text . Startovací značka umístěn přímo před značkou
Název dokumentu
1.5 Značky těla dokumentu
Značky těla dokumentu identifikují součásti dokumentu HTML, které se zobrazují v okně. Tělo dokumentu může obsahovat odkazy na jiné dokumenty, text a další formátované informace.
Tělo dokumentu
. Tělo dokumentu musí být mezi značkami A. Toto je část dokumentu, která se zobrazuje jako textová a grafická (sémantická) informace vašeho dokumentu.Úrovně nadpisů
Nadpis první úrovně
Nadpisy jiné úrovně mohou být reprezentovány v obecném případě takto:
značka odstavce
Na rozdíl od většiny textové procesory, návraty na začátek řádku jsou v dokumentu HTML obvykle ignorovány. Fyzický konec odstavce může být kdekoli ve zdrojovém textu dokumentu (pro snadnější čitelnost). Prohlížeč však rozděluje odstavce pouze v případě, že existuje značka
Pokud odstavce neoddělujete tagem
Váš dokument bude vypadat jako jeden velký odstavec.
Další parametry tagu
Umožňuje zarovnat odstavec doleva, na střed a doprava.
Centrování prvků dokumentu. Všechny prvky dokumentu můžete vycentrovat v okně prohlížeče. K tomu můžete použít značku.
Všechny prvky mezi tagy
přeformátovat značku,Umožňuje prezentovat text se specifickým formátováním na obrazovce. Předformátovaný text končí koncovou značkou. Uvnitř předformátovaného textu můžete použít:a) řádkový posuv
b) znaky tabulátoru (posun o 8 znaků doprava)
c) neúměrné písmo nastavené prohlížečem.
Pomocí značek, které definují formát odstavce, jako např
nebo , bude prohlížeč při umístění mezi značky ignorovat Seznam skupin Seznam skupiny 6-M-11
Tento seznam obsahuje příjmení, křestní jména a patronymie.
Seznam lze použít pouze pro úřední účely.
Zde je to, co uvidíte na obrazovce prohlížeče:
Pozornost! Záhlaví „Seznam skupin“ prohlížeč nevykresluje jako součást dokumentu. Zobrazí se v záhlaví okna prohlížeče.
Zalomení řádku
. Štítek
upozorní prohlížeč na zalomení řádku. Nejlepším příkladem použití této značky je formátovaná adresa nebo jakákoli jiná sekvence řádků, kde je má prohlížeč zobrazovat pod sebou. Například:Alexej Jarcev
Dmitrov dálnice,
9B, kancelář 326Další parametr umožňuje rozšířit možnosti značky
.
Tento parametr umožňuje nejen provést posun řádku, ale také umístit další řádek, počínaje čistým levým (vlevo), pravým (pravým) nebo oběma (všemi) okraji okna prohlížeče. Pokud je například vedle textu vlevo obrázek, můžete použít značku
pro posunutí textu pod obrázkem:Jak vidíte, toto schéma ukazuje zapojení
Odkazy na body v dokumentu. Pomocí speciální skryté značky pro tyto sekce můžete odkazovat na různé sekce nebo sekce stejného dokumentu. To vám umožní rychle se přesouvat z oddílu do oddílu v dokumentu, aniž byste museli posouvat obrazovku. Jakmile kliknete na odkaz, prohlížeč vás přesune do zadané části dokumentu a řádek obsahující značku oddílu (obvykle první řádek oddílu nebo nadpis oddílu) se umístí na první řádek dokumentu. okno prohlížeče (pokud tento řádek ještě není na obrazovce).
Vytvořte značku sekce. Syntaxe této značky je:
Text, který se zobrazí na prvním řádku
Text
Například:
Seznam sekcí
- Sekce 1
- Sekce 2
Sekce 1
Text oddílu 1
Sekce 2
- align — Определяет выравнивание линии. Может принимать значение left, center, right.
- color — Задаёт цвет линии.
- noshade — Рисует линию без трехмерных эффектов.
- size — Задаёт толщину линии.
- width — Задаёт ширину линии.
Text oddílu 2
Znaky "#ex1" říkají vašemu prohlížeči, aby v daném HTML dokumentu hledal značku s názvem "ex1".
Když uživatel klikne na řádek „Sekce 1“, prohlížeč skočí přímo do sekce 1.
2.2 Grafika v dokumentu
Jednou z nejatraktivnějších funkcí webu je schopnost zahrnout do dokumentu HTML odkazy na grafiku a další typy dat. To se provádí pomocí značky . Použití tohoto tagu může výrazně zlepšit vzhled a funkčnost dokumentů.
Grafiku v HTML dokumentech lze použít dvěma způsoby. Prvním je vložení grafiky do dokumentu, které uživateli umožňuje vidět obrázky přímo v kontextu ostatních prvků v dokumentu. Toto je nejpoužívanější technika při návrhu dokumentu, někdy označovaná jako „inline image“. Syntaxe značky:
Pojďme si popsat prvky syntaxe značky:
Povinný parametr, který má stejnou syntaxi jako standardní adresa URL. Tato adresa URL prohlížeči sděluje, kde se obrázek nachází. Výkres musí být uložen v grafickém formátu podporovaném prohlížečem. Dnes jsou formáty GIF a JPG podporovány většinou prohlížečů.="text":
Tento volitelný prvek určuje text, který se zobrazí v prohlížeči, který nepodporuje grafiku nebo má vypnuté stránkování obrázků. Obvykle se jedná o krátký popis obrázku, který by uživatel viděl nebo mohl vidět na obrazovce. Li daný parametr chybí, pak na místě obrázku většina prohlížečů zobrazuje piktogram (ikonu), jehož aktivací uživatel obrázek vidí. Značka ALT se doporučuje, pokud vaši uživatelé používají prohlížeč, který nepodporuje grafický režim, jako je Lynx.=n1:
Tento volitelný parametr se používá k určení výšky obrázku v pixelech. Pokud tento parametr není zadán, použije se původní výška obrázku. Tato možnost vám umožňuje zmenšit nebo roztáhnout obrázky vertikálně, což vám umožní jasněji definovat vzhled vašeho dokumentu. Některé prohlížeče však tuto možnost nepodporují. Na druhou stranu se rozlišení obrazovky vašeho klienta může lišit od vašeho, takže buďte opatrní při nastavování absolutní hodnoty grafiky.=n2:
Parametr je také volitelný, stejně jako předchozí. Umožňuje nastavit absolutní šířku obrázku v pixelech.: Toto nastavení se používá k tomu, aby prohlížeč řekl, kam má umístit další blok textu. To umožňuje přísněji specifikovat umístění prvků na obrazovce. Pokud tento parametr není použit, většina prohlížečů umístí obrázek na levou stranu obrazovky a text napravo od něj.:
Tato možnost sděluje prohlížeči, že tento obrázek umožňuje uživateli provést nějakou akci kliknutím na konkrétní místo v obrázku. Tato funkce je rozšířením HTML.
Zde je příklad použití této značky:
Od HTML 2.0 má značka byly přidány další možnosti:
Nové možnosti::
Umožňuje nastavit velikost bílého prostoru nad a pod obrázkem v pixelech tak, aby text nepřesahoval obrázek. To je důležité zejména u dynamicky generovaných obrázků, kdy není možné vidět dokument předem.:
Stejné jako VSPACE, ale pouze horizontálně.
Obrázky na pozadí. Většina prohlížečů umožňuje zahrnout do dokumentu obrázek na pozadí, který bude maticový a zobrazen před celým dokumentem. Některým uživatelům se grafika na pozadí líbí, některým ne. Nenápadný průsvitný obrázek (tapeta) obvykle vypadá dobře jako pozadí pro většinu dokumentů.
Popis obrázku na pozadí je součástí tagu BODY a vypadá takto:
.každý z parametrů určuje barvu prvku. Pojďme si popsat tyto parametry:Barva pozadí dokumentu:
Barva prostého textu dokumentu:
Barva odkazu. Barva je určena jako šestimístné číslo v hexadecimálním formátu pomocí schématu RGB (červená, zelená, modrá). Barva #000000 je černá a barva #FFFFFF je bílá. Například:
Daná linie definuje bílá barva pozadí dokumentu, černý text a stříbrné odkazy.
Vodorovná čára. Pomocí značky
, můžete text oddělit vodorovným pruhem.
Formát značky:
Možnosti značek::
Tloušťka čáry v pixelech:
Šířka čáry v pixelech nebo procento šířky okna prohlížeče.: Poloha na obrazovce (vlevo | uprostřed | vpravo).: Ve výchozím nastavení se čára vykresluje ve 3D zobrazení se stínem. NOSHADE umožňuje znázornit linii jako obyčejný tmavý pruh.
2.3 Přidání stylů do dokumentu
umožňuje používat různé styly písma pro zvýraznění textových informací v dokumentech. Tady krátký seznam styly podporované většinou prohlížečů: (tučné) (kurzíva) s mezerami (zapisovač – použití pevných písem)
Můžete kombinovat různé druhy styly, jako je tučné písmo a kurzíva.
Tabulka č. 1: Základní styly textu
Kombinace stylů umožňuje zobrazit více prvků na stejném řádku s různými styly, například:
Život - Tento píseň!
Život- Tento píseň!
Pozor, dodatek velký počet styly a jejich kombinace znesnadňují čtení textu!
Další styly:
velký (velký)
malý (malý)
spodní (dolní index)
sup (horní index)
Tabulka č. 2: Další styly textu
Velikost písma . Velikost písma můžete změnit pomocí značky:
Písmo může mít velikost od 1 do 7. Velikost písma můžete zadat přímo jako číslo nebo určit posun od základní hodnoty (ve výchozím nastavení 3) v kladném nebo záporném směru. Základní hodnotu lze změnit pomocí značky:
Například:
A hm En En A E
Změna barvy písma . Barvu písma můžete změnit pomocí značky: Červené Zelená Modrý.
2.4 Optimalizace grafiky pro web
V současné době se na webu používají dva typy rastrových souborů: ve formátu JPEG a GIF Formát dobře zprostředkovává barevné a tónové šmouhy, neostré okraje (např. fotografie). Soubor jpeg se v prohlížeči dobře měří. Špatně přenáší i barevné plochy, v kompresi je horší než formát GIF. Při ukládání ve formátu JPEG zvolte kvalitu „střední.“ Formát dobře reprodukuje rovnoměrné barevné plochy, tvrdé okraje (například vektorovou grafiku, loga). Má maximální kompresi, umožňuje průhledné pozadí. Špatně zmenšené v prohlížeči, narušuje barvy a tóny. Formát GIF použijte, pokud je obrázek bezeztrátově převeden na 128 barev se zapnutou možností „rozkladu“. V opačném případě je lepší uložit obrázek ve formátu JPEG. Chcete-li exportovat soubor jako GIF, nejprve indexujte jeho barevnou paletu v Adobe Photoshop:
Minimální počet barev zvolte ručně (pro kvalitní přenos vyhlazeného jednobarevného obrázku na jednobarevné pozadí stačí 5-8 barev, pro dvou- nebo tříbarevný stačí 15-25 barev Pokud je původní obrázek ve stupních šedi, převeďte jej před indexováním na RGB.
Pokud je to možné, vyhněte se zahrnutí možnosti „rozkladu“ – zvětšuje velikost souboru. Tato možnost je vyžadována pouze v případě, že je v obrázku barevný nebo tonální odlesk (např. stín). Při přiřazování průhledného pozadí se ujistěte, že se pozadí po použití "rozkladu" nestane "kostkovaným".
V obtížných případech zvýrazněte nejdůležitější prvky obrázku před indexováním. Barvy ve vybrané oblasti jsou indexovány správněji než ostatní.
3. Algoritmus praktické práce
.1 Příprava
K vytvoření webu jsem použil dva programy:
Macromedia Flash8 - program pro tvorbu flash animací; Dreamweaver - program pro psaní webových stránek.
V Macromedia Flash8 jsem vytvořil animaci pro záhlaví webu, včetně loga naší technické školy a názvu oboru, který studuji. Jako rámeček animace jsem zvolil monitor PC, pozadí vyplnil přechodem, přidal binární kód, který dynamicky klesá z horní části animace. Do popředí jsem vložil logo naší technické školy, které se nachází uprostřed a plynule přechází do levého horního rohu, přičemž klesá i název mé budoucí specializace „Mistr v digitálním zpracování informací“, který se zvedá zdola a se nachází přísně v centru.
V Adobe Dreamweaver vytvořil samotný web. Pro vytvoření webu jsem připravila potřebné informace, popsala samotnou odbornost, co bychom měli umět a co bychom měli umět, přidala seznamy skupin a také naši praktickou práci, kterou jsme ve třídě dělali. Na hlavní stránce jsou informace pro uchazeče, dole odkaz na stránky naší technické školy.
3.2 Vytvoření stránky "Mistr v digitálním zpracování informací"
V Adobe Dreamweaver jsem vytvořil tabulku ze šablony, která je v programu k dispozici, a pomocí nástrojů jsem do hlavičky webu přidal předpřipravenou animaci. Pod hlavičkou webu na pravé straně jsem zaregistroval registrační a přihlašovací formulář uživatele. Na levé straně jsem přidal odkazy na následující stránky webu:
Home - na hlavní stránce jsou informace pro žadatele a jejich rodiče; podmínky pro přijetí, podmínky studia, odkaz na „Federální státní vzdělávací standard pro primární odborné vzdělávání podle povolání 230103.02 Magistr v digitálním zpracování informací (schváleno nařízením Ministerstva školství a vědy Ruské federace ze dne 16. dubna 2010 č. 365)
O profesi - na této stránce jsem zveřejnil informace o samotné specializaci, kde může být poptávka, jaké odborné dovednosti by měl mít člověk, který si tuto specializaci vybral, a osobní vlastnosti. Aby se každý, kdo se chce do této speciality přihlásit, mohl s odborností co nejlépe seznámit a rozhodnout se, zda mu vyhovuje nebo ne.
Co by měl vědět - zde jsou uvedeny informace o tom, co by měl umět "Master of Digital Information Processing", tedy jaké odborné znalosti by měl mít člověk, který se rozhodl pro toto povolání.
Co by měl umět – tato stránka poskytuje informace o tom, co by měl umět „Mistr v digitálním zpracování informací“, jaký software a odborné dovednosti by měl mít člověk, který absolvoval školení v této specializaci.
Skupiny – tato stránka obsahuje skupiny, které se právě v této specializaci školí, a také seznam skupin.
Naše práce – zde jsou naše nejlepší praktické práce, které jsme ve třídě odvedli.
Nejlepší práce - tato stránka je věnována nejlepším pracím, které se zúčastnily soutěží, výstav atd.
Registrace - na této stránce se v případě potřeby může host mého webu zaregistrovat na webu.
Na levé straně jsou miniaplikace, hodiny a kalendář. Animace hodin a kalendáře jsem si stáhl z webu třetí strany, po vložení na můj web mi Adobe Dreamweaver automaticky předepíše HTML kód, což mi hodně pomohlo.
Níže je odkaz na naše webové stránky. Jako pozadí jsem zvolil bezešvé pozadí oblohy, prohlížeč sám vyplní stránku obrázkem na pozadí v závislosti na rozlišení obrazovky. Jako pozadí stolu jsem zvolil jednolitou barvu.
Design všech stránek odpovídá designu hlavní stránky.
přípona souboru programovacího webu
Závěr
V dnešní době existuje mnoho programů na tvorbu webových stránek, ale ani jeden to neumí sám, určitě potřebujete uživatele, který bude tento program spravovat . A bez ohledu na to, jaký program používáte, bez znalosti programovacího jazyka HTML uživatel nic nezmůže.
V procesu tvorby webu jsem se seznámil s metodou programování HTML, jak vytvářet webové stránky a jak používat základní značky. Práce se soubory různých formátů a přípon pro správné zobrazení v prostředí internetu.
Chci, aby se mi moje znalosti v budoucnu hodily v práci, k profesionálovi mám samozřejmě daleko, ale dál se budu věnovat HTML programování a zdokonalovat se jako specialista.
Seznam použité literatury
1. Allenova Natalia - Návod na html.
2. Malchuk E. - HTML a CSS. Tutorial.
3. Webové stránky – www.msiter.ru
4. Webové stránky – www.ic.vrn.ru
5. Webové stránky – www. tcs74.ru/professii/MOCI
6. Webové stránky – www.vk.com›oficiální veřejná skupina2
7. Webové stránky – www.ic.vrn.ru/
Webové stránky - www.arachnoid.com/arachnophilia
Webové stránky - www.rzn62.narod.ru
Webové stránky - www.mysite.hut.ru
aplikace
.
2.
Теперь немного поясню. Все теги (тэг — элемент языка разметки гипертекста ) делятся на два типа «одиночные» и «закрывающиеся». Кроме того теги заключаются в следующие символы < и > , именно они отличают тег от обычного текста html . Рассмотрим несколько самых простых «одиночных» тегов:
— тег, который отвечает за перенос на новую строку, в том месте, где установлен данный тег. Рассмотрим код с использованием этого тега.
А это мой первый сайт.
Результат можно посмотреть .
— тег, который рисует горизонатльную линию. Этот тег относится к блочным элементам, линия всегда начинается с новой строки. Имеет 5 атрибутов:
Код с использованием тега
:
А это мой первый сайт.
Визуальный пример находится .
Ещё один «одиночный» тег — это . Данный тег спользуются для хранения информации предназначенной для браузеров и поисковых систем. Поисковые системы обращаются к метатегам для получения описания сайта, ключевых слов и других данных. Разрешено использовать неограниченное число метатегов, все они должны находится между и . Параметры любого метатега имеют вид «имя=значение», который определяется ключевыми словами content , name или http-equiv . Т.к. метатеги предназначены для машин, никакого визуального изменения они не вносят, поэтому я приведу лишь исходный код:
Эта строка говорит о том, что создатель страницы считает, что на странице используется кодировка UTF-8. В HTML5 всё стало проще, для того, чтобы указать кодировку, достаточно лишь следующей строки:
Cуществуют и другие одиночные теги (,
,