Tutoriale Dreamweaver Partea 1

Notiuni introductive

HTML (Hypertext Markup Language) este un limbaj creat în scopul de a descrie, în mod text, formatul paginilor Web; fisierele create în acest limbaj vor fi interpretate de navigatoare, care vor afisa paginile în forma doritã (cu texte formatate, liste, tabele, formule, imagini, hiperlegãturi, obiecte multimedia etc.). HTML a apãrut ca o aplicatie ISO standard (apartine standardului SGML - Standard Generalized Markup Language, specializat pentru hipertext si adaptat la Web).

Asa cum se poate deduce din numele limbajului, HTML descrie caracteristicile de format ale elementelor incluse prin procedee de marcare. Acestea pot fi asemãnate intuitiv cu marcajele folosite în tipografie pentru a indica scrierea unui text cu un anumit tip de caractere. Fiecare element va fi introdus între douã marcaje ("tags", în limba englezã) - de început si sfârsit - (uzual) de forma <marcaj> … </marcaj>. Caracterele speciale de delimitare a marcajelor "<", ">" permit deosebirea acestora de textul propriu-zis. De exemplu, pentru textele aldine (îngrosate), marcajul de început este iar de sfârsit - .

În informaticã, limbajele de marcare sunt foarte convenabile fiindcã comenzile lor pot fi interpretate simplu. LaTeX-ul, de exemplu, este tot un limbaj de marcare; prin interpretarea fisierelor .tex descrise în acest limbaj se va genera formatul dorit al documentelor pe diverse tipuri de sisteme de calcul (în cazul, LaTeX-ului, se obtine uzual format PostScript sau PDF). În schimb, procesoarele de documente uzuale nu au un limbaj de marcare standardizat, care sã ofere compatibilitate între diverse tipuri de calculatoare si sisteme de operare. Astfel, se poate spune cã avantajele aplicãrii limbajelor de marcare constau în portabilitate si flexibilitate: fisierele create cu ajutorul lor pot fi transferate pe orice tip de sistem, unde vor fi interpretate cu ajutorul unor programe specifice.

De fapt, procesoarele de texte uzuale folosesc adesea procedee de marcare pentru formatãri (de exemplu, formatãrile de tip caracter din Word); în acest caz însã, caracterele de control introduse sunt ascunse iar rezultatul editãrii este direct vizibil ("What You See Is What You Get"). În schimb, în limbajele de marcare - inclusiv HTML - marcajele sunt introduse în text, astfel încât acestea sunt exclusiv succesiuni de caractere (litere, cifre, caractere speciale) - fisiere de tip text.

Referitor la legãtura dintre procesoarele de documente uzuale si limbajul HTML, mai trebuie mentionat faptul cã ultimele versiuni ale editoarelor de documente oferã facilitãti de salvare în format HTML - de exemplu, Word, începând cu versiunea Microsoft Office '97. Mai mult, toate produsele incluse în aceastã gamã dedicatã biroticii (MS Office) oferã compatibilitate cu formatul HTML.
Procesele de standardizare si de includere a comenzilor de marcare în fisierele HTML permit navigatoarelor sã citeascã si sã formateze paginile Web, lucru foarte important în conditiile în care ele contin nu numai texte alb-negru, ci si culori, imagini, hiperlegãturi, diverse obiecte. Practic, marcajele HTML asigurã controlul asupra modului de afisare a obiectelor corespunzãtoare în cadrul programelor de vizualizare a documentelor HTML - navigatoarele. Limbajul HTML a evoluat în versiuni succesive, odatã cu evolutia protocolului HTTP si a programelor de navigare. Astfel, HTML 1.0 era compatibil cu Mosaic, primul program de navigare, dar dupã aparitia unor navigatoare noi, a fost necesarã introducerea unui standard oficial Internet pentru construirea paginilor (HTML 2.0) si extinderea sa cu noi facilitãti: formule matematice, tabele, moduri avansate de descriere a organizãrii paginilor (începând cu HTML 3.0).

Standardizarea oficialã a limbajului HTML a fost realizatã de consortiul WWW si dezvoltatã de diversi producãtori de soft (unii dintre acestia urmãresc chiar promovarea navigatoarelor proprii prin introducerea unor particularitãti în formatele oficiale).
Paginile HTML se pot crea cu orice editor de texte de cãtre utilizatorii care cunosc limbajul HTML sau, mai simplu, se pot utiliza editoare speciale, în care obiectele se introduc interactiv iar codul HTML se genereazã automat. Având în vedere cã si în acest caz este utilã cunoasterea marcajelor generate pentru corectarea eventualelor erori (mai ales în cazul link-urilor), vom prezenta în continuare entitãtile care se pot introduce în paginile HTML si marcajele caracteristice acestora:

Elementele limbajului HTML

Toate obiectele HTML sunt introduse între marcaje care le definesc; majoritatea acestora sunt de forma <tip_obiect> (la început) si </tip_obiect> (la sfârsit). Tipul standard al obiectului poate fi specificat cu majuscule sau minuscule; totusi, se recomandã utilizarea majusculelor fiindcã astfel marcajele ies în evidentã.

Majoritatea navigatoarelor permit vizualizarea paginii curente în formatul sursã HTML (forma pe care o interpreteazã pentru afisarea paginii). La interpretare, programele de navigare ignorã spatiile si <Enter>-urile, aplicând formatarea specificatã.
Existã însã si marcaje cu parametri; acestea au forma <tip_obiect param1=valoare1 param2=valoare2 …>. De exemplu, obiectele de tip imagine sunt introduse cu delimitatorul <IMG>, care are diversi parametri. Pentru definirea hiperlegãturilor se foloseste marcajul <A>, care are de asemenea parametri proprii.

