Operații cu pagini web

- paginile-web (pagină html, hypertext) sunt principalele fișiere care compun siteurile-web. Sunt stocate în Internet pe serverul-web care găzduiește siteul.

- programele browser localizează paginile după adresa lor, apoi le descarcă în calculatorul nostru și le afișează pe ecran.

- Operații cu paginile-web :

1. Afișarea cu browserul

- dacă pagina este în Internet, îi scriem adresa în bara cu adrese a browserului, sau ajungem la ea folosind linkurile din paginile de care este legată.

- dacă pagina este în calculator, dăm dublu click pe ea și o deschide browserul implicit al sistemului de operare.

- deschiderea paginii de către browser înseamnă încărcarea ei în memoria RAM și executarea comenzile HTML scrise în pagină ceea ce conduce la afișarea în fereastra browserului a conținutului rezultat (text, tabele, imagini și alte elemente multimedia etc.).

2. Salvarea din Internet în calculatorul nostru a unei pagini

- cu Google Chrome :

a) cu meniul rapid (click dreapta în pagină) -> Save as...  sau
b) cu meniul browserului (dreapta-sus) -> More tools -> Save page as...

apoi alegem directorul și forma în care o salvăm :

Webpage, Complete - salvează pagina completă, cu imagini și toate componentele
Webpage, HTML Only - salvează doar textul fără imagini
Webpage, Single File - salvează pagina completă, într-un singur fișier

3. Afișarea codului HTML

- codul HTML al unei pagini-web este mulțimea comenzilor HTML scrise în pagină.

- afișăm pagina cu Google Chrome, apoi
meniul contextual (click dreapta în pagină) -> View page source

4. Crearea și modificarea (editarea)

- cea mai profesională și dificilă metodă pentru crearea paginilor-web este cu programele editoare de text (Notepad++, Notepad) în care scriem comenzile limbajului de programare HTML potrivite pentru ceea ce vrem să afișeze browserul.

- după ce scriem paginile cu editorul, le salvăm ca fișiere text, dar obligatoriu cu extensiile html sau htm.

- crearea cu această metodă seamănă cu munca de programare.

- pentru modificarea unei pagini care este în calculatorul nostru :

click dreapta pe fișier -> Open with... -> Notepad/ Notepad++ sau cu un program editor html

- după ce obținem paginile în forma finală (în calculatorul nostru), trebuie să le încărcăm pe un server prin diferite metode.

Limbajul HTML

- HTML (HyperText Markup Language) este limbajul folosit la crearea paginilor-web.

- HTML înseamnă mulțimea operațiilor (comenzilor) înțelese de browser, care afișează pe ecran informațiile dorite și descriu formatul acestora (fonturi, culori, mărimi, distanțe etc.).

- un element HTML este numele unei operații pe care o știe executa browserul, fără să precizăm detaliile acesteia.

- elementele sunt de obicei prescurtările unor cuvinte din engleză.

Exemple :

• elementul p afișează un paragraf de text în fereastra browserului
• elementul br adăugă un rând gol ...
• elementul img afișează o imagine ...
• elementul title afișează titlul paginii în colțul stânga-sus al browserului

- marcajul HTML (eng. tag) este o operație pe care o știe executa browserul și detaliile ei.

- deci operația specificată de un element devine acțiune concretă în browser dacă o scriem sub forma unui marcaj.

- un marcaj conține un element scris între semnele < și >, uneori alături de semnul / și perechi de tipul atribut=valoare care precizează detaliile acțiunii :

<element   atribut₁=valoare₁   atribut₂=valoare₂ ... >

- există două tipuri de marcaje, în funcție de elementele din care provin :

• marcaje simple : <element>
• marcaje perechi : <element> . . . </element>



pentru perechi (conțin același element) :
<element>  este marcajul de început
</element>  este marcajul de sfârșit
... (punctele de suspensie) reprezintă conținutul asupra căruia se execută acțiunea

Exemple de marcaje :

- reținem că :

• elementul p se scrie cu marcajele perechi <p> și </p> care afișează în browser textul cuprins între ele.
  În exemplu : La mijloc de codru
• elementul br folosește un marcaj simplu care afișează un rând gol în fereastra browserului.
• elementul img folosește un marcaj simplu, iar atributul src precizează fișierul cu imaginea de afișat.
  În exemplu : valoarea atributului src este pisica100.jpg

- limbajul HTML conține zeci de elemente și marcaje cu multe atribute și valori posibile. Pentru unele elemente folosim marcaje simple, pentru altele folosim marcaje perechi.