ia referat html

8/3/2019 IA Referat HTML

http://slidepdf.com/reader/full/ia-referat-html 1/17

Universitatea Valahia din Târgovite

Facultatea de Inginerie Electric

Specializarea: EE + ET

Anul I

PROIECTla

Informatica Aplicata

Student:Matache Eduard-Ionut

Coordonator: Asist. ing. Ana-Maria SUDUC

- 2012 ±



Matache Eduard-Ionut HTML5

2

Tema:

HTML5




3

Cuprins

1. Introducere ..........................................................................Error! Bookmark not defined.

2. [Cuprinsul] ..........................................................................Error! Bookmark not defined.

3. [Indicaii privind formatarea] ...............................................Error! Bookmark not defined.

4. [Coninutul proiectului]........................................................Error! Bookmark not defined.

5. [Bibliografie] .......................................................................Error! Bookmark not defined.




4

Introducere

Internetul este intr-o continua evolutie. Pe zi ce trece apar

site-uri din ce in ce mai inovatoare,care forteaza limitele HTML-

ului.Acest lucru se poate explica usor prin faptul ca dezvoltarea

limbajului s-a oprit in 1999,la HTML 4.WC3 (World Wide Web

Consortium) a continuat dezvoltarea XML, precum si altor limbaje

´markup´ cum ar fi:Scalable Vector Graphics (SVG), XForms and

MathML.Programatorii au invatat CSS si limbajul JavaScript pentru a-si crea propriile aplicatii pe framework-uri déjà existente care foloseau

Asynchronous JavaScript + XML (AJAX).Astfel , HTML nu s-a dezvoltat in

ultimii 8 ani.

Acest lucru vrea sa se schimbe in 2004, cand trei dintre cei mai

mari producatori de browsere: Apple, Opera si Mozilla au inceput sa

lucreze impreuna, formand (Web Hypertet Application Technology

Working Group sau WHATWG), pentru dezvoltarea clasicului

HTML.Astfel apare HTML 5(denumit si Web Applications 1.0) care se

vrea a 5-a mare revizie a HTML-ului.

Avand ca punct de plecare HTML 5,W3C a fondat, in 2007,HTML

working group(sau W3C HTML WG),care a publicat prima schita a

proiectului in 22 Ianuarie 2008.




6

(elementul div poate fi inlocuit cu: header,nav,section,article,aside,footer).

Codul pentru o pagina avand structura de mai sus va fi:

<body>

<header>...</header><nav>...</nav>

<article>

<section>

...




7

</section>

</article>

<aside>...</aside>

<footer>...</footer>

</body>

De exemplu pentru urmatoarea structura markup s-au folosit section

incuibat si elemente hl:

<section>

<h1>Level 1</h1>

<section>

<h1>Level 2</h1>

<section>

<h1>Level 3</h1>

</section>

</section>

</section>

De asemenea pentru compatibilitate cu browswerele actuale, este

posibila folosirea altor elemente de heading (h2««.h6) in locul

elementelor h1.




8

Folosind sectiunile(sections), paginile vor devein mult mai usor

navigabile.De exemplu, se poate sari usor de la un articol la altul, fara sa

fie necesara folosirea de catre autor a linkurilor de skip.Cei care

realizeaza paginile au, de asemenea, de beneficiat pentru ca inlocuirea

div-urilor cu alte elemente face codul mult mai usor de

urmarit.Elementele de header reprezinta headerul unei

sectiuni.Headerele pot contine mai mult decat doar headingul unei

sectiuni.De exemplu acestea pot include subtitluri sau informatii(nume,

functie) despre autor.

<header>

<h1>A Preview of HTML 5</h1>

<p class="byline">By Lachlan Hunt</p>

</header>

<header>

<h1>Example Blog</h1>

<h2>Insert tag line here.</h2>

</header>

Elementele de footer reprezinta footerul sectiunii careia i se aplica.De

obicei acesta contine informatii despre sectiunea respective, despre

autor, link-uri si coyright-ul.




9

<footer>© 2007 Example Inc.</footer>

Elementele de nav reprezinta sectiunea de ³navigation links´.Sefoloseste atat pentru navigarea pe site, cat sip e post de cuprins.

nav><ul><li><a href="/">Home</a></li><li><a href="/products">Products</a></li><li><a href="/services">Services</a></li>

<li><a href="/about">About</a></li></ul></nav>

Elementul aside este folosit pentru continut care abordeaza aceeasitematica si este in general, folosit pentru crearea sidebar-urilor.

<aside>

<h1>Archives</h1>

<ul>

<li><a href="/2007/09/">September 2007</a></li>

<li><a href="/2007/08/">August 2007</a></li>

<li><a href="/2007/07/">July 2007</a></li>

</ul>

</aside>




10

Elementele de section reprezinta o sectiune a documentului sau a

aplicatiei, de exemplu un capitol.

<section>

<h1>Chapter 1: The Period</h1>

<p>It was the best of times, it was the worst of times,

