Bazele html pentru începători într-un limbaj ușor de înțeles. Teste de cunoaștere a tehnologiilor Web

Limbile de hipermarkup, cum ar fi html și CSS, nu sunt atât de greu de învățat pe cât ar părea la începutul cunoașterii lor. Acestea se bazează pe principii complet naturale și ușor de înțeles, care, odată stăpânite, pot rezolva cu ușurință numeroase probleme care apar în funcționarea propriului site.

Cunoștințele de bază ale html și CSS vă vor permite să depanați în mod independent problemele minore inevitabile în funcționarea unei resurse web, să editați informații de pe site, să plasați hyperlinkuri, să plasați imagini și să extrageți informațiile necesare în diferite moduri.

Html este baza aspectului și o componentă de bază în organizarea elementelor site-ului

Html este baza pe care se suprapune ulterior alte cunoștințe despre managementul resurselor și organizarea elementelor acesteia. Acest limbaj de marcare este unul dintre cele mai importante și mai frecvent utilizate. Și capabilitățile html vă permit să plasați elemente pe o pagină web în locul dorit și să le oferiți dimensiunea și aspectul dorit.

Informațiile care sunt marcate folosind HTML sunt citite de aplicații special dezvoltate, mai bine cunoscute ca browsere sau browsere de internet. Cele mai utilizate browsere de internet astăzi sunt:

Internet Explorer
Google Chrome;
Operă;
Mozilla Firefox.

În același timp, creatorii de browsere pot crea în mod independent seturi noi de elemente pentru html. La sfârșitul anilor 90, tocmai din cauza creativității atât de active a dezvoltatorilor de browsere concurenți s-a format fenomenul „războiului browserului”. Esența sa s-a rezumat la faptul că unele pagini HTML sunt afișate corect într-un browser de internet, dar în altul utilizatorul le vede cu erori. Singura cale de ieșire din situația de conflict de browser este să utilizați aspectul între browsere.

Editori pentru crearea paginilor html

Puteți crea sau edita o pagină HTML folosind editori HTML. Cel mai simplu și mai faimos este editorul de text Notepad, care nu este scris special pentru a lucra cu marcaj HTML, dar acceptă această funcție. Următoarele editoare sunt mai funcționale și proiectate special pentru lucrul cu HTML:

Notepad++ - funcționează cu codul sursă și este distribuit gratuit.
Macromedia Dreamweaver se distinge printr-un set de funcții avansate pentru editarea și vizualizarea marcajului creat și are și capacitatea de a afișa pagina finală.
Adobe Dreamweaver - ca și editorul anterior, are funcția de afișare a paginii finalizate, adică permite utilizatorului să vizualizeze versiunea editată în forma în care aceasta va fi afișată în browser. Acest program este o versiune ulterioară, apărută ca urmare a îmbunătățirilor aduse de specialiștii Adobe, achiziționate de la Macromedia, ale editorului lor. Din această cauză, Macromedia Dreamweaver și Adobe Dreamweaver sunt foarte asemănătoare.
Microsoft Front Page este inclus în pachetul de aplicații Office și are capacități suficiente pentru procesarea și crearea de markup HTML.

Etichetele principale

Un document care utilizează marcaj HTML este un set simplu de componente care sunt segmentate folosind caractere speciale numite etichete. Etichetele includ un element, dându-i astfel un aspect specific și definindu-i locul. Există, de asemenea, cazuri când eticheta nu conține nimic: acest lucru se aplică combinației
, care returnează o linie.

Eticheta care vine înaintea elementului de încadrare se numește eticheta de deschidere și arată astfel< тег >. Eticheta care vine după elementul de închidere se numește eticheta de închidere și arată astfel. Este necesară prezența unei bare oblice (/) pentru a închide eticheta, altfel componenta nu va funcționa. Această regulă se aplică majorității etichetelor, cu excepția celei menționate mai sus
si altii unii. Etichetele HTML principale includ:

— o etichetă care indică direct că fișierul aparține formatului html;
— o etichetă care este invizibilă într-un document și are rolul de a indica numele documentului și caracteristicile acestuia pentru roboții de căutare;
— o etichetă care definește limitele părții vizibile a documentului;
— o etichetă care trimite titlul paginii la cuprins;
, , , - etichete de formatare a textului care creează text aldine, text italic, întreruperi de paragraf și numerotare.

Alături de etichete, al căror rezultat este văzut de vizitatorul paginii sub formă de scriere aldine sau cursive, există și etichete de serviciu, care se numesc metaetichete și oferă informațiile necesare motoarelor de căutare și browserului, dar nu sunt vizibil pentru utilizatorul mediu.

Pentru a crea o pagină html, trebuie să efectuați succesiv pașii descriși mai jos. Puteți folosi un blocnotes obișnuit.

1) Creați un document. Lipim următorul cod în el:

Conținutul acestui element va fi afișat în browser

Notă: asigurați-vă că indicați codarea documentului în „”, așa cum se arată mai sus.

2) În continuare: fișier - salvați ca. În câmpul „tip fișier”, în loc de „txt”, selectați „Toate fișierele” (toate fișierele), în câmpul paginii de cod (codarea paginii) - selectați 65001 (UTF-8), în câmpul „nume fișier”, după numele documentului, puneți un punct și extensia html (.html), apoi faceți clic pe salvare. Avem un al doilea document în același folder, dar în html. Aceasta este pagina noastră web, care poate fi deschisă acum în orice browser.

Exemple de cod HTML

Text împărțit în paragrafe

Paragraful 1

paragraful 2

paragraful 3

Titluri și paragrafe centrate

Acest titlu este aliniat la centru.

Al doilea nivel al titlului este centrat.

Textul paragrafului este centrat.

Metaetichete, titlul paginii (titlu), descrierea paginii (descriere) și cuvinte cheie (cuvinte cheie)

Titlul paginii

Paragraf cu cuvinte cheie specificate în „cuvinte cheie”

CSS - adăugarea de mecanisme html

Acolo unde funcționalitatea html este insuficientă, foile de stil în cascadă (CSS) vin în ajutor. Sunt opțiuni mai avansate și mai puternice pentru a schimba aspectul unei pagini web. Funcțiile CSS împreună cu funcțiile html. Aceste două seturi de parametri interacționează și nu se înlocuiesc în niciun fel.

Opțiunile CSS pot fi plasate în documentul web în sine utilizând:

etichete care se află între etichete și ;
atribut de stil situat în interiorul oricărei alte etichete.

Sugestiile CSS pot fi, de asemenea, atașate unui document web folosind:

etichetă plasată între și ;
Directiva @import plasată între etichetele și.

În procesul de scriere a unei foi de stil, este necesar să se respecte cu strictețe o sintaxă specială care implică subordonarea elementelor și ierarhia acestora, în care pozițiile sunt distribuite între pointer, proprietate, valoare, descriere și șir. În acest caz, acoladele sunt folosite pentru a indica proprietăți și mai multe proprietăți pot fi atribuite fiecărei etichete simultan.

Modalități de conectare a foilor de stil CSS

Există mai multe moduri de a conecta CSS la html:

tabele inline, care încorporează o foaie de stil în antetul paginii folosind ;

Pagina cu foaie de stil încorporată

Ztx (

dimensiunea fontului: 12px;
culoare: #4A4A4A;
}

Ztx_2 (
font-family:Verdana, Geneva, sans-serif;
dimensiunea fontului: 18px;
culoare:#F00;
culoare de fundal:#3FF;
}

Text bogat

Un al doilea stil a fost deja aplicat acestui text.

Notă: „font-family” este numele fontului, „font-size” este dimensiunea fontului, „color” este culoarea fontului, „background-color” este culoarea de fundal.

tabele CSS interne, unde tabelul este plasat în interiorul unui element html;

Pagina cu stiluri în interiorul unui element

Text bogat

Al doilea stil va fi deja aplicat acestui text

tabelele CSS externe, atunci când utilizați această metodă de conectare, foile de stil sunt create ca fișier separat.
Această metodă este cea mai convenabilă și, prin urmare, des folosită. Conexiunea în acest caz se face folosind o etichetă și va arăta astfel:

Conectarea CSS la HTML

Acesta este titlul de primul nivel

Doar trimite mesaj aici

Acesta este un titlu de al doilea nivel

Doar trimite mesaj aici

Dar conținutul fișierului CSS „style.css” este astfel aplicat textului atribuit clasei „form”, în acest caz: numele fontului, dimensiunea fontului și culoarea de fundal.

Formă(
font-family:Verdana, Geneva, sans-serif;
dimensiunea fontului: 12px;
culoare de fundal:#3FF;
}

Material informativ întocmit de angajații studioului de web design „WHITE SAIL”

Sperăm din suflet că va fi util tuturor celor care au decis să stăpânească elementele de bază ale html și css.

Această intrare a fost publicată duminică, 17 martie 2013 la 08:47 și este depusă în . Puteți urmări orice răspuns la această intrare prin feed. Răspunsurile sunt momentan închise, dar puteți de pe site-ul dvs.

Noțiuni de bază HTML pentru începători, ceea ce ar trebui să știe acum orice webmaster sau blogger începător. Dacă doriți să învățați cum să creați site-uri web de bază, să înțelegeți codul în sine, să știți ce se află în spatele ce și ce ar trebui să meargă, este pur și simplu imposibil să faceți acest lucru fără cunoașterea elementelor de bază ale limbajului HTML. Pe blogul meu voi avea un întreg lanț de articole pe care le voi dedica acestui subiect de la A la Z, voi descrie fiecare etichetă care este prezentă în document, ce înseamnă și cum să o folosesc corect.

Bazele HTML

Dacă nu știi cele mai elementare lucruri, drumul tău este închis. Consider că fiecare persoană care decide să dezvolte și să creeze site-uri web ar trebui să cunoască și să înțeleagă elementele de bază, în ce constă site-ul în sine, cum funcționează și ce se întâmplă în codul în sine.

Desigur, există destul de multe limbaje de programare, toate sunt complexe în felul lor, dar există unele pe care trebuie neapărat să le cunoști. Dacă doriți să proiectați frumos o scrisoare care să fie trimisă prin poștă, aveți propriul grup VKontakte, un grup pe alte rețele sociale, același canal YouTube, trebuie să modificați codul de pe oricare dintre motoarele site-ului, trebuie doar să cunoască conceptele de bază.

Am dat doar câteva exemple, de fapt, acum aceste cunoștințe sunt folosite din ce în ce mai des pe Internet. Sunt mai mult un practician decât un teoretician, așa că în articolele mele din această secțiune vă voi arăta exemplele mele despre cum și ce am făcut, pas cu pas. Voi posta atât pagini de exemplu, cât și site-uri întregi.

Un document HTML este cel mai simplu document text, un limbaj de etichetare pe care îl întâlniți în fiecare zi pe Internet. Etichetele descriu structura unui document. Etichetele sunt formatate ca unghiular< >paranteze, în interiorul cărora este scris numele etichetei. Browserul se uită la structura documentului, îl construiește și îl afișează conform instrucțiunilor sale pe monitor, dacă, desigur, ați făcut totul corect.

Întregul proces începe chiar înainte de a vedea imaginea finală. Browserele procesează un document secvenţial, de la început până la sfârşit. Inclusiv tot ce ar trebui să fie pe pagină. Tabele, imagini, scripturi și așa mai departe, cu excepția faptului că acestea includ stiluri CSS.

Bazele pentru începători

Ce este html - dacă te uiți la ce scrie Wikipedia - (HyperText Markup Language) limbaj de marcare hipertext pentru documente. Majoritatea paginilor de pe Internet conțin marcaj de pagină în această limbă. Această limbă este interpretată de browsere, iar textul formatat rezultat este afișat pe monitorul computerului sau pe dispozitivul mobil.

Acest limbaj este în mod inerent foarte ușor și accesibil de învățat. Oricine poate învăța și înțelege elementele de bază. Pentru a folosi un astfel de limbaj, trebuie să cunoașteți și să utilizați descriptori, care sunt numiți și etichete. Cu ajutorul etichetelor este creat un document.

În ce ar trebui să constea structura documentului, ce etichete ar trebui să fie prezente. Să privim totul cu un mic exemplu. Am scris ceva text în MS Office și l-am arătat în această captură de ecran.

Pentru a afișa acest text în browser în același mod în care a fost scris în document, trebuie să îi adăugați un marcaj de pagină, care include câteva etichete. Mai întâi, uită-te la ele, apoi îi voi descrie pe fiecare cine este responsabil pentru ce.

Bun venit pe blogul meu, acum iei o lecție despre elementele de bază ale HTML. Dacă ți-a plăcut acest articol, te poți abona la acest blog pentru a primi articole noi în căsuța ta de e-mail.

