Toate etichetele care se află între și sunt ceva ca informații tehnice oficiale. Luați o etichetă ca exemplu - acesta este un titlu. Pentru ce este, întrebi?
Deschideți browserul și aruncați o privire la toate linii de comandă(și anume pe titlul ferestrei)... L-ai văzut?
Elementul HEAD (indicat de etichetele și) este plasat imediat înaintea corpului document HTML, care este definit de etichetele și ().
Între etichete și pot exista următoarele componente:
HEAD - definește începutul și sfârșitul elementului, în interiorul căruia întregul informații de proprietate, conceput pentru browser.
TITLUL - indică numele documentului (pagina de Internet), care este afișat în fereastra browserului. Poate fi specificat, dar nu de mai multe ori.
BAZA — defineste adresa de bază, din care se numără ulterior legături relativeîn interiorul documentului dvs. Nu are etichetă de închidere. În același timp, un punct obligatoriu aici este prezența a cel puțin unuia dintre parametrii (atributele):- HREF— determină adresa de bază (URL) a paginii de Internet;
- ŢINTĂ— definește cadrul (numele său) care va fi utilizat în hyperlinkuri în mod implicit.
Exemplu.
Crearea site-ului web
...
Listă
...
STYLE - folosit pentru a insera o foaie de stil în cascadă într-un document CSS (Foaie de stil în cascadă).
Are următoarele atribute:
- TIP— definește tipul MIME al foii de stil care trebuie integrată. este atribut obligatoriuși, de regulă, contează „text/css” .
- TITLU— definește numele foii de stil în cascadă. Devine necesar dacă intenționați să utilizați mai multe reguli într-un singur document STIL. În acest caz, browserul va fi forțat să întrebe care dintre stilurile propuse va fi aplicabil documentului. Toate browsere moderne ignorați acest atribut - nu îl puteți utiliza.
Exemplu.
Folosind o foaie de stil CSS
LINK - determină relația documentului tău cu alte obiecte. Nu are etichetă de închidere.
Atribute
- HREF— definește adresa URL a documentului (pagina de internet).
- REL— determină modul în care documentul este legat de obiectul definit de parametrul HREF. Poate avea următoarele semnificații:
- TIP— determină tipul MIME pentru obiectul specificat în parametrul HREF.
Exemple.
element DIV
Amiază
META - folosit pentru a introduce metadate. Această etichetă vă permite să introduceți diverse informații tehnice utile în elementul HEAD, care, în cele din urmă, nu vor fi vizibile pentru utilizator, dar browserul le va recunoaște. Aceste informații sunt pur și simplu necesare pentru indexarea corectă a paginilor site-ului. roboți de căutare(vom vorbi despre ele când va fi vorba momentul potrivitîn predare). Nu are etichetă de închidere.
Are următoarele atribute:
NUME— specifică numele metadatelor. Există un număr mare de nume predefinite.
HTTP-EQUIV— specifică numele metadatelor. Este aproape identic cu parametrul NAME, dar cu o singură diferență: este utilizat numai atunci când este nevoie de transfer Informații suplimentare V antet http.
CONŢINUT— atribuie o valoare metadatelor definite în parametrul NAME (sau HTTP-EQUIV).
Și acum - un exemplu.
...
Etichetele meta în html sunt un grup etichete speciale, care se află între etichete și . Din nume este imediat clar că acestea sunt situate la începutul codului.
Etichetele de titlu au două scopuri importante:
- Raportați informații despre pagina html către browser;
- Furnizați informații motoarelor de căutare despre o anumită pagină html;
Particularitatea etichetelor de antet este că nu sunt vizibile vizual pentru utilizator (excepția este eticheta, care poate fi vizibilă într-o filă a paginii de browser). Toate etichetele de antet sunt opționale, dar asta nu înseamnă că nu sunt necesare.
Aceste etichete pot fi împărțite în 4 grupuri.
- Etichetă
- Etichete
- Etichete
- Etichetă
Să ne uităm la fiecare grup separat.
1. Etichetați- titlul paginii. Aceasta este singura etichetă de antet care este vizibilă pentru utilizatori. Este de mare importanță pentru motoarele de căutareîn ceea ce privește SEO. Acest titlu de pagină este afișat în rezultatele căutării atunci când sunt specificate titlurile paginii.
...Titlul paginii...Nu este ușor să compuneți corect pentru un începător, deoarece trebuie să țineți cont de mai multe nuanțe. Eticheta de titlu ideală ar trebui să fie atractivă pentru utilizatori și să conțină fraze cheie pentru motoarele de căutare. Nu trebuie să faceți această etichetă foarte lungă, deoarece aceasta poate fi percepută ca spam de către motoarele de căutare. Această etichetă trebuie să fie unică pentru fiecare pagină!
2. Etichete- acestea sunt un grup de etichete de serviciu care conțin informații despre pagină. Să luăm în considerare fiecare dintre ele separat.
2.1. Meta Content-TipSintaxa pentru acest atribut este următoarea:
... ...Această etichetă specifică codificarea paginii. Valoarea specifică este scrisă prin atributul charset. ÎN în acest caz, Codificarea este Windows-1251. Cel mai adesea, site-urile web folosesc codificarea UTF-8.
Dacă codificarea site-ului și o anumită pagină html (sau din baza de date) nu se potrivesc, site-ul poate fi afișat prin hieroglife în unele browsere.
2.2. Meta descriere.....Atributul conținut conține o descriere a paginii. Cel mai adesea, această descriere este folosită ca fragment pentru un motor de căutare. Descrierea nu este o etichetă obligatorie. De exemplu, motorul de căutare Yandex determină fragmentul la discreția sa, dar Google folosește această descriere și o afișează așa cum este scrisă.
2.3. Meta cuvinte cheie......Această etichetă provoacă multe dezbateri cu privire la necesitatea ei. Motoarele de căutare nu pretindeți că aceste cuvinte cheie au vreun rol în clasarea site-ului.
Atributul de conținut listează cuvintele cheie. Este puțin probabil ca acest lucru să afecteze radical promovarea site-ului, dar în cazul unor probleme controversate poate influența în favoarea dumneavoastră. Cuvintele cheie trebuie scrise separate prin virgule. Nu scrieți cuvinte cheie care nu sunt pe pagină. Puteți citi mai multe despre Cuvinte cheie.
2.4. Meta reîmprospătare......Există multe alte meta-etichete, dar nu au nicio importanță nici pentru browsere, nici pentru motoarele de căutare, așa că nu are rost să le folosești.
2.5. Meta viewport ...... 3.3. Link rel=Alternate ... ... 4. Etichetă ‹script›- conectarea fișierelor java cu scripturi.
... ...Atributul src specifică locația fișierelor Java incluse. Este folosit pentru a reduce codul de pe pagină, precum și în cazul în care unele funcții Java trebuie folosite la deschiderea paginii. De asemenea, accelerează încărcarea paginii, deoarece... Browserele memorează de obicei scripturile în cache.
Stimate cititor, am revizuit anteturile etichete html document. Acum înțelegeți mai bine optimizarea site-ului și scrieți cod competent.
Bună ziua, dragi cititori ai blogului! Continuăm secțiunea „Crearea unui site web de la zero” și în special subiectul etichetelor... Și astăzi ne vom uita la etichetele care sunt prezente pe orice pagină de internet - și. Mai există o etichetă care trebuie să fie în fiecare document HTML și despre care am scris deja într-unul din articolele anterioare - așa că nu o vom atinge.
În articolele anterioare ale acestei secțiuni, am scris despre creație dosar gol V format html. De fapt, a fost folosit în articolul despre (acolo au fost aplicate etichetele de titlu). Acum vom edita direct acest fișier cu descrieri complete.
Și vom începe articolul prin editarea fișierului creat. Personal, l-am numit index.html, dar numele poate fi orice. Deschide-l folosind oricare editor de text(este mai bine să utilizați Notepad++, deoarece are evidențierea codului și alte caracteristici utile). Și îi vom adăuga imediat etichete și exact în ordinea în care sunt scrise. Nu uitați să le închideți, așa cum se arată în captură de ecran. Documentul va arăta astfel:
Acum să ne uităm la semnificația fiecărei etichete separat. Nu degeaba se află în fiecare document HTML.
Funcțiile etichetei Deci, eticheta este un container (). Conține tot conținutul vizibil și invizibil al unei pagini web (inclusiv etichete și ). Eticheta de deschidere vine imediat după declarația Doctype, iar eticheta de închidere vine la sfârșitul documentului. Astfel, îi explică browserului unde să înceapă procesarea documentului și unde să-l termine.Teoretic, el însuși poate înțelege ce și cum. Serios? Acesta este un traducător limbaj HTMLși este puțin probabil să înceapă procesarea de la mijlocul documentului și să-l termine înainte de a ajunge la final. Întrebarea, desigur, este controversată, dar mereu am crezut (și acum nu renunț la părerea mea) că scrisul a acestei etichete Neapărat.
Chiar și ținând cont de faptul că funcția acestei etichete este doar de a indica limitele conținutului, are propriile atribute (care acum fie nu sunt folosite deloc, fie sunt folosite extrem de rar). ÎN surse diferite sunt indicate atribute care sunt diferite unele de altele, așa că nu îndrăznesc să propun versiunea corectă.
Singurul lucru pe care îl pot spune cu siguranță este că majoritatea atributelor nu sunt acceptate de HTML 4.01 sau sunt nedorite. Deși voi da totuși un exemplu.
— un sfat explicativ oriunde în document. De exemplu, când treceți mouse-ul peste o imagine, este posibil să vedeți pop-up text. De asemenea, în cazul acestei etichete:
Iată ce veți vedea când treceți cu mouse-ul peste un document cu acest conținut: Este de preferat sa se foloseasca atributul titlului
nu în etichetă, ci în orice alte zone specifice ale paginii. În primul rând, este convenabil și, în al doilea rând, motoarele de căutare vă vor trata mai bine site-ul. Această etichetă nu afectează direct optimizarea resurselor. Să mergem mai departe. Funcția de etichetă Și următorul în rând este eticheta. Conține totul informatii tehnicedespre o pagină care ajută browserul și motoarele de căutare. Eticheta este container și vine imediat după, doar spre deosebire de aceasta din urmă, eticheta de închidere nu vine la sfârșitul documentului, ci înainte de eticheta de deschidere. În ce informații pot fi văzute? Dar nici unul. Tot ceea ce se află în această etichetă este accesibil ochiului uman doar prin vizionare cod sursă
pagini. Tot conținutul din această etichetă este destinat motoarelor de căutare și browserelor. Singurul lucru pe care îl puteți vedea cumva este eticheta, care este responsabilă pentru titlul ferestrei paginii web. Iată un exemplu: Textul de după pictogramă este conținutul etichetei. Acum să ne uităm la conținutul pe care nu îl vedem, dar care este foarte parte importantă
crearea si promovarea site-ului. În primul rând, aceasta este linia Aceasta este o metaetichetă responsabilă pentru tipul de conținut al paginii (Content-Type). În acest caz, este cod html în codificare UTF-8 (content="text/html; charset=UTF-8"). Urmează eticheta de titlu descrise mai sus. Apoi sunt linii care încep cu eticheta. Indică o legătură cu document extern
. De exemplu, linia
indică faptul că este conectat un fișier (rel="stylesheet") cu (type="text/css"), care se află la o astfel de adresă (pentru a reduce lungimea liniei, am înlocuit jumătate din adresă cu puncte) . După ce browserul procesează acest șir, va determina de unde să obțină foile de stil în cascadă. În general, în eticheta de cap există o mulțime de informații despre care se poate vorbi la nesfârșit. Ultimul lucru care merită remarcat (în special în cazul ) este prezența etichetelor de descriere, cuvinte cheie și canonice. Folosesc pluginul All in Un singur SEO
Pack, motiv pentru care sunt prezente în .
- – rădăcina oricărui document HTML în care se află toate celelalte secțiuni (această etichetă trebuie să fie într-o singură copie și trebuie să fie prezentă pe fiecare pagină).
- – un antet care conține informații despre serviciu și instrucțiuni pentru browser pentru afișarea conținutului.
- – secțiunea principală în care se află conținutul, adică toate informatii utile(text, imagini, video). Pe lângă conținut, această secțiune conține grila site-ului sau aspectul acesteia - sunt descrise locațiile principalelor secțiuni ale site-ului, cum ar fi antetul, subsolul, meniul principal, coloanele laterale etc.
Eticheta nu este diferită, cu excepția faptului că este elementul rădăcină - un container pentru toate celelalte blocuri. Prin urmare, să trecem la o analiză mai detaliată a secțiunii.
Elementele acestei secțiuni nu sunt afișate direct pe pagina web. Singura etichetă din această secțiune care va afișa informații este eticheta. În eticheta, secțiunea, este scris titlul paginii web, acest text va fi afișat în bara de titlu a ferestrei browserului.
Titlul va fi afișat în bara de titlu a browserului
Această etichetă este o singură eticheta obligatorie in sectiune.
Pe lângă etichetă, în această secțiune pot fi plasate următoarele etichete: , , , .
EtichetăAceastă etichetă îi spune browserului unde se află anumite lucruri. resurse externe, cum ar fi stilurile externe (CSS). De asemenea, folosind o etichetă și specificând cea corespunzătoare atributul rel, puteți specifica adresa fluxului RSS, favicon pentru site și alte resurse externe.
Etichetă
Aceasta este o etichetă generică care descrie datele. Eticheta oferă metadate despre document browser HTML. Metadatele nu sunt afișate, ci sunt folosite doar în scopuri oficiale, fie de către motorul browserului, fie de către spider-ul de căutare. Elementele meta sunt de obicei folosite pentru a descrie o pagină ( descriere), specificarea cuvintelor cheie ( cuvinte cheie), indicarea autorului documentului ( autor), indicații ale tipului de conținut și codificarea acestuia și alte metadate.
Etichetă
Folosind această etichetă, puteți spune browserului unde ar trebui să caute scripturi externe:
sau inserați scriptul direct în această secțiune:
document.write("Bună lume!")
EtichetăAceastă etichetă poate fi folosită pentru a seta stilurile necesare numai pentru această pagină și, de asemenea, dacă nu este nevoie să vă conectați fișier extern stiluri folosind . Puteți specifica mai multe etichete
h1 (culoare: roșu) p (culoare: albastru)
Acestea sunt toate informațiile pe care trebuie să le știi despre secțiune. În continuare, vom lua în considerare secțiunea, care va conține conținutul principal al paginii web.
