Evaluare utilizator: 0 / 5

Steluță inactivăSteluță inactivăSteluță inactivăSteluță inactivăSteluță inactivă
 

În cadrul acestei lecții veți învăța despre:

  • Ce este (X)HTML
  • Structura unui document (X)HTML

1. Ce este (X)HTML?

Mai înainte de toate trebuie să știți că HTML nu este un limbaj de programare . HTML este un limbaj de marcare. Poartă această denumire deoarece utilizează o colecție de marcaje (tag-uri) pentru a realiza o pagina web. W3C este prima organizație care a definit standardele Web. W3C a definit limbajul HTML ca o aplicație a metalimbajului de marcare SGML – Standard Generalized Markup Languages. SGML este o tehnologie utilizată pentru a defini limbaje de marcare, precizând structura documentului permis, sub forma unei definiri a tipului de document – DTD. Pe scurt, acest DTD indică sintaxa care poate fi utilizată pentru diferitele elemente ale unui limbaj de marcare, cum ar fi HTML. HTML are două caracteristici esențiale, și anume: hipertextul și universalitatea.

{jcomments on}

Hipertextul înseamnă că puteți crea un link (legătură) într-o pagină web, care direcționează vizitatorii către alte pagini web sau către orice alt site de pe internet. Aceasta înseamnă că informația poate fi accesată din multe alte locuri. Universalitatea înseamnă că, orice calculator poate citi o pagină web, deoarece documentele HTML sunt salvate ca fișiere text. Nu contează că vizitatorii utilizează calculatoare cu sisteme de operare diferite, cum ar fi: Macintosh, Windows, Linux sau Unix. Web-ul este deschis tuturor. Poate, de asemenea, veți auzi cuvântul Hipermedia. Un sistem Hipermedia funcționează la fel ca hipertextul, cu excepția faptului că include imagini, sunete, video, animație.

În 1990 W3C – World Wide Web Consortium (www.W3.org) - a rescris HTML, ca o aplicație XML , și a denumit-o XHTML – Extensible Hypertext Markup Language. După cum am menționat mai sus, XHTML a fost definit, de către W3C, ca o aplicație XML. Aceasta înseamnă că, XML și SGML, pot fi folosite pentru a scrie limbaje de marcare, nu doar HTML și XHTML. Mai jos, sunt câteva exemple de limbaje de marcare definite cu SGML și XML.

SGML

XML

HTML

XHTML

TEI

WML

DocBook

RSS

 

SOAP

 

Probabil, vă puneți întrebarea de ce era necesar HTML, dacă exista SGML?. Era necesar deoarece SGML este greoi, nu este foarte bine adaptat pentru a scrie pagini web, este foarte larg și cuprinzător. De asemenea, utilizarea lui necesită instrumente foarte scumpe și complexe.

2. Structura unui document (X)HTML

Pentru a înțelege mai bine modul în care este structurat un document HTML, voi face un exemplu simplu în HTML.

Exemplu:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

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

<title>Pagina mea web</title>

</head>

<body>

<h1>Aceasta este pagina mea Web</h1>

<hr/>

<p>Aceasta este partea de paragraf. Intr-un paragraf se pot utiliza <em>caractere italice</em></p>

<blockquote>

<p>Site dedicat celor care iubesc Web-ul</p>

</blockquote>

<h2>Acesta este un subheading</h2>

<p>Va salut pe toti!</p>

<hr/>

</body>

</html>

 

În browser acest exemplu va arăta în felul următor:

Aceasta este pagina mea Web


Aceasta este partea de paragraf. Intr-un paragraf se pot utiliza caractere italice

Site dedicat celor care iubesc Web-ul

Acesta este un subheading

Va salut pe toți!


 

Din acest exemplu, se poate observa că un document creat în HTML are o structură arborescentă. De asemenea, observăm că sunt câteva cuvinte înconjurate de paranteze unghiulare. Poate vă întrebați ce o fi cu aceste paranteze unghiulare, care au în interiorul lor cuvinte, litere, cifre, cum ar fi: <html>,<head>,<body>,<p>, etc. Aceste paranteze unghiulare, cuvintele, literele cu cifre, din interiorul lor sunt tag-uri , adică acele marcaje pe care limbajul HTML le utilizează pentru a crea pagini web. De  asemenea, observați că între parantezele unghiulare se află anumite propoziții și fraze. Spre exemplu: <h1>Aceasta este pagina mea Web</h1>. Tagul <h1> </h1> marchează un nivel de titlu sau heading, care în browser arată în felul următor:

Aceasta este pagina mea Web

Mai departe, observăm că avem un tag de deschidere <h1> și un tag deînchidere </h1>. Tagul de închidere este ușor diferit de tagul de deschidere deoarece are o bara oblică, orientată spre dreapta, în engleză purtând denumirea de slash. Perechea de tag-uri și ceea ce se află între ele sau ceea ce este conținut de aceste perechi de tag-uri poartă denumirea de element. Și acum, schematic puteți vedea ce este un element:

Element:

<h1>Aceasta este pagina mea Web</h1>

 

<h1> = tag de deschidere

</h1> = tag de închidere

 

 În sfârșit, acum că știți ce este un tag sau un element, pot să schițez o structură a unei pagini HTML :

  • !DOCTYPE – este o declarație care specifică versiunea limbajului de marcare, HTML sau XHTML, în care pagina este scrisă.
  • HTML - întregul conţinut este realizat în HTML

SAU     <html xmlns="http://www.w3.org/1999/xhtml"> - conţinutul realizat în XHTML

  • HEAD – conține informații despre o pagină web.
  • BODY – determină cum va arată pagina web în browser

 

Sumar

HTML este un limbaj de marcare, care utilizează o colecție de tag-uri pentru a formata o pagină HTML. HTML are două trăsături esențiale, și anume: hipertextul și universalitatea . Hipertextul înseamnă că puteți crea un link (legătură) într-o pagină web, care direcționează vizitatorii către alte pagini web sau către orice alt site de pe internet. Universalitatea înseamnă că, orice calculator poate citi o pagină web. Un sistem Hipermediafuncționează la fel ca hipertextul, cu excepția faptului că include imagini, sunete, video, animație. În 1990 W3C – World Wide Web Consortium (www.W3.org) - a rescris HTML, ca o aplicație XML , și a denumit-o XHTML – Extensible Hypertext Markup Language.

          Tag-ul apare sub forma unor paranteze unghiulare, având în interiorul lor niște cuvinte. Tag-urile sunt deschise și închise. Cele închise sunt ușor diferite, deoarece conțin o bară oblică orientată spre dreapta sau slash, în limba engleză. Tagu-rile împreună cu ce este conținut între ele formează un element. Structura unui document (X)HTML:

  1. !DOCTYPE
  2. HTML SAU <html xmlns="http://www.w3.org/1999/xhtml">
  3. HEAD
  4. BODY

 

Cuvinte cheie:

HTML – Hypertext Markup Language

XHTML – Extensible Hypertext Markup Language

SGML - Standard Generalized Markup Languages

W3C – World Wide Web Consortium

Element

Tag de deschidere

Tag de închidere

!DOCTYPE

HEAD

BODY

HIPERTEXT

HIPERMEDIA

Descarcă lecţia scrisă:

Files:
struct_html
Date 2013-12-23 Filesize 1.45 MB Download 199