Blogul lui Evgeny Nesmelov! website Noțiuni de bază ale html și css pentru începători

În ce etichete constă orice document html, ce include și unde ar trebui să fie scris totul?

< html >

< body >

< h2 >< / h2 >

< p >Bine ați venit pe blogul meu, urmați acum tutorialul despre elementele de bază HTML. Dacă ți-a plăcut acest articol, te poți abona la acest blog pentru a primi articole noi în căsuța ta de e-mail.< / p >

< h2 >Blogul Evgeniei Nesmelov! Nesmelov. ru Bazele HTML și CSS pentru începători< / h2 >

< / body >

< / html >

Orice cod constă din caractere care sunt plasate între paranteze unghiulare. Toate acestea se numesc elemente. Toate elementele constau de obicei din două etichete, de deschidere și de închidere. Vă sfătuiesc să priviți inițial cu atenție etichetele dacă omiteți una dintre ele și nu o închideți, va trebui să revizuiți părți mari din cod pentru a găsi eroarea.

Au fost cazuri când a durat mai mult de o zi, o persoană contactează și cere ajutor, nu poate găsi o eroare pe site-ul său, așa că uitați-vă întotdeauna cu mare atenție la ce și unde scrieți. Să folosim acum acest exemplu pentru a ne uita la fiecare element al codului, ce este scris în el, ce înseamnă și ce se întâmplă în final.

Majoritatea etichetelor sunt împerecheate, ceea ce include o etichetă de deschidere și una de închidere. Pe lângă astfel de etichete, există și etichete unice. Etichetele pot merge împreună cu altele, astfel cuibărându-se unele în altele. De exemplu, afișați textul cu caractere aldine și cursive simultan.

Text

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

Structura documentului HTML

Permiteți-mi să vă reamintesc încă o dată, trebuie să urmați regulile prezente în document. Acesta este modul în care browserul înțelege ce este pe pagină, secvența acesteia, conținutul și așa mai departe.

O etichetă este o componentă care îi spune browserului web să efectueze o anumită sarcină. De exemplu, prezența unui paragraf, tabel, formular sau imagine.

Atribut - modifică eticheta. De exemplu, puteți alinia un paragraf centrat sau aliniat la dreapta, puteți, de asemenea, să setați locația imaginii pe pagină și așa mai departe.

ÎNTOTDEAUNA închideți etichetele, dacă îl deschideți, asigurați-vă că îl închideți. În caz contrar, va apărea o eroare și documentul dvs. nu se va afișa corect pe pagină. Există și excepții, care nu trebuie uitate.

Este clar necesar să înțelegeți că există un titlu de document și corpul acestuia. Titlul este tot ceea ce este conținut în etichetă. Corpul documentului (), corpul documentului conține tot conținutul paginii. Dacă este necesar să lăsați o secțiune de cod pentru dvs., incluzând astfel aceste etichete în comentarii, eticheta este folosită pentru aceasta. Tot ceea ce se află în interiorul unei astfel de etichete servește drept comentariu și nu este perceput de browsere.

Să începem cu primul. La începutul documentului am deschis o etichetă și la sfârșit am închis-o. Acest cod este prezent în absolut fiecare document, îi spune browserului că tot ce este plasat între aceste etichete este cod HTML. Este rădăcina documentului în sine, tot ceea ce este prezent ulterior în spatele acestei etichete nu mai este inclus în document și nu este perceput de browsere. Chiar la începutul documentului, eticheta este deschisă și la sfârșit trebuie închisă.

Întreaga secțiune a acestei etichete conține toate informațiile tehnice ale documentului. Ca și eticheta anterioară, capul trebuie de asemenea deschis și închis la sfârșit. Aceste informații includ titlul paginii, descrierea, cuvintele cheie ale motorului de căutare și codificarea. Despre codificare puțin mai jos.

Conţinut

< head >Conţinut< / head >

Această etichetă este inclusă în cap și trebuie să fie scrisă în interiorul etichetei. Această etichetă de titlu este obligatorie și trebuie să fie prezentă în fiecare document HTML. În plus, apare ca titlul ferestrei browserului. Lungimea unui astfel de antet nu trebuie să depășească 60 de caractere. Textul unui astfel de antet ar trebui să conțină cele mai complete informații care caracterizează conținutul paginii.

Dacă ați scris „Hello World” în antet, aceasta este informația care ar trebui să fie afișată pe pagină și nu alta. Nu ar trebui să înșeli oamenii și motoarele de căutare, nu le place și, prin urmare, înrăutățiți lucrurile pentru dvs. Informațiile conținute în această etichetă ar trebui să fie relevante pentru conținutul paginii dvs.

După eticheta de titlu obligatorie, există o etichetă meta opțională, dar la fel de importantă. Această etichetă este singură. Folosind această etichetă, setați o descriere pentru pagină (descriere) și cuvintele ei cheie (cuvinte cheie).

În plus, metaeticheta poate conține date despre autorul paginii și alte proprietăți de metadate. Puteți împiedica indexarea întregii pagini de către motoarele de căutare. Setați pagina să se reîmprospăteze automat după 20 de secunde sau după 5 secunde, urmată de trecerea la o altă pagină.

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

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

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

Pot exista mai multe astfel de meta-elemente, deoarece pot transporta informații complet diferite. Alți utilizatori, când deschid pagina în browser, nu văd toate descrierile dvs., toate acestea rămân ascunse.

Eticheta de stil poate fi folosită și pentru a seta stiluri pe pagină. Dacă utilizați mai multe stiluri CSS diferite, atunci este recomandabil să le setați într-un fișier separat. Dacă trebuie să specificați mai multe dintre ele, toate acestea pot fi specificate direct în documentul html.

