Publicitate

HTML5 este cel mai recent și cel mai mare Ce este HTML5 și cum se schimbă modul în care navighez? [FaceUseOf Explică]În ultimii ani, este posibil să fi auzit din când în când termenul HTML5. Indiferent dacă știți ceva despre dezvoltarea web sau nu, conceptul poate fi oarecum nebulos și confuz. Evident,... Citeste mai mult versiunea limbajului de marcare cel mai utilizat pe web. Există câteva schimbări importante față de ultima versiune a limbii și, dacă nu le utilizați, nu vă mai pierdeți funcționalitatea cu adevărat interesantă.

Nu avem spațiu care să acopere fiecare element nou din a cincea versiune de HTML, dar aceste nouă sunt unele dintre cele mai importante. Pentru mai multe informații despre noile elemente și API-uri din HTML5, asigurați-vă că vezi W3Schools.

O introducere în elementele semantice

Ca o mare parte a internetului, HTML5 s-a orientat spre concentrarea pe semantică. Acum, în loc să folosească etichetele pur și simplu pentru formatare, sunt folosite și pentru a spune browserelor

și motoarele de căutare Top 7 motoare de căutare semantice ca alternativă la Google Citeste mai mult sensul a ceea ce înconjoară.

De exemplu,

pur și simplu spune unui browser că conține un paragraf.

, despre care vom discuta momentan, spune unui browser că acesta conține conținutul principal al paginii.

Web-ul semantic încă se dezvoltă și am început doar să zgâriem suprafața a ceea ce poate face. HTML5 ajută la aducerea marcaj semantic Ce este Marcarea Semantică și cum se va schimba Internetul pentru totdeauna [Tehnologia explicată] Citeste mai mult pentru o parte mult mai mare a internetului și asta nu poate fi bun decât pentru viitorul procesării semantice.

1.

eticheta definește „conținut independent, de sine stătător.” Cel mai simplu exemplu este, desigur, un articol. Pentru acest articol anume, deschidem eticheta înainte de introducere și o închidem după încheiere.

 Tot textul din secțiunea dvs. de sine stătătoare. 

Dar există și alte moduri în care îl puteți folosi. De exemplu, multe bloguri de gătit includ povești personale despre cum a apărut o rețetă sau de ce este important pentru scriitor. Este apoi urmată de rețeta în sine. Ați putea argumenta că fiecare dintre aceste elemente ar putea sta singur.

Într-un forum, fiecare postare sau thread ar putea fi considerate de sine stătătoare și fiecare ar putea fi marcată cu propria sa

etichetă. În cea mai mare parte, va fi folosit pe conținutul principal al unei pagini. Dar ține cont de faptul că îl poți folosi și mai creativ.

2.

În strânsă legătură cu

este

. Aceasta definește o „grupare tematică a conținutului, de obicei cu o rubrică.” Asa de

va fi înăuntru

… dreapta?

Nu neaparat. W3 subliniază că depinde de structura site-ului dvs. Este posibil să aveți conținut autonom în diferite secțiuni ale paginii dvs. (gândiți-vă la prima pagină a unui site de știri, de exemplu). Apoi, puteți avea secțiuni în acel articol.

De ce ai nevoie de un DAC
Totul sună mai bine.
Cum să configurați un DAC
Iată ce trebuie să faci.. .

Puteți avea chiar și secțiuni în secțiuni dacă se potrivește cu pagina dvs. Nu uitați că o secțiune este pur și simplu o „grupare tematică a conținutului” și veți găsi o mulțime de locuri pentru a o folosi.

3.

Acest element „trebuie utilizat ca container pentru conținut introductiv.” Pe scurt, partea din pagina dvs. îi ajută pe oameni să înțeleagă ce vor să citească.

Dar nu vă lăsați păcălit - puteți utiliza acest recipient de mai multe ori. De exemplu, îl puteți utiliza pentru a identifica titlul paginii și paragraful introductiv al postării dvs. de blog. Puteți folosi, de asemenea, pentru a marca conținutul introductiv pentru fiecare secțiune.

Tot ce trebuie să știți despre DAC-uri
Iată o introducere utilă la DAC-uri ...
 Restul articolului dvs. merge aici.

Secțiunile antet conțin de obicei cel puțin o etichetă de antet - H1, H2 și așa mai departe. Nu trebuie, dar, în general, dacă utilizați o etichetă de antet, există un pariu bun pentru a include conținut de antet.

4.