Codurile de marcare HTML pot fi clasificate în urmãtoarele categorii:

1. marcaje de bazã - cele care delimiteazã pagina / documentul HTML, titlul acesteia si corpul paginii;
2. marcaje pentru structurarea documentului - care permit introducerea de subtitluri, paragrafe, linii de delimitare;
3. marcaje pentru formatarea textului si crearea listelor;
4. marcaje pentru crearea hiperlegãturilor (hyperlinks);
5. marcaje pentru introducerea de obiecte - tabele, formule, imagini sau obiecte multimedia preluate din fisiere, formulare.

Vom descrie în paragrafele urmãtoare, elementele caracteristice fiecãreia din aceste categorii.
Pentru structurarea si organizarea informatiilor din paginile web se pot utiliza frame-uri (marcajul <FRAME>), prin care la un moment dat se afiseazã mai multe ferestre continând fiecare câte o paginã. Introducerea si gestiunea frame-urilor se realizeazã foarte convenabil folosind editoarele HTML.
Mai mentionãm faptul cã în ultimele versiuni ale limbajului HTML si ale browser-elor s-a introdus posibilitatea integrãrii, respectiv lansãrii în executie prin navigator, a unor aplicatii. Acestea sunt scrise în limbajul Java, un limbaj cu caracteristici distribuite si obiectuale, adaptat programãrii în Web; ele se numesc "applet"-uri si se introduc în sursele HTML cu marcajul <APP> sau <APPLET> . Ultimele versiuni de editoare HTML permit introducerea interactivã a applet-urilor Java.

Marcaje de bazã

O paginã Web este delimitatã de marcajele <HTML> si </HTML> care indicã începutul si finalul documentului si contine:
zonã de antet cuprinsã între marcajele: <HEAD> … </HEAD> si
un corp delimitat de marcajele: <BODY> … </BODY>.

Zona de antet este utilizatã de cãtre programele de cãutare pe site-urile web si permite specificarea titlului paginii care va fi afisat de navigator (nu apare propriu-zis în continutul paginii). titlul, introdus în antet, este cuprins între marcajele <TITLE> … </TITLE>.

Astfel, o formã extrem de simplã a unui document HTML ar putea fi cea din urmãtorul exemplu:

<HTML>
<HEAD> <TITLE>Titlul documentului </TITLE>
</HEAD>
<BODY>Document HTML foarte simplu</BODY>
</HTML>

Marcaje pentru structurarea documentului

Programele de navigare asigurã afisarea diferentiatã a unot titluri si subtitluri pentru sectiunile paginii, dupã criteriile implementate în acest scop la conceperea sa (litere mai mari sau mai mici, diverse culori, litere aldine sau simple, unul sau mai multe rânduri libere dupã titlu etc.).
Titlurile de capitole sau subtitlurile sunt definite de marcajele <Hn>, unde n este o cifrã între 1 si 6 care specificã nivelul titlului (1 este titlul principal iar 6 corespunde celui mai scãzut nivel).
Astfel:
<H1> … </H1> indicã un subtitlu de nivelul 1 …
<H6> … </H6> indicã un subtitlu de nivelul 6.

Pentru separarea zonelor paginii se pot folosi treceri la:
linie nouã - cu marcajul , eventual cu desenarea unei linii orizontale - marcajul <HR>;
paragraf nou - cu marcajul (se insereazã o linie nouã si eventual se face o indentare). Marcajul desemneazã sfârsitul de paragraf dar este mai rar folosit (se poate omite).

Marcaje pentru formatarea textului si crearea listelor

Formatãrile uzuale de texte permit scrierea cu caractere:
aldine - în acest scop pentru acel text se aplicã marcajele … ;
cursive (italice) - pentru acel text se aplicã marcajele … ;
subliniate - textul se introduce între marcajele ….

Unele programe mai vechi de navigare nu permiteau reprezentarea acestor formate; în acest caz, se aplicau alte moduri de evidentiere a textelor respective (culori, video invers).
Alte tipuri de formatãri de caractere care se pot defini se referã la:
dimensiunea fonturilor si culori - se va utiliza marcajul cu parametri:
 …
 , care indicã utilizarea unui font de dimensiune x si culoare y.
x poate fi un numãr între 1 si 12, indicând mãrimea exactã, sau un numãr cu semn, indicând mãrimea relativã la dimensiunea curentã.
y poate fi numele unei culori standard, specificatã în limba englezã si între ghilimele, sau, eventual, descompunerea unei culori în componentele

RGB, sub formã hexazecimalã (câte douã cifre hexa pentru fiecare componentã).
Suplimentar, se pot crea pagini de stiluri, în care sã se defineascã stiluri logice, modificabile ulterior; în acest scop, se folosesc marcajele <DN> - definitie, - punere în evidentã, - accentuare puternicã.
Pentru tastaturile care suportã numai codurile ASCII, caracterele speciale se pot crea folosind formatul &nume_caracter - de exemplu, è pentru e. Având în vedere semnificatia specialã a caracterelor <, > si &, aparitia lor în documente trebuie specificatã sub forma caracterelor speciale: < , > , respectiv & .

Prezentãm în continuare un exemplu de document HTML, precum si modul în care acesta este afisat de Netscape Navigator.

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>

<head>
<title>Pagina simpla</title>
</head>

<body>
Acesta este un exemplu simplu de o pagina HTML. Ea arata cum pot aparea caractere
bold,
italic,
mai mari,
mai mici, respectiv insera o mica imagine
<img src="Handshake8114.gif" width="20" height="14">.

</body>

</html>

Scris de AtestateLaInformatica.ro

27
Nov

Articole si Idei