.bază ( lățime: 100px; culoarea fundalului: #000; înălțimea: 150px; culoare: #fff; )

< style type = "text/css" >

Baza(

lățime: 100px;

fundal - culoare: #000;

inaltime: 150px;

culoare: #fff;

Sau adăugați stiluri în mod specific unei etichete, pentru a face acest lucru, trebuie să adăugați un element de stil în interiorul etichetei. Această etichetă trebuie utilizată în interiorul unui container care stabilește stiluri pentru pagină. Puteți folosi mai multe astfel de etichete, aceasta nu va fi o eroare.

Un pic similar cu eticheta anterioară, eticheta de legătură vă permite să setați stiluri pentru un document care se află într-un alt fișier. Cu alte cuvinte, puteți atașa o foaie de stil CSS completă, care constă din multe proprietăți, unui document existent. Astfel, reduceți dimensiunea documentului, care în cele din urmă se va încărca și se va deschide mai repede pe un computer sau dispozitiv mobil cu viteze scăzute de internet.

Puteți conecta mai mult de un fișier, nu există restricții. Nu este nevoie să închideți o astfel de etichetă. Dacă totul este făcut corect, anumite stiluri dintr-un fișier separat vor fi încărcate în documentul dvs. Această etichetă poate fi adăugată la html-ul de bază și nu uita de existența sa. Rezultatul este o imagine ca aceasta:

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

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

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

Folosind eticheta de script, puteți conecta diferite scenarii (scripturi) la un document. Eticheta de închidere este necesară. Scriptul în sine poate fi localizat la începutul documentului, în interiorul sau la sfârșit.

Spune browserului că orice lucru plasat între aceste etichete ar trebui să apară în fereastra browserului dvs. Iată principalele etichete care pot fi prezente în absolut fiecare document. Eticheta body servește ca corp principal al paginii, care include tot conținutul acesteia. Este recomandabil să deschideți această etichetă și să nu uitați să o închideți la sfârșitul documentului.

Titluri de pagină h1 h2 h3

Să mergem mai departe, vedem o etichetă care se deschide și se închide în același mod. Această etichetă denotă titlul principal al textului, în majoritatea cazurilor, sub titlul H1 se află titlul paginii; De fapt, există doar șase titluri de date. . Sunt folosite și în SEO, dar acesta este un subiect ușor diferit. Cu siguranță voi evidenția un articol pentru asta și le voi oferi o descriere detaliată, abonați-vă la actualizările blogului ca să nu pierdeți nimic.

Prezența unor astfel de titluri în articol va juca un rol important în promovarea paginii. În plus, utilizarea lor vă oferă o structură clară a paginii, titlul, subtitlurile, evidențierile, subparagrafele și așa mai departe. Folosește-le întotdeauna și pune-le în practică. Pe multe CMS, cum ar fi WordPress, atunci când scrieți text, puteți vedea „titlu 1”, „titlu 2”, „titlu 3” și așa mai departe. Ei sunt cei responsabili pentru h1, h2 și h3.

Dacă scrieți textul corpului dintr-un paragraf nou, scrieți o etichetă

La început și închideți-l la sfârșit

. Marcarea unui paragraf în html este echivalentă cu crearea unui nou paragraf într-un document MS Word. Nu am adăugat nimic nou în document. Dar acest lucru nu este tot ceea ce ar trebui să fie prezent într-un document html. Să ne uităm la un alt exemplu, descrierea va veni puțin mai târziu.

document HTML

Acest text va fi aldine, iar acesta este tot cu caractere cursive

< ! DOCTYPE html >

< html >

< head >

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

< title >document HTML< / title >

< / head >

< body >

< p >

< b >

< / b >

< / p >

< / body >

< / html >

Elemente de bază Cap și Titlu

Fiecare document conține un titlu și un element de titlu. Prima, care vine imediat după prima etichetă. Această etichetă conține toate informațiile despre pagină, conține și elementul. Titlu – informații despre titlul paginii, cu alte cuvinte titlul paginii, numele acesteia. În titlu indicați numele corect al paginii prin care utilizatorul vă va căuta printr-un motor de căutare, punct foarte important. Ambele elemente trebuie să fie deschise și, de asemenea, închise. Fiecare element este închis cu un „/”. Rezultatul este o imagine ca aceasta.

Titlu și conținutul paginii

< / html >

După cum puteți vedea, nu este nimic complicat. Iată cele mai de bază etichete care ar trebui să fie prezente în fiecare document html. Nu uitați să închideți fiecare dintre ele, altfel browserul nu va putea percepe imaginea completă a codului. Trebuie să știi și să-ți amintești mereu acest lucru. Apoi începeți să inserați text, imagini, videoclipuri și așa mai departe. Dar asta va fi deja în alte articole.

Editor Notepad++

Pentru a lucra cu codul, utilizați programul Notepad++. Este gratuit și nu este greu să-l găsești pe internet. Foarte convenabil pentru înțelegerea oricărui cod, de asemenea, afișează convenabil etichetele de deschidere și de închidere. Suportăm sintaxa a peste 40 de limbaje de programare. Exact ceea ce aveți nevoie pentru a învăța elementele de bază ale html.

Blocnotesul este superior în toate privințele unui blocnotes obișnuit. Pentru confort, simplitate și învățare maximă, acest editor trebuie instalat inițial pe computerul dumneavoastră. Cel mai important avantaj și comoditate este că editorul Notepad++ afișează indicii atunci când scrieți cod, ceea ce vă face munca mult mai rapidă și de mai bună calitate.

element DOCTYPE

Fiecare document trebuie să conțină, de asemenea, următorul element doctype. De ce este nevoie și ce ar trebui să fie în el. De obicei, oamenii nu sunt foarte pasionați de aceste linii, le copiază în documentele lor și lucrează în liniște. Aceste elemente spun browserului ce versiune de html este folosită în document, care este descrierea paginii, ce codificare este folosită, ce cuvinte cheie sunt incluse, cine este autorul și cum se numește pagina.

Ele sunt de obicei plasate chiar la început. Există mai multe opțiuni și toate diferă unele de altele, voi scrie un exemplu care este folosit cel mai des. Acest gol poate fi folosit ca șablon gata făcut. În continuare va fi o descriere clară a fiecărei linii, nu ar trebui să existe probleme cu aceasta.

Pe scurt, într-un limbaj clar despre elementele de bază ale html: Această linie îi spune browserului că acest document este versiunea XHTML 1.0, se folosește limba engleză și toată această mizerie se află la această adresă. Apoi, în metaeticheta indicăm codificarea care este utilizată. Cel mai des folosit este Windows 1251.

Descriere - este atins subiectul SEO, una dintre cele trei tag-uri principale care trebuie sa fie prezente in absolut fiecare document acest tag indica descrierea paginii; Ce este scris pe această pagină, o scurtă descriere, nu mai mult de două propoziții. Eticheta de cuvinte cheie acoperă și subiectul SEO, această etichetă este necesară. Conține cuvinte cheie pe care utilizatorii de internet le vor folosi pentru a vă găsi prin motoarele de căutare.

Eticheta de titlu conține numele documentului în sine, titlul acestuia, pe care îl vedem în browser. Probabil cea mai importantă etichetă din întregul document, care are cel mai mare impact asupra promovării paginii. Articolul despre adăugarea și proiectarea descrie această etichetă mai detaliat.

Ce trebuie să rețineți din această lecție despre elementele de bază ale html:

Aproape toate etichetele se deschid și se închid;

Documentul începe cu eticheta ;

Prezența etichetei;

Structura clară a documentului html.

Toate paginile principale ar trebui să fie întotdeauna numite index. Așa este acceptat și toată lumea este obișnuită, indiferent de extensia de fișier, poate fi html sau php. Întotdeauna se numește așa.

Urmăriți un videoclip despre elementele de bază ale HTML de la Webformyself.

Limbajul de marcare hipertext, elemente de bază și structură. Voi încerca să descriu toate acestea și multe altele pe blogul meu. În primul rând, vor fi scrise informații utile pentru începători, va fi oferit un exemplu de cod și va fi oferită posibilitatea de a descărca exemplul în sine împreună cu pagina finală.

HTML înseamnă H yper Text M arkup Language, adică. Hypertext Markup Language este elementul de bază al paginilor web, folosit pentru a crea și prezenta vizual pagini web.

HTML adaugă markup textului simplu. Hipertextul conține diverse link-uri prin care paginile web sunt conectate între ele. Cu HTML, oricine poate crea atât site-uri web statice, cât și dinamice. HTML este un limbaj care descrie structura și semantica conținutului unui document web. Conținutul unei pagini web este marcat folosind etichete care reprezintă elemente HTML. Exemple de astfel de elemente sunt: , și așa mai departe. Aceste elemente formează elementele de bază ale oricărui site web.

HTML a fost inventat în 1991 de omul de știință Tim Berners-Lee și a fost inițial destinat schimbului de documente între oamenii de știință de la diferite universități. Cu invenția sa, Tim Burns-Lee a pus bazele internetului modern.

Există mai multe versiuni de HTML. Standardul de limbă este actualizat și completat continuu și, ca urmare, o nouă versiune de HTML este lansată aproape în fiecare an. Versiunea „HTML 2.0” a fost prima specificație standard HTML, care a fost publicată în 1995. HTML 4.01 este versiunea majoră a HTML care a fost publicată la sfârșitul anului 1999 și este utilizat pe scară largă astăzi. Astăzi, cea mai populară versiune este HTML-5, care este o extensie a HTML 4.01, publicată în 2012.

Un document HTML sau o pagină web este un document text simplu care conține etichete (care, la rândul lor, sunt text simplu cuprins între paranteze unghiulare). O pagină web poate fi tastată fie într-un editor de text obișnuit (Notepad, WordPad, Word etc.) fie într-unul specializat cu evidențiere de cod (Notepad++, Sublime Text etc.). Documentele HTML sunt stocate ca fișiere cu extensia .htm sau .html.

Exemple online în fiecare lecție

Pe măsură ce prezentăm materialul, fiecare lecție va oferi exemple care vă vor ajuta să înțelegeți fiecare cod în detaliu și, prin practică, să vă bucurați de învățare. Cu editorul nostru HTML online, puteți edita un document HTML și apoi faceți clic pe butonul portocaliu „Run” din editor, care se află deasupra ferestrei editorului din stânga, pentru a vedea rezultatul. Dacă utilizați un editor HTML specializat, atunci puteți copia exemplul și vizualiza rezultatele muncii dvs. în browserul instalat pe computer.

Exemplu HTML: Incearca-l tu insuti

Titlul paginii

Acesta este titlul

Acesta este un paragraf.

Exemple HTML online

Tutorialul HTML vă oferă peste 100 de exemple online care vă vor ajuta să stăpâniți cu ușurință limbajul de marcare. Mai bine să vezi o dată decât să auzi de o sută de ori! Teoria plus practica este cheia succesului tău în stăpânirea HTML-ului.

Salutare tuturor! Astăzi mi-am petrecut dimineața explicându-mi pe degete cum să scriu linkuri de text și imagini folosind pixuri. Cred că cunoștințele de bază despre HTML nu vor răni nimănui, așa că voi sublinia pe scurt esența principală a HTML. Pentru ca, ca să spunem așa, optimizatorii SEO și bloggerii începători să aibă o idee despre acest limbaj și despre modul în care sunt construite paginile.

Ce este HTML?

HTML înseamnă Hypertext Markup Language. Este un limbaj de calculator folosit pentru a crea documente pe Internet. Aceste documente sunt fișiere text care conțin conținutul dvs. (text, imagini, videoclipuri etc.) și etichete HTML utilizate pentru a structura acel conținut. Browserele citesc pagina, iar etichetele HTML și HTML le spun ce să arate și cum să o afișeze. Etichetele HTML nu sunt afișate în browser. Toate etichetele încep în partea stângă cu o pictogramă „” mai mică. Pentru a construi o pagină HTML de bază veți avea nevoie de editorul de text Notepad++ (din părerea mea cel mai bun) sau de orice editor de text simplu pentru a alege dintre TextEdit, TextWrangler, SimpleText, TextPad sau chiar Notepad. Există și programe specializate care ușurează viața webmasterilor, precum Adobe Dreamweaver, dar acest lucru nu este necesar. Nu folosi Microsoft Word! HTML nu face distincție între majuscule și minuscule.

Mai multe despre etichetele HTML

Există două tipuri de etichete: container și goale.

O etichetă de container „învelește” textul sau imaginea și ar trebui să conțină o etichetă de deschidere și de închidere, cum ar fi... Eticheta de închidere are o bară oblică / care spune browserului că eticheta s-a încheiat.
O etichetă goală rămâne singură, cum ar fi
pentru o întrerupere de linie sau pentru o linie orizontală. Etichetele goale nu necesită o etichetă de închidere, deoarece nu „împachetează” nimic.

Cum se creează o pagină HTML

Pentru a începe, să aruncăm o privire la un șablon HTML foarte simplu.

Numele site-ului sau al paginii

Conținutul paginii principale

Vă rugăm să rețineți că atunci când deschidem o etichetă, trebuie să ne asigurăm că o închidem. Documentele HTML sunt împărțite în două părți principale - cap și corp. Eticheta îi spune browserului că acesta este un document HTML. eticheta include informații despre document, cum ar fi:

titlul paginii - o etichetă care apare în browsere în titlul filei
eticheta autorului -
eticheta de cuvinte cheie -
etichetă de descriere - etc.

Aici sunt incluse fișierele de stil (CSS)? dar asta e pentru tovarășii mai avansați. În sfârșit, eticheta, care conține tot conținutul paginii site-ului: text, imagini, grafică etc.

Crearea primei pagini HTML

Deschideți un editor de text și inserați următorul cod într-un document nou:

Prima mea pagină web

Instruire HTML
Buna ziua!
Aceasta este prima mea pagină web.
Învăț elementele de bază ale HTML și etichetelor de titlu
BAZELE HTML

Ar trebui să arate așa:

Salvați fișierul ca example.html pe desktop. Deschideți fișierul într-un browser web pentru a vedea cum convertește etichetele. Acest lucru va părea destul de plictisitor în această etapă, dar este un început.

Il poti infrumuseta putin :).

Formatarea textului

Putem adăuga etichete textului pentru a-i oferi mai multă structură. În prima etapă, vom evidenția titluri, paragrafe, întreruperi de rând și linii orizontale, dar să vorbim despre totul în ordine.

Categorii

Există 6 niveluri de titluri în HTML, ele determină nivelul de importanță. De exemplu, pe un blog, titlul articolului dvs. poate fi o etichetă h1, în timp ce titlurile paragrafelor postării dvs. pot fi etichete h2 sau h3. De exemplu:

Titlul h1
Titlul h2
Titlul h3

Articole

Pentru secțiuni individuale de text puteți utiliza

Etichetă pentru adăugarea de spațiu între paragrafe.

Paragraf

Rupere de linie

Pentru a adăuga o întrerupere de linie, utilizați o etichetă goală
, adică nu trebuie să fie închis /. Aceasta creează o linie goală și trimite următorul cod la următoarea linie.

Linie orizontală

Pentru a crea o linie orizontală pe pagina dvs. folosim .

Cum se adaugă formatarea textului unei pagini?

Deschideți din nou example.html într-un editor de text și adăugați formatarea textului astfel:

În urma acestor mișcări obținem următoarele:

Deja mai plăcut pentru ochi.

Iată elementele de bază absolute ale HTML și probabil cea mai plictisitoare parte! Plănuiesc să dezvolt puțin acest subiect în postările viitoare, pentru că... Orice specialist SEO trebuie să se ocupe în cele din urmă de elementele de bază ale HTML.

Noțiuni de bază HTML conține regulile de bază ale limbajului HTML, o descriere a structurii unei pagini HTML și relațiile din structura unui document HTML între elementele HTML.

Un document HTML este un document text obișnuit care poate fi creat fie într-un editor de text obișnuit (Notepad), fie într-unul specializat cu evidențiere de cod (Notepad++, Visual Studio Code etc.). Un document HTML are extensia .html.

Un document HTML constă dintr-un arbore de elemente HTML și text. Fiecare element este identificat în documentul sursă printr-o etichetă de început (deschidere) și de sfârșit (închidere) (cu rare excepții).

Eticheta de început arată unde începe elementul, eticheta de final arată unde se termină. Eticheta de închidere se formează prin adăugarea unei bare oblice / înainte de numele etichetei: .... Între etichetele de început și cele de închidere se află conținutul etichetei - conținutul.

Etichetele unice nu pot stoca conținut direct; este scrisă ca valoare de atribut, de exemplu, o etichetă va crea un buton cu textul Button în interior.

Etichetele pot fi imbricate una în alta, de exemplu,

Text

. Când investiți, ar trebui să urmați ordinea în care sunt închise (principiul „matryoshka”), de exemplu, următoarea intrare va fi incorectă:

Text

Elementele HTML pot avea atribute (globale, aplicate tuturor elementelor HTML și propriile lor). Atributele sunt scrise în eticheta de deschidere a elementului și conțin un nume și o valoare, specificate în formatul atribut name="value" . Atributele vă permit să modificați proprietățile și comportamentul elementului pentru care sunt setate.

Fiecărui element i se pot atribui mai multe valori de clasă și o singură valoare de id. Mai multe valori de clasă sunt scrise separate printr-un spațiu, . Valorile de clasă și id-ul trebuie să fie compuse numai din litere, cifre, cratime și caractere de subliniere și trebuie să înceapă doar cu litere sau cifre.

Browserul vizualizează (interpretează) documentul HTML, construindu-i structura (DOM) și afișându-l în conformitate cu instrucțiunile incluse în acest fișier (fișe de stil, scripturi). Dacă marcajul este corect, fereastra browserului va afișa o pagină HTML care conține elemente HTML - anteturi, tabele, imagini etc.

Procesul de interpretare (parsare) începe înainte ca pagina web să fie complet încărcată în browser. Browserele procesează documentele HTML secvenţial, de la început, în timp ce procesează CSS şi relaţionează foile de stil cu elementele paginii.

Un document HTML este format din două secțiuni - antetul - între etichete ... și partea de conținut - între etichete ....

Structura paginii web 1. Structura documentului HTML

HTML urmează regulile conținute în fișierul de declarare a tipului de document (Definiția tipului de document sau DTD). Un DTD este un document XML care definește ce etichete, atribute și valorile acestora sunt valabile pentru un anumit tip HTML. Fiecare versiune de HTML are propriul DTD.

DOCTYPE este responsabil pentru afișarea corectă a unei pagini web de către browser. DOCTYPE specifică nu numai versiunea HTML (de exemplu html), ci și fișierul DTD corespunzător de pe Internet.

...

Elementele din interiorul etichetei formează un arbore de document, așa-numitul model de obiect document, DOM (model de obiect de document). În acest caz, elementul este elementul rădăcină.

Orez. 1. Cea mai simplă structură a unei pagini web

Pentru a înțelege interacțiunea elementelor paginii web, este necesar să se ia în considerare așa-numitele „relații de familie” dintre elemente. Relațiile dintre mai multe elemente imbricate sunt clasificate ca părinte, copil și soră.

Un strămoș este un element care conține alte elemente. În figura 1, strămoșul pentru toate elementele este . În același timp, elementul este strămoșul tuturor etichetelor pe care le conține: ,

, , etc.

Un descendent este un element situat într-unul sau mai multe tipuri de elemente. De exemplu, este un descendent al , și elementul

Este un descendent al ambelor și .

Un element părinte este un element care este legat de alte elemente la un nivel inferior și este situat deasupra lor în arbore. În figura 1 și . Etichetă

Este părinte numai pentru .

Un element copil este un element care este direct subordonat unui alt element la un nivel superior. În figura 1 există doar elemente , ,

Și sunt copii ai .

Un element soră este un element care are un element părinte comun cu cel în cauză, așa-numitele elemente de același nivel. În figura 1 și sunt elemente de același nivel, precum și elemente , și

Sunt surori una cu cealaltă.

1.1. Elementul 1.2. Element

Secțiunea... conține informații tehnice despre pagină: titlu, descriere, cuvinte cheie pentru motoarele de căutare, codificare etc. Informațiile pe care le introduceți acolo nu sunt afișate în fereastra browserului, dar conțin date care îi spun browserului cum să proceseze pagina.

1.2.1. Element

Eticheta de secțiune necesară este . Textul plasat în interiorul acestei etichete apare în bara de titlu a browserului web. Titlul nu trebuie să aibă mai mult de 60 de caractere pentru a se încadra complet în titlu. Textul titlului trebuie să conțină cea mai completă descriere a conținutului paginii web.

1.2.2. Element

O etichetă de secțiune opțională este o singură etichetă. Cu ajutorul acestuia, puteți seta o descriere a conținutului paginii și a cuvintelor cheie pentru motoarele de căutare, autorul documentului HTML și alte proprietăți ale metadatelor. Un element poate conține mai multe elemente, deoarece poartă informații diferite în funcție de atributele utilizate.

Descrierea conținutului paginii și a cuvintelor cheie pot fi specificate simultan în mai multe limbi, de exemplu, în rusă și engleză:

Folosind o etichetă, puteți bloca sau permite indexarea unei pagini web de către motoarele de căutare:

Pentru a reîncărca automat pagina după o anumită perioadă de timp, trebuie să utilizați valoarea de reîmprospătare:

Pagina va fi reîncărcată după 30 de secunde. Pentru a redirecționa vizitatorul către o altă pagină, trebuie să specificați adresa URL în parametrul URL:

Tabelul 2. Atributele etichetei Atribut

set de caractere	Specifică codificarea caracterelor pentru documentul HTML curent:
conţinut	Conține text arbitrar care specifică valoarea asociată cu atributul http-equiv sau name, în funcție de valoarea acestora.
http-echiv	Controlează acțiunile browserului pe o anumită pagină web (echivalent cu anteturile HTTP). La randarea paginii, browserul va urma instrucțiunile specificate în atribut: default-style specifică stilul preferat de utilizat pe pagină. Atributul de conținut trebuie să conțină ID-ul elementului care face referire la foaia de stil CSS sau ID-ul elementului care conține foaia de stil. reîmprospătare indică timpul în secunde înainte ca pagina să fie reîncărcată sau timpul înainte de redirecționarea către o altă pagină, dacă atributul conținut conține linia „url=page_address” după timp. Reîncărcați automat pagina după o anumită perioadă de timp, în acest exemplu, după 30 de secunde: Dacă trebuie să redirecționați imediat vizitatorul către o altă pagină, puteți specifica adresa URL în parametrul url:
Nume	Asociat cu valoarea conținută în atributul conținut. Nu ar trebui utilizat dacă elementul are deja setate atributele http-equiv , charset sau itemprop. nume-aplicație specifică numele aplicației web utilizate pe pagină. autor specifică numele autorului documentului în format liber. descriere definește o scurtă descriere a conținutului paginii, de exemplu: generator specifică unul dintre pachetele software utilizate pentru a crea documentul, de exemplu: . cuvintele cheie conține o listă de cuvinte cheie, separate prin virgulă, care se potrivesc cu conținutul paginii, de exemplu: . De asemenea, atributul nume poate lua următoarele valori din specificația extinsă, cum ar fi creator, googlebot, editor, roboți, slurp, viewport, deși niciuna dintre acestea nu a fost încă adoptată oficial.

1.2.3. Element

În interiorul acestui element sunt setate stilurile care sunt utilizate pe pagină. CSS este folosit pentru a seta stiluri într-un document HTML. Pot exista mai multe astfel de elemente pe o pagină.

În interiorul acestui element puteți scrie cod de formatare atât pentru elementele paginii web în sine, cât și pentru întreaga pagină web.

.hârtie ( lățime: 200px; înălțime: 300px; culoare de fundal: #ef4444; culoare: #666666; )

Pentru a conecta un stil specificat la un element, trebuie să atribuiți un nume adecvat elementului folosind atributul class (sau id):

...

Codul CSS poate fi încorporat direct în elementul de marcare ca valoare a atributului de stil, de exemplu:

1.2.4. Element

De asemenea, puteți seta stiluri pentru un document folosind o altă metodă - scrieți-le într-un fișier separat cu extensia .css, de exemplu, style.css.

Există două moduri de a conecta un fișier cu stiluri la o pagină web:
prin directiva @import URL

@import url(style.css);

folosind elementul. Elementul nu necesită o etichetă de închidere. Acest element definește relația dintre pagina curentă și alte documente. Pot exista mai multe astfel de elemente pe o pagină. Intrarea va arăta astfel:

Tabelul 4. Atributele etichetei Descrierea atributului, valoare acceptată

origine încrucișată	Indică dacă CORS (o tehnologie de browser care permite unei pagini web să acceseze resurse dintr-un alt domeniu) ar trebui utilizată atunci când se preia o imagine de pe un site. anonim — browserul adaugă automat un antet Origin la o solicitare între domenii, care conține numele domeniului de la care a fost făcută cererea. Dacă serverul nu răspunde cu antetul CORS Access-Control-Allow-Origin: * (sau numele domeniului în loc de asterisc), atunci încărcarea imaginii va fi blocată. use-credentials - Dacă serverul nu furnizează acreditări utilizând Access-Control-Allow-Credentials: true , atunci încărcarea imaginii va fi blocată.
href	Atributul principal al etichetei, valoarea este calea către fișierul cu stiluri.
hreflang	Determină limba textului din documentul de referință.
mass-media	Specifică tipul de dispozitiv la care ar trebui să fie aplicată resursa de legătură.
nonce	O variabilă șir generată aleatoriu pe server care stabilește reguli pentru utilizarea stilurilor inline pentru a proteja conținutul. Valoarea atributului este un șir de text.
rel	Atributul definește relația dintre documentul curent și documentul la care se face referire. alternativ - un link către același document, dar într-un format diferit (de exemplu, pagini pentru tipărire, traducere, oglindă, feed în format RSS sau Atom), . arhive - indică faptul că documentul legat este de interes istoric. Un link poate indica o colecție de înregistrări, documente sau alte materiale. link autor către o pagină despre autorul documentului sau către o pagină cu informațiile de contact ale autorului. marcați o referință la cel mai apropiat strămoș al articolului, care este linkul, sau la secțiunea articolului cel mai strâns legată de element, dacă nu există niciun strămoș. extern este folosit pentru a indica faptul că pagina către care face legătura nu face parte din acest site. mai întâi specifică o legătură care indică primul document dintr-o secvență de documente. link de ajutor către un document de ajutor. pictograma specifică calea către pictograma care va fi utilizată pentru documentul curent. last specifică o legătură care indică ultimul document dintr-o secvență de documente. licență Un link către informațiile privind drepturile de autor pentru un document. în continuare indică faptul că acest document face parte dintr-o serie și că linkul duce la următorul document din acea serie. nofollow indică faptul că linkul nu este aprobat de autorul paginii sau că linkul este de natură comercială. noreferrer indică faptul că antetul cererii client care conține url-ul sursei cererii nu trebuie transmis atunci când urmărește linkul. pingback specifică adresa serverului de pingback, ceea ce permite blogului să notifice automat site-urile care leagă la acesta. prefetch specifică faptul că fișierul la care se face referire trebuie să fie stocat în cache în prealabil. prev indică faptul că acest document face parte dintr-o serie și că linkul este către un document anterior din acea serie. căutare indică faptul că documentul la care se face referire conține o interfață pentru căutare și resurse aferente. bara laterală indică faptul că documentul legat va fi afișat în context suplimentar de browser, dacă este posibil, iar unele browsere, când faceți clic pe un hyperlink, deschid o fereastră pentru a adăuga linkul la bara de marcaje. foaia de stil este un link către un fișier extern care va fi folosit ca foaie de stil pentru acest document. eticheta indică faptul că eticheta cu hyperlink se aplică acestui document. sus indică faptul că pagina face parte dintr-o structură ierarhică și că hyperlinkul indică un nivel superior de resursă din structură.
dimensiuni	Specifică dimensiunea pictogramelor pentru afișarea vizuală. Atributul sizes este utilizat numai împreună cu rel="icon" și poate lua următoarele valori: lățimi-înălțime - definește o listă de dimensiuni separate prin spații, fiecare dimensiune trebuie să fie în format - lățimi-înălțime (dimensiunile pictogramei sunt specificate în pixeli), de exemplu: ; orice - pictograma poate fi scalată la orice dimensiune.
titlu	Definește titlul unui link sau numele unui set de foi de stil alternative. Valoarea atributului este text.
tip	Specifică tipul MIME al documentului la care se face referire. În acest caz, ia valoarea „text/css” .

1.2.5. Element Tabelul 5. Atributele etichetei Descrierea atributului, valoare acceptată

asincron	Atributul indică faptul că scriptul va rula asincron cu restul paginii (scriptul va începe să se execute în același timp în care se încarcă pagina).
set de caractere	Definește codificarea caracterelor
origine încrucișată	Stabilește dacă CORS va fi utilizat la încărcarea scripturilor externe (folosind atributul src). anonim — înainte de a încărca scriptul într-o solicitare între domenii, browserul adaugă automat antetul Origin, fără a trece parametri de acces (cookie, certificat X.509, autentificare/parolă pentru autentificare de bază prin HTTP). Dacă răspunsul serverului nu conține antetul Access-Control-Allow-Origin: nume de domeniu, scriptul nu va fi încărcat. use-credentials — înainte de a încărca scriptul într-o solicitare între domenii, browserul adaugă automat un antet Origin care indică parametrii de acces (cookie, certificat SSL sau perechi de autentificare/parolă). Dacă răspunsul serverului nu conține antetul Access-Control-Allow-Credentials: true, scriptul nu va fi încărcat.
amâna	Interpretarea scripturilor este amânată până când documentul este redat pe dispozitivul utilizatorului.
nonce	Oferă securitate prin protejarea împotriva atacurilor cross-site scripting (XSS). Setează reguli pentru utilizarea scripturilor încorporate folosind valori nonce și hash-uri. În timpul redării paginii, browserul calculează hashuri pentru fiecare script inline și le compară cu cele enumerate în CSP. Descărcările din resurse care nu sunt incluse în „lista albă” sunt blocate.
src	Indică locația fișierului cu scriptul; valoarea atributului este adresa URL a fișierului care conține programul JavaScript.
tip	Folosit pentru a declara limbajul de script folosit pentru a compune conținutul etichetei.

1.3. Element

Această secțiune conține tot conținutul documentului. Disponibil pentru element.

Tabelul 5. Atributele etichetei Descrierea atributului, valoare acceptată

pe amprentă	Un eveniment care se declanșează după ce o pagină este trimisă pentru imprimare sau după ce fereastra de imprimare este închisă.
onbeforeprint	Un eveniment care se declanșează înainte ca o pagină să fie trimisă pentru imprimare.
onbeforeunload	Evenimentul este declanșat atunci când vizitatorul inițiază o tranziție către o altă pagină sau dă clic pe „închide fereastra”. Vă permite să afișați un mesaj în dialogul de confirmare pentru a anunța utilizatorul dacă dorește să rămână sau să părăsească pagina curentă.
onhashchange	Evenimentul este declanșat atunci când partea hash a adresei URL se modifică, de exemplu, când utilizatorul trece de la example.domain/test.aspx#page1 la example.domain/test.aspx#page2 .
onmessage	Un eveniment are loc atunci când un mesaj este primit printr-o sursă de eveniment.
onoffline	Evenimentul este declanșat de browser atunci când browser-ul stabilește că conexiunea la Internet a fost pierdută.
pe net	Evenimentul este declanșat de browser atunci când conexiunea la Internet a fost restabilită.
onpagehide	Evenimentul are loc atunci când utilizatorul părăsește pagina prin navigare, cum ar fi făcând clic pe un link, reîmprospătând pagina, completarea unui formular etc.
onpageshow	Evenimentul are loc atunci când utilizatorul navighează la pagina web, după evenimentul onload.
la descărcare	Evenimentul este declanșat dacă pagina nu se încarcă dintr-un motiv oarecare sau când fereastra browserului este închisă.