Upload
sabin-buraga
View
846
Download
6
Embed Size (px)
DESCRIPTION
Citation preview
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
Tehnologii Web
Dr. SabinCorneliu BuragaFacultatea de Informatica
Universitatea “A.I.Cuza” – Iasi, Romania
http://www.infoiasi.ro/~busaco/
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
DetaliiDetalii in in [PSW, [PSW, 142142‐‐163163 + CD]+ CD]
XHTML
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
“Începutul nu lasă să se întrevadă sfârşitul.”
Herodot
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
HyperText Markup LanguageCaracterizare & format
De la HTML la XHTMLResurse
cuprins
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
intrebare
Cum putem publica pe Web?
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
raspuns
Via o modalitate de structuraresi de prezentare a datelor
in cazul nostru, folosind un limbaj de marcare(markup language)
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
Extensible HyperText Markup Language“Lingua franca” a Web‐ului
Documente HTML ≡ pagini Web(fisiere text .html sau .htm) stocate pe un server Web şi vizualizate
de un client Web (navigator, browser)
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
Format bazat pe marcatori(adnotări, markups)
<html>…</html>
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
Structura: antet (head) + corp (body)
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
<html> <!-- tag obligatoriu --><head> <!-- început de antet -->
…</head> <!-- sfârşit de antet --><body> <!-- început de corp -->
…</body> <!-- sfârşit de corp -->
</html> <!-- sfârşit de document -->
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
Marcatorii trebuie sa fie inchisisi sa se imbrice corect!
Incorectitudinile sintactice/semanticenu vor fi semnalate de browser
Spațiile albe nu au semnificație
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Secțiuni ale conținutului<p> paragraf<div> diviziune<hr /> linie orizontală<br /> trecere la linie nouă<h1> ... <h6> şase tipuri de titluri
<hr /><h2>Maniera de evaluare</h2>
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Indicații despre conținut<b> îngroşat<i> înclinat<strong> important<em> intensificat <sub> indice<sup> exponent
<pre> text preformatat<code> cod sursa<span> proprietăți ale
conținutului
<p><strong>Orice încercare de…</strong></p>
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Liste<ul> listă nenumerotată<ol> listă numerotată<li> element de listă (ne)numerotată
<ul><li><p>Mere albastre</p></li><li><p>Ferestre <em>zburlite</em></p></li>
</ul>
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Imagini<img /> inserează o imagine JPG/PNG
<img src="../sigla.png../sigla.png" alt="Sigla Tehnologii Web" />
Este un URL Este un URL relativrelativ
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Legături (ancore) – specifică hipertextul<a> ancoră spre o altă resursă Web
sau un fragment de document
<p><a href="http://www.xhtml.org/http://www.xhtml.org/" title="Spre situl XHTML.org">XHTML.org</a></p>
Este un URLEste un URL
De De care?care?
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Tabele<table> inserează un conținut tabelar<tr> linie de tabel<td> definiție de celulă<th> antet de tabel<caption> legendă de tabel…
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Formulare<form> inserează un formular electronic<input> câmp de intrare <button> buton<select> selecție de listă de opțiuni<option> opțiune ce poate fi selectată<textarea> text introdus pe mai multe linii
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Includere de alte conținuturi<style> definiții de stiluri interne<script> programe JavaScript<applet> applet‐uri Java<embed> inserare a unui obiect generic<object> (audio, film, animație etc.)
<embed name="plugin" type="audio/mpeg"src="Celestial%20Celebration.mp3" />
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Elemente importante
Meta‐date (plasate în <head>…</head>) <title> titlul paginii Web<meta /> informații suplimentare – descrierea documentului, autorul, cuvintele‐cheie etc.
<link /> inserează un fişier extern – e.g., o foaie de stiluri
<meta name="description" lang="ro" content="Situl Web dedicat cursului" />
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Entități
Permit inserarea de caractere specialeentități standard –&nume_entitate;
< <> >& &" "
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Entități
Permit inserarea de caractere specialeentități simbolice –&nume_entitate;
spațiu indestructibil· ·– –© ©µ µ…
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Entități
Permit inserarea de caractere specialeentități caracter –&#cod_caracter;
© ©¶ ¶…
depind de setul de caractere ales: ISO‐8859‐1 (Latin‐1), ISO‐8859‐2 (Latin‐2),…
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
intrebare
De ce XHTML şi nu HTML?
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML
Extensibilitatepot fi incluse elemente ale altor limbaje: SVG (Scalable Vector Graphics), MathML,…
Modularizare grupare logică a seturilor de marcatori, utilizate conform necesităților
Transformare a marcajelor convertire facilă în alte tipuri de conținut
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Reguli
Elemente & atribute scrise cu minuscule– XHTML este case sensitive
Tag‐uri de sfârşit obligatorii
Tag‐urile vide scrise <tag />sau <tag></tag>
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Reguli
Valorile atributelor vor fi incluse între ghilimele<table width=600> este greşit
Atributele booleene vor trebui să aibă ataşatăşi valoarea: <hr noshade="noshade" />
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Reguli
Pentru a se indica faptul că documentul este unul XHTML, acesta trebuie să înceapă cu: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> sau<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Reguli
Verificarea/convertirea poate fi realizata cu Tidy,online (validator.w3.org/) sau
via FireBug / Html Validator (extensii Firefox)
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML: Viitor
HTML 5 – working draft din 2008compatibil cu vechiul HTML 4.01, dar il extinde
XHTML 2 – propus din 2006viitoarea versiune a XHTML 1.1, aliniat XML
A se vizita http://www.w3.org/html/
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
XHTML 1.0 (recomandare W3C): www.w3.org/TR/xhtml1
Modularization of XHTML: www.w3.org/TR/xhtml-modularization
Situl dedicat XHTML: www.xhtml.org/
HTML Techniques for Web Content Accessibility Guidelines:www.w3.org/TR/WCAG10/
resurse
Dr. Sabin Buraga http://www.infoiasi.ro/~busaco/
TehnologiiTehnologii WebWeb <?xml version=“1.0” ?><curs desc=“…” />
??