W3 spune că, de obicei, etichetele de subsol conțin „autorul documentului, informații privind drepturile de autor, link-uri către termenii de utilizare, informații de contact etc.” Vă puteți gândi la el ca la „menaj”.

Documentația prevede, de asemenea, că puteți avea mai multe secțiuni de subsol pe pagina dvs. Este probabil, însă, o idee bună să păstrezi toate aceste informații într-o singură locație.

5.

Această etichetă conține legăturile de navigare pentru o pagină dată. Rețineți că numai secțiunea de navigare primește această etichetă, nu toate linkurile de pe pagina dvs. Este pentru bare de navigare și instrumente similare.

Aceasta este o etichetă foarte simplă - asta este tot ce trebuie. Folosiți-l pentru a defini secțiunea de navigare și nu o mai folosiți pe pagina dvs.

6.

Unul dintre cele mai interesante elemente noi în HTML5 este deoparte. W3 îi oferă definiția oarecum nefolositoare a „anumitor conținut în afară de conținutul în care este plasat.”

Pe scurt, deoparte este orice este legat de (dar separat de) informațiile din jur. Ar putea fi o bară laterală care să adauge detalii conținutului tău. Când este utilizat într-un set de

etichete, oferă informații suplimentare care nu sunt necesare pentru înțelegerea conținutului principal.

De exemplu, dacă am fi inclus o bară laterală în acest articol care oferă informații despre istoricul HTML5, aceasta ar fi deoparte.

Cu exceptia

 Articolul principal merge aici.  Articolul continuă aici.

Deoarece există mai multe utilizări pentru această etichetă, poate fi confuz. Dacă rețineți că este „conținut secundar” și că nu trebuie să fie întotdeauna o bară laterală, veți avea o idee mai bună despre cum să o utilizați.

7.

Multe site-uri web au informații care trebuie afișate, dar nu în mod evident. Poate este vorba despre informațiile privind drepturile de autor pentru o fotografie. Sau amprenta la un concurs. Acest tip de informații este exact pentru ce este eticheta de detalii.

Când utilizați eticheta de detalii, creați un text ascuns care poate fi afișat cu ușurință. Iată un exemplu:

Faceți clic aici pentru a vedea informații.

Iată informații mai detaliate de care nu aveți nevoie imediat.

Doar faceți clic pe săgeată pentru a obține detaliile. Simplu. Crearea acestuia este la fel de ușoară. Iată codul folosit pentru exemplul de mai sus:

 Faceți clic aici pentru a vedea informații. 
 Iată informații mai detaliate care nu aveți nevoie imediat. 

tag definește propoziția care va fi afișată, în timp ce celelalte conținut sunt ascunse. Rețineți că puteți utiliza alte etichete în secțiunea de detalii: titluri, secțiuni și așa mai departe.

Există și alte lucruri misto pe care le poti face cu HTML 8 Efecte HTML cool pe care oricine le poate adăuga pe site-ul webNu trebuie să știți CSS sau PHP pentru a construi un site fantezist. Utilizați aceste trucuri HTML cool pentru a genera efecte nemaipomenite. Citeste mai mult de asemenea, chiar dacă nu știți prea multe CSS sau JSON.

8-9.

și

Nu vă faceți griji, eticheta pe care o folosești de ani buni nu va dispărea.

ocolește eticheta de imagine și anunță browserul că este o imagine, o diagramă, o listă de coduri sau o figură de sine stătătoare.

Dacă o figură este eliminată din pagină, aceasta nu va afecta fluxul de conținut.

Acest lucru vă oferă un mod integrat de a adăuga o legendă la imaginile dvs. Nu mai este nevoie să vă parcurgeți CMS-ul.

Profitați de puterea HTML5

Noile elemente din HTML5 adaugă multă putere, în special în scopuri semantice. Există elemente suplimentare pentru formatare, măsurări scalare, progresul sarcinilor și multe altele. Poti sa vezi toate elementele noi la W3Schools.

Dar dacă puteți stăpâni aceste nouă, veți fi bine în calea dvs. de a folosi bine HTML5. Și dacă sunteți nou la HTML, nu uitați să consultați aceste exemple de cod 17 exemple simple de cod HTML pe care le puteți învăța în 10 minuteVrei să creezi o pagină web de bază? Aflați aceste exemple HTML și încercați-le într-un editor de text pentru a vedea cum arată în browser. Citeste mai mult !

Ați început să utilizați HTML5? Ce elemente noi vi se par cele mai utile? Împărtășește-ți gândurile în comentariile de mai jos!