Cum se creează o pagină web. Cum se creează o pagină HTML: instrucțiuni pas cu pas, tehnologie și recomandări

Bună ziua, dragi cititori ai blogului. Cu acest articol, vom începe să învățăm elementele de bază ale limbajului HTML.

Probabil că știți deja că limba principală a internetului este limbaj de marcare hipertext HTML (HyperText Markup Language). În acest articol, vom învăța conceptele de bază ale HTML și vom învăța cum să creăm pagini WEB simple.

Să începem cu cel mai important lucru, să vedem cum funcționează World Wide Web - Internet. Pentru a produce pagini web, creați fișiere scrise în HTML și le plasați pe un server web. După aceasta, orice browser instalat pe un dispozitiv cu acces la Internet, fie că este un computer, telefon sau tabletă, vă poate găsi paginile web.

server web- Acesta este un computer obișnuit cu software special care are acces la Internet. Ascultă continuu solicitările din browsere pentru pagini web, imagini, fișiere audio și video. După ce a primit o solicitare pentru una dintre aceste resurse, serverul o caută și o trimite browserului.

Browser este un program special conceput pentru a vizualiza site-uri web, cum ar fi Internet Explorer. Folosind un browser, navigați pe site-uri web făcând clic pe linkuri. Orice astfel de clic determină browserul să facă o cerere pentru pagina HTML către serverul web, să primească un răspuns și să afișeze pagina în fereastra sa. Când pagina este afișată, limbajul HTML începe să funcționeze, acesta spune browserului totul despre structura și conținutul paginii web. Utilizarea comenzilor - etichete, HTML spune browserului unde încep paragrafele de text, ce parte a textului este un titlu și unde să insereze tabele și chiar imagini. Și etichetele sunt cuvinte între paranteze unghiulare, de exemplu

,

, .

Ai nevoie urgent de un magazin online, dar nu ai timp să înveți HTML, CSS, PHP și alte tehnologii. Apoi puteți închiria pur și simplu un magazin online cu funcționalitate și optimizare complet implementate pentru motoarele de căutare.

Limbajul HTML și etichetele acestuia

Prima versiune a limbajului HTML a apărut în 1992. La momentul anului 2013, specificația unei noi versiuni de HTML, numărul 5, este în curs de dezvoltare. Dezvoltarea acestei specificații este realizată de World Wide Web Consortium, sau pe scurt W3C. Organizația W3C dezvoltă alte standarde Web. Vă puteți familiariza cu aceste standarde pe site-ul lor www.w3.org. Apropo, multe browsere Web acceptă deja unele caracteristici HTML 5.

Vă sugerez să începeți să învățați HTML imediat cu un exemplu. Deci, să creăm prima noastră pagină Web. Orice editor de text este potrivit pentru crearea de pagini WEB. Vă sugerez să utilizați mai întâi Windows-ul încorporat Notepad(în general, pe viitor, recomand să utilizați pentru a edita codul html). Îl puteți găsi: „Start->Toate programele->Accesorii->Notepad”. Să creăm o pagină despre mașini. Deci, deschideți Notepad și introduceți următorul text în el:

Site despre mașini.

Bine ați venit pe site-ul nostru auto. Aici veți găsi multe articole interesante și utile despre mașini. Site-ul conține descrieri ale multor mașini importate și autohtone.

Apoi, salvați pagina web creată într-un fișier numit index.html. În acest caz, în caseta de dialog de salvare a fișierului, trebuie să setați codificarea la UTF-8 și să includeți numele fișierului între ghilimele, altfel Notepad va adăuga extensia txt la acesta, iar fișierul nostru va fi numit index.htm.txt:

Acum tot ce rămâne este să deschideți fișierul creat în browser și să priviți rezultatul. Pentru a face acest lucru, puteți utiliza browserul Microsoft Internet Explorer care vine cu Windows sau orice alt browser instalat pe computer, făcând dublu clic pe fișierul index.html sau trăgând fișierul pe pictograma browserului. Deschide-l și vezi ceva de genul:

Așa că am creat o pagină Web în Notepad care, deși puțin simplă, conține deja un titlu mare și un paragraf de text care este rupt automat în rânduri și conține o porțiune cu caractere aldine.

Ce este o etichetă?

Acum să vorbim mai multe despre structura paginii. Să ne uităm la fragment:

Site despre mașini

. Aici vedem textul care apare pe pagină ca titlu, închis în etichete

Şi

. Ce este o etichetă în HTML?

Etichetă HTML sunt cuvinte și simboluri obișnuite cuprinse între paranteze unghiulare, de exemplu

,

, . Deci etichetați

este eticheta de deschidere, eticheta

eticheta de închidere, iar textul dintre ele se numește conținutul etichetei. De asemenea, etichetați

și etichetați

se numesc etichete pereche. Împreună, eticheta de deschidere plus conținutul plus eticheta de închidere formează un element de document HTML. Există, de asemenea, elemente formate dintr-o etichetă de deschidere:

Etichetă așa împerecheată

definește un element antet de prim nivel. Există șase niveluri de titluri în total, acestea sunt elementele

—

.

Elementele pot fi bloc sau inline (text). Elemente de bloc efectuează formatarea structurală a paginii. Elementele bloc sunt întotdeauna afișate pe o nouă linie pe pagină și sunt indentate față de elementele adiacente. Elemente în linie efectuați formatarea directă a textului sau formatarea logică. Element

este un element bloc.

Asta e tot pentru mine!!! Ne vedem în postările următoare!

Vă întrebați cum să creați o pagină HTML? Pentru a face acest lucru, trebuie să petreceți câteva ore și veți ști și vă puteți crea prima pagină în 5 minute.