it was the age of wisdom, it was the age of foolishness,it was the epoch of belief, it was the epoch of incredulity,

it was the season of Light, it was the season of Darkness,

...</p>

</section>

Un element article reprezinta o sectiune independent a documentului,

paginii sau site-ului.Acesta poate fi folosit pentru a scrie un articol de

stiri, un post pe blog, un post pe un forum sau un comentariu.

<section>

<h1>Chapter 1: The Period</h1>

<p>It was the best of times, it was the worst of times,

it was the age of wisdom, it was the age of foolishness,




12

elemente, singura deosebire referindu-se la diferentele intre cele doua

tipuri media: vizual si non-vizual.Cea mai simpla modalitate de a insera

un clip video este de a folosi elemental video si de a permite browser-

ului sa creeze o interfata default.Atributul controls este un atribut

Boolean si indica daca programatorul doreste sau nu interfata cu

utilizatorul(UI) by default.

<video src="video.ogv" controls poster="poster.jpg"

width="320" height="240">

<a href="video.ogv">Download movie</a>

</video>

Atributul optional poster poate fi folosit pentru a specifica o imagine

care va fi afisata in locul clipului video inainte ca acesta sa incapa sa

ruleze.Desi exista formate video care ofera propriului lor ³poster frame

feature´, cum ar fi MPEG-4, Solutia propusa de HTML 5 va functiona

pentru orice format.

La fel de simplu se insereaza elemente audio in pagina, folosind

audio.Majoritatea atributelor sunt commune intre audio si video.Totusi,

din motive evidente, pentru elemental audio lipsesc atributele: width,

height si poster.

<audio src="music.oga" controls>

<a href="music.oga">Download song</a> </audio>




13

HTML 5 ofera atributul source, pentru a preciza elementele audio sau

video din care browserul poate allege, bazandu-se pe tipurile sale media

sip e suportul codecurilor.

<video poster="poster.jpg">

<source src="video.3gp" type="video/3gpp"

media="handheld">

<source src="video.ogv" type="video/ogg;

codecs=theora, vorbis">

<source src="video.mp4" type="video/mp4">

</video>

<audio>

<source src="music.oga" type="audio/ogg">

<source src="music.mp3" type="audio/mpeg">

</audio>

Pentru programatorii care isi doresc cea mai mult control asupra

interfetei cu utilizatorul astfel incat sa o poata dimensiona in functie de

designul paginii, API-urile suplimentare ofera mai multe metode de alasa scripturile sa controleze functionarea elementului media.Cele mai

simple metode de folosire sunt: play ( ), pause ( ), si a seta CurrentTime

sa deruleze de la inceput.Urmatorul exemplu ilustreaza cum se pot folosi

acestea:




14

<video src="video.ogg" id="video"></video>

<script>

var video = document.getElementById("video");

</script>

<p><button type="button" onclick="video.play();">Play</button>

<button type="button" onclick="video.pause();">Pause</button>

<button type="button" onclick="video.currentTime = 0;">

<< Rewind</button>

R eprezentarea Documentelor

Spre deosebire de variantele anterioare HTML si XHTML, care sunt

definite in termini de sintaxa, HTML 5 e definit in termini de Document

Object Model (DOM)= cele trei reprezentari folosite de browsere pentru

a define un document.De exemplu, considerand un document format din

title, heading si paragraph, asa ar arata reprezentarea in DOM:




15

Arborele DOM include un element titlu in head si elemente h1 si p in body.

Avantajul de a defini HTML 5 in termini de DOM este ca limbajul

insusi poate fi definit independent de sintaxa.Exista, in principal, doua

sintaxe care pot fi folosite pentru a reprezenta documente HTML:

HTML serialization (sau HTML 5) si XML serialization (sau XHTML

5).

HTML serialization se refera la sintaxa inspirata din sintaxa SGML (a

versiunilor anterioare HTML).

<!DOCTYPE html>

<html>

<head>

<title>An HTML Document</title>

</head>

<body>

<h1>Example</h1>

<p>This is an example HTML document.




16

</body>

</html>

XML serialization se refera la o sintaxa care foloseste XML 1.0 si

namespaces, ca si XHTML 1.0.

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

<head><title>An HTML Document</title>

</head>

<body>

<h1>Example</h1>

<p>This is an example HTML document.</p>

</body>

</html>

Browserele folosesc tipul MIME pentru a face deosebire intre cele

2.Orice document text/html trebuie sa se conformeze cerintelor HTML

serialization si orice document de tipul XML MIME, cum ar fi

application/xhtml + xml trebuie sa fie in conform cu cerintele

standardului XML serialization.




17

Bibliografie

1. http://www.alistapart.com/articles/previewofhtml52. http://www.ibm.com/developerworks/library/x-html5/3. http://www.w3.org/TR/2008/WD-html5-diff-20080122/4. http://www.pcworld.com/article/id,140408-pg,1/article.html

ia referat html

Documents