HTML înseamnă HyperText Markup Language. Tradus, aceasta înseamnă „limbaj de marcare hipertext”. Este important să înțelegeți că HTML nu este un limbaj de programare, ci un limbaj de marcare a site-ului.

Toate browserele moderne îl pot recunoaște. Apoi afișează informațiile într-un mod ușor de utilizat, așa cum a intenționat în prealabil autorul.

Această limbă folosește etichete speciale. Fiecare etichetă își îndeplinește propria funcție. Sunt o mulțime. În mod ideal, trebuie să înveți totul. Dar pentru un începător, cunoștințele de bază sunt destul de suficiente.

Bazele HTML

Înainte de a crea o pagină HTML, trebuie să știți în ce constă. Există două concepte în acest limbaj: element și tag.

O etichetă de deschidere și de închidere sunt folosite pentru a indica unde începe și unde se termină acest element. Arata cam asa.

<открывающий тег>conţinut

După cum puteți vedea, singura diferență între eticheta de deschidere și de închidere este „/”.

Întregul document HTML este o colecție a acestor elemente. Există anumite cerințe pentru structura documentului. Tot conținutul paginii trebuie să fie între două etichete Şi. Când scrieți cod, faceți un obicei să includeți imediat o etichetă de deschidere și de închidere.

De asemenea, amintiți-vă că structura limbajului HTML are propria sa ierarhie. Altfel se numește cuibărit. este cea mai importantă, deoarece toate celelalte sunt în ea.

HTML are două elemente copil:

• ... ;
• .. .

Blocul HEAD indică diverse informații de service. Aceste informații nu sunt afișate în browser. De exemplu, instrucțiuni pentru dezvoltatori, pentru orice program, pentru roboți și multe altele.

Cel mai important lucru este că nu există conținut aici.

Secțiunea BODY specifică conținutul documentului care va fi afișat utilizatorului.

Învață să creezi imediat etichete deschise și închise, deoarece pot exista 10 elemente imbricate. În plus, pentru comoditate, este recomandat să indentați etichetele imbricate. De exemplu, așa.

Acest lucru se face astfel încât etichetele de importanță egală să fie la același nivel, iar etichetele copil să fie „în interior”. Acest lucru face mult mai ușor de înțeles și de găsit codul potrivit. Altfel s-ar putea să te confuzi. Dar pentru a economisi spațiu, corpul în sine poate fi făcut fără adâncituri. Acest lucru se face astfel încât toți ceilalți să nu aibă indentare suplimentară. Este indicat să separați totul.

Cum se creează o pagină HTML simplă

Pentru a scrie cod aveți nevoie de un fel de editor. Sunt o mulțime. Cele populare sunt Notepad++ și Adobe Dreamweaver. Puteți folosi și un blocnotes.

Așa arată editorul Notepad++.

Acesta este un editor foarte convenabil și, în același timp, gratuit. Adobe Dreamweaver de mai sus este o versiune plătită. Diferența dintre editorii proiectați pentru scris și un bloc de note este că etichetele speciale sunt evidențiate. Dacă nu este evidențiat, atunci ați scris-o incorect.

Pentru ca lumina de fundal să se potrivească cu limba, aceasta trebuie specificată în setări.

Să vedem cum să creați o pagină HTML în Notepad. Adică, să terminăm partea tehnică și apoi să trecem direct la studierea etichetelor.

Cum se creează o pagină web în HTML Notepad

Pentru a începe, deschide Notepad.

Apoi tastați în el ceea ce este indicat în următoarea captură de ecran.

Obișnuiți-vă să scrieți cu mâinile în loc să copiați. Când scrieți cu mâinile, mai bine vă amintiți întreaga bază de etichetă.

După aceasta, puteți deschide fișierul într-un browser și puteți admira rezultatul. Acum ar trebui să înțelegeți cum să creați o pagină web într-un bloc de note HTML.

Consorțiul mondial W3C

Există o organizație numită W3C, care dezvoltă și implementează toate standardele pentru Internet. Toate browserele respectă aceste standarde și procesează marcarea paginii (codul) conform acestor reguli.

Pe site-ul oficial al dezvoltatorilor limbajului HTML puteți găsi un tabel cu toate etichetele și regulile de utilizare a acestora. În acest articol le luăm în considerare pe cele mai de bază.

S-ar putea să vă gândiți, care ar putea fi regulile? Toate etichetele descrise au propria lor recomandare. Există mai multe dintre ele:

• Etichetă opțională.
• Interzis.
• Etichetă goală.
• Învechit
• Pierdut.

Etichete în HTML

Înainte de a crea o pagină HTML, trebuie să înțelegeți ce ar trebui să fie în partea de service HEAD.

Zona HEAD conține atât etichete obligatorii, cât și etichete opționale. Eticheta necesară este titlul. Este desemnat . Este atribuit întregului document. Și ceea ce vedeți în rezultatele motorului de căutare Google este eticheta de titlu.

Să trecem la secțiunea CORP. Există elemente care sunt afișate în browser și sunt și altele care nu sunt. De exemplu, comentariile nu sunt afișate utilizatorului. Ele pot fi folosite pentru note sau pentru a oferi indicii altor angajați dacă lucrați în echipă.

Ele sunt desemnate ca

Totul dintre ele, este privit de program ca atare. Vă rugăm să rețineți că nu puteți imbrica o etichetă de comentariu într-o altă etichetă de comentariu. Pentru că odată ce ai deschis.

Un exemplu de astfel de cuibărire:

continuarea primului comentariu -->

Rezultatul în browser va fi următorul

continuarea primului comentariu -->

Iată o bucată nu vor fi vizibile. A doua etichetă de